@import url("flexible_layout.css");
@import url("bg.css");

.horizontal-text {
  writing-mode: horizontal-tb;
  display: inline-block;
  padding-top: 0px;
}

.break {
    flex-basis: 100%;
    height: 0;
  }

.load_more_wrapper{
    margin-top: 60px;
    text-align: center;
    display: flex;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
}

.load_more_btn{
    color:#63629B;
    cursor: pointer;
}

.load_more_btn .icon{
	-webkit-transition: all 0.15s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: all 0.15s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    border:1px #63629B solid;
    width: 50px;
    height: 50px;
    border-radius: 100%;
    position: relative;
    margin: auto;
}

.load_more_btn:hover .icon{
    background-color: #63629B;
}

.load_more_btn .icon::before{
    content:"";
    background-color: #63629B;
    width: 1px;
    height: 15px;
    position: absolute;
    top:0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    margin: auto;
}

.load_more_btn:hover  .icon::before{
    background-color: #fff;
}

.load_more_btn .icon::after{
    content:"";
    width: 8px;
    height: 8px;
    position: absolute;
    top:3px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    border-right:1px solid #63629B;
    border-bottom:1px solid #63629B;
    transform: rotate(45deg);
    margin: auto;
}

.load_more_btn:hover  .icon::after{
    border-right:1px solid #fff;
    border-bottom:1px solid #fff;
}

.load_more_btn .text{
    margin-top: 10px;
}


.back_btn_wrapper{
    margin-top: -65px;
    position: absolute;
    left: 0px;
    top: 0px;
}

.back_btn_wrapper .back_btn{
    display: inline-block;
    padding-left: 20px;
    position: relative;
      color: #63629B;
        font-weight: 600;
}

.back_btn_wrapper .back_btn::before{
   content: "";
  width: 8px;
  height: 8px;
  transform: rotate(-45deg);
  position: absolute;
  left: 3px;
  top: 0px;
  bottom: 0px;
  margin: auto;
  border-top: 1px solid #63629B;
  border-left: 1px solid #63629B;
}

.back_btn_wrapper .back_btn:hover{
      color: rgb(0, 155, 157);
}

.back_btn_wrapper .back_btn:hover::before{
  border-top: 1px solid rgb(0, 155, 157);
  border-left: 1px solid rgb(0, 155, 157);
}

.submenu_btn_wrapper{
    display: flex;
    justify-content: center;
    margin-bottom: 60px;
}

.submenu_btn_wrapper div{
    padding-left: 30px;
    padding-right: 30px;
    display: inline-block;
}

.submenu_btn_wrapper a{
    color:#575792;
    display: inline-block;
    padding-bottom: 5px;
    padding-top: 5px;
    border-bottom: 1px solid transparent;
}

.submenu_btn_wrapper a.active{
    border-bottom: 1px solid #575792;
}

.submenu_btn_wrapper div+div{
    border-left:1px solid #9f9b9a;
}

/* photo_wrapper */

.caption{
    padding-left: 25px;
    border-left:1px solid #AD6364;
    margin-top: 20px;
    color:#685B58;
    font-size: 80%;
}


/* button style */

.border_button{
    padding: 2px 15px;
    border:1px solid #63629B;
    color:#63629B;
    border-radius: 999px;
}

.border_button:hover{
    background-color: #63629B;
    color:#fff;
}


/* page_number_wrapper */

.page_number_wrapper{
    margin-top: 80px;
    display: flex;
    gap: 20px;
}

.page_number_wrapper a.active{
    border-bottom:1px solid #000;
}

/* section */
.section{
    position: relative;
    z-index: 3;
}

/* roll_menu_section */

.roll_menu_section{
    position: relative;
}

.sticky_section{
	-webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    position: sticky;
    top:80px;
    z-index: 98;
      pointer-events: none;
}

.sentinel {
    position: absolute;
    margin-top: -70px;
    height: 1px;
    width: 100%;
}

.sticky_section.is_stuck{
}

.roll_menu_inwrapper{
    overflow: hidden;
    padding-bottom: 200px;
    margin-bottom: -200px;
    pointer-events: none;
}

.roll_menu_inwrapper .roll_menu{
    pointer-events: auto;
}

.sticky_section.is_stuck .roll_menu{
    background-color: #EEE8DC;
    box-shadow: 0px 10px 10px rgba(200, 200, 200, 0.5);
}

.sticky_section.is_stuck::after{
    /* content: "";
    position: absolute;
    left: 0px;
    top:100%;
    width: 100%;
    background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 100%); 
    height: 10px;
    pointer-events: none; */
}

.roll_top_menu{
    position: relative;
    z-index: 11;
}

.roll_top_menu::before{
	-webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    height: 40px;
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
    pointer-events: none;
}

.roll_top_menu::after{
    content:"";
    position: absolute;
    border-bottom:1px solid #b6b3b3;
    left: 50px;
    right: 50px;
    margin: auto;
    bottom: 0px;
}

.nottop .roll_top_menu::before{
    opacity: 0.5;
    height: 40px;
}

.roll_top_menu .section_center_content{
    position: relative;
}

.center_roll_top_menu .section_center_content{
    justify-content: center;
    display: flex;
}

.roll_top_menu .section_center_content::after{
    content:"";
    position: absolute;
}
.roll_top_menu .swiper-container {
    position: relative;
    overflow: visible;
}

.roll_top_menu .swiper-wrapper .swiper-slide{
    height: auto;
    align-self: stretch;
    display: flex;
    width: auto;
    position: relative;
}

.roll_top_menu .swiper-wrapper .swiper-slide a{
    height: auto;
    align-self: stretch;
    display: flex;
    align-items: center;
    padding-top: 10px;
    padding-bottom: 10px;
    color:#63629B;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
    display: block;
    position: relative;
    white-space:nowrap;
}
.roll_top_menu .swiper-wrapper .swiper-slide a.active{
    font-weight: 600;
}

.roll_top_menu .swiper-wrapper .swiper-slide a.active::after{
    content:"";
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    border-bottom:2px solid #009b9d
}

.roll_top_menu .swiper-wrapper .swiper-slide a:hover{
    color:#009b9d;
}

.roll_top_menu .breadcrumb{
    text-align: center;
    display: inline-block;
    position: relative;
    display: flex;
    gap: 10px;
}

.roll_top_menu .breadcrumb span{
    position: relative;
}

.roll_top_menu .breadcrumb a{
    color:#63629B;
    font-weight: 600;
    position: relative;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 20px;
    padding-right: 20px;
    display: block;
}

.roll_top_menu .breadcrumb .scrollinbottom_dropdown_wrapper{
    position: relative;
}



.roll_top_menu .breadcrumb a.scrollinbottom_dropdown{
    padding-left: 50px;
    padding-right: 50px;
    color:#009b9d;
}

.roll_top_menu .breadcrumb .scrollinbottom_dropdown_wrapper.active .scrollinbottom_dropdown{
    color:#009b9d
}



.roll_top_menu .breadcrumb a.scrollinbottom_dropdown span{
    padding-right: 20px;
}

.roll_top_menu .breadcrumb a.scrollinbottom_dropdown span::before {
    content: "";
    position: absolute;
    top: 0px;
    bottom: 6px;
    right: 0px;
    margin: auto;
    width: 8px;
    height: 8px;
    border-right:1px solid #009b9d;
    border-bottom:1px solid #009b9d;
    transform: rotate(45deg);
}

.roll_top_menu .breadcrumb .scrollinbottom_dropdown_wrapper.active  a.scrollinbottom_dropdown span::before {
    border-right:1px solid #009b9d;
    border-bottom:1px solid #009b9d;
    transform: rotate(-135deg);
    top: 6px;
    bottom: 0px;
}

.roll_top_menu .breadcrumb .scrollinbottom_dropdown_wrapper .hidden{
    position: absolute;
    left: 0px;
    top:100%;
    padding: 10px;
    background-color: #fff;
    z-index: 9;
    text-align: left;
    display: none;
}

.roll_top_menu .breadcrumb .scrollinbottom_dropdown_wrapper .hidden a{
    padding: 10px;
    background-color: #fff;
    color:#575792;
}

.roll_top_menu .breadcrumb .scrollinbottom_dropdown_wrapper .hidden li+li{
    border-top:1px solid #b6b3b3
}

.roll_top_menu .breadcrumb .scrollinbottom_dropdown_wrapper .hidden a:hover{
    color:#009b9d;
}


.scrollinbottom_dropdown::before {
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    height: 100%;
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%);
    pointer-events: none;
}

.roll_bottom_menu{
	-webkit-transition: background-color 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: background-color 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    padding-top: 10px;
    padding-bottom: 0px;
}

.roll_bottom_menu .section_center_content{
display: flex;
justify-content: center;
}

.roll_bottom_menu .swiper-container {
    /* overflow: visible; */
}

.roll_bottom_menu .swiper-container .swiper-wrapper{
}

.roll_bottom_menu .swiper-wrapper .swiper-slide{
    height: auto;
    align-self: stretch;
    display: flex;
    width: auto;
    padding-left: 20px;
    padding-right: 50px;
}

.roll_bottom_menu .swiper-wrapper .swiper-slide a{
    height: auto;
    align-self: stretch;
    display: flex;
    align-items: center;
    padding-bottom: 4px;
    color:#9f9b9a;
    text-align: center;
    display: block;
    border-bottom:1px solid transparent;
    white-space:nowrap;
}

.roll_bottom_menu .swiper-wrapper .swiper-slide a:hover{
    color:#009b9d;
}

.roll_bottom_menu .swiper-wrapper .swiper-slide a.active{
    border-bottom:1px solid #009b9d;
    font-weight: 600;
    color:#009b9d;
}

.roll_bottom_menu .swiper-wrapper .swiper-slide a:hover{
    color:#009b9d;
    }


.slide-has_dropdown > .a_wrapper > a{
    padding-right: 40px !important;
    position: relative;
}

.slide-has_dropdown > .a_wrapper .dropdown_arrow {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  width: 30px;
  margin: auto;
  pointer-events: none;
}

.slide-has_dropdown > .a_wrapper .dropdown_arrow::before {
    content:"";
  position: absolute;
  top: 0px;
  bottom: 6px;
  right: 20px;
  margin: auto;
  width: 8px;
  height: 8px;
  border-right: 1px solid #575792;
  border-bottom: 1px solid #575792;
  transform: rotate(45deg);
}

.slide-has_dropdown.opened > .a_wrapper .dropdown_arrow::before {
    content:"";
  position: absolute;
  top: 6px;
  bottom: 0px;
  right: 20px;
  margin: auto;
  width: 8px;
  height: 8px;
  border-right: 1px solid #575792;
  border-bottom: 1px solid #575792;
  transform: rotate(-135deg);
}

.slide-has_dropdown > .a_wrapper:hover .dropdown_arrow::before {
  border-right: 1px solid #009b9d;
  border-bottom: 1px solid #009b9d;
}
    
.swiper_dropdown{
    position: absolute;
    left: 0px;
    top:100%;
    background-color: #fff;
    padding: 0px;
    display: none;
}

.swiper_dropdown div{

}

.swiper_dropdown a{
    color:#575792;
    display: block;
    border-bottom:none;
    white-space: nowrap;
      padding-top: 10px;
  padding-bottom: 10px;
    text-align: center;
  padding-left: 20px;
  padding-right: 20px;
}

.swiper_dropdown a:hover, .swiper_dropdown a.selected{
    color:#009594 !important;
}

.swiper_dropdown div+div{
    margin-top: 5px;
}

.horizontal-scroll-wrapper {
	position: relative;
	/* overflow: hidden; <-- removed to allow dropdown overflow */
}

.js-drag-scroll {
	will-change: transform;
	cursor: grab;
	display: flex;
}

.js-drag-scroll a {
  -webkit-user-drag: none;
}

.scroll-inner {
	display: flex;
	gap: 50px;
    padding-left: 50px;
    padding-right: 50px;
	margin-left: 0;
	margin-right: 0;
	white-space: nowrap;
}


.scroll-inner.centered {
	margin-left: auto;
	margin-right: auto;
}

.horizontal-scroll-wrapper.dragging .js-drag-scroll {
	cursor: grabbing;
}

.menu-item {
	flex: 0 0 auto;
	position: relative;
	white-space: nowrap;
}

body.dragging-scroll {
	user-select: none;
	cursor: grabbing;
}

.roll_top_menu .menu-item .a_wrapper a{
    padding: 10px 20px;
    border-bottom:2px solid transparent;
    color:#63629B;
    display: block;
}

.roll_top_menu .menu-item .a_wrapper a:hover{
    color:#009b9d
}

.roll_top_menu .menu-item .a_wrapper a.active{
    padding: 10px 20px;
    border-bottom:2px solid #009b9d;
      font-weight: 600;
}

.roll_bottom_menu .menu-item .a_wrapper a{
    padding-bottom: 10px;
    border-bottom:1px solid transparent;
      color: #9f9b9a;
    display: block;
}

.roll_bottom_menu .menu-item .a_wrapper a:hover{
      color: #009b9d;
}

.roll_bottom_menu .menu-item .a_wrapper a.active{
    border-bottom:1px solid #009b9d;
      color: #009b9d;
        font-weight: 600;
}


.js-drag-scroll .has_dropdown > .a_wrapper > a{
    padding-right: 40px !important;
    position: relative;
}

.js-drag-scroll .has_dropdown > .a_wrapper .dropdown_arrow {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  width: 30px;
  margin: auto;
  pointer-events: none;
}

.js-drag-scroll .has_dropdown > .a_wrapper .dropdown_arrow::before {
    content:"";
  position: absolute;
  top: 0px;
  bottom: 6px;
  right: 20px;
  margin: auto;
  width: 8px;
  height: 8px;
  border-right: 1px solid #575792;
  border-bottom: 1px solid #575792;
  transform: rotate(45deg);
}

.js-drag-scroll .has_dropdown.opened > .a_wrapper .dropdown_arrow::before {
    content:"";
  position: absolute;
  top: 6px;
  bottom: 0px;
  right: 20px;
  margin: auto;
  width: 8px;
  height: 8px;
  border-right: 1px solid #575792;
  border-bottom: 1px solid #575792;
  transform: rotate(-135deg);
}

.js-drag-scroll .has_dropdown > .a:hover .dropdown_arrow::before {
  border-right: 1px solid #009b9d;
  border-bottom: 1px solid #009b9d;
}
    

/* plain_menu_section */

.plain_menu_section{
    margin-top: 60px;
}

.plain_menu_wrapper{
    overflow: hidden;
}

.plain_menu_inwrapper{
    margin-left: -1px;
    margin-right: -1px;
    margin-top: -20px;
}

.plain_menu {
    display: grid;
    grid-template-columns: repeat(4, auto);
    align-items: center;
    justify-content: normal;
    width: 100%;
}

.plain_menu > li {
    color: #63629B;
    font-size: 16px;
    text-align: center;
    position: relative;
    margin-top: 20px;
}

.plain_menu > li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 1em;
    width: 1px;
    background-color: #63629B;
    opacity: 1;
}

.plain_menu li a{
    padding: 0 10px;
    color:#63629B
}

/* section_content */

.section_content{
    padding-top: 60px;
    padding-bottom: 60px;
}

.section_more_news{
     z-index: 11;
}

.section_title{
    margin: auto;
    text-align: center;
    color:#63629B;
    letter-spacing: 0.05em;
    font-weight: 600;
}

.en_body .section_title{
    letter-spacing: 0em;
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
    font-weight: normal;
}

.section_title + .section_introduction{
    margin-top: 30px;
}

.gallery_date{
    letter-spacing: 0em;
    font-weight: 400;
      margin-top: 5px;
}

.section_smalltitle{
    color:#6f6ea6;
}

.en_body .section_smalltitle{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}

.section_subtitle{
    margin: auto;
    text-align: center;
    letter-spacing: 0.05em;
    font-weight: 600;
}
.en_body .section_subtitle{
    letter-spacing: 0em;
}


.section_title + .section_subtitle{
    margin-top: 20px;
}



.section_content + .section_content .section_title{
    color:#009b9d;
}

.section_content + .section_content + .section_content .section_title{
    color:#63629B;
}

.section_content + .section_content + .section_content + .section_content .section_title{
    color:#009b9d;
}

.section_description{
    max-width: 800px;
    margin: auto;
    text-align: center;
    letter-spacing: 0.05em;
    margin-top: 20px;
}

.en_body .section_description{
    letter-spacing: 0em;
}

.single-gallery .section_description{
    text-align: left;
}

/* section_list_content */

.section_list_content{
}

.section_list{
    margin-top: 60px;
}

.list_item_row{
    display: flex;
    /* gap: 20px; */
    width: 100%;
}

.list_item_col{
    display: flex;
    gap: 20px;
    border-bottom:1px solid #be6e6f;
    padding-top: 20px;
    padding-bottom: 20px;
    align-items: start;
}

.list_item_col + .list_item_col > div{
    padding-left: 50px;
}

.list_item_col a{
    color:#736562
}

.list_item_col a:hover{
    color:#009594
}

.list_item_col.text_c1 a{
    color:#575792
}

.list_item_col.text_c1 a:hover{
    color:#009594
}

.inner_list_item_col .free_text ul li + li {
    margin-top: 5px;
  }

/* vertical_text_wrapper */

.vertical_text_wrapper .date{
    display: flex;
    width: 80px;
    height: 80px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: 100%;
    background: radial-gradient(circle,rgba(195,217,194,0) 0%, rgba(195,217,194,1) 100%);   
    margin-left: auto;
    margin-bottom: 20px;
    pointer-events: auto;
}
.vertical_text_wrapper .year{
    color:#6f6ea6;
    font-weight: 600;
    line-height: 1.2em;
}

.vertical_text_wrapper .month{
    color:#6f6ea6;
    line-height: 1.2em;
    font-weight: 100;
}

.vertical_text_wrapper .day{
    color:#6f6ea6;
    font-weight: 600;
    line-height: 1.2em;
}



/* section_expandable_list */

.section_expandable_list{
    margin-top: 60px;
}

.section_content + .section.section_expandable_list{
    margin-top: auto;
}

.section_expandable_list:first-child{
    margin-top: auto;
}

.filter_menu_section + .section_expandable_list{
    margin-top: auto;
}

.expandable_item{
    position: relative;
}

.expandable_item::before{
    content:"";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 50px;
    background: linear-gradient(0deg, rgba(195,217,194,0) 0%, rgba(195,217,194,1) 100%); 
}

.no_bg .expandable_item::before{
    display: none;
}


.no_bg .expandable_item .center_content::before{
    content:"";
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: auto;
    width: auto;
    height: auto;
    margin: auto;
    background: none; 
    border-bottom:1px solid #736562;
    z-index: 2;
}


.expandable_item .expandable_title{
	-webkit-transition: padding-top 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s, padding-bottom 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: padding-top 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s, padding-bottom 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    position: relative;
    padding: 30px 0px;
    padding-right: 32px;
    color:#63629B;
    cursor: pointer;
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}

.no_bg .expandable_item .expandable_title:hover{
    background-color: rgba(255,255,255,0.5);
}

.no_bg .expandable_item.active .expandable_title:hover{
    background-color: transparent;
}

.expandable_item .expandable_title.disable{
    cursor:auto;
}

.expandable_item.active .expandable_title{
    padding-top: 60px;
    padding-bottom: 60px;
}


.expandable_item .expandable_title .cat{
    font-weight: 600;
}

.expandable_item .expandable_title .icon{
    position: absolute;
    right: 0px;
    top:0px;
    width: 18px;
    height: 18px;
    bottom: 0px;
    margin: auto;
}

.expandable_item .expandable_title .icon::before{
    position: absolute;
    right: 0px;
    top:0px;
    bottom: 0px;
    margin: auto;
    content:"";
    width: 100%;
    height: 1px;
    background-color: #6b809a;
}

.expandable_item .expandable_title .icon::after{
    position: absolute;
    right: 0px;
    top:0px;
    bottom: 0px;
    margin: auto;
    content:"";
    width: 100%;
    height: 1px;
    background-color: #6b809a;
    transform: rotate(90deg);
}

.expandable_item.active  .expandable_title .icon::after{
    transform: rotate(0deg);
}

.expandable_item .hidden{
    position: relative;
    display: none;
}

.expandable_item.active .hidden{
    display: block;
}

.expandable_item .hidden_content{
	-webkit-transition: padding-bottom 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: padding-bottom 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    padding-bottom: 30px;
}

.expandable_item .hidden_content .btn_wrapper{
    margin-top: 50px;
      display: flex;
  gap: 30px;
}

.expandable_item .hidden_content .btn_wrapper .round_btn{
    border:1px #62629b solid;
    color:#62629b;
}

.expandable_item .hidden_content .btn_wrapper .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
}

.expandable_item.active .hidden_content{
    padding-bottom: 60px;
}

.expandable_item .hidden_content .free_text h1,
.expandable_item .hidden_content .free_text h2,
.expandable_item .hidden_content .free_text h3,
.expandable_item .hidden_content .free_text h4,
.expandable_item .hidden_content .free_text h5,
.expandable_item .hidden_content .free_text h6{
    color: #62629b;
}

.expandable_item .download_btn_wrapper{
    display: flex;
    margin-top: 20px;
    gap: 20px;
}

.table_flex_item_wrapper{
    display: flex;
    flex-wrap: wrap;
    gap: 50px ;
}

.table_flex_item_wrapper2{
    max-width: 1000px;
}

.table_flex_item_wrapper2 .table_flex_item{
    width: calc(50% - 50px);
}

.table_flex_item_wrapper .table_flex_item.col6{
    width: calc(50% - 50px);
}

.table_flex_item_wrapper + .table_flex_item_wrapper{
    margin-top: 50px;
}

.table_flex_item .title{
    color:#63629B;
    font-weight: 600;
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}

.table_flex_item .text{
    margin-top: 5px;
}

.table_flex_item .text:first-child{
    margin-top: auto;
}

.table_flex_item a:hover{
    color:#45adb3;
}

.table_flex_item.break{
  flex-basis: 100%;
  height: 0;
  padding: 0;
  margin: 0;
  border: none;
}

.section_expandable_list .free_text a{
    color:#45adb3;
	text-decoration: underline;
}

.section_expandable_list .free_text  .table-responsive, .table_flex_item  .free_text  .table-responsive{
    position: relative;
}

.section_expandable_list .free_text table, .table_flex_item .free_text table{
    width: 100%;
    position: relative;
    table-layout: fixed;
}

.section_expandable_list .free_text table td, .table_flex_item .free_text table td{
  position: relative;
  }

.section_expandable_list .free_text thead td, .table_flex_item .free_text thead td{
    color:#62629e;
    padding: 10px;
}


.section_expandable_list .free_text tbody td, .table_flex_item .free_text tbody td{
    padding: 10px;
}

.section_expandable_list .free_text tbody, .table_flex_item .free_text tbody{
    position: relative;
}

.section_expandable_list .free_text .table-bg::before, .table_flex_item .free_text .table-bg::before{
    content:"";
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
    pointer-events: none;
}

.section_expandable_list .free_text tbody tr, .table_flex_item .free_text tbody tr{
    position: relative;
}

.section_expandable_list .free_text tbody td+td , .table_flex_item .free_text tbody td+td {
    border-left:2px solid #EEE8DC;
}

.section_expandable_list .free_text tbody tr+tr td, 
.table_flex_item .free_text tbody tr+tr td{
    border-top:2px solid #EEE8DC;
}

.section_expandable_list_title{
    margin-bottom: 20px;
    color:#62629b;
}

.resource_content_section{
    padding-top: 0px;
}

.resource_content_section .section_expandable_list + .section_expandable_list{
    margin-top: 60px;
}

.announcement_title{
    display: flex;
    gap: 50px;
    width: 100%;
    max-width: 800px;
}

.announcement_title > *{
  flex: 1;
}

/* home_top_section */
.home_top_section{  
    padding-top: 12%;
  padding-bottom: 12%;
}

.home_top_section .text{  
    font-weight: normal;
    color:#575454;
    letter-spacing: 0.07em;
}

.en_body .home_top_section .text{
    letter-spacing: 0em;
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}

.home_top_section .logo{  
    width: 5.1em;
    margin-top: 0.6em;
}

.home_top_section .logo img{
    width: 100%;
}


/* home_about_slider_section */

.home_about_slider_section{
    padding: 60px 0px;
    position: relative;
    z-index: 5;
}

.home_about_slider_section .section_center_content{
    position: relative;
}

.home_about_slider_section > .section_center_content > .col_wrapper > .flex{
    flex-direction: row-reverse;
}

.en_body .home_about_slider_section > .section_center_content > .col_wrapper > .flex{
    flex-direction: row;
}


.home_about_slider_section .vertical_text_wrapper .project_title{
    line-height: 1.25em;
    position: relative;
    color:#62629b;
}

.home_about_slider_section .vertical_text_wrapper .project_smalltitle{
    margin-left: 10px;
    position: relative;
}

.home_about_slider_section .vertical_text_wrapper .project_smalltitle span{
    border-left:1px solid #409192;
    padding-left: 10px;
    display: inline-block;
}


.home_about_slider_section .vertical_text span{
    display: inline-block;
    padding-top: 3px;
}

.home_about_slider_section .vertical_text_wrapper{
    display: flex;
    justify-content: end;
}

.home_about_slider_section .vertical_text{
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 0.25em;
}

.en_body .home_about_slider_section .vertical_text{
    writing-mode: horizontal-tb;
    text-orientation: mixed;
  letter-spacing: 0em !important;
}

.en_body  .vertical_text{
  letter-spacing: 0em !important;
}

.en_body .home_about_slider_section .vertical_text_wrapper {
  justify-content: start;
}

.en_body .vertical_text_wrapper .project_title{
  font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}

.en_body .home_about_slider_section .col2{
    width: 100%;
}

.en_body .home_about_slider_section .col10{
    margin-left: auto;
    margin-right: auto;
}

.en_body .home_about_slider .text_wrapper {
  padding-top: 0%;
}

.en_body .home_about_slider::before {
  top: 10%;
}

.home_about_slider{
    position: relative;
}

.home_about_slider::before{
    content:"";
    position: absolute;
    left: 25%;
    right: 0%;
    height: 50%;
    top:20%;
    background: linear-gradient(0deg, rgba(236,204,184,0) 0%, rgba(236,204,184,1) 100%); 
}

.home_about_slider .text_wrapper{
    padding-top: 20%;
}

.home_about_slider .ink_image img{
    width: 100%;
}

.home_about_slider .btn_wrapper{
    margin-top: 30px;
      display: flex;
  gap: 50px;
}


.home_about_slider .round_btn{
    border:1px #ae6364 solid;
    color:#ae6364;
}

.home_about_slider .round_btn:hover{
    border:1px #ae6364 solid;
    color:#fff;
    background-color: #ae6364;
}

.home_about_slider .flex, .home_about_slider .col, .home_about_slider .col_spacing, .home_about_slider .ink_image{
    display: flex;
    position: relative;
}

.home_about_slider .col_spacing{
    width: 100%;
}

.home_about_slider .col_spacing .ink_image{
    width: 100%;
    margin-bottom: 20%;
}

.home_about_slider .col_spacing .ink_image img{
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center top;
}

.home_about_slider_section .nav_wrapper{
    position: absolute;
    bottom: 0px;
    right: 50px;
}

.home_about_slider_section .prev_btn{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    position: relative;
    width: 100px;
    height: 60px;
    margin: auto;
    margin-top: 60px;
    margin-right: 60px;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
}

.home_about_slider_section .prev_btn::before{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top:0px;
    bottom: 0px;
    left: 0px;
    margin: auto;
    background-color: #ae6364;
}

.home_about_slider_section .prev_btn:hover::before{
    left:-10px;
}

.home_about_slider_section .prev_btn::after{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 30px;
    height: 30px;
    top:0px;
    bottom: 0px;
    left: 5px;
    margin: auto;
    transform: rotate(-45deg);
    border-top:1px solid #ae6364;
    border-left:1px solid #ae6364;
}

.home_about_slider_section .prev_btn:hover::after{
    left:-5px;
}

.home_about_slider_section .next_btn{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    position: relative;
    width: 100px;
    height: 60px;
    margin: auto;
    margin-top: 60px;
    margin-left: 60px;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
}

.home_about_slider_section .next_btn::before{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top:0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    background-color: #ae6364;
}

.home_about_slider_section .next_btn:hover::before{
    right:-10px;
}

.home_about_slider_section .next_btn::after{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 30px;
    height: 30px;
    top:0px;
    bottom: 0px;
    right: 5px;
    margin: auto;
    transform: rotate(45deg);
    border-top:1px solid #ae6364;
    border-right:1px solid #ae6364;
}

.home_about_slider_section .next_btn:hover::after{
    right:-5px;
}


.home_about_slider_section .dot_wrapper{
    text-align: center;
    display: flex;
    justify-content: start;
    gap: 20px;
    margin-top: 60px;
}

.home_about_slider_section .dot_wrapper .swiper-pagination-bullet{
    border:1px solid #A16765;
    background-color: transparent;
    opacity: 1;
}

.home_about_slider_section .dot_wrapper .swiper-pagination-bullet-active{
    background-color: #A16765;
}

/* home_news_section */

.home_news_section{
    padding-bottom: 60px;
    z-index: 4;
}

.home_news_section .vertical_text_wrapper{
    margin-right: 50px;
}

.home_news_section .vertical_text_wrapper .project_title{
    line-height: 1.25em;
    position: relative;
    color:#62629b;
}

.home_news_section .vertical_text_wrapper .project_smalltitle{
    margin-left: 10px;
    position: relative;
}

.home_news_section .vertical_text_wrapper .project_smalltitle span{
    border-left:1px solid #409192;
    padding-left: 10px;
    display: inline-block;
}


.home_news_section .vertical_text span{
    display: inline-block;
    padding-top: 3px;
}

.home_news_section .vertical_text_wrapper{
    display: flex;
    justify-content: end;
    position: relative;
}

.home_news_section .vertical_text{
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 0.25em;
}

.en_body .home_news_section .vertical_text{
  letter-spacing: 0em;
}

.home_news_year_slider{
    padding-top: 60px;
    padding-bottom: 0px;
    position: relative;
}

.home_news_year_slider .all_news_btn_wrapper{
    position: absolute;
    bottom:30px;
    right: 50px;
}

.home_news_year_slider .all_news_btn_wrapper .round_btn{
    border:1px solid #ae6364;
    color:#ae6364;
    background-color: #fff;
}

.home_news_year_slider .all_news_btn_wrapper .round_btn:hover{
    color:#fff;
    background-color: #ae6364;
}

.home_news_year_slider .swiper-container{
    margin: auto;
    width: 200px;
}

.home_news_year_slider .swiper-slide{
    text-align: center;
}

.home_news_year_slider .prev_btn{
    border:none;
    background: none;
    width:60px;
    height: 30px;
    position: absolute;
    right: 50%;
   margin: auto;
   top:0px;
   bottom: 0px;
   margin-right: 150px;
    cursor: pointer;
   z-index: 11;
}

.home_news_year_slider .prev_btn:hover{
    opacity: 0.8;
}

.home_news_year_slider .prev_btn::before{
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top: 0px;
    bottom: 0px;
    left: 0px;
    margin: auto;
    background-color: #ae6364;
}

.home_news_year_slider .prev_btn::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  top: 0px;
  bottom: 0px;
  left: 5px;
  margin: auto;
  transform: rotate(-45deg);
  border-top: 1px solid #ae6364;
  border-left: 1px solid #ae6364;
}

.home_news_year_slider .prev_btn:hover{
   border-color: transparent #ae6364 transparent transparent;
}

.home_news_year_slider .next_btn{
    border:none;
    background: none;
    width:60px;
    height: 30px;
    position: absolute;
   left:50%;
   margin: auto;
   top:0px;
   bottom: 0px;
   margin-left: 150px;
    cursor: pointer;
   z-index: 11;
}

.home_news_year_slider .next_btn:hover{
    opacity: 0.8;
}

.home_news_year_slider .next_btn::before{
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top: 0px;
    bottom: 0px;
    left: 0px;
    margin: auto;
    background-color: #ae6364;
}

.home_news_year_slider .next_btn::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  top: 0px;
  bottom: 0px;
  right: 5px;
  margin: auto;
  transform: rotate(45deg);
  border-top: 1px solid #ae6364;
  border-right: 1px solid #ae6364;
}


.home_news_year_slider .next_btn:hover{
   border-color: transparent transparent transparent #ae6364;
}

.home_news_year_slider .section_center_content{

}

.home_news_year_slider::before{
    content:"";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 50px;
    background: linear-gradient(180deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%);
}

.home_news_year_slider .t_wrapper{
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: center;
}

.home_news_year_slider .t1{
    border:1px solid #575454;
    width: 80px;
    height: 80px;
    border-radius: 100%;
    display: flex;
    color:#575454;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    font-weight: 600;
    text-transform: uppercase;
}

.home_news_year_slider .t2{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}


/* home_news_date_slider */

.home_news_date_slider_wrapper_wrapper{
    /* background-color: #EEE8DC; */
}

.home_news_date_slider_wrapper{
    padding-top: 60px;
    padding-bottom: 0px;
    position: relative;
    z-index: 7;
    opacity: 0;
    pointer-events: none;
    display: block;
}

.home_news_date_slider_wrapper.show{
    opacity: 1;
    pointer-events: auto;
}

.home_news_date_slider_inwrapper{
    padding-left: 50px;
    padding-right: 50px;
    position: relative;
    margin-top: 30px;
}

.home_news_date_slider_wrapper .prev_btn{
    width: 50px;
    position: absolute;
    left: 0px;
    top:0px;
    height: 100%;
    cursor: pointer;
    /* background: linear-gradient(-90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); */
    z-index: 1;
    border-right:1px solid #575454;
}

.home_news_date_slider_wrapper .prev_btn::before{
    content:"";
    position: absolute;
    top:0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 24px;
    height: 24px;
    margin: auto;
    transform: rotate(-45deg);
    border-top:2px solid #575454;
    border-left:2px solid #575454;
}

.home_news_date_slider_wrapper .next_btn{
    width: 50px;
    position: absolute;
    right: 0px;
    top:0px;
    height: 100%;
    cursor: pointer;
    /* background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); */
    z-index: 1;
    border-left:1px solid #575454;
}



.home_news_date_slider_wrapper .next_btn::before{
    content:"";
    position: absolute;
    top:0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    width: 24px;
    height: 24px;
    margin: auto;
    transform: rotate(45deg);
    border-top:2px solid #575454;
    border-right:2px solid #575454;
}


.home_news_date_slider_wrapper .swiper-button-disabled{
    pointer-events: none;
}


.home_news_date_slider_wrapper .swiper-button-disabled::before{
    opacity: 0;
}

.home_news_date_slider_wrapper .swiper-container{
    /* border-left:1px solid #575454;
    border-right:1px solid #575454; */
}

.home_news_date_slider_inwrapper{
    position: relative;
}



.home_news_date_slider_wrapper .swiper-container .swiper-wrapper{
    margin-left: -1px;
    margin-right: -1px;
    width: auto;
}

.home_news_date_slider .date{
    text-align: left;
    margin-bottom: 30px;
    padding-left: 30px;
    padding-right: 30px;
}

.home_news_date_slider .news_item_wrapper{
    display: flex;
}

.home_news_date_slider .news_item{
    width: 100%;
    flex-grow: 1;
    box-sizing: border-box;
}

.home_news_date_slider .news_item a:hover{
    opacity: 0.5;
}

.news_item_spacing{
    margin-left: 30px;
    margin-right: 30px;
}

.home_news_date_slider .news_item:nth-child(even) {
    margin-top: 20%;
  }

.home_news_date_slider .news_item .text{
    margin-top: 20px;
    color:#736562;
    font-weight: 600;
}

.home_news_date_slider .news_item .text + .cat_icon{
    margin-top: 20px;
}


.home_news_date_slider .news_item img{
    width: 100%;
    box-shadow: 5px 5px 10px rgba(0,0,0,.3);
}

.home_news_date_slider .swiper-slide{
    width: auto;
    box-sizing: border-box;
    height: auto;
    align-self: stretch;
    position: relative;
}

.home_news_date_slider .swiper-slide +  .swiper-slide::before{
    content:"";
    position: absolute;
    left: 0px;
    top:0px;
    bottom: 0px;
    margin: auto;
    border-left: 1px solid #575454;
}


.home_news_loading {
      text-align: center;
  padding: 0px 20px;
  margin-top: 90px;
  margin-bottom: 30px;
  margin-left: 100px;
  margin-right: 100px;
  box-sizing: border-box;
  display: none;

}

.home_news_loading.active{
    display: flex;
    align-items: center;
}

.home_news_slider_bottom{
}

.home_news_slider_bottom .section_center_content{
    display: flex;
    gap: 20px;
    justify-content: space-between;
    align-items: end;
}

.cat_legend_item_wrapper{
    display: flex;
    gap: 30px;
    margin-top: 15px;
}

.cat_legend_item{  
    display: flex;
    gap: 10px;
    align-items: center;
}

.home_news_slider_bottom .round_btn{
    border:1px solid #ae6364;
    color:#ae6364;
}

.home_news_slider_bottom .round_btn:hover{
    border:1px solid #ae6364;
    color:#fff;
    background-color: #ae6364;
}

.home_news_section .cat_icon{
    width: 15px;
    height: 15px;
    margin-top: 15px;
}

.home_news_section .cat_legend_item .cat_icon{
    margin-top: auto;
}

.home_news_section .cat_circle{
    width: 15px;
    height: 15px;
    border-radius: 100%;
}

.home_news_section .bg_color1{
    background-color: #ae6364;
}

.home_news_section .bg_color2{
    background-color: #b7adc8;
}

/* event_list_section */

.intro_btn_wrapper{
    margin-top: 80px;
}

.intro_btn_wrapper  .round_btn{
    border:1px #62629b solid;
    color:#62629b;
    margin: auto;
    margin-top: 20px;
    padding: 5px 20px;
}

.intro_btn_wrapper .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
}

.intro_btn_wrapper  .round_btn:first-child{
    margin-top: 0px;
}

.event_list_section{
    padding-top: 60px;
    padding-bottom: 60px;
    position: relative;
    z-index: 7;
}

.filter_menu_section + .event_list_section{
    padding-top: 0px;
}

.filter_menu_section + .event_list_section[style*="display: none;"] + .event_list_section{
  padding-top: 0px;
}

.event_section_title{
    letter-spacing: 0.05em;
  font-weight: 600;
  color: #63629B;
  position: relative;
}

.en_body .event_section_title {
  letter-spacing: 0em;
  font-family: "richmond-text","Chiron Sung HK WS",serif !important;
  font-weight: normal;
}

.event_list_item .title_wrapper{
    border-left:1px solid #059f9f;
    padding-left: 30px;
}
/* event_list_item */


.event_section_title + .event_list_item_wrapper{
    margin-top: 30px;
}

.event_list_item{
    display: flex;
    gap: 20px;
    flex-wrap: nowrap;
}

.event_list_item + .event_list_item{
    margin-top: 60px;
}

.event_list_item .date{
    width: 200px;
    text-align: center;
    flex-grow: 0;  
    align-content: center;
    flex: 0 0 200px;
}

.event_list_item .date > *{
    color:#6f6ea6;
}

.event_list_item .date .btn_wrapper{
    display: flex;
    align-items: center;

}

.event_list_item .d_wrapper{
    display: flex;
    gap: 40px;
    justify-content: center;
}

.event_list_item .d_wrapper .d{
    position: relative;
}

.event_list_item .d_wrapper .d+.d::before{
    content:"";
    position: absolute;
    width: 20px;
    height: 1px;
    right: 100%;
    top:0px;
    bottom: 0px;
    margin: auto;
    margin-right: 10px;
    background-color: #b6b3b3;
}

.event_list_item .date .d1{
    font-weight: 100;
}

.event_list_item .date .d2{
    font-weight: 600;
}


.event_list_item  .round_btn{
    border:1px #62629b solid;
    color:#62629b;
    margin: auto;
    margin-top: 20px;
}

.event_list_item .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
}

.event_list_item .title_wrapper{
    flex-grow: 1;
    align-content: center;
}

.event_list_item .photo{
    flex-grow: 0;
    position: relative;
      flex: 0 0 300px;
}

.event_list_item .photo a:hover{
    opacity: 0.5;
}

.event_list_item .photo::before{
    content:"";
    position: absolute;
    width: 300px;
    height: 300px;
    left: 0px;
    top:0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    border-radius: 100%;
    /* background: linear-gradient(180deg, rgba(239,211,193,1) 70%, rgba(239,211,193,0) 100%); */
}

.event_list_item:nth-child(even) .photo::before{
    /* background: linear-gradient(180deg, rgba(195,217,194,1) 70%, rgba(195,217,194,0) 100%); */
}


.event_list_item .photo img{
    margin: auto;
    display: block;
    position: relative;
    z-index: 1;  
    width: 250px;
    height: 250px;
    object-fit: contain;
}

.event_list_item .info_item_wrapper{
    display: flex;
    gap: 30px 20px;
    flex-wrap: wrap;
    margin-top: 30px;
}

.event_list_item .info_item{
    width: calc(50% - 10px);
    flex-grow: 0;
}

.event_list_item .info_item .t1{
    color: #62629b;
    margin-bottom: 5px;
    font-weight: 600;
}

.event_list_item .big_info_item{
    width: 100%;
    flex-grow: 0;
}

.event_list_item .title{
    color: #62629b;
}

.news_date{
    margin-top: 10px;
}

.news_date:first-child{
    margin-top: auto;
}

.news_title_wrapper .news_date{  
    color: #736562;
    letter-spacing: 0em;
}

.news_title_wrapper + .info_item_wrapper{
    margin-top: 50px;
}

/* home_course_intro_section */

.home_course_intro_section{
    padding-bottom: 60px;
}

.home_course_intro_section > .section_center_content > .col_wrapper > .flex {
    flex-direction: row-reverse;
  }


.home_course_intro_section .vertical_text_wrapper .project_title{
    line-height: 1.25em;
    position: relative;
    color:#62629b;
}

.home_course_intro_section .vertical_text_wrapper .project_smalltitle{
    margin-left: 10px;
    position: relative;
}

.home_course_intro_section .vertical_text_wrapper .project_smalltitle span{
    border-left:1px solid #409192;
    padding-left: 10px;
    display: inline-block;
}


.home_course_intro_section .vertical_text span{
    display: inline-block;
    padding-top: 3px;
}

.home_course_intro_section .vertical_text_wrapper{
    display: flex;
    justify-content: end;
}

.home_course_intro_section .vertical_text{
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 0.25em;
}


.home_course_intro_section .expandable_item + .expandable_item{
    margin-top: 30px;

}

.home_course_intro_section .expandable_item::before {
    display: none;
}

.home_course_intro_section .expandable_title{
    -webkit-transition: padding-top 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s, padding-bottom 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s, margin-bottom 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s;
    transition: padding-top 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s, padding-bottom 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s, margin-bottom 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s;
    border-bottom:1px solid #ae6364;
    color:#62629b;
    display: flex;
    justify-content: space-between;
    padding-right: 0px;
    padding-top: 20px;
    padding-bottom: 10px;
    margin-bottom: 0px;
}

.home_course_intro_section .expandable_item.active .expandable_title {
    padding-top: 20px;
    padding-bottom: 10px;
    margin-bottom: 20px;
  }



.home_course_intro_section .expandable_title .arrow{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    width: 60px;
    height: 40px;
    position: relative;
    cursor: pointer;
}

.home_course_intro_section .expandable_title .arrow::before{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s, width 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s, width 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top:0px;
    bottom: 0px;
    left: 0px;
    margin: auto;
    background-color: #009b9d;
}

.home_course_intro_section .expandable_title:hover .arrow::before{
    left:-10px;
}

.home_course_intro_section .expandable_title .arrow::after{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 20px;
    height: 20px;
    top:0px;
    bottom: 0px;
    left: 3px;
    margin: auto;
    transform: rotate(-45deg);
    border-top:1px solid #009b9d;
    border-left:1px solid #009b9d;
}

.home_course_intro_section .expandable_title:hover .arrow::after{
    left:-8px;
}

.home_course_intro_section .expandable_item.active .expandable_title .arrow::before{
    -webkit-transition: left 0s cubic-bezier(0.77, 0, 0.175, 1) 0s, width 0s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0s cubic-bezier(0.77, 0, 0.175, 1) 0s, width 0s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    width: 0%;
    left: 20px;
}

.home_course_intro_section .expandable_item.active .expandable_title .arrow::after{
    -webkit-transition: left 0s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transform: rotate(-135deg);
    left: 25px;
}

/* home_promotion_section */

.home_promotion_section{
    padding-bottom:60px;
}

.home_promotion_section_title{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}

.home_promotion_section_title h1{
    font-weight: normal;
    color:#62629b;
}

.en_body .home_promotion_section_title h1{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}

.home_promotion_box_wrapper{
    margin-top: 60px;
}

.home_promotion_box_wrapper .section_center_content{
    height: 500px;
    display: flex;
}
.home_promotion_box_inwrapper{
    height: 500px;
    display: flex;
    border-left: 1px solid #5c728c;
    border-right: 1px solid #5c728c;
}

.home_promotion_box{
    height: 500px;
    width: 100px;
    display: flex;
    position: relative;
    overflow: hidden;
}

.home_promotion_box+ .home_promotion_box{
    border-left: 1px solid #5c728c;
}

.home_promotion_box .title{
    -webkit-transition: opacity 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s, left 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: opacity 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s, left 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s;  
    position: absolute;
    /* left: 100px;
    top:0px; */
    width: 100px;
    height: 500px;
    display: flex;
    align-items: start;
    justify-content: space-between;
    /* transform-origin: 0px 0px;
    transform: rotate(90deg); */
    cursor: pointer;
    opacity: 1;
}

.home_promotion_box .title:hover .rotate_text_wrapper{
    opacity: 0.5;
}

.home_promotion_box.active .title{
    left:0px;
    opacity: 0;
    pointer-events: none;
}

.home_promotion_box .title .rotate_text_wrapper  span{
    letter-spacing: 0.1em;
}

.en_body .home_promotion_box .title .rotate_text_wrapper  span{
    letter-spacing: 0em;
}

.home_promotion_box .title .num{
    font-size: calc(12px + 1.3vw);
    position: relative;
    transform: rotate(-90deg);
    height: calc(12px + 1.3vw);
    width: calc(12px + 2.2vw);
    text-align: center;
}
.home_promotion_box .rotate_text_wrapper{
    padding-top: 20px;
    padding-bottom: 45px;
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
    color:#62629b;
      writing-mode: vertical-lr;
}

.en_body .home_promotion_box .rotate_text_wrapper{
      writing-mode: vertical-rl;
}

.en_body .home_promotion_box .rotate_text_wrapper h3{   
        line-height: 1.1em;
}

.home_promotion_box .hidden_wrapper{
    position: relative;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.home_promotion_box.active .hidden_wrapper{
    pointer-events: auto;
}

.home_promotion_box .hidden{
    -webkit-transition: opacity 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: opacity 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    opacity: 0;
    width: 0px;
    display: block;
    position: relative;
}

.home_promotion_box.active .hidden{
    opacity: 1;
    width: 100%;
}

.home_promotion_box .hidden_content{
    padding-left: 30px;
    padding-right: 30px;
}

.home_promotion_box.active{
    width: auto;
}

.home_promotion_box .col_wrapper{
    overflow: visible;
}

.home_promotion_box .image_wrapper{
    /* -webkit-transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transform: translateY(60px);
    opacity: 0; */
}

.home_promotion_box.anim_in .image_wrapper{
    /* transform: translateY(0px);
    opacity: 1; */
}

.home_promotion_box .image_wrapper img{
    width: 100%;
    max-height: 600px;
    object-fit: contain;
    object-position: center center;
}

.home_promotion_box .t_wrapper .t2{
    margin-top: 30px;
}

.home_promotion_box .t_wrapper .btn_wrapper{
    margin-top: 30px;
      display: flex;
  flex-direction: column;
  gap: 10px;
}

.home_promotion_box .t_wrapper .btn_wrapper .round_btn{
    border:1px #62629b solid;
    color:#62629b;
}

.home_promotion_box .t_wrapper .btn_wrapper .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
}

.home_promotion_box .big_num{
    position: absolute;
    bottom: 2px;
    left: 0px;
    color: #62629b;
    width: 100px;
    text-align: center;
    /* opacity: 0; */
}

.home_promotion_box.active .big_num{
    -webkit-transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: all 1.2s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    /* opacity: 1; */
}

/* border_thumb_text_box_slider_wrapper */

.border_thumb_text_box_slider_wrapper{
    margin-top: 60px;
    position: relative;
    padding-bottom: 70px;
}

.border_thumb_text_box_slider_inwrapper{
    overflow: hidden;
    margin-left: 100px;
    margin-right: 100px;
}

.border_thumb_text_box_slider_inwrapper + .dot_wrapper{
    text-align: center;
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 80px;
}

.border_thumb_text_box_slider_inwrapper + .dot_wrapper .swiper-pagination-bullet{
    border:1px solid #A16765;
    background-color: transparent;
    opacity: 1;
}

.border_thumb_text_box_slider_inwrapper + .dot_wrapper .swiper-pagination-bullet-active{
    background-color: #A16765;
}

.border_thumb_text_box_slider_wrapper .swiper-container{
    margin-left: -15px;
    margin-right: -15px;
}

.border_thumb_text_box_slider_wrapper .border_thumb_text_box{
    padding-left: 15px;
    padding-right: 15px;
    cursor: pointer;
}

.border_thumb_text_box_slider_wrapper .border_thumb_text_box:hover .text{
    color:#009b9d;
}

.border_thumb_text_box_slider_wrapper .thumb{
    padding-top: 25%;
}

.border_thumb_text_box_slider_wrapper .thumb img{
}

.border_thumb_text_box_slider_wrapper .text{
    padding-right: 50px;
    position: relative;
}

.border_thumb_text_box_slider_wrapper .text .icon{
    position: absolute;
    top:0px;
    right: 0px;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    border:1px solid #5C728B;
}

.border_thumb_text_box_slider_wrapper .border_thumb_text_box:hover .text .icon{
    border:1px solid #009b9d;
}

.border_thumb_text_box_slider_wrapper .text .icon::before{
    content:"";
    position: absolute;
    top:0px;
    right: 0px;
    bottom: 0px;
    left: 2px;
    margin: auto;
   width: 0px;
   height: 0px;
   border-style: solid;
   border-width: 6px 0 6px 8px;
   border-color: transparent transparent transparent #5C728B;
   transform: rotate(0deg);
}

.border_thumb_text_box_slider_wrapper .border_thumb_text_box:hover .text .icon::before{
    border-color: transparent transparent transparent #009b9d;
}

.border_thumb_text_box_slider_wrapper .swiper-slide{
    height: auto;
    align-self: stretch;
    border-left:1px solid #5C728B;
    box-sizing: border-box;
}
.border_thumb_text_box_slider_wrapper .swiper-slide:nth-child(even) .border_thumb_text_box{
    padding-top: 60px;
}


.border_thumb_text_box_slider_wrapper .prev_btn, .border_thumb_text_box_slider_wrapper .next_btn{
	-webkit-transition: opacity 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: opacity 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    opacity: 0;
    pointer-events: none;
}

.border_thumb_text_box_slider_wrapper .swiper-container{
    position: relative;
}

.border_thumb_text_box_slider_wrapper:hover .prev_btn, .border_thumb_text_box_slider_wrapper:hover .next_btn{
    opacity: 1;
    pointer-events: auto;
}


.border_thumb_text_box_slider_wrapper .prev_btn{
    position: absolute;
    bottom: 0px;
    right: calc(50% + 10px);
    width: 50px;
    height: 50px;
    margin: auto;
    background-color: #009b9d;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
}

.border_thumb_text_box_slider_wrapper .prev_btn:hover{
    background-color: #fff;
}

.border_thumb_text_box_slider_wrapper .prev_btn::after{
    content:"";
    position: absolute;
    width: 40%;
    height: 40%;
    top:0px;
    bottom: 0px;
    left: 15%;
    right: 0px;
    margin: auto;
    transform: rotate(-45deg);
    border-top:1px solid #fff;
    border-left:1px solid #fff;
}

.border_thumb_text_box_slider_wrapper .prev_btn:hover::after{
    border-top:1px solid #009b9d;
    border-left:1px solid #009b9d;
}

.border_thumb_text_box_slider_wrapper .next_btn{
    position: absolute;
    bottom: 0px;
    left: calc(50% + 10px);
    width: 50px;
    height: 50px;
    margin: auto;
    background-color: #009b9d;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
}

.border_thumb_text_box_slider_wrapper .next_btn:hover{
    background-color: #fff;
}

.border_thumb_text_box_slider_wrapper .next_btn::after{
    content:"";
    position: absolute;
    width: 40%;
    height: 40%;
    top:0px;
    bottom: 0px;
    left: 0px;
    right: 15%;
    margin: auto;
    transform: rotate(45deg);
    border-top:1px solid #fff;
    border-right:1px solid #fff;
}


.border_thumb_text_box_slider_wrapper .next_btn:hover::after{
    border-top:1px solid #009b9d;
    border-right:1px solid #009b9d;
}

/* thumb_text_box_slider */

.thumb_text_box_slider_wrapper{
    margin-top: 60px;
    position: relative;
    overflow: hidden;
}

.thumb_text_box_slider_wrapper .swiper-slide{
    cursor: pointer;
}

.thumb_text_box_slider_wrapper .swiper-slide .thumb{
    padding-bottom: 100%;
    position: relative;
    margin-right: 30px;
    width: auto;
}

.thumb_text_box_slider_wrapper .swiper-slide .thumb .video_play_btn{
    -webkit-transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    position: absolute;
    top:0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
   width: 0px;
   height: 0px;
   border-style: solid;
    border-width: 24px 0 24px 36px;
    border-color: transparent transparent transparent #ffffff;
   transform: rotate(0deg);
   margin: auto;
}

.thumb_text_box_slider_wrapper .swiper-slide:hover .thumb .video_play_btn{
    border-color: transparent transparent transparent #009b9d;
}

.thumb_text_box_slider_wrapper .swiper-slide .thumb2 {
    padding-bottom: 56.25%;
}

.thumb_text_box_slider_wrapper .swiper-slide .thumb img{
    position: absolute;
    left: 0px;
    top:0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.thumb_text_box_slider_wrapper .swiper-slide:nth-child(even) .thumb3{  
    background-color: #ccc;
    background: linear-gradient(180deg, rgba(239,211,193,1) 20%, rgba(239,211,193,0.2) 100%);
}

.thumb_text_box_slider_wrapper .swiper-slide:nth-child(odd) .thumb3{  
    background-color: #ccc;
    background: linear-gradient(180deg, rgba(195,217,194,1) 20%, rgba(195,217,194,0.2) 100%);
}

.thumb_text_box_slider_wrapper .swiper-slide .thumb3 img{
    width: 80%;
    height: 80%;
    object-fit: contain;
}



.thumb_text_box_slider_wrapper .swiper-slide .text{
    margin-left: 30px;
    margin-top: -60px;
}

.thumb_text_box_slider_wrapper .swiper-slide .text_spacing{
    -webkit-transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    padding: 20px;
    padding-top: 120px;
    background-color: #fff;
    display: block;
}

.thumb_text_box_slider_wrapper .swiper-slide:hover .text_spacing{
    background-color: #e1e9de;
}

.thumb_text_box_slider_wrapper .swiper-slide .cat{
    font-weight: 600;
}

.thumb_text_box_slider_wrapper .swiper-slide .title{
    color:#009b9d;
    margin-top: 20px;
}

.thumb_text_box_slider_wrapper .swiper-slide .title:first-child{
    margin-top: auto;
}

.thumb_text_box_slider_wrapper .swiper-slide .description{
    margin-top: 20px;
}

.thumb_text_box_slider_wrapper .swiper-slide .name{
    margin-top: 20px;
}

.thumb_text_box_slider_wrapper .prev_btn, .thumb_text_box_slider_wrapper .next_btn{
	/* -webkit-transition: opacity 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: opacity 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    opacity: 0;
    pointer-events: none; */
}

.thumb_text_box_slider_wrapper .swiper-container{
    position: relative;
    width: 140%;
    left: -20%;
}

.thumb_text_box_slider_wrapper:hover .prev_btn, .thumb_text_box_slider_wrapper:hover .next_btn{
    /* opacity: 1;
    pointer-events: auto; */
}


.thumb_text_box_slider_wrapper .prev_btn{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    position: absolute;
    top:0px;
    bottom: 0px;
    left: 45px;
    width: 100px;
    height: 60px;
    margin: auto;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
}

.thumb_text_box_slider_wrapper .prev_btn::before{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top:0px;
    bottom: 0px;
    left: 0px;
    margin: auto;
    background-color: #009b9d;
}

.thumb_text_box_slider_wrapper .prev_btn:hover::before{
    left:-10px;
}

.thumb_text_box_slider_wrapper .prev_btn::after{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 30px;
    height: 30px;
    top:0px;
    bottom: 0px;
    left: 5px;
    margin: auto;
    transform: rotate(-45deg);
    border-top:1px solid #009b9d;
    border-left:1px solid #009b9d;
}

.thumb_text_box_slider_wrapper .prev_btn:hover::after{
    left:-5px;
}

.thumb_text_box_slider_wrapper .next_btn{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    position: absolute;
    top:0px;
    bottom: 0px;
    right: 45px;
    width: 100px;
    height: 60px;
    margin: auto;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
}

.thumb_text_box_slider_wrapper .next_btn::before{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top:0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    background-color: #009b9d;
}

.thumb_text_box_slider_wrapper .next_btn:hover::before{
    right:-10px;
}

.thumb_text_box_slider_wrapper .next_btn::after{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 30px;
    height: 30px;
    top:0px;
    bottom: 0px;
    right: 5px;
    margin: auto;
    transform: rotate(45deg);
    border-top:1px solid #009b9d;
    border-right:1px solid #009b9d;
}

.thumb_text_box_slider_wrapper .next_btn:hover::after{
    right:-5px;
}

/* */


.thumb_text_box_slider_wrapper2{
    margin-top: 50px;
    position: relative;
    overflow: hidden;
}

.thumb_text_box_slider_wrapper2  .swiper-container{
    overflow: visible;
}

.thumb_text_box_slider_wrapper2 .swiper-slide{
    cursor: pointer;
}

.thumb_text_box_slider_wrapper2 .swiper-slide .thumb{
    padding-bottom: 56.25%;
    position: relative;
    margin-right: 0px;
    width: auto;
}

.thumb_text_box_slider_wrapper2 .swiper-slide .thumb img{
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}
.thumb_text_box_slider_wrapper2 .swiper-slide .text{
    margin-top: 30px;
}

.thumb_text_box_slider_wrapper2 .swiper-slide .text_spacing{
    padding: 0px 30px;
    border-left:1px solid #619c92;
}


.thumb_text_box_slider_wrapper2 .swiper-slide .title_wrapper{
    position: relative;
    padding-right: 80px;
}

.thumb_text_box_slider_wrapper2 .swiper-slide .title{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
    color:#6f6ea1;
}


.thumb_text_box_slider_wrapper2 .swiper-slide .title2{
    color:#6f6ea1;
    margin-top: 20px;
}

.thumb_text_box_slider_wrapper2 .swiper-slide .year{
    position: absolute;
    top:0px;
    right: 0px;
    font-weight: 600;
    color:#6f6ea1;
}

.thumb_text_box_slider_wrapper2 .swiper-slide .description{
    margin-top: 20px;
}

.thumb_text_box_slider_wrapper2 .swiper-slide .name{
    margin-top: 20px;
}

.thumb_text_box_slider_wrapper2 .prev_btn, .thumb_text_box_slider_wrapper2 .next_btn{
	/* -webkit-transition: opacity 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: opacity 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    opacity: 0;
    pointer-events: none; */
}

.thumb_text_box_slider_wrapper2 .swiper-container{
    position: relative;
    margin-left: 80px;
}

.thumb_text_box_slider_wrapper:hover .prev_btn, .thumb_text_box_slider_wrapper:hover .next_btn{
    /* opacity: 1;
    pointer-events: auto; */
}


.thumb_text_box_slider_wrapper2 .prev_btn{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    position: absolute;
    top:0px;
    bottom: 0px;
    left: 45px;
    width: 100px;
    height: 60px;
    margin: auto;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
}

.thumb_text_box_slider_wrapper2 .prev_btn::before{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top:0px;
    bottom: 0px;
    left: 0px;
    margin: auto;
    background-color: #009b9d;
}

.thumb_text_box_slider_wrapper2 .prev_btn:hover::before{
    left:-10px;
}

.thumb_text_box_slider_wrapper2 .prev_btn::after{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 30px;
    height: 30px;
    top:0px;
    bottom: 0px;
    left: 5px;
    margin: auto;
    transform: rotate(-45deg);
    border-top:1px solid #009b9d;
    border-left:1px solid #009b9d;
}

.thumb_text_box_slider_wrapper2 .prev_btn:hover::after{
    left:-5px;
}

.thumb_text_box_slider_wrapper2 .next_btn{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    position: absolute;
    top:0px;
    bottom: 0px;
    right: 45px;
    width: 100px;
    height: 60px;
    margin: auto;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
}

.thumb_text_box_slider_wrapper2 .next_btn::before{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top:0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    background-color: #009b9d;
}

.thumb_text_box_slider_wrapper2 .next_btn:hover::before{
    right:-10px;
}

.thumb_text_box_slider_wrapper2 .next_btn::after{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 30px;
    height: 30px;
    top:0px;
    bottom: 0px;
    right: 5px;
    margin: auto;
    transform: rotate(45deg);
    border-top:1px solid #009b9d;
    border-right:1px solid #009b9d;
}

.thumb_text_box_slider_wrapper2 .next_btn:hover::after{
    right:-5px;
}

.thumb_text_box_slider_wrapper2 .btn_wrapper{
    margin-top: 20px;
}

.thumb_text_box_slider_wrapper2 .round_btn{
    border:1px #6f6ea1 solid;
    color:#6f6ea1;
}

.thumb_text_box_slider_wrapper2 .round_btn:hover{
    border:1px #6f6ea1 solid;
    color:#fff;
    background-color: #6f6ea1;
}
/* publication_box */

.filter_result_section{
    padding-top: 0px;
}

.publication_box_list{
    margin-top: 60px;
    display: flex;
    flex-wrap: wrap; 
    gap: 60px 60px; 
}

.filter_result_section .publication_box_list{
    margin-top: auto;
}

.publication_box_list_title{
    margin-bottom: 60px;
    color: #6f6ea1;
}

.en_body .publication_box_list_title{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}

.publication_box_list_wrapper+.publication_box_list_wrapper{
    margin-top: 60px;
    padding-top: 60px;
    border-top:1px solid #9f9b9a;;
}

.publication_box{
    display: flex;  
    gap: 20px;   
    flex: 0 0 calc(33.33% - 50px); /* Changed flex-grow to 0 */
    box-sizing: border-box; /* Ensures padding doesn't affect width */
}

.publication_box .publication_thumb{
    width: 50%;
}

.publication_box .publication_thumb img{
    box-shadow: 5px 5px 10px rgba(0,0,0,.3);
}

.publication_box a:hover{
    opacity: 0.5;
}

.publication_box .publication_text{
    width: 50%;
}

.publication_text .year{
    color:#63629B;
}

.publication_text_item{
    margin-top: 20px;
}

.publication_text_item:first-child{
    margin-top: auto;
}

.publication_text_item.book_name{
    color:#63629B;
    font-weight: 600;
}

.publication_text_item.book_name a{
    color:#63629B;
}

.publication_text_item.book_name a:hover{
    color:#ae6364;
    opacity: 1;
}

.publication_text_item .title{
    color:#63629B;
    font-weight: 600;
    text-transform: uppercase;
}


/* top_photo_banner_section */

.top_photo_banner_section{
    padding-top: 60px;
    padding-bottom: 60px;
    z-index: 4;
}

.top_photo_banner_section_hidden{
    overflow: hidden;
}

.top_photo_banner_section .col_wrapper{
    overflow: visible;
}

.top_photo_banner_section:first-child{
    margin-top: auto;
}

.top_photo_banner_section .flex{
    flex-direction: row-reverse;
}

.top_photo_banner_section.banner_bg .section_center_content{
    position: relative;
}

.top_photo_banner_section.banner_bg .section_center_content::before {
    content: "";
    position: absolute;
    top: 130px;
    right: calc(16.68% - 60px); 
    left: calc(41.66% - 180px);
    height: 400px;
    background: linear-gradient(180deg, rgba(239,211,193,1) 0%, rgba(239,211,193,0) 100%);
  }

.top_photo_banner_section.banner_bg2 .section_center_content::before {
    content: "";
    position: absolute;
    top: 130px;
    right: calc(16.68% - 60px); 
    left: calc(41.66% - 180px);
    height: 400px;
    background: linear-gradient(180deg, rgba(195,217,194,1) 0%, rgba(195,217,194,0) 100%);
  }

.top_photo_banner_section .photo_wrapper{
    margin-left: -50px;
}

.top_photo_banner_section .photo_wrapper .photo{
    padding-bottom: 50%;
    position: relative;  
    overflow: hidden;
}

.top_photo_banner_section .photo_wrapper .photo img{
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.top_photo_banner_section .chair_photo_wrapper{
    display: flex;
    align-items: end;
    gap:20px
}

.top_photo_banner_section .chair_photo_wrapper .chair_name .t1{
    font-weight: 600;
}

.top_photo_banner_section .chair_photo_wrapper .chair_name .t2{
    margin-top: 5px;
}

.top_photo_banner_section .text_wrapper{
    padding-right: 0px;
    color:#636298;
    display: flex;
    flex-direction: column;
}

.top_photo_banner_section .text_wrapper .description{
    margin-top: 50px;
}


.top_photo_banner_section .text_wrapper .description.free_text{
    color:#63629B
    
}

.top_photo_banner_section .text_wrapper .project_title, .top_photo_banner_section .text_wrapper .project_smalltitle{
    position: relative;
}

.en_body .top_photo_banner_section .text_wrapper .project_title, .en_body .top_photo_banner_section .text_wrapper .project_smalltitle{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}

.top_photo_banner_section .text_wrapper  .title_bg_wrapper{
    position: relative;
    padding-bottom: 20px;
}

.top_photo_banner_section .text_wrapper  .title_bg_wrapper::before {
    content: "";
    position: absolute;
    left: -9999px;
    bottom: 0px;
    right: -9999px;
    margin: auto;
    height: 80px;
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%);
    pointer-events: none;
  }

.top_photo_banner_section .text_wrapper .description.free_text h1,
.top_photo_banner_section .text_wrapper .description.free_text h2,
.top_photo_banner_section .text_wrapper .description.free_text h3,
.top_photo_banner_section .text_wrapper .description.free_text h4,
.top_photo_banner_section .text_wrapper .description.free_text h5,
.top_photo_banner_section .text_wrapper .description.free_text h6{
}


.top_photo_banner_section .text_wrapper .border_btn_wrapper{
    margin-top: 50px;
    padding-top: 20px;
    border-top:1px solid #009594;
    color:#717272;
}

.top_photo_banner_section .text_wrapper .border_btn_wrapper .btn{
    display: block;
    padding: 5px 10px;
    border-radius: 16px;
    background-color: #fff;
}

.top_photo_banner_section .text_wrapper .border_btn_wrapper .btn:hover{
    background-color: #63629B;
    color:#fff;
}


.top_photo_banner_section .text_wrapper .border_btn_wrapper .btn + .btn{
    margin-top: 10px;
}

.top_photo_banner_section .text_wrapper .border_btn_wrapper .btn_title{
    color:#63629B;
    margin-bottom: 10px;
}

.top_photo_banner_section .text_wrapper .border_btn_wrapper .btn_text{
    position: relative;
    padding-right: 50px;
}

.top_photo_banner_section .text_wrapper .border_btn_wrapper .btn_text::before{
    content:"";
    position: absolute;
    top:0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    width: 30px;
    height: 1px;
    background-color: #009594;
}

.top_photo_banner_section .text_wrapper .border_btn_wrapper .btn:hover .btn_text::before{
    background-color: #fff;
    right: 2px;
}

.top_photo_banner_section .text_wrapper .border_btn_wrapper .btn_text::after{
    content:"";
    position: absolute;
    top:0px;
    bottom: 0px;
    right: 20px;
    margin: auto;
    width: 10px;
    height: 10px;
    border-top:1px solid #009594;
    border-left:1px solid #009594;
    transform: rotate(-45deg);
}

.top_photo_banner_section .text_wrapper .border_btn_wrapper .btn:hover .btn_text::after{
    border-top:1px solid #fff;
    border-left:1px solid #fff;
    right: 22px;
}

.top_photo_banner_section .absolute_vertical_text_wrapper{
    position: absolute;
    right: 0px;
    top:0px;
}

.top_photo_banner_section .vertical_text_wrapper .project_title{
    line-height: 1.25em;
    position: relative;
}

.top_photo_banner_section .vertical_text_wrapper .project_smalltitle{
    margin-left: 10px;
    position: relative;
}

.top_photo_banner_section .vertical_text_wrapper .project_smalltitle span{
    border-left:1px solid #409192;
    padding-left: 10px;
    display: inline-block;
}


.top_photo_banner_section .vertical_text span{
    display: inline-block;
    padding-top: 3px;
}

.top_photo_banner_section .vertical_text_wrapper{
    
}

.top_photo_banner_section .vertical_text{
    writing-mode: vertical-rl;
    text-orientation: mixed;
    letter-spacing: 0.25em;
}

.en_body .top_photo_banner_section .vertical_text{
    writing-mode: horizontal-tb;
  text-orientation: mixed;
  letter-spacing: 0em;
  /* position: absolute;
  top: 0px;
  right: 0px; */
  text-align: right;
}

.top_photo_banner_section .caption{
    margin-left: 50px;
}

.top_photo_banner_section_absolute{
    position: absolute;
    right: 0px;
    width: 100%;
    z-index: 4;
    pointer-events: none;
}

.top_photo_banner_section_absolute .vertical_text_wrapper .project_title{
    line-height: 1.25em;
    position: relative;
}

.top_photo_banner_section_absolute .vertical_text{
    pointer-events: auto;
}

/* section_right_content */


.section_right_content{
    padding-top: 60px;
    padding-bottom: 60px;
}

.section_right_content:first-child{
    margin-top: auto;
}

.section_right_content .flex{
    justify-content: end;
}

.section_right_content .free_text h1,
.section_right_content .free_text h2,
.section_right_content .free_text h3,
.section_right_content .free_text h4,
.section_right_content .free_text h5,
.section_right_content .free_text h6{
    color:#409192
}

.section_right_content .flexible_layout_photo:first-child{
    margin-left: 100px;
}

/* section_left_right_content */

.top_photo_banner_section + .section_left_right_content{
    z-index: 4;
    padding-top: 0px;
}

.section_left_right_content{
    padding-top: 60px;
    padding-bottom: 60px;
}

.section_left_right_content .col_wrapper{
    overflow: visible;
}

.section_left_right_content:first-child{
    margin-top: auto;
}

.section_left_right_content .free_text h1,
.section_left_right_content .free_text h2,
.section_left_right_content .free_text h3,
.section_left_right_content .free_text h4,
.section_left_right_content .free_text h5,
.section_left_right_content .free_text h6{
    color:#409192
}

.section_left_right_content .right_content .flexible_layout_photo:first-child{
    margin-left: 100px;
}

.top_photo_banner_section_absolute + .section_left_right_content2{
    z-index: 3;
}

.top_photo_banner_section_absolute + .section_left_right_content{
      padding-top: 60px;
}

.section_left_right_content2 .col_wrapper{
    overflow: visible;
}

.section_left_right_content2 .flex{
    justify-content: center;
}

.section_left_right_content2 .left_content{
    position: relative;
    z-index: 1;
}

.section_left_right_content2 .left_content .photo{
    text-align: center;
}


.section_left_right_content2 .left_content .photo img{

      width: 100%;
  height: auto;
  object-fit: contain;

}



.section_left_right_content2 .left_content .caption{
    /* margin-left: 50px; */
}

.section_left_right_content2 .right_content{
    margin-top: 100px;
    padding-top: 100px;
    position: relative;
}

.section_left_right_content2 .right_content::before{
    content:"";
    position: absolute;
    top:-150px;
    right: -150px;
    left: -150px;
    height: 400px;
    background: linear-gradient(180deg, rgba(239,211,193,1) 0%, rgba(239,211,193,0) 100%);
}

.section_left_right_content2 .info_item_wrapper{
    position: relative;
}


.section_left_right_content2 .info_item_wrapper{
    display: flex;
    gap: 30px 20px;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.section_left_right_content2 .info_item_wrapper + .flexible_layout{
    border-top:1px solid #409192;
    padding-top: 50px;
}

.section_left_right_content2 .info_item{
    width: calc(50% - 10px);
    flex-grow: 0;
}

.section_left_right_content2 .info_item .t1{
    color: #409192;
    margin-bottom: 5px;
    font-weight: 600;
}

.section_left_right_content2 .big_info_item{
    width: 100%;
    flex-grow: 0;
}

.section_left_right_content2 .title{
    color: #409192;
}

.news_right_content .news_title_wrapper{
    margin-top: -150px;
    margin-bottom: 50px;
}

.news_title_wrapper{
        position: relative;
}

.news_title_wrapper .news_cat{  
    color: #409192;
    position: relative;
    margin-bottom: 10px;
    letter-spacing: 0em;
}

.news_title_wrapper .news_title{
      color: #636298;
        position: relative;
    letter-spacing: 0.05em;
}

.en_body .news_title_wrapper .news_title{
    letter-spacing: 0em;
      font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}

/* plain_text_section */

.plain_text_section{
    padding-top: 60px;
    padding-bottom: 60px;
}

.section_content + .plain_text_section{
    padding-top: 0px;
}

.plain_text_section .free_text  .table-responsive{
    position: relative;
}


.top_photo_banner_section + .plain_text_section{
    padding-top: 0px;
    z-index: 4;
}

.plain_text_section .free_text h1,
.plain_text_section .free_text h2,
.plain_text_section .free_text h3,
.plain_text_section .free_text h4,
.plain_text_section .free_text h5,
.plain_text_section .free_text h6{
    color:#63629B
}

/* year_list_slider */

.year_list_section{
    padding-top: 60px;
    padding-bottom: 60px;
      z-index: 12;
}

.year_list_slider_wrapper{
    position: relative;
    padding-bottom: 20px;
}

.year_list_slider_wrapper::before {
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    height: 80px;
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%);
    pointer-events: none;
    display: none;
  }

.year_list_slider_inwrapper{
    overflow: hidden;
    margin-left: 30px;
    margin-right: 30px;
}

.year_list_slider .swiper-container{
    margin-left: -1px;
}

.year_list_slider .swiper-slide{
    width: auto;
}
.year_list_slider .swiper-slide div{
    padding-left: 50px;
    padding-right: 50px;
    text-align: center;
}

.year_list_slider .swiper-slide + .swiper-slide div{
    border-left:1px solid #D5CECA;
}

.year_list_slider .swiper-slide div a{
    color:#575555;
    padding-top: 5px;
    padding-bottom: 5px;
    display: inline-block;
    box-sizing: border-box;
    font-weight: 100;
}
.year_list_slider .swiper-slide div a.active{
    border-bottom:1px solid #009b9d;
}


.year_list_slider_wrapper:hover .prev_btn, .year_list_slider_wrapper:hover .next_btn{
    opacity: 1;
    pointer-events: auto;
}


.year_list_slider_wrapper .prev_btn{
    position: absolute;
    top:0px;
    bottom: 0px;
    left: 50px;
    width: 30px;
    height: 30px;
    margin: auto;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
}

.year_list_slider_wrapper .prev_btn:hover{
}

.year_list_slider_wrapper .prev_btn::after{
    content:"";
    position: absolute;
    width: 40%;
    height: 40%;
    top:0px;
    bottom: 0px;
    left: 15%;
    right: 0px;
    margin: auto;
    transform: rotate(-45deg);
    border-top:1px solid #9f9b9a;
    border-left:1px solid #9f9b9a;
}

.year_list_slider_wrapper .prev_btn:hover::after{
    border-top:1px solid #009b9d;
    border-left:1px solid #009b9d;
}

.year_list_slider_wrapper .next_btn{
    position: absolute;
    top:0px;
    bottom: 0px;
    right: 50px;
    width: 30px;
    height: 30px;
    margin: auto;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
}

.year_list_slider_wrapper .next_btn:hover{
}

.year_list_slider_wrapper .next_btn::after{
    content:"";
    position: absolute;
    width: 40%;
    height: 40%;
    top:0px;
    bottom: 0px;
    left: 0px;
    right: 15%;
    margin: auto;
    transform: rotate(45deg);
    border-top:1px solid #9f9b9a;
    border-right:1px solid #9f9b9a;
}


.year_list_slider_wrapper .next_btn:hover::after{
    border-top:1px solid #009b9d;
    border-right:1px solid #009b9d;
}

.year_list_grid_wrapper{
    margin-top: 60px;
}

.year_list_grid .bigtext_wrapper{
    padding: 15px;
    padding-bottom: 60px;
    position: relative;
}

.year_list_grid .bigtext_wrapper .bg{
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 100%;
}

.year_list_grid .bigtext_wrapper .t1{
    position: relative;
}

.year_list_grid .bigtext_wrapper .t2{
    position: relative;
    margin-top: 5px;
}

.year_list_grid .photo, .year_list_grid .text{
    margin-top: 15px;
}

.year_list_grid .bigtext_wrapper .text{
    margin-top: auto;
}

.year_list_grid .photo:first-child, .year_list_grid .text:first-child{
    margin-top: auto;
}

.year_list_grid .text{
    color:#685B58;
    font-weight: 600;
}



.year_list_grid .btn_wrapper{
    margin-top: 30px;
}

.year_list_grid .photo img{
    width: 100%;

}

.year_list_grid .date{
    color:#5C728B;
    font-weight: 600;
}

.year_list_grid .round_btn{
    border:1px #5C728B solid;
    color:#5C728B;
}

.year_list_grid .round_btn:hover{
    border:1px #5C728B solid;
    color:#fff;
    background-color: #5C728B;
}

.year_list_grid_wrapper .col{
    margin-top: 60px;
}

.year_list_grid_wrapper .row{
    margin-top: -60px;
}

.year_list_grid.col2_4 .photo{
    padding-bottom: calc(112.5% + 15px);
    position: relative;  
    overflow: hidden;
}

.year_list_grid.col4_8 .photo{
    padding-bottom: 56.25%;
    position: relative;  
    overflow: hidden;
}

.year_list_grid.col .photo img{
    position: absolute; 
    left: 0px;
    top:0px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.project_item_wrapper{
    padding-top: 30px;
}

/* section_intro */

.section_intro::before{
    content:"";
    position: absolute;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    height: 80px;
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
    pointer-events: none;
    z-index: 1;
}

.section_intro .section_center_content{
    position: relative;
    z-index: 1;
}

/* research_centre_box */


.research_centre_box_list{
}
.research_centre_box + .research_centre_box{
    margin-top: 50px;
}
.research_centre_box .col{
    display: flex;
}

.research_centre_box .col_spacing{
    display: flex;
    padding-bottom: 50px;
    border-bottom: 1px solid #009594;
    width: 100%;
}

.research_centre_logo .thumb{
    width: 65%;
    margin: auto;
}

.research_centre_text{
}

.research_centre_text_item_wrapper{
    display: flex;
    gap: 20px 50px;
    flex-wrap: wrap;
    align-content: center;
}

.research_centre_text_item{
    flex: 0 0 calc(33.33% - 33.33px);
    overflow: hidden;
    word-wrap: break-word;
}

.research_centre_text_item a{
    color:#45adb3;
	/* text-decoration: underline; */
}

.research_centre_text_item a:hover{
    opacity: 0.5;
}

.research_centre_text_item.col12{
    flex: 0 0 calc(100%);
}

.research_centre_text_item .t1{
    color:#63629B;
    font-weight: 600;
    margin-bottom: 5px;
}

.research_centre_text .description .t1{
    color:#63629B;
    font-weight: 600;
}

.research_centre_text .description .t2{
    margin-top: 10px;
}

.research_centre_text .description .btn_wrapper{
    margin-top: 20px;
}

.research_centre_text  .round_btn{
    border:1px #62629b solid;
    color:#62629b;
    margin: auto;
    margin-top: 20px;
}

.research_centre_text  .round_btn:first-child{
    margin-top: auto;
}

.research_centre_text .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
}

.research_thesis_list .flex{
    flex-wrap: nowrap;
    align-items: stretch;
}

.research_thesis_list .flex > *, .research_thesis_list .flex > * > *{
    display: flex;
    align-items: stretch;
}

.research_thesis_list .flex > * > *{
    width: 100%;
}

.research_thesis_list .t_wrapper{
    display: flex;
    gap: 20px;
    padding-bottom: 50px;
    width: 100%;
    border-bottom:1px solid #a26766;
}

.research_thesis_list .t{
}

.research_thesis_list .col3 .t{
    flex-grow: 0;
    width: 50%;
}

.research_thesis_list .col7 .t:first-child{
    width: 30%;
}

.research_thesis_list .col7 .t+.t{
    flex: 1;
}

.research_thesis_list .t1{
    color: #62629b;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 5px;
}

.research_thesis_list .row{
    margin-left: auto;
    margin-right: auto;
}

.research_thesis_list .col_spacing{
    margin-left: auto;
    margin-right: auto;
}

/* news_box_section */


.news_box .round_btn{
    border:1px #6F6EA6 solid;
    color:#6F6EA6;
}

.news_box .round_btn:hover{
    border:1px #6F6EA6 solid;
    color:#fff;
    background-color: #6F6EA6;
}

.featured_news_box_section{
    padding-top: 60px;
    padding-bottom: 60px;
}

.featured_news_box_section .col_wrapper{
    overflow: visible;
}

.featured_news_box_section .news_box .photo{
    position: relative;
    padding-bottom: 56.25%;
    margin-bottom: 30px;
    background-color: rgba(255,255,255,0.8);
}

.featured_news_box_section .news_box .photo a:hover{
    opacity: 0.5;
}

.featured_news_box_section .news_box .photo img{  
    position: absolute;
  left: 0%;
  top: 0%;
  width: 80%;
  height: 80%;
  object-fit: contain;
  object-position: center center;
  right: 0%;
  bottom: 0%;
  margin: auto;
}

.featured_news_box_section .news_box .date_wrapper{
    float: left;
    margin-right: 20px;
    width: 30%;
    color:#63629B;
    font-weight: 100;
}


.featured_news_box_section .news_box .title_wrapper{
    overflow: hidden;
    padding-left: 20px;
    border-left:1px solid #62629e
}

.featured_news_box_section .news_box .title_wrapper .title{
    color:#6F6EA6;
    font-weight: 600;
}

.featured_news_box_section .news_box .btn_wrapper{
    margin-top: 50px;
}


.news_box_section{
    padding-top: 60px;
    padding-bottom: 60px;
}

.filter_menu_section + .news_box_section{
    padding-top: 0px;
}

.news_gallery_box_section{
    padding-top: 0px;
    }

.news_box_section .col_spacing{
    display: flex;
    flex-direction: row-reverse;
    gap: 40px;
    border-top:1px solid #62629e;
      padding-top: 15px;
}

.news_gallery_box_section .col_spacing{
    gap: 20px;
}

.news_box_section .row{
    margin-top: -60px;
}

.news_box_section .news_box{
    margin-top: 60px;
}

.news_box_section .news_box .photo {
    position: relative;
    margin-bottom: auto;
    /* padding-bottom: 45%; */
    position: relative;
    display: block;
    flex: 1;
  }


.news_box_section .news_box:nth-child(even) .photo{  
    background-color: rgba(255,255,255,0.8);
    /* background: linear-gradient(180deg, rgba(239,211,193,1) 0%, rgba(239,211,193,0.5) 100%); */
}

.news_box_section .news_box:nth-child(odd) .photo{  
    background-color: rgba(255,255,255,0.8);
    /* background: linear-gradient(180deg, rgba(195,217,194,1) 0%, rgba(195,217,194,0.5) 100%); */
}


.news_box_section .news_box .photo img{  
    /* position: absolute;
  left: 0px;
  top: 0px;
  width: 85%;
  height: 85%;
  object-fit: contain;
  object-position: center center;
  right: 0px;
  bottom: 0px;
  margin: auto; */
  width: 100%;
}

.news_gallery_box_section .news_box .photo {
    position: relative;
    margin-bottom: auto;
    padding-bottom: 56.26%;
    position: relative;
    display: block;
    flex: 1;
    background-color: #ffffff;
  }

.news_gallery_box_section .news_box .photo img{  
    position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  right: 0px;
  bottom: 0px;
  margin: auto;
}

.news_box_section .news_box a.photo:hover{
    opacity: 0.5;
}

.news_box_section .news_box .text_wrapper {
    padding-top: 15px;
    padding-top: 0px;
    flex: 0 0 calc(50% - 20px); /* Changed flex-grow to 0 */
  }

.news_gallery_box_section.news_box_section .news_box .text_wrapper {
    padding-top: 15px;
  }

.teaching_project_section.news_gallery_box_section .news_box .photo {
    position: relative;
    padding-bottom: 0px;
  }

.teaching_project_section.news_gallery_box_section .news_box .photo img{  
    position: relative;
  left: auto;
  top: auto;
  width: 100%;
  height: auto;
  object-fit:unset;
  object-position: center center;
  right: auto;
  bottom: auto;
  margin: auto;
  }


.news_gallery_box_section .col_spacing{
    flex-direction: row;
    display: block;
}

.news_gallery_box_section .news_box .text_wrapper {
    flex: 0 0 calc(40% - 20px); /* Changed flex-grow to 0 */
  }
  
.news_box_section .news_box .date_wrapper {
    float: none;
    margin-right: auto;
    width: 100%;
    color: #62629e;
    margin-bottom: 5px;
  }

.news_box_section .news_box .date_wrapper + .title_wrapper{
    margin-top: 25px;
}
  

  .news_box_section .news_box .title{
    font-weight: 600;
    color: #62629e;
}

.news_box_section .news_box .btn_wrapper{
      margin-top: 50px;
  }

.gallery_detail_box .photo{
    padding-bottom: 56.26%;
    position: relative;
      display: block;
}

.gallery_detail_box .photo img{
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.gallery_detail_box a:hover{
    opacity: 0.5;
}

/* alphabet_list_wrapper */

.filter_menu_section{
    position: relative;
    z-index: 9;
}

.filter_menu_section > .section_center_content{
    position: relative;
    z-index: 1;
}

.filter_menu_wrapper{
    padding-top: 60px;
}

.filter_menu{
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 50px;
    position: relative;
}

.filter_menu_no_flex{
    display: block;
}

.filter_menu_bottom2 > .section_center_content{
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 50px;
    position: relative;
}

.filter_menu_content{
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 50px;
    position: relative;
}

.full_filter_menu_content{
    width: 100%;
}

.filter_menu_bottom{
    justify-content: start;
}

.filter_menu_bottom .filter_menu_content{
    justify-content: start;
}

.filter_remark{
    padding-top: 20px;
}

.filter_menu::before{
	-webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    height: 80px;
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
    pointer-events: none;
}

.filter_menu_left_bg::before{
    display: none;
}

.filter_menu_left_bg .filter_menu_content::before{
	-webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    bottom: 0px;
    right: -50px;
    margin: auto;
    height: 80px;
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
    pointer-events: none;
    width: 99999px;
}

.full_filter_menu_wrapper{
    position: relative;
}

.full_filter_menu_wrapper .filter_menu_left_bg .filter_menu_content::before{
    display: none;
}

.full_filter_menu_wrapper::before{
    content:"";
    position: absolute;
    bottom: 0px;
    right: 0px;
    margin: auto;
    height: 80px;
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
    pointer-events: none;
    width: auto;
    left: 0px;
}

.alphabet_list_wrapper{
    position: relative;
    padding-top: 20px;
    padding-bottom: 20px;
}

.alphabet_list_wrapper .title{
    color:#62629b;
}

.alphabet_list_wrapper .alphabet_list{
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    /* margin-top: 20px; */
}

.alphabet_list_wrapper .alphabet_list:first-child{
    margin-top: auto;
}

.alphabet_list_wrapper .title + .alphabet_list{
    margin-top: 20px;
}

.big_alphabet_list_wrapper .alphabet_list{
    gap: 5px 0px;
}

.alphabet_list_wrapper .alphabet_list a{
    cursor: pointer;
    position: relative;
}

.alphabet_list_wrapper .alphabet_list a.active, .alphabet_list_wrapper .alphabet_list a:hover{
    color:#009b9d
}

.alphabet_list_wrapper .alphabet_list a.active::after{
    content:"";
    position: absolute;
      border-bottom: 1px solid #009b9d;
      position: absolute;
      left: 0px;
      right: 0px;
      top:100%;
      margin: auto;  
      margin-top: 3px;
      box-sizing: border-box;
}

.big_alphabet_list_wrapper .alphabet_list li{
    padding-right: 20px;
    margin-right: 20px;
    border-right:1px solid #63629B;

}

.big_alphabet_list_wrapper .alphabet_list li:last-child{
    padding-right: 0px;
    margin-right: 0px;
    border-right:none;
}

.filter_checkbox_wrapper{
    display: flex;
    gap: 20px 50px;
    position: relative;
    padding-top: 20px;
    padding-bottom: 20px;
    flex-wrap: wrap;
}

.filter_checkbox input[type="checkbox"], .filter_checkbox input[type="radio"]{
    display: none;
}

.filter_checkbox input[type="checkbox"] + label, .filter_checkbox input[type="radio"] + label{
    position: relative;
    display: inline-block;
    padding-left: 20px;
    vertical-align: middle;
    cursor: pointer;
}

.filter_checkbox input[type="checkbox"] + label::before, .filter_checkbox input[type="radio"] + label::before{
    content:"";
    position: absolute;
    left: 0px;
    top:0px;
    bottom: 0px;
    margin: auto;
    width: 20px;
    height: 20px;
    background-color: #fff;
    border-radius: 100%;
}

.filter_checkbox input[type="checkbox"] + label::after, .filter_checkbox input[type="radio"] + label::after{
    content:"";
    position: absolute;
    left: 5px;
    top:0px;
    bottom: 0px;
    margin: auto;
    width: 10px;
    height: 10px;
    background-color: #63629B;
    border-radius: 100%;
    display: none;
}

.filter_checkbox input[type="checkbox"]:hover + label::after, .filter_checkbox input[type="radio"]:hover + label::after{
    display: block;
    opacity: 0.5;
}
.filter_checkbox input[type="checkbox"]:checked + label::after, .filter_checkbox input[type="radio"]:checked + label::after{
    display: block;
    opacity: 1;
    background-color: #63629B;
}

.filter_checkbox span{
    margin-left: 10px;
    vertical-align: middle;
    line-height: 1.6;
}

.filter_dropdown_wrapper{
    position: relative;
}

.right_filter_dropdown_wrapper{
    margin-left: auto;
}

.filter_dropdown_wrapper .filter_dropdown_btn{
    position: relative;
    color:#62629b;
    font-weight: 600;
    display: block;
    padding-right: 50px;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
    cursor: pointer;
}

.filter_dropdown_wrapper .filter_dropdown_btn::before{
    content:"";
    position: absolute;
    width: 12px;
    height: 12px;
    top:0px;
    right: 5px;
    bottom: 5px;
    margin: auto;
    border-bottom:1px solid #6f6ea6;
    border-right:1px solid #6f6ea6;
    transform: rotate(45deg);
}

.filter_dropdown_wrapper.active .filter_dropdown_btn::before{
    top:10px;
    bottom: 0px;
    transform: rotate(-135deg);
}

.filter_dropdown_wrapper .filter_dropdown{
    position: absolute;
    top:100%;
    width: auto;
    min-width: 100%;
    padding: 20px;
    box-sizing: border-box;
    display: none;
    background-color: #EEE8DC;
}

.right_filter_dropdown_wrapper .filter_dropdown{
    right: 0px;
}

.filter_dropdown_wrapper .filter_dropdown::before{
	-webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    height: 100%;
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
    pointer-events: none;
}

.filter_dropdown_wrapper .filter_dropdown ul{
    position: relative;
    z-index: 1;
}

.filter_dropdown_wrapper .filter_dropdown ul a{
    padding:  20px;
    display: block;
    white-space: nowrap;
    cursor: pointer;
}

.filter_dropdown_wrapper .filter_dropdown .swiper-slide{
    width: auto;
    text-align: center;
}

.filter_dropdown_wrapper .filter_dropdown .swiper-slide > div{
    padding: 30px 30px;
}

.filter_dropdown_wrapper .filter_dropdown a:hover, .filter_dropdown_wrapper .filter_dropdown ul a.active{
    color:#63629B
}

.filter_dropdown_wrapper .filter_dropdown .prev_btn{
    position: absolute;
    width: 12px;
    height: 100%;
    top:0px;
    left: 50px;
}

.filter_dropdown_wrapper .filter_dropdown .prev_btn::before{
    content:"";
    position: absolute;
    width: 12px;
    height: 12px;
    top:0px;
    left: 0px;
    bottom: 0px;
    margin: auto;
    border-top:1px solid #6f6ea6;
    border-left:1px solid #6f6ea6;
    transform: rotate(-45deg);
    cursor: pointer;
    z-index: 1;
}

.filter_dropdown_wrapper .filter_dropdown .next_btn{
    position: absolute;
    width: 12px;
    height: 100%;
    top:0px;
    right: 50px;
}

.filter_dropdown_wrapper .filter_dropdown .next_btn::before{
    content:"";
    position: absolute;
    width: 12px;
    height: 12px;
    top:0px;
    right: 0px;
    bottom: 0px;
    margin: auto;
    border-top:1px solid #6f6ea6;
    border-right:1px solid #6f6ea6;
    transform: rotate(45deg);
    cursor: pointer;
    z-index: 1;
}

.filter_menu_section + .filter_detail_section{
    padding-top: 0px;
}

.filter_detail_section + .filter_detail_section{
    padding-top: 0px;
}

.filter_detail_section{
    padding-top: 0px;
}

.filter_course_type_name{
    color: #6f6ea6;
    text-align: center;
    margin-bottom: 50px;
}

.en_body .filter_course_type_name{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
}

.filter_detail_flex{
    display: flex;
    gap: 20px;
    width: 100%;
    padding-right: 0px !important;
}

.filter_detail_flex_item{
    flex: 1;
    position: relative;
}

.filter_detail_flex_item_btn{
    flex: 0 0 auto;
    position: relative;
}


.filter_detail_flex_head .filter_detail_flex_item{
    color:#6f6ea6;
    font-weight: 600;
}

.no_bg.filter_detail_flex_head .filter_detail_flex_item{
    padding: 0px 10px;
}

.filter_detail_flex_head + .filter_detail_flex_body{
    margin-top: 10px !important;
}

.filter_detail_flex_body .filter_detail_flex_item{
    color: #736562;
    font-weight: 400;
}

.no_bg.filter_detail_flex_body .filter_detail_flex_item{
    padding: 0px 10px;
}

.filter_detail_flex_body .filter_detail_flex_item_title{
    font-weight: 600;
}

.filter_detail_description_title{
    color:#6f6ea6;
    font-weight: 600;
    margin-bottom: 5px;
}

.filter_detail_description{
    width: 75%;
}


/* section_course_detail */

.section_course_detail{
    padding-top: 60px;
    padding-bottom: 60px;
    position: relative;
    
}

.section_course_detail::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    margin: auto;
    height: 80px;
    background: linear-gradient(0deg, rgba(195,217,194,0) 0%, rgba(195,217,194,1) 100%);
    pointer-events: none;
    z-index: 1;
  }

.course_detail_info_box_wrapper{
    display: flex;
    gap: 50px;
    flex-wrap: wrap;
    position: relative;
    z-index: 1;
}

.course_detail_info_box{
    flex: 0 0 calc(50% - 50px);
}

.course_detail_info_box .t1{
    margin-bottom: 5px;
    font-weight: 600;
    color: #62629b;
}

.section_course_detail .hidden_content{
    width: 75%;
}

.course_detail_info_box .t2 a{
    color: #62629b;
}

.course_detail_info_box .t2 a:hover{
    color: #fff;
}

.course_detail_info_box .btn_wrapper{
    margin-top: 10px;
}

.course_detail_info_box .round_btn{
    border:1px #62629b solid;
    color:#62629b;
}

.course_detail_info_box .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
}

.course_detail_expandable_list .expandable_item::before {
    border-top:1px #62629b solid;
    background: none;
    left: 50px;
    right: 50px;
    width: auto;
    margin: auto;
  }

  .course_detail_expandable_list .expandable_item .free_text table td+td{
    padding-left: 50px;
  }

  .course_detail_expandable_list .expandable_item .free_text table tr+tr td{
    padding-top: 10px;
  }


/* student_list_item */

.student_list_section{
    /* z-index:unset; */
}

.filter_menu_section + .student_list_section{
    padding-top: 0px;
}

.student_list_item_wrapper{
    display: flex;
    flex-wrap: wrap;
    gap: 60px 15px;
    
}

.student_list_item{
    flex-grow: 0;
    width: calc(20% - 12px);
      display: flex;
  flex-direction: column;
  justify-content: stretch;
}

.student_list_item > .text{
    margin-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
    border-left:1px solid #6f6ea6;
      flex: 1;
        display: flex;
  flex-direction: column;
}

.student_list_item > .text a{
    color:#6f6ea6;
    cursor: pointer;
}

.student_list_item > .text a:hover{
    color:#009594;
}

.student_list_item > .text > .name{
    color:#6f6ea6;
    font-weight: 600;
}

.student_list_item > .text >  .title{
    margin-top: 5px;
}

.student_list_item > .text >  .email{
    padding-top: 30px;
    word-wrap: break-word;
    overflow: hidden;
    margin-top: auto;
      text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.student_list_item > .text >  .email a:hover{
    opacity:0.5
}

.student_list_item > .photo{
    width: 100%;
    cursor: pointer;
    padding-bottom: 100%;
    position: relative;
    display: block;
      background-color: #fff;
}

.student_list_item > .photo:hover{
    opacity: 0.5;
}

.student_list_item > .photo img{
    position: absolute;
    left: 0px;
    top:0px;
    height: 100%;
    width: 100%;
    object-position: center center;
    object-fit: cover;
}

.people_popup{
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 999999;
    left: 0px;
    top:0px;
    background-color: rgba(237,232,229,0.8);
    display: none;
}

.people_popup::before{
    content:"";
    position: absolute;
    left: 0px;
    right: 0px;
    top:40%;
    height: 60%;
    width: 100%;
    background-color: #EEE8DC;
    background: linear-gradient(180deg, rgba(237,232,229,0) 0%, rgba(237,232,229,1) 20%);
}

.people_detail_section{
    padding-top: 150px;
    overflow: hidden;
}

.people_detail_content{
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}


.people_detail_incontent{
    display: flex;
    gap: 50px;
    position: relative;
    width: 100%;
    max-width: 1400px;
}

.people_popup .people_detail_incontent{
    width: 800px;
    min-height: 500px;
}

.people_detail_incontent::before{
    content:"";
    position: absolute;
    left: 20%;
    top:-60px;
    right: -9999px;
    bottom: -10%;
    background: linear-gradient(0deg, rgba(241,213,189,0) 0%, rgba(241,213,189,1) 50%); 
}

.people_popup .people_detail_incontent::before{
    right: -5%;
}

.people_detail_photo_wrapper{
    width: 35%;
    position: relative;
      max-width: 400px;
  flex-shrink: 0; /* Prevent shrinking below 35% */
}

.people_detail_photo img{
    width: 100%;
}

.people_detail_photo_shadow{
    box-shadow: 5px 5px 10px rgba(0,0,0,.3);
}

.people_detail_photo_wrapper .people_detail_email{
    margin-top: 30px;
}

.people_detail_photo_wrapper .people_detail_email .e1{
    margin-bottom: 5px;
    color: #62629e;
}

.people_detail_text{
  flex: 1;
    position: relative;
    box-sizing: border-box;
}

.people_detail_text .free_text .round_btn{
    border:1px #62629b solid;
    color:#62629b;
}

.people_detail_text .free_text .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
    opacity: 1;
}

.people_popup .people_detail_text{
    max-height: 500px;
    overflow: auto;
    padding-right: 50px;
}

.people_detail_text .name{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
    color:#62629e;
    margin-top: 10px;
      font-weight: 600;
}

.people_detail_text .name:first-child{
    margin-top: auto;
}

.people_detail_text .position{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
    /* color:#62629e; */
    font-weight: 600;
}

.people_detail_text .qualifications{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
    color:#62629e;
    margin-top: 60px;
}

.people_detail_text .title1{
    color:#62629e;
    margin-top: 30px;
      font-weight: 600;
}

.people_detail_text .title1:first-child{
    margin-top: auto;
}

.people_detail_text .title2{
    color:#62629e;
    margin-top: 30px;
      font-weight: 600;
}

.people_detail_text .title2:first-child{
    margin-top: auto;
}


.people_detail_text .qualifications ul li{
    padding-left: 20px;
    position: relative;
}

.people_detail_text .qualifications ul li::before{
    content:"";
    position: absolute;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 6px 0 6px 8px;
    border-color: transparent transparent transparent #62629e;
    transform: rotate(0deg);
    left: 0px;
    top: 4px
}

.people_detail_text .qualifications ul li+li{
    margin-top: 5px;
}

.people_detail_text .info_table{
    margin-top: 60px;
}

.people_detail_text .table_flex_item_wrapper{
    gap: 20px 50px;
      max-width: 700px;
}

.people_detail_text .description{
    margin-top: 60px;
}

.scholarship_popup .people_detail_text .description{
    margin-top: 30px;
}


.people_detail_text .t1{
    margin-bottom: 5px;
    color: #62629e;
    font-weight: 600;
}

.people_detail_text .author{
    margin-top: 50px;
    color: #62629e;
}

.people_detail_content_year_list table{
    width: 100%;
}


.people_detail_content_year_list table td+td{
    padding-left: 50px;
}


.people_detail_content_year_list table tr+tr td{
    padding-top: 30px;
}

.people_detail_content_year_list thead td{
    color:#62629e;
    padding-bottom: 5px;
}

.people_detail_content_year_list .year{
    color:#62629e;
    white-space: nowrap;
    width: 120px;
}

.people_detail_content_year_list .free_text h1,
.people_detail_content_year_list .free_text h2,
.people_detail_content_year_list .free_text h3,
.people_detail_content_year_list .free_text h4,
.people_detail_content_year_list .free_text h5,
.people_detail_content_year_list .free_text h6{
    color:#62629e;
}


.scholarship_popup .people_detail_photo_wrapper{
    width: 50%;
}

.scholarship_popup .people_detail_text{
    width: 50%;
}

.scholarship_popup .video_wrapper {
  position: relative;
  padding-bottom: 56.25%;
}

.scholarship_popup .video_wrapper:first-child{
	margin-top: auto;
}

.scholarship_popup .video_wrapper iframe {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  display: block;
  cursor: pointer;
}

.scholarship_popup .description .t3{
    margin-top: 30px;
}

.popup_left_photo{
    position: relative;
}

.popup_left_photo img{
    width: 100%;
}

.popup_close_btn{
    position: fixed;
    top:45px;
    right:45px;
    width: 50px;
    height: 50px;
    display: block;
    z-index: 10;
    cursor: pointer;
}

.popup_close_btn:hover{
}

.popup_close_btn::before{
    content:"";
    height: 1px;
    width: 100%;
    top:0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background-color: #62629e;
    transform: rotate(-45deg);
    display: block;
    position: absolute;
    margin: auto;
}

.popup_close_btn::after{
    content:"";
    height: 1px;
    width: 100%;
    top:0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background-color: #62629e;
    transform: rotate(45deg);
    display: block;
    position: absolute;
    margin: auto;
}


/* section_song */

.section_song{
    padding-top: 60px;

}

.song_bg{
    height: 400px;
    background-color: #fff;
}

.song_bg img{
     
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: right center;
}

.main_song_content{
    position: relative;
}

.main_song_wrapper{
}

.main_song{
    background-color: #fff;
    box-shadow: 5px 5px 10px rgba(0,0,0,.3);
    margin-left: auto;
    margin-right: auto;
}

.main_song_btn_wrapper{
    margin-left: auto;
    margin-right: auto;
}

.main_song_btn_wrapper ul{
    display: flex;
    gap: 20px;
}

.main_song_btn_wrapper a{
    padding: 5px 10px;
    padding-right: 60px;
    background-color: #fff;
    border-radius: 999px;
    border:1px solid #231f20;
    color: #231f20;
    position: relative;
}

.main_song_btn_wrapper a::before{
    content:"";
    position: absolute;
    width: 0px;
   height: 0px;
   border-style: solid;
   border-width: 6px 0 6px 8px;
   border-color: transparent transparent transparent #231f20;
   transform: rotate(0deg);
   top:0px;
   bottom: 0px;
   margin: auto;
   right: 10px;
}

.main_song_btn_wrapper a:hover, .main_song_btn_wrapper a.active{
    background-color: #231f20;
    color:#fff;
}

.main_song_btn_wrapper a:hover::before, .main_song_btn_wrapper a.active::before{
    border-color: transparent transparent transparent #fff;
}

.main_song{
    position: relative;
    display: flex;
    margin-top: 30px;
}

.section_song .download_song_wrapper{
    margin-top: 30px;
}

.section_song .round_btn{
    border:1px #62629b solid;
    color:#62629b;
}

.section_song .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
}

.song_thumb{
    width: 20%;
    flex-grow: 0;
    position: relative;
}

.song_thumb img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    position: absolute;
}

.song_text{
    width: 80%;
    flex-grow: 0;
    padding: 30px;
    color:#231f20;
}

.song_text_top{
    display: flex;
    gap: 50px;
    justify-content: space-between;
}

.song_text_top .t1{
    font-weight: 600;
}

.song_text_top .t2{
    font-weight: 600;
}

.song_player_wrapper{
    margin-top: 30px;
}

.song_section_intro{
    padding-top: 60px;
    padding-bottom: 60px;
    position: relative;
}

.song_section_intro::before{
	-webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    height: 80px;
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
    pointer-events: none;
}

.song_section_text{
    padding-top: 60px;
    padding-bottom: 60px;
    position: relative;
}

.song_section_text .flex{
    justify-content: space-between;
}


/* contact_banner */

.contact_banner{
    width: 100%;
    margin-top: 50px;
}

.contact_banner .photo{
    width: 100%;
    padding-bottom: 33.33%;
    position: relative;
}

.contact_banner img{
    position: absolute;
    left: 0%;
    top:0%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

.contact_intro{
    padding-top: 60px;
    padding-bottom: 60px;
    position: relative;
}

.contact_intro::before {
    -webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s;
    transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s;
    content: "";
    position: absolute;
    left: 0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    height: 80px;
    background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%);
    pointer-events: none;
  }

.contact_bottom{
    padding-top: 60px;
    padding-bottom: 60px;
    position: relative;
}  

.contact_map_wrapper{
    padding-bottom: 66.66%;
    position: relative;
}

.contact_map_wrapper .map{
    position: absolute;
    width: 100%;
    height: 100%;
}

.contact_bottom .free_text hr{
    border-top:1px solid #636060;
}

.contact_bottom .free_text h1,
.contact_bottom .free_text h2,
.contact_bottom .free_text h3,
.contact_bottom .free_text h4,
.contact_bottom .free_text h5,
.contact_bottom .free_text h6{
    color:#6f6ea6;
}

/* scheme */

.section_scheme{
    padding-top: 60px;
    padding-bottom: 60px;
}

.filter_menu_section + .section_scheme{
    padding-top: 0px;
}

.section_scheme .section_scheme_title{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
    color:#6F6EA6;
}

.section_scheme .section_scheme_prog_name{
    margin-top: 30px;
    font-weight: 600;
}

.section_scheme .section_scheme_description{
    margin-top: 30px;
}

.section_scheme .section_scheme_description:first-child{
    margin-top: auto;
}

.scheme_unit_box_wrapper{
    margin-top: 60px;
}

.scheme_unit_box_inwrapper{
    display: flex;
    gap: 30px;
}

.scheme_unit_box{
    flex-grow: 1;
    display: flex;
    background-color: #009594;
    justify-content: space-between;
}

.scheme_unit_box_left{
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px;
    font-weight: 600;
    position: relative;
}

.scheme_unit_box_right{
    padding: 20px;
    width: 80px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: center;
    position: relative;
}

.scheme_unit_box_right::before{
    content:"";
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 100%;
    background-image: url(images/ink_transparent.png);
}

.scheme_unit_box_right div{
    text-align: center;
}

.scheme_unit_box_right .t1{
    padding: 40px 0px;
    font-weight: 900;
    position: relative;
}

.scheme_unit_box_right .t2{
    position: absolute;
    left: 20px;
    bottom: 20px;
    right: 20px;
    margin: auto;
}

.scheme_style1{
    background-color:#bfdbd2 ;
}

.scheme_style1 .scheme_unit_box_right::before{
    background-position: -200px -60px ;
}

.scheme_style2{
    background-color:#e9c5b6 ;
}

.scheme_style2 .scheme_unit_box_right::before{
    background-position: -400px -200px ;
}

.scheme_style3{
    background-color:#cdd5dc ;
}

.scheme_style3 .scheme_unit_box_right::before{
    background-position: -100px -300px ;
}

.scheme_style4{
    background-color:#c7c4e2 ;
}

.scheme_style4 .scheme_unit_box_right::before{
    background-position: -300px -400px ;
}

.scheme_style5{
    background-color:#f2e68f ;
}

.scheme_style5 .scheme_unit_box_right::before{
    background-position: -200px -400px ;
}

.scheme_style6{
    background-color:#d8d8d8 ;
}

.scheme_style6 .scheme_unit_box_right::before{
    background-position: -400px -300px ;
}

.scheme_unit_box_total{
    display: flex;
    justify-content: space-between;
    align-items: end;
    position: relative;
    margin-top: 30px;
}

.scheme_unit_box_total::before{
    content:"";
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 100%;
    background-image: url(images/ink_transparent2.png);
    background-size: cover;
    background-position: bottom center;
}

.scheme_unit_box_total .scheme_unit_box_right .t1 {
  padding: 0px 0px 20px;
}

.scheme_unit_box_total .scheme_unit_box_right::before{
    display: none;
}

.scheme_unit_expandable_box_wrapper{
    margin-top: 60px;
}

.scheme_unit_expandable_box+.scheme_unit_expandable_box{
    margin-top: 30px;
}

.scheme_unit_expandable_box .title{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    gap: 50px;cursor: pointer;
}

.scheme_unit_expandable_box .right_title{
    display: flex;
    gap: 10px;
    justify-content: end;
    align-items: center;
}

.scheme_unit_expandable_box .num{
    font-weight: 900;
}

.scheme_unit_expandable_box .icon_wrapper{
    padding-left: 40px;
    width: 18px;
    position: relative;
}

.scheme_unit_expandable_box .icon{
    position: absolute;
    right: 0px;
    top:0px;
    width: 18px;
    height: 18px;
    bottom: 0px;
    margin: auto;
}

.scheme_unit_expandable_box .icon::before{
    position: absolute;
    right: 0px;
    top:0px;
    bottom: 0px;
    margin: auto;
    content:"";
    width: 100%;
    height: 1px;
    background-color: #736562;
}

.scheme_unit_expandable_box .icon::after{
    position: absolute;
    right: 0px;
    top:0px;
    bottom: 0px;
    margin: auto;
    content:"";
    width: 100%;
    height: 1px;
    background-color: #736562;
    transform: rotate(90deg);
}

.scheme_unit_expandable_box.active .icon::after{
    transform: rotate(0deg);
}



.scheme_unit_expandable_box .hidden{
    display: none;
}

.scheme_unit_expandable_box .hidden_content{
      padding: 20px;
}

.scheme_unit_expandable_box .hidden_content table{
    width: 100%;
    font-weight: 600;
    table-layout: fixed;
}

.scheme_unit_expandable_box .hidden_content table a{
    display: inline-block;
    border-bottom: 1px solid #54565A;
}

.scheme_unit_expandable_box .hidden_content table a:hover{
    color:#fff;
    border-bottom: 1px solid #fff;
}

.scheme_unit_expandable_box .hidden_content table tr td{
    width: auto;
}

.scheme_unit_expandable_box .hidden_content table tr td:first-child{
    width:120px;
}

.scheme_unit_expandable_box .hidden_content table tr td:last-child{
    width:60px;
    text-align: right;
}

.scheme_unit_expandable_box .hidden_content table tr td+td{
      padding-left: 20px;
}


.scheme_unit_expandable_box .hidden_content table tr+tr td{
      padding-top: 20px;
}

.scheme_unit_expandable_box .hidden_content table tr td .course_short_description{
    margin-top: 5px;
    font-weight: 400;
}

.scheme_remark{
    margin-top: 50px;
}



/* committee_list_slider */

.section_intro_no_bg + .section_committee{
    padding-top: 0px;
}

.committee_list .section_smalltitle + ul{
    margin-top: 20px;
}


.committee_list.free_text ol li + li{
    margin-top: 5px;
}

.committee_list_slider{
    margin-top: 60px;
    position: relative;
}

.committee_list_slider > .swiper-container{
    margin-left: 80px;
    margin-right: 80px;
}

.committee_list_slider .name{
    color:#6f6ea6;
    font-weight: 600;
}

.committee_list_slider .name + .description{
    margin-top: 20px;
}


.committee_list_slider .description{
    position: relative;
}


.committee_list_slider .description::before{
    content:"";
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 80px;
    background: linear-gradient(180deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
}

.committee_list_slider .description .free_text{
    position: relative;
}

.committee_list_slider .description .free_text table{
    width: 100%;
}


.committee_list_slider .description .free_text table td+td{
    padding-left: 20px;
}


.committee_list_slider .description .free_text table tr+tr td{
    padding-top: 5px;
}

.committee_list_slider .description .free_text thead td{
    color:#62629e;
    padding: 10px 20px;
}


.committee_list_slider .description .free_text tbody td{
    padding-left: 20px;
    padding-right: 20px;
}

.committee_list_slider .description .free_text tbody{
    position: relative;
}

.committee_list_slider .description .free_text tbody tr:first-child td{
    padding-top: 10px;
}

.committee_list_slider .description .free_text tbody::before{
    content:"";
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 80px;
    background: linear-gradient(180deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
    pointer-events: none;
}

.committee_list_slider .description .free_text tbody tr{
    position: relative;
}


.committee_list_slider .prev_btn{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    width: 100px;
    height: 60px;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
    position: absolute;
    top:50%;
    margin-top: -30px;
    left: 0px;
}

.committee_list_slider .prev_btn::before{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top:0px;
    bottom: 0px;
    left: 0px;
    margin: auto;
    background-color: #059F9F;
}

.committee_list_slider .prev_btn:hover::before{
    left:-10px;
}

.committee_list_slider .prev_btn::after{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 30px;
    height: 30px;
    top:0px;
    bottom: 0px;
    left: 5px;
    margin: auto;
    transform: rotate(-45deg);
    border-top:1px solid #059F9F;
    border-left:1px solid #059F9F;
}

.committee_list_slider .prev_btn:hover::after{
    left:-5px;
}

.committee_list_slider .next_btn{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    width: 100px;
    height: 60px;
    margin: auto;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
    position: absolute;
    top:50%;
    margin-top: -30px;
    right: 0px;
}

.committee_list_slider .next_btn::before{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top:0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    background-color: #059F9F;
}

.committee_list_slider .next_btn:hover::before{
    right:-10px;
}

.committee_list_slider .next_btn::after{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 30px;
    height: 30px;
    top:0px;
    bottom: 0px;
    right: 5px;
    margin: auto;
    transform: rotate(45deg);
    border-top:1px solid #059F9F;
    border-right:1px solid #059F9F;
}

.committee_list_slider .next_btn:hover::after{
    right:-5px;
}

.section_committee_album{
    overflow: hidden;
}

.section_committee_album .section_smalltitle{
    margin-bottom: 30px;
    color: #575792;
}

.committee_albums_slider{
    position: relative;
}



.committee_albums_slider > .swiper-container{
    overflow: visible;
    margin-right: -50%;
    margin-left: 80px;
}

.no_slider.committee_albums_slider > .swiper-container{
    overflow: visible;
    margin-right: 80px;
    margin-left: 80px;
}

.committee_album_slider{
    width: 100%;
}

.committee_album_slider .swiper-container{
    width: 100%;
}

.committee_album_slider .swiper-slide{
    width: 100%;
}

.committee_album_slider .swiper-slide a{
    display: block;
    padding-bottom: 50%;
  position: relative;
  overflow: hidden;
}

.committee_albums_slider .album_title{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
    margin-bottom: 10px;
    color: #575792;
    font-weight: 600;
}


.committee_albums_slider .prev_btn{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    width: 100px;
    height: 60px;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
    position: absolute;
    top:50%;
    margin-top: -30px;
    left: 0px;
}

.committee_albums_slider .prev_btn::before{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top:0px;
    bottom: 0px;
    left: 0px;
    margin: auto;
    background-color: #059F9F;
}

.committee_albums_slider .prev_btn:hover::before{
    left:-10px;
}

.committee_albums_slider .prev_btn::after{
    -webkit-transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: left 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 30px;
    height: 30px;
    top:0px;
    bottom: 0px;
    left: 5px;
    margin: auto;
    transform: rotate(-45deg);
    border-top:1px solid #059F9F;
    border-left:1px solid #059F9F;
}

.committee_albums_slider .prev_btn:hover::after{
    left:-5px;
}

.committee_albums_slider .next_btn{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    width: 100px;
    height: 60px;
    margin: auto;
    z-index: 9;
    border-radius: 999px;
    cursor: pointer;
    position: absolute;
    top:50%;
    margin-top: -30px;
    right: 0px;
}

.committee_albums_slider .next_btn::before{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top:0px;
    bottom: 0px;
    right: 0px;
    margin: auto;
    background-color: #059F9F;
}

.committee_albums_slider .next_btn:hover::before{
    right:-10px;
}

.committee_albums_slider .next_btn::after{
    -webkit-transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    transition: right 0.3s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
    content:"";
    position: absolute;
    width: 30px;
    height: 30px;
    top:0px;
    bottom: 0px;
    right: 5px;
    margin: auto;
    transform: rotate(45deg);
    border-top:1px solid #059F9F;
    border-right:1px solid #059F9F;
}

.committee_albums_slider .next_btn:hover::after{
    right:-5px;
}


.committee_album_slider img{
    position: absolute;
    height: 100%;
    width: 100%;
    object-position: center center;
    object-fit: cover;

}


.committee_album_slider .dot_wrapper{
    display: flex;
    justify-content: start;
    gap: 10px;
    margin-top: 20px;
    flex-wrap: wrap;
}

.committee_album_slider .dot_wrapper .swiper-pagination-bullet{
    border:1px solid #6F6EA6;
    background-color: transparent;
    opacity: 1;
}

.committee_album_slider .dot_wrapper .swiper-pagination-bullet-active{
    background-color: #6F6EA6;
}


.section_committee_sns .section_smalltitle{
    color: #6F6EA6;
}

.section_committee_sns ul{
	display: flex;
	flex-direction: row;
	gap: 20px;
	justify-content: start;
    margin-top: 30px;
}

.section_committee_sns a {
  height: 24px;
  width: 24px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  display: block;
  pointer-events: auto;
}

.section_committee_sns a:hover{
    opacity: 0.5;
}

/* section_alumni_btn */

.section_alumni_btn .section_smalltitle{
    color:#62629b;
}

.section_alumni_btn ul{
    display: flex;
    gap: 10px 20px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.section_alumni_btn .round_btn{
    border:1px #62629b solid;
    color:#62629b;
}

.section_alumni_btn .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
}

.alumni_news_box_section .section_smalltitle{
    color:#62629b;
}

.alumni_news_box_section .section_smalltitle + .col_wrapper{
    margin-top: 30px;
}

.alumni_news_box_section .news_box .date_wrapper{
    color:#736562;  
    font-weight: 400;
}

.alumni_news_box_section .news_box .title_wrapper .description{
    color:#736562;
    margin-top: 20px;
}

.alumni_news_box_section .news_box .title_wrapper .btn_wrapper{
    color:#736562;
    margin-top: 30px;
      margin-bottom: 1px;
}

.alumni_news_box_section .flex{
    gap: 50px 0px;
}

.alumni_story_section .section_smalltitle{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
    color:#62629b;
}

.alumni_story_section  .thumb_text_box_slider_wrapper{
    margin-top: 50px;
}

.alumni_story_section .thumb_text_box_slider_wrapper .swiper-slide .title{

    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
    color:#62629b;
}

.alumni_story_section .thumb_text_box_slider_wrapper .swiper-slide .year + .title{
    margin-top: auto;
}

.alumni_story_section .thumb_text_box_slider_wrapper .swiper-slide .title2{
    margin-top: 20px;
    color:#62629b;
}

.alumni_story_section .thumb_text_box_slider_wrapper .swiper-slide .btn_wrapper{
    margin-top: 20px;
}

.alumni_story_section .thumb_text_box_slider_wrapper .swiper-slide .round_btn{
    border:1px #62629b solid;
    color:#62629b;
}

.alumni_story_section .thumb_text_box_slider_wrapper .swiper-slide .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
}

.border_box_item_wrapper{
    margin-top: 30px;
}

.border_box_item_inwrapper{
    overflow: hidden;
    border-left:1px solid #62629b;
    border-right:1px solid #62629b;
}

.border_box_item_inwrapper > .swiper-container{
    margin-left: -1px;
}

.border_box_item_wrapper .dot_wrapper{  
    text-align: center;
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 80px;
}

.border_box_item_wrapper .dot_wrapper .swiper-pagination-bullet{
    border:1px solid #A16765;
    background-color: transparent;
    opacity: 1;
}

.border_box_item_wrapper .dot_wrapper .swiper-pagination-bullet-active{
    background-color: #A16765;
}


.border_box_item_row{
}

.border_box_item{
    position: relative;
    padding-bottom: 60px;
    padding-left: 20px;
    padding-right: 20px;
      box-sizing: border-box;
    height: auto;
    align-self: stretch;
}

.border_box_item + .border_box_item::before{
    content:"";
    position: absolute;
    left: 0px;
    top:0px;
    bottom: 0px;
    margin: auto;
    border-left:1px solid #575792;
}

.border_box_item .photo{
    position: relative;
    margin-top: 20px;
    padding-bottom: 56.25%;
}

.border_box_item .photo img{
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position:center center;
}

.border_box_item .t1{
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
    color:#62629b;
}

.border_box_item .t2{
    margin-top: 20px;
}

.border_box_item .btn_wrapper{
    margin-top: 20px;
    position: absolute;
    left: 20px;
    bottom: 0px;
}

.border_box_item .round_btn{
    border:1px #62629b solid;
    color:#62629b;
}

.border_box_item .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
}

/* resource_top_section */

.section_introduction  .table-responsive{
    position: relative;
}

.section_introduction .free_text table{
    width: auto;
    position: relative;
}

.section_introduction .free_text td{
    position: relative;
}

.section_introduction .free_text td + td{
    padding-left: 10px;
}


.section_introduction .free_text tr + tr td{
    padding-top: 10px;
}

.section_introduction .free_text tbody{
    position: relative;
}

.section_introduction .free_text h1,
.section_introduction .free_text h2,
.section_introduction .free_text h3,
.section_introduction .free_text h4,
.section_introduction .free_text h5,
.section_introduction .free_text h6{
    color: #62629b;
}

.resource_top_section .section_introduction{
    margin-top: 60px;
} 
.resource_top_section .section_introduction .free_text h1,
.resource_top_section .section_introduction .free_text h2,
.resource_top_section .section_introduction .free_text h3,
.resource_top_section .section_introduction .free_text h4,
.resource_top_section .section_introduction .free_text h5,
.resource_top_section .section_introduction .free_text h6{
    color: #62629b;
}

.resource_top_section + .filter_menu_section{
    padding-top: 0px;
}

.resource_top_section .free_text{
    margin-top: 30px;
}


.resource_top_section  .table-responsive{
    position: relative;
}

.resource_top_section .free_text table{
    width: 100%;
    position: relative;
    table-layout: fixed;
}

.resource_top_section .free_text thead td{
    color:#62629e;
    padding: 10px;
    position: relative;
}


.resource_top_section .free_text tbody td{
    padding: 10px;
    position: relative;
}

.resource_top_section .free_text tbody{
    position: relative;
}


.resource_top_section .free_text .table-bg::before{
    content:"";
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
    pointer-events: none;
}

.resource_top_section .free_text tbody tr{
    position: relative;
}

.resource_top_section .free_text tbody td+td {
    border-left:2px solid #EEE8DC;
}

.resource_top_section .free_text tbody tr+tr td{
    border-top:2px solid #EEE8DC;
}

.switchable_section_expandable_list{
    display: none;
}

.switchable_section_expandable_list.active{
    display: block;
}

.resource_filter_menu_section .switchable_section_expandable_list{
    margin-top: 50px;
}

/* scheme */

.sibling-pages-menu{
    display: flex;
}

.sibling-pages-menu {
    display: flex;
    gap: 20px 50px;
    list-style: none;
    padding: 0;
    margin: 0;
    align-items: center;
    margin-bottom: 60px;
      justify-content: center;
      flex-wrap: wrap;
}

.sibling-page-item {
    position: relative;
}

.sibling-page-item:not(:last-child)::after {
    content: '';
    position: absolute;
    right: -25px; /* half of gap */
    top: 0;
    height: 100%;
    width: 1px;
    background-color: #575792;
}

.sibling-page-item.current a, .sibling-page-item.current a:hover{
    color: #575792;
}

.section_scheme_title_wrapper{
    position: relative;
    z-index: 10;
}

.scheme_groups_dropdown_wrapper{
    display: flex;
    margin-top: 30px;
    position: relative;
    z-index: 1;
}

.scheme_groups_dropdown_wrapper:first-child{
    margin-top: auto;
}

.scheme_groups_dropdown{
    padding: 5px 10px;
    border:1px solid #6f6ea6;
    cursor: pointer;
    position: relative;
    background-color: #EEE8DC;
}

.scheme_group_wrapper{
    margin-top: 50px;
    position: relative;
}

.scheme_group_expandable_item{
    margin-top: 30px;
    position: relative;
}

.scheme_group_expandable_item .icon_wrapper{
    position: relative;
}

.scheme_group_expandable_item .icon{
    position: absolute;
    right: 0px;
    top:0px;
    width: 18px;
    height: 18px;
    bottom: 0px;
    margin: auto;
}

.scheme_group_expandable_item .icon::before{
    position: absolute;
    right: 0px;
    top:0px;
    bottom: 0px;
    margin: auto;
    content:"";
    width: 100%;
    height: 1px;
    background-color: #6b809a;
}

.scheme_group_expandable_item .icon::after{
    position: absolute;
    right: 0px;
    top:0px;
    bottom: 0px;
    margin: auto;
    content:"";
    width: 100%;
    height: 1px;
    background-color: #6b809a;
    transform: rotate(90deg);
}



.scheme_group_expandable_item.active .icon::after{
    transform: rotate(0deg);
}

.scheme_group_expandable_item .hidden{
    display: none;
}

.scheme_group_expandable_item .hidden .hidden_content{
    padding-top: 30px;
}

.scheme_group_expandable_item .title{
    padding-bottom: 10px;
    border-bottom:1px solid #736562;
    display: flex;
    justify-content: space-between;
    gap: 50px;
    cursor: pointer;
      font-weight: 600;
}

.scheme_group_expandable_item.active .title{
    color:#575792;
}

.scheme_group_expandable_item .title:hover{
    color:#575792;
}

.scheme_group_expandable_item .right_title{
    display: flex;
    justify-content: space-between;
    gap: 50px;
}

.scheme_group_expandable_item .right_title .unit{
    white-space: nowrap;
}

.scheme_group_expandable_item .right_title .num{
  display: flex;
  align-items: center;
    gap: 10px;
      font-weight: normal;
}

.scheme_group_expandable_item .free_text h1,
.scheme_group_expandable_item .free_text h2,
.scheme_group_expandable_item .free_text h3,
.scheme_group_expandable_item .free_text h4,
.scheme_group_expandable_item .free_text h5,
.scheme_group_expandable_item .free_text h6{
    color: #62629b;
}

.group_total_units{
    margin-top: 30px;
    display: flex;
    justify-content: end;
    gap: 10px;
      align-items: center;
      color:#575792
}

.scheme_groups_dropdown .selected{
    padding-right: 50px;
    position: relative;
    color:#6f6ea6;
}

.scheme_groups_dropdown .selected .arrow{
    position: absolute;
    width: 30px;
    height: 30px;
    top:50%;
    margin-top: -15px;
    right: 0px;
}

.scheme_groups_dropdown .selected .arrow::before{  
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    top: 0px;
    right: 5px;
    bottom: 5px;
    margin: auto;
    border-bottom: 1px solid #6f6ea6;
    border-right: 1px solid #6f6ea6;
    transform: rotate(45deg);
}

.scheme_groups_dropdown.opned .selected .arrow::before{  
  top: 10px;
  bottom: 0px;
  transform: rotate(-135deg);
}

.scheme_groups_dropdown .hidden{
    display: none;
    padding: 10px 15px;
    position: absolute;
    left: 0px;
    top:100%;
    background-color: #fff;
    margin-top: 1px;
    min-width: 100%;
}

.scheme_groups_dropdown .hidden li{
    display: block;
}
.scheme_groups_dropdown .hidden li + li{
    margin-top: 5px;
}

.scheme_groups_dropdown .hidden li a{
    color:#736562;
}

.scheme_groups_dropdown .hidden li.active a{
    color:#575792
    
}

.scheme_groups_dropdown .hidden li a:hover{
    color:#575792;
}

.scheme_group {
    display: none;
}

.scheme_group.active{
    display: block;
}

.scheme_group .btn_wrapper .round_btn{
    border:1px #62629b solid;
    color:#62629b;
}

.scheme_group .btn_wrapper .round_btn:hover{
    border:1px #62629b solid;
    color:#fff;
    background-color: #62629b;
}

.scheme_group .filter_detail_section{
    margin-top: 60px;
}

.scheme_pdf_btn_wrapper{
    margin-bottom: 60px;
    text-align: left;
}

.scheme_pdf_btn{
    padding-bottom: 10px;
    border-bottom:1px solid #575792;
    color:#575792;
    display: inline-block;
    padding-right: 30px;
    position: relative;
}

.scheme_pdf_btn .arrow{  
    width: 10px;
  height: 30px;
  position: absolute;
  top: 0%;
    right: 0px;
}

.scheme_pdf_btn .arrow::before{
    content:"";
    position: absolute;
    left: 0px;
    right: 0px;  
    width: 2px;
  height: 13px;
    top:5px;
    margin: auto;
    background-color: #575792;
}


.scheme_pdf_btn .arrow::after{
    content: "";
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 12px;
    width: 6px;
    height: 6px;
    margin: auto;
    transform: rotate(0deg);
    border-right: 2px solid #575792;
    border-bottom: 2px solid #575792;
    transform: rotate(45deg);
}

.scheme_title{
      margin: auto;
    text-align: center;
    color: #63629B;
    letter-spacing: 0.05em;
    font-weight: 600;
    position: relative;
}

.en_body .scheme_title{
    letter-spacing: 0em;
    font-family: "richmond-text","Chiron Sung HK WS",serif !important;
    font-weight: normal;
}

.scheme_item_wrapper{
      margin-top: 60px;
      position: relative;
}

.scheme_item{
      padding-top: 60px;
  position: relative;
}

.scheme_item::before {
  content: "";
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 50px;
  background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);

}

.scheme_item + .scheme_item{
    margin-top: 60px;
}

.group_introduction{
    margin-top: 30px;
    position: relative;
}

.group_introduction + .scheme_group_expandable_item {
    margin-top: 50px;
}

.scheme_course_list_section{
    margin-top: 60px;
    position: relative;
    padding-top: 60px;
    padding-bottom: 60px;
}

.scheme_item .scheme_course_list_section{
    padding-top: 0px;
    padding-bottom: 0px;
}

/* .scheme_course_list_section::before {
  content: "";
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 50px;
  background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 100%);

} */

.scheme_title + .scheme_group_expandable_item{
    margin-top: 50px;
}

.scheme_remark{
    margin-top: 60px;
}

/* good table */

.switchable_section_expandable_list  .table-responsive{
    position: relative;
}

.switchable_section_expandable_list .free_text table{
    width: 100%;
    position: relative;
    table-layout: fixed;
}

.switchable_section_expandable_list .free_text thead td{
    color:#62629e;
    padding: 10px;
    position: relative;
}


.switchable_section_expandable_list .free_text tbody td{
    padding: 10px;
    position: relative;
}

.switchable_section_expandable_list .free_text tbody{
    position: relative;
}

.switchable_section_expandable_list .free_text .table-bg::before{
    content:"";
    position: absolute;
    left: 0px;
    top:0px;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%); 
    pointer-events: none;
}

.switchable_section_expandable_list .free_text tbody tr{
    position: relative;
}

.switchable_section_expandable_list .free_text tbody td+td {
    border-left:5px solid #EEE8DC;
}

.switchable_section_expandable_list .free_text tbody tr+tr td{
    border-top:1px solid #EEE8DC;
}

/* search */

.search_wrapper{
    position: relative;
    margin-top: 10px;
}

.search_wrapper:first-child{
    margin-top: auto;
}

.keyword_title{
    text-align: left;
}

.search_wrapper .search_input {
  background: none;
  border: none;
  padding: 10px;
  border: 1px solid #878787;
  color: #000;
  border-radius: 999px;
  width: 100%;
  box-sizing: border-box;
}

.search_wrapper .submit_arrow{
      border: none;
    background: none;
    width: 20px;
    height: 30px;
    position: absolute;
    right: 0%;
    margin: auto;
    top: 0px;
    bottom: 0px;
    margin-right: 15px;
    cursor: pointer;
    z-index: 11;
}

.search_wrapper .submit_arrow::before{
    content:"";
    position: absolute;
    width: 100%;
    height: 1px;
    top: 0px;
    bottom: 0px;
    left: 0px;
    margin: auto;
    background-color: #ae6364;
}

.search_wrapper .submit_arrow::after {
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  top: 0px;
  bottom: 0px;
  right: 0px;
  margin: auto;
  transform: rotate(45deg);
  border-top: 1px solid #ae6364;
  border-right: 1px solid #ae6364;
}


.search_wrapper .submit_arrow:hover{
   border-color: transparent transparent transparent #ae6364;
}


.search_wrapper .submit_arrow:after{
  border-top: 1px solid #ae6364;
  border-right: 1px solid #ae6364;
}

.search_section{
    margin-top: 60px;
}

.search_section .subtitle{
    background: none;
  border: none;
  border-radius: 999px;
  text-transform: uppercase;
  line-height: 1em;
  padding: 5px 15px;
  border: 1px solid transparent;
  color: #54565A;
  text-decoration: none !important;
  display: inline-block;
  box-sizing: content-box;
  border: 1px solid #ae6364;
  color: #ae6364;
  margin-bottom: 10px;
}

.search_section .btn_wrapper{
    margin-top: 20px;
}

.search_section .col{
    margin-top: 90px;
}

.search_section .row{
    margin-top: -90px;
}

.search_pagination{
  text-align: center;
  margin-top: 90px;
}

.wp-pagenavi a, .wp-pagenavi span {
  display: inline-block;
  position: relative;
  -webkit-border-radius: 200px;
  -moz-border-radius: 200px;
  border-radius: 200px;
  overflow: hidden;
  line-height: 25px;
  height:25px;
  text-align: center;
  padding: 0px;
  width: 25px;
  margin: 0px 3px;
  color: #6a5d9d !important;
  }

  .wp-pagenavi a > span, .wp-pagenavi span > span, .wp-pagenavi span > a{
    margin: auto;
  }

  .wp-pagenavi a:hover,  .wp-pagenavi span.current{
    background-color: #6a5d9d;
    color:#fff !important;
    print-color-adjust: exact; 
  }

/* @-moz-document url-prefix() {
  .wp-pagenavi a, .wp-pagenavi span {
    line-height: 28px;
    }
} */

  .wp-pagenavi .previouspostslink{
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    width: auto;
    border:none !important;
    margin-left: 20px;
    margin-right: 20px;
  }
  .wp-pagenavi .previouspostslink:hover{
    background: none;
    color: #000000 !important;
  }
  .wp-pagenavi .nextpostslink{
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
    width: auto;
    border:none !important;
    margin-left: 20px;
    margin-right: 20px;
  }
  .wp-pagenavi .nextpostslink:hover{
    background: none;
    color: #000000 !important;
  }


/* newsletter_main*/

.newsletter_main{
    position: relative;
    z-index: 10;
}

/* section_mid_link_menu */

.section_introduction + .section_mid_link_menu{
    padding-top: 50px;
    padding-bottom: 50px;
    position: relative;
    margin-top: 50px;

}

.section_introduction + .section_mid_link_menu::before {
  content: "";
  position: absolute;
  left: 0px;
  bottom: 0px;
  right: 0px;
  margin: auto;
  height: 80px;
  background: linear-gradient(0deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%);
  pointer-events: none;
  z-index: 1;
}

.section_mid_link_menu + .section_introduction{
    margin-top: 50px;
}

.section_mid_link_menu ul{
    display: flex;
    gap:25px;
    position: relative;
    z-index: 1;
}

.section_mid_link_menu ul li + li{
    padding-left: 25px;  
    border-left: 1px solid #D5CECA;
}

.section_introduction + .section_introduction{
    padding-top: 60px;
}

/* general_section */

.general_section .general_content{
    margin-top: 60px;
}

/* override */

.no_max_height{
    max-height: none !important;
}

/* color */

.text_c1{
    color:#63629B !important;
}

.text_c1 a{
    color:#63629B !important;
}

.text_c1 a:hover{
    color:#009594 !important;
}

.text_c2{
    color:#5C728B !important;
}

.text_c3{
    color:#63629B !important;
}


@media screen and (max-width: 1200px) {

    .roll_bottom_menu .swiper-wrapper .swiper-slide{
        padding-left: 25px;
        padding-right: 25px;
    }


    /* event_list_section */

    .event_list_item .date {
        width: 180px;
        flex: 0 0 180px;
      }

    .event_list_item .photo {
        width: 150px;
          flex: 0 0 150px;
          height: 150px;
      }

      .event_list_item .photo img {
        width: 150px;
        height: 150px;
        object-fit: contain;
      }

      .event_list_item .photo::before {
        width: 150px;
        height: 150px;
      }

      .event_list_item .title_wrapper {
        padding-left: 20px;
        width: 400px;
      }


    /* filter_dropdown_wrapper */

    .filter_dropdown_wrapper .filter_dropdown .swiper-slide > div {
        padding: 20px 10px;
        }

    .scheme_unit_box_right{  
        padding: 20px 0px;
        
    }

    .filter_detail_description{
        width: 100%;
    }
    
} 


@media screen and (max-width: 1023px) { 

    .section_left_right_content2 .right_content::before {
    top: -130px;
    right: -100px;
    left: -100px;
    }


    .section_description{
        width: auto;
    }

    .sticky_section{
        top:40px;
        
    }
    .sticky_section.is_stuck{
    }

    .sticky_section.is_stuck::after{
    }

    .sentinel {
        margin-top: -40px;
    }


	  .roll_menu_section .section_center_content{
		padding-left: 0px;
		padding-right: 0px;
	  }

    .roll_top_menu .swiper-wrapper .swiper-slide div{
        padding-left: 10px;
        padding-right: 10px;
    }


    .roll_top_menu::after {
        left: 0px;
        right: 0px;
    }

    .roll_bottom_menu .swiper-wrapper .swiper-slide div{
        padding-left: 10px;
        padding-right: 10px;
    }

    .roll_bottom_menu .swiper-wrapper .swiper-slide a {
        padding-bottom: 8px;
      }

    .roll_bottom_menu {
        padding-top: 10px;
        padding-bottom: 0px;
      }

    /* section_content */

    .section_content {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .section_left_right_content{
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .top_photo_banner_section{
        padding-top: 30px;
        padding-bottom: 30px;
        padding-top: 0px;
    }

    .top_photo_banner_section_absolute{
        padding-top: 60px;
    }

    .plain_text_section{
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .year_list_section{
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .featured_news_box_section{
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .news_box_section{
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .filter_menu_section + .news_box_section{
        padding-top: 0px;
    }

    .section_expandable_list {
    margin-top: 30px;
    }

    .resource_content_section .section_expandable_list + .section_expandable_list {
    margin-top: 30px;
    }


    .resource_top_section .section_introduction.col6{
        width: 100%;
        margin-top: 30px;
    }

    /* home */

    .home_about_slider_section {
        padding: 60px 0px;
      }

    .home_about_slider .col_spacing .ink_image img {
        max-height: 400px;
      }


    .home_about_slider_section .nav_wrapper {
        width: 75px;
        right: 15px;
      }

      .home_about_slider_section .prev_btn {
        width: 40px;
        height: 25px;
        margin-top: auto;
        float: left;
        margin-right: auto;
        margin-bottom: 10px;
      }

      .home_about_slider_section .prev_btn::after {
        width: 15px;
        height: 15px;
        left: 2px;
      }

      .home_about_slider_section .next_btn {
        width: 40px;
        height: 25px;
        margin-top: auto;
        float: right;
        margin-left: auto;
        margin-bottom: 10px;
      }

      .home_about_slider_section .next_btn::after {
        width: 15px;
        height: 15px;
        right: 2px;
      }

      .home_about_slider_section .dot_wrapper {
        margin-top: 30px;
        clear: both;
        gap: 10px;
      }

      .home_about_slider .btn_wrapper {  
        flex-direction: column;
        gap: 10px;
            padding-bottom: 5px;
        }

         .home_about_slider .btn_wrapper .line_btn{
            display: block;
         }

         .home_news_date_slider_wrapper_loading .home_news_date_slider{
            opacity: 0;
         }



      /* home_news_section */

      .home_news_year_slider .all_news_btn_wrapper{    
        bottom: -12px;
        right: 0px;
        left: 0px;
        margin: auto;
        text-align: center;
        z-index: 11;
        }

        .home_news_year_slider .round_btn{    
        z-index: 1;
        position: relative;
        }

      .home_news_section .vertical_text_wrapper {
        margin-right: 15px;
      }

      .home_news_year_slider .t_wrapper {
        gap: 20px;
      }

      .home_news_year_slider {
        padding-bottom: 30px;
      }

      .home_news_year_slider .t1 {
        width: 50px;
        height: 50px;
      }


      .home_news_loading {
        margin-top: 30px;
        margin-bottom: 30px;
  margin-left: 25px;
  margin-right: 25px;
        }


      .home_news_date_slider_wrapper {
        padding-top: 30px;
        padding-bottom: 0px;
      }


      .home_news_date_slider_inwrapper {
        padding-left: 15px;
        padding-right: 15px;
        margin-top: 0px;
      }

      .home_news_date_slider_wrapper .prev_btn {
        width: 25px;
        left: -10px;
      }

      .home_news_date_slider_wrapper .next_btn {
        width: 25px;
        right: -10px;
      }

      .home_news_date_slider .news_item_wrapper {
        display: flex;
      }


    .home_news_date_slider .date{
        padding-left: 15px;
        padding-right: 15px;
    }
        
      .news_item_spacing{
        margin-left: 15px;
        margin-right: 15px;
      }

      .cat_legend_item_wrapper{
        margin-top: 10px;
      }

      .home_news_year_slider .prev_btn {
        width: 40px;
        height: 20px;
        margin-right: 100px;
        }

        .home_news_year_slider .prev_btn::after {
        width: 15px;
        height: 15px;
          left: 3px;
        }

      .home_news_year_slider .next_btn {
        width: 40px;
        height: 20px;
        margin-left: 100px;
        }

        .home_news_year_slider .next_btn::after {
        width: 15px;
        height: 15px;
          right: 3px;
        }

        .home_news_section {
        padding-bottom: 0px;
        }

    /* section_list_content */


    .section_list {
        margin-top: 30px;
      }

    .list_item_row {
        display: block;
    }

    .list_item_row + .list_item_row{
        padding-top: 20px;
        margin-top: 20px;
        border-top:1px solid #be6e6f;
    }

    .list_item_row .list_item_col{
        width: 100%;
    }

    .list_item_col + .list_item_col > div{
        padding-left: 0px;
    }


    .list_item_col {
        border-bottom: none;
        padding-top: 0px;
        padding-bottom: 0px;
        align-items: start;
        margin-top: 5px;
      }



    /* expandable */
    
    .people_detail_incontent {
        gap: 20px;
    }

    .table_flex_item_wrapper {
        display: flex;
        flex-wrap: wrap;
        gap: 30px 10px;
      }

      .people_detail_text .table_flex_item_wrapper{
        gap: 30px 10px;
      }

      .people_detail_photo_wrapper {
        width: 25%;
    }


    .table_flex_item_wrapper .table_flex_item.col6 {
        width: calc(50% - 5px);
    }

      .table_flex_item_wrapper + .table_flex_item_wrapper{
            margin-top: 30px;
        }

    .table_flex_item .text {
        margin-top: 5px;
      }

      /* thumb_text_box_slider_wrapper */


      .thumb_text_box_slider_wrapper{
          margin-top: 20px;
      }

      .alumni_story_section .thumb_text_box_slider_wrapper{
          margin-top: 20px;
      }

    .thumb_text_box_slider_wrapper .prev_btn{
        left: 15px;
        width: 30px;
        height: 30px;
    }

    .thumb_text_box_slider_wrapper .prev_btn::after {
        width: 15px;
        height: 15px;
        left: 2px;
      }

    .thumb_text_box_slider_wrapper .prev_btn:hover::after {
        left: -8px;
      }

      .thumb_text_box_slider_wrapper .prev_btn:hover::before {
        left:-10px;
      }

    .thumb_text_box_slider_wrapper .next_btn{
        right: 15px;
        width: 30px;
        height: 30px;
    }

    .thumb_text_box_slider_wrapper .next_btn::after {
        width: 15px;
        height: 15px;
        right: 2px;
      }

    .thumb_text_box_slider_wrapper .next_btn:hover::after {
        right: -8px;
      }

      .thumb_text_box_slider_wrapper .next_btn:hover::before {
          right:-10px;
      }


      /* thumb_text_box_slider_wrapper2 */

      .thumb_text_box_slider_wrapper2{
          margin-top: 20px;
      }

      .thumb_text_box_slider_wrapper2 .swiper-container{
            margin-left: 40px;
        }

        .thumb_text_box_slider_wrapper2 .swiper-slide .text_spacing {
        padding: 0px 15px;
        }

    .thumb_text_box_slider_wrapper2 .prev_btn{
        left: 15px;
        width: 30px;
        height: 30px;
    }

    .thumb_text_box_slider_wrapper2 .prev_btn::after {
        width: 15px;
        height: 15px;
        left: 2px;
      }

    .thumb_text_box_slider_wrapper2 .prev_btn:hover::after {
        left: -8px;
      }

      .thumb_text_box_slider_wrapper2 .prev_btn:hover::before {
        left:-10px;
      }

    .thumb_text_box_slider_wrapper2 .next_btn{
        right: 15px;
        width: 30px;
        height: 30px;
    }

    .thumb_text_box_slider_wrapper2 .next_btn::after {
        width: 15px;
        height: 15px;
        right: 2px;
      }

    .thumb_text_box_slider_wrapper2 .next_btn:hover::after {
        right: -8px;
      }

      .thumb_text_box_slider_wrapper2 .next_btn:hover::before {
          right:-10px;
      }



      /* border_thumb_text_box_slider_wrapper */

      .border_thumb_text_box_slider_wrapper .prev_btn{
        width: 30px;
        height: 30px;
        opacity: 1;
        pointer-events: auto;
    }

    .border_thumb_text_box_slider_wrapper .next_btn{
        width: 30px;
        height: 30px;
        opacity: 1;
        pointer-events: auto;
    }


    /* publication_box_list */

    .publication_box_list_title {
    margin-bottom: 30px;
    color: #6f6ea1;
    text-align: center;
    }

    .publication_box_list{
        margin-top: 80px;
        display: flex;
        flex-wrap: wrap; 
        gap: 50px 30px; 
    }

    .publication_box{
        display: block;  
        gap: 20px;   
        flex: 0 0 calc(50% - 15px); /* Changed flex-grow to 0 */
        max-width: calc(50% - 15px); /* Enforces maximum width */
        box-sizing: border-box; /* Ensures padding doesn't affect width */
    }

    .publication_box .publication_thumb{
        width: 100%;
        max-width: 320px;
    }

    .publication_box .publication_thumb img{
        box-shadow: 5px 5px 10px rgba(0,0,0,.3);
    }

    .publication_box .publication_text{
        width: 100%;
        margin-top: 20px;
    }

    .publication_box_list_wrapper+.publication_box_list_wrapper{
        margin-top: 50px;
        padding-top: 50px;
        border-top:1px solid #9f9b9a;;
    }

    .publication_text_item {
    margin-top: 10px;
    }


    /* section_year_list */

    

    .year_list_slider_wrapper .prev_btn {
        left: 15px;
    }

    .year_list_slider_wrapper .next_btn {
        right: 15px;
    }

    .year_list_slider .swiper-slide div {
        padding-left: 0px;
        padding-right: 0px;
        text-align: center;
      }

    /* filter_dropdown_wrapper */


    .filter_menu_section::before{
        bottom:30px;
    }
    .filter_menu_content {
        gap: 20px;
      }

      .big_alphabet_list_wrapper .alphabet_list li{
        padding-right: 10px;
        margin-right: 10px;

    }

    .big_alphabet_list_wrapper .alphabet_list li:last-child{
        padding-right: 0px;
        margin-right: 0px;
    }

    .alphabet_list_wrapper .alphabet_list{
        gap: 10px 4px;
        margin-top: 10px;
    }
    
    .filter_dropdown_wrapper .filter_dropdown .swiper-slide > div {
        padding: 20px 15px;
    }


    .filter_dropdown_wrapper .filter_dropdown_btn::before {
        width: 8px;
        height: 8px;
      }

    .filter_dropdown_wrapper .filter_dropdown .prev_btn {
        left: 15px;
      }

      .filter_dropdown_wrapper .filter_dropdown .prev_btn::before {
        width: 8px;
        height: 8px;
      }

      .filter_dropdown_wrapper .filter_dropdown .next_btn::before {
        width: 8px;
        height: 8px;
      }

    .filter_dropdown_wrapper .filter_dropdown .next_btn {
        right: 15px;
      }


    .filter_dropdown_wrapper .filter_dropdown_btn {
        padding-right: 30px;
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 0px;
            white-space: nowrap;
      }

      .filter_checkbox_wrapper {
        gap: 10px 10px;
        padding-top: 10px;
        padding-bottom: 10px;
      }

      .event_list_item .reg_btn{  
        padding: 5px;
      }

      .filter_checkbox input[type="checkbox"] + label::before, .filter_checkbox input[type="radio"] + label::before {
        width: 12px;
        height: 12px;
        }

        .filter_checkbox input[type="checkbox"] + label::after, .filter_checkbox input[type="radio"] + label::after {

        left: 2px;
        width: 8px;
        height: 8px;
        }

        .filter_checkbox input[type="checkbox"] + label, .filter_checkbox input[type="radio"] + label {
        padding-left: 8px;
        }

      /* student_list */

      .student_list_item_wrapper {
        gap: 50px 15px;
      }

      .student_list_item {
            width: calc(33.33% - 10px);
      }

      .student_list_item > .text {
        padding-left: 10px;
        padding-right: 10px;
      }

      .people_popup{
        background-color: rgba(237,232,229,1);
    }

    .popup_close_btn {
        top: 15px;
        right: 15px;
        width: 30px;
        height: 30px;
      }

      .people_popup .people_detail_text{
        max-height: none;
        width: 100%;
        padding-right: 0px;
      }

      .people_popup .people_detail_content{
        overflow: auto;
      }

      .people_popup .people_detail_incontent {
        width: 85%;
        margin: auto;
        padding: 50px 0px;
        flex-direction: column;
        gap: 30px;
      }
      
      .people_popup .people_detail_incontent::before{
        display: none;
      }

      .people_detail_incontent::before {
        content: "";
        position: absolute;
        left: -15px;
        top: 15%;
        bottom: auto;    
        height: 85%;
      }

      .people_detail_text {
        position: relative;
        padding-right: 0px;
      }

      .people_detail_text .qualifications {
        margin-top: 30px;
      }

      .people_detail_text .info_table{
        margin-top: 30px;
      }

      .people_detail_text .description {
        margin-top: 30px;
      }

      .people_detail_photo_wrapper .people_detail_email {
        margin-top: 10px;
      }

      .people_detail_section .section_expandable_list{
        margin-top: 50px;
      }

      .scholarship_popup .people_detail_photo_wrapper {
    width: 100%;
    }

        .people_detail_content {
        display: block;
        }

        .back_btn_wrapper {
            position: relative;
            left: auto;
            top:auto;
            margin-bottom: 25px;
            margin-top: auto;
        }
      
      /* top_photo_banner_section */

      .top_photo_banner_section .photo_wrapper {
      }

      .top_photo_banner_section .text_wrapper {
        /* padding-right: 15px; */
      }

      .top_photo_banner_section.banner_bg .section_center_content::before {
        top:50%;
        right: 0px;
      }  

      /* scheme */
      .scheme_unit_box_inwrapper {
        display: flex;
        gap: 15px;
        flex-wrap: wrap;
        }
    .scheme_unit_box{
        width: calc(50% - 15px);
    }

    .scheme_unit_box_left{
        padding: 15px;
    }

    .scheme_unit_box_right {
        padding: 15px;
      width: 60px;
    
    }
    .scheme_unit_box_right .t1 {
        padding: 20px 0px;
    }

    .scheme_unit_box_total{
        margin-top: 15px;
    }

    .scheme_unit_expandable_box_wrapper{
        margin-top: 50px;
    }

    .scheme_unit_expandable_box + .scheme_unit_expandable_box {
    margin-top: 15px;
    }

    .scheme_unit_expandable_box .icon_wrapper {
    padding-left: 15px;
    }

    .scheme_unit_expandable_box .title {
        padding: 15px;
        gap: 20px;
    }

    .scheme_unit_expandable_box .hidden_content {
        padding: 15px;
    }

    .resource_top_section .section_introduction {
    margin-top: 30px;
    }

    /* event_list_section */

    .event_list_item + .event_list_item {
    margin-top: 30px;
    }

    /* border_box_item_wrapper */

    .border_box_item_wrapper .dot_wrapper{
        margin-top: 40px;
    }


    /* scheme_groups_dropdown_wrapper */

    .sibling-pages-menu {
    margin-bottom: 40px;
    }

    .sibling-pages-menu {
        gap: 10px 30px;
    }

    .sibling-page-item:not(:last-child)::after {
        right: -15px; /* half of gap */
    }

    .scheme_groups_dropdown_wrapper {
        margin-top: 30px;
    }


    .home_promotion_box_wrapper {
    margin-top: 30px;
    }

}


@media screen and (max-width: 800px) { 


    .people_detail_content_year_list .year {
    width: 90px;
    }


    .scroll-inner {
    gap: 25px;
    padding-left: 15px;
    padding-right: 15px;
    }

    .roll_top_menu .menu-item .a_wrapper a {
    padding: 10px 10px;
    }

    .vertical_text_wrapper .date{
        margin-left: 0px;
    }


    .section_left_right_content2 .info_item_wrapper{
        margin-bottom: 30px;
    }

    .section_left_right_content2 .info_item_wrapper + .flexible_layout{
        padding-top: 30px;
    }

    .section_left_right_content2 .left_content .caption{
        margin-left: 15px;
    }

    /* home */

    .home_top_section {
        padding-top: 60px;
        padding-bottom: 30%;
      }


    .home_about_slider_section > .section_center_content > .col_wrapper > .flex {
        flex-direction: row;
        display: block;
      }

    .home_about_slider_section > .section_center_content > .col_wrapper > .flex > .col {
        display: block;
        width: 100%;
        float: none;
        }

    .home_about_slider_section .vertical_text {
        writing-mode: horizontal-tb;
        letter-spacing: 0.25em;
      }

      .home_about_slider_section .vertical_text_wrapper {
        display: block;
      }


      .home_news_date_slider .news_item img {
      }


      .home_news_section .vertical_text_wrapper {
        justify-content: start;
        padding-left: 0px;
        padding-top: 50px;
        padding-bottom: 50px;
    }

      .home_news_section .vertical_text {
        
        writing-mode: horizontal-tb;
        letter-spacing: 0.25em;
      }


    .home_course_intro_section .vertical_text_wrapper {
        display: flex;
        justify-content: start;
        }

    .home_course_intro_section .vertical_text {
    
    writing-mode: horizontal-tb;
    letter-spacing: 0.25em;
    }

    .home_course_intro_section .col{
        float: none;
        display: block;
        width: 100%;
    }

    .home_course_intro_section .section_expandable_list {
        margin-top: 50px;
      }

      .home_course_intro_section .expandable_title .arrow {
        width: 30px;
        height: 20px;
      }

      .home_course_intro_section .expandable_title .arrow::after {
        width: 10px;
        height: 10px;
        left: 0px;
      }

      .home_course_intro_section .expandable_item.active .expandable_title .arrow::after {
        left: 15px;
        bottom: 5px;
      }

      .home_promotion_section {
        padding-bottom: 50px;
      }

      .home_promotion_box_wrapper .section_center_content{
        height: 640px;
      }

      .home_promotion_box_inwrapper{
        height: 640px;
      }

      .home_promotion_box {
        height: 640px;
        width: 60px;
        display: flex;
        position: relative;
      }

      .home_promotion_box .title {
        width: 60px;
        height: 640px;
      }

      .home_promotion_box .col{
        float: none;
        width: 100%;
      }

       .home_promotion_box .col + .col{
        margin-top: 15px;
        }

      .home_promotion_box .hidden_content {
        padding-left: 15px;
        padding-right: 15px;
      }

      .home_promotion_box .t_wrapper .t2 {
        margin-top: 15px;
      }

      .home_promotion_box .t_wrapper .btn_wrapper {
        margin-top: 10px;
          gap: 5px;
      }

      .line_btn {
        padding-bottom: 5px;
        }

      .home_promotion_box .t_wrapper .t2  p{
        margin-top: 15px;
      }

      .home_promotion_box .big_num{
        width: 60px;
    }

    .home_promotion_box .image_wrapper{
        max-width: 300px;
    }
    
    /* top_photo_banner_section */



    .top_photo_banner_section_absolute{
        padding-top: 20px;
    }

    .top_photo_banner_section .flex{
        flex-direction: column-reverse;
        display: flex;
    }
    .top_photo_banner_section .col{
        display: block;
        width: 100%;
        float: none;
    }
    .top_photo_banner_section .col+.col{
        margin-top: 20px;
    }

    .top_photo_banner_section .vertical_text {
        writing-mode: horizontal-tb;
      }

      .en_body .top_photo_banner_section .vertical_text{

        writing-mode: horizontal-tb;
          text-align: left;
      }

      .top_photo_banner_section .vertical_text_wrapper {
        justify-content: start;
        /* padding-left: 15px;
        padding-right: 15px; */
      }

      .top_photo_banner_section .text_wrapper {
        /* padding-left: 15px;
        padding-right: 15px; */
      }

      .top_photo_banner_section .text_wrapper .project_smalltitle span {
        border-left: none;
        padding-left: 0px;
        border-bottom:  1px solid #409192;
        padding-bottom: 5px;
      }


      .en_body .top_photo_banner_section .text_wrapper .project_smalltitle span{
        border-bottom:  none;
        padding-bottom: 0px;
      }

      .top_photo_banner_section .text_wrapper .project_smalltitle {
        margin-left: 0px;
        margin-bottom: 5px;
      }

      .top_photo_banner_section .caption {
        margin-left:15px;
      }

      .top_photo_banner_section .text_wrapper .description {
        margin-top: 25px;
      }

      .top_photo_banner_section .text_wrapper .border_btn_wrapper {
        margin-top: 25px;
      }

      .caption {
        padding-left: 15px;
      }



        .top_photo_banner_section_absolute{
            position: relative;
            padding-bottom: 20px;
        }

        .top_photo_banner_section_absolute .vertical_text_wrapper .project_title {
            max-height: none !important;
            min-height: 0px !important;
          }

    /* section_left_right_content */
    
    
    .top_photo_banner_section_absolute + .section_left_right_content2{
        padding-top: 0px;
    }

    .section_left_right_content .flex{
        display: block;
    }
    .section_left_right_content .col{
        display: block;
        width: 100%;
        float: none;
    }
    .section_left_right_content .col+.col{
        margin-top: 25px;
    }

    .section_left_right_content .flexible_layout_photo {
        margin-left: auto !important;
      }
      
      
      .section_left_right_content2 .left_content {
        margin-left: -15px;
        margin-right: -15px;
        position: relative;
        z-index: 1;
      }

      .section_left_right_content2 .left_content .caption {
        margin-left: 15px;
      }

      .section_left_right_content2 .right_content {
        margin-top: 0px;
        padding-top: 30px;
        position: relative;
      }

      .section_left_right_content2 .right_content::before {
        content: "";
        position: absolute;    
        top: 0px;
        right: -15px;
        left: -15px;
        height: 200px;
      }

      .news_right_content .news_title_wrapper{
        margin-top: auto;
        margin-bottom: auto;
    }

    .news_title_wrapper + .info_item_wrapper {
    margin-top: 0px;
    }

    .news_date {
    margin-top: 5px;
    }

    /* year_list_section */

    .year_list_grid_wrapper {
        margin-top: 50px;
      }

    .year_list_grid.col2_4{
        width: 50%;
    }
    .year_list_grid.col4_8{
        width: 50%;
    }

    .year_list_grid_wrapper .row {
        margin-top: -50px;
    }

    .year_list_grid_wrapper .col {
        margin-top: 50px;
    }

    .load_more_wrapper {
        margin-top: 50px;
        text-align: center;
    }

    /* research_centre_box */

    .research_centre_box .col{
        width: 100%;
    }

    .research_centre_text_item_wrapper{
        gap: 20px;
    }

    .research_centre_text_item {
        flex: 0 0 calc(33.33% - 20px);
    }

    .research_centre_box + .research_centre_box {
        margin-top: 30px;
    }
    
    .research_centre_logo .col_spacing {
        padding-bottom: 0px;
        border-bottom: none;
    }

    .research_thesis_list .flex{
        flex-wrap: wrap;
    }

    .research_thesis_list .flex > .col2{
        width: 40%;
    }

    .research_thesis_list .flex > .col3{
        width: 60%;
    }
    .research_thesis_list .flex > .col7{
        width: 100%;
    }


    .research_thesis_list .t_wrapper{
        padding-bottom: 20px;
    }


    .research_thesis_list .flex > .col2 .t_wrapper, .research_thesis_list .flex > .col3 .t_wrapper{
        border-bottom: none;
        padding-bottom: 0px;
    }

    .research_centre_text .col_spacing {
        padding-bottom: 30px;
    }

    /* featured_news_box_section */

    .featured_news_box_section .news_box .photo {
        margin-bottom: 20px;
    }

    .featured_news_box_section .news_box .date_wrapper {
        float: none;
        margin-right: auto;
        width: auto;
        font-weight:normal;
    }

    .featured_news_box_section .news_box .title_wrapper {
        padding-left: 0px;
        border-left:none;
        margin-top:10px;
    }

    .featured_news_box_section .news_box .btn_wrapper {
        margin-top: 20px;
    }



    .news_box_section .row{
        margin-top: -40px;
        margin-left: -8px;
        margin-right: -8px;
    }

    .news_box_section .news_box{
        margin-top: 40px;
    }

    .news_box_section .news_box .text_wrapper {
        padding-top: 15px;
    }

    .news_box_section .col_spacing {
        display: block;
        padding-top: 10px;
        margin-left: 8px;
        margin-right: 8px;
      }

      .news_box_section .news_box .btn_wrapper {
        margin-top: 20px;
      }

      .news_box_section .news_box .photo {
            /* padding-bottom: 100%; */
        }

      /* events */

      .intro_btn_wrapper{
        margin-top: 30px;
      }

       /* event_list_section */

       .event_list_item .d_wrapper {
        flex-direction: column;
        }

        .event_list_item .d_wrapper .d + .d{
        }

        .event_list_item .d_wrapper .d + .d::before {
        content: "";
        position: absolute;
        width: 1px;
        height: 21px;
        left: 0%;
        right: 0%;
        top: -30px;
        bottom: auto;
        margin: auto;
        background-color: #b6b3b3;
        }

       .event_list_item + .event_list_item {
            margin-top: 60px;
        }

       .event_list_item{
        gap: 10px;
        /* flex-wrap: wrap;
        gap: 0px;
            flex-direction: column; */
       }

       
    .event_list_item .date {
        /* width: 100%;
        display: flex;    
        justify-content: space-between;
        border-bottom:1px solid #009594;
        padding-bottom: 15px;
        margin-bottom: 15px;
            flex: 1; */
        width: 100px;
                flex: 0 0 100px;
      }

      .event_list_item .info_item {
        gap: 15px;
        }

      .event_list_item .round_btn{
        /* margin-top: auto; */
      }

    .event_list_item .photo {
        width: 250px;
        margin: auto;
        margin-top: 30px;
        height: 250px;
      }

      .event_list_item .photo img {
        
        width: 250px;
        height: 250px;
        object-fit: contain;
      }

      .event_list_item .photo::before {
        width: 250px;
        height: 250px;
      }

      .event_list_item .title_wrapper {
        padding-left:20px;
        width: 100%;
      }
      .event_list_item .info_item_wrapper {
        gap: 15px 20px;
        margin-top: 20px;
      }

      .event_list_item .info_item{
        display: flex;
        gap: 20px;
      }

      .event_list_item .info_item img{
        width: 100%;
        margin: auto;
            max-width: 200px;
      }

      .event_list_item .info_item .t1 {
        white-space: nowrap;
        }

      /* thumb_text_box_slider_wrapper */
      .thumb_text_box_slider_wrapper{
        margin-top: 50px;
      }

      /* border_thumb_text_box_slider_wrapper*/
      .border_thumb_text_box_slider_wrapper {
        margin-top: 50px;
    }

    .border_thumb_text_box_slider_inwrapper{
        margin-left: 15px;
        margin-right: 15px;
    }

    .border_thumb_text_box_slider_inwrapper + .dot_wrapper{
        margin-top: 40px;
        gap:10px;
    }

    /* chair_photo_wrapper */

    .top_photo_banner_section .absolute_vertical_text_wrapper{
        position: relative;
        right: auto;
        top: auto;
    }

    .top_photo_banner_section .chair_photo_wrapper{
        flex-direction: column;   
        align-items: start;
    }

    .top_photo_banner_section .chair_photo_wrapper .chair_name{
        text-align: right;
        margin-left: auto;
    }

     .top_photo_banner_section .photo_wrapper {
    margin-left: -15px;
    margin-right: -15px;
  }

    .chair_photo_wrapper .photo_wrapper{
        width: calc(100% + 30px);
    }

    .top_photo_banner_section.banner_bg2 .section_center_content::before {
        right: 0px;
        left: 0px;
        top: 180px;
      }

      .top_photo_banner_section + .section_left_right_content{
        padding-top: 0px;
      }

    /* song */

    .section_song {
    padding-top: 30px;
    }

    .song_bg {
        height: 250px;
    }

    .main_song_btn_wrapper {
        margin-left: 0px;
        margin-right: 0px;
      }

      .main_song_btn_wrapper ul {
        gap: 10px;
      }

      .main_song_btn_wrapper a {
        padding-right: 30px;
      }

      .main_song {
        margin-left: auto;
        margin-right: auto;
      }

      .song_thumb {
        width: 30%;
      }

      .song_text {
        padding: 15px;
        width: 70%;
      }

      .song_section_intro {
        padding-top: 30px;
        padding-bottom: 30px;
      }

      .song_section_text {
        padding-top: 30px;
        padding-bottom: 30px;
      }

    .song_section_text .flex{
        flex-direction: column;
    }

    .song_section_text .flex .col{
        width: 100%;
    }

    /* contact */

    .contact_banner{
        margin-top: 30px;
    }

    .contact_intro{
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .contact_bottom{
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .contact_bottom .flex{
        flex-direction: column;
    }

    .contact_bottom .flex .col{
        width: 100%;
    }


    /* filter */

    .filter_menu {
        /* align-items: center; */
      }

    .filter_menu_wrapper {
        padding-top: 10px;
      }

    .filter_menu_left_bg .filter_menu_content::before{
        right: -15px;
          height: 40px;
    }
    .mobile_title{
        color:#63629B;
        font-weight: 600;
    }
    .filter_menu_section{
        /* padding-bottom: 0px; */
    }
    .filter_menu_section + .student_list_section {
        /* padding-top: 20px; */
      }
    .filter_detail_flex_head + .filter_detail_flex_body {
        margin-top: 0px !important;
      }

    .filter_detail_flex_item+.filter_detail_flex_item{
        margin-top: 10px;
    }

      .expandable_item .expandable_title.filter_detail_flex{
        display: flex;
        flex-wrap: wrap;
        gap: 10px 30px;
      }

      .filter_detail_flex_item {
        flex: 0 0 calc(50% - 30px);
        position: relative;
      }

      .filter_detail_flex_body .filter_detail_flex_item_title{
        flex: 0 0 calc(100%);
      }

      .filter_detail_flex_item_btn{
        position:unset
      }

      .expandable_item .expandable_title.filter_detail_flex .icon {

        -webkit-transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
        transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0s; 
        top: 30px;
        bottom: auto;
        margin: auto;
      }

      .expandable_item.active .expandable_title.filter_detail_flex .icon {
        top: 40px;
      }

      .expandable_item.active .expandable_title.filter_detail_flex {
        padding-top: 60px;
        padding-bottom: 30px;
      }

      .expandable_item .hidden_content .btn_wrapper {
        margin-top: 30px;
      }

      .filter_dropdown_wrapper .filter_dropdown {
        padding: 10px 0px ;
      }

      .filter_dropdown_wrapper .filter_dropdown ul a {
        padding: 10px 20px;
        display: block;
      }

      .alphabet_list_wrapper{
        padding-bottom: 10px;
      }

      .alphabet_list_wrapper .alphabet_list a.active::after {
        margin-top: 3px;
        }

        .filter_remark{
            padding-top: 10px;
        }

      /* section_course_detail */

      .section_course_detail .hidden_content{
        width: 100%;
    }

    .section_course_detail .section_expandable_list{
        margin-top: 50px;
    }
    
    .course_detail_info_box_wrapper {
        gap: 30px;
      }

      .course_detail_info_box {
        flex: 0 0 calc(50% - 30px);
      }

    .course_detail_expandable_list .expandable_item::before {
        left: 15px;
        right: 15px;
      }

    .expandable_item.active .expandable_title {
        padding-top: 30px;
        padding-bottom: 30px;
      }

      .expandable_item.active .hidden_content {
        padding-bottom: 30px;
      }

      /* student Association */

      .committee_list_slider {
        margin-top: 50px;
        }

        .committee_list_slider .prev_btn {
        width: 30px;
        height: 30px;
        margin-top: -15px;
        }

        .committee_list_slider .next_btn {
        width: 30px;
        height: 30px;
        margin-top: -15px;
        }

        .committee_list_slider .prev_btn::after {
            width: 15px;
            height: 15px;
            left: 2px;
        }

        .committee_list_slider .next_btn::after {
            width: 15px;
            height: 15px;
            right: 2px;
        }

        .committee_list_slider > .swiper-container {
        margin-left: 40px;
        margin-right: 40px;
        }

        .committee_albums_slider .prev_btn{
        width: 30px;
        height: 30px;
        margin-top: -15px;
        }

        .committee_albums_slider .next_btn{
        width: 30px;
        height: 30px;
        margin-top: -15px;
        }

        .committee_albums_slider .prev_btn::after {
            width: 15px;
            height: 15px;
            left: 2px;
        }

        .committee_albums_slider .next_btn::after {
            width: 15px;
            height: 15px;
            right: 2px;
        }

        .committee_albums_slider .prev_btn:hover::after {
        left: -8px;
      }

      .committee_albums_slider .prev_btn:hover::before {
        left:-10px;
      }

    .committee_albums_slider .next_btn:hover::after {
        right: -8px;
      }

      .committee_albums_slider .next_btn:hover::before {
          right:-10px;
      }
      

        .committee_albums_slider > .swiper-container {
        margin-left: 40px;
        }

        .no_slider.committee_albums_slider > .swiper-container {
        margin-right: 40px;
        margin-left: 40px;
        }

        .committee_album_slider .dot_wrapper {
        gap: 5px;
          margin-top: 15px;
        }


      .section_left_right_content2 .left_content .photo img{    
        max-width: 500px;
        max-height: 400px;

        }


        .section_scheme .section_scheme_description{
            width: 100%;
        }

        .scheme_unit_expandable_box .hidden_content table tr td:first-child {
            width: 60px;
        }

        .scheme_unit_expandable_box .hidden_content table tr td:last-child {
        width: 40px;
        }
        .scheme_unit_expandable_box .hidden_content table tr td + td {
        padding-left: 15px;
        }


    .people_detail_content_year_list table td + td {
        padding-left: 20px;
    }
}


@media screen and (max-width: 480px) { 



    .top_photo_banner_section + .plain_text_section .col6{
        width: 100%;
      }


      .student_list_item {
        width: calc(50% - 8px);
      }
      

      .student_list_item .email {
        margin-top: 20px;
      }

      .people_detail_incontent{
        flex-direction: column;
        gap: 30px;
      }

      .people_popup .people_detail_incontent {
        width: 85%;
        margin: auto;
        padding: 60px 0px;
      }

      .people_detail_photo_wrapper {
        width: 100%;
        margin: auto;
        }

        .single-profile .people_detail_photo_wrapper, .single-publication .people_detail_photo_wrapper{
        width: 50%;
        }

      .people_detail_incontent::before {
        left: -15px;
        height: 200px;
      }

      .news_box.col6{
        width: 100%;
      }

      .news_box.col4{
        width: 50%;
      }

      .news_box.col3{
        width: 50%;
      }

        .event_list_item .info_item img {
            max-width: 150px;
        }

}