.homepage {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #2e4565;
    overflow: hidden;
}

.slideshow-container {
    width: 100vw;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.images-container {
    position: relative;
    margin-top: 13vw;
    width: 82.083333vw;
    height: 32.29vw;
}

.imagesSlide {
    display: none;
}

.imagesSlide img {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 0.78152vw;
    object-fit: cover;
}

#social_btn, #slide_btn, .image-bar{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.dot {
    cursor: pointer;
    width: 2.3vw;
    height: 0.3125vw;
    border-radius: 134px;
    margin: 0 1vw;
    background-color: #818181;
    transition: background-color 0.6s ease;
}

.active,
.dot:hover {
    background-color: #ffbb00;
}

.active {
    width: 2.3vw;
    height: 0.5729vw;
    border-radius: 134px;
}

.click_btn_bar{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 82.083vw;
    margin: 1.875vw 3.541666vw 3.177083vw 3.541666vw;
}

.click_btn_bar img{
    width: 2vw;
    height: 2vw;
    margin-left: 0.65104vw;
    margin-right: 0.65104vw;
}

#btn_pre_img{
    border: none;
    background-color: transparent;
    cursor: pointer;
    padding: 0;
}

#btn_next_img{
    border: none;
    background-color: transparent;
    cursor: pointer;
    padding: 0;
}

/* icon and title */
.block-title {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.block-title span {
    color: #374a73;
    font-family: "Noto Sans TC", sans-serif;
    font-weight: bold;
    text-align: center;
}

.icon {
    width: auto;
    height: auto;
}

.ch-title {
    margin-top: 0.5vw;
    letter-spacing: 0.3125vw;
    font-family: "Noto Sans TC", sans-serif;
    font-size: 2.34375vw; /* 40px -> 45px*/ 
    font-weight: bold;
    line-height: 2.344166666vw;
    letter-spacing: 0.3125vw;
}

.en-title {
    margin-top: 0.5vw;
    font-size: 1.8229vw; /*30px -> 35px*/
    letter-spacing: 0.078125vw;
}

/***********************/
.rounded_border{
    width: 100vw;
    height: 2vw;
    background-color: #e4dfd2;
    border-top-left-radius: 2rem;
    border-top-right-radius: 2rem;
}

/***** the News block ******/
.News-container {
    position: relative;
    width: 100vw;
    background-color: #e4dfd2;
    z-index: 1;
    border-top-left-radius: 2rem;
    border-top-right-radius: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Posts */
.news_title {
    margin-top: 6.09375vw;
}

.news-article {
    margin-top: 5.885vw;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

/*** the readmore button*****/
#news_readmore_btn {
    margin-top: 5.901041666vw;
    margin-bottom: 6.770833333vw;
}

/* Milo: start of event part */

.events {
    width: 100vw;
    background-color: #2e4565;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 1;
    border-radius: 1.302083333vw;
    overflow-x: hidden;
    margin-top: -2vw;
}

#event-slider-container-outer {
    transform: translateX(-56.35%);
    min-height: 100%;
    height: 100%;
    position: relative;
    z-index: 0;
}
#event-slider-container {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    height: 100%;
    min-height: 26.15vw;
}
.event-slider-container-transition {
    transition: 0.7s ease-in-out;
}
.event-slider-item {
    min-width: 35.41%;
    max-width: 35.41%;
    flex-shrink: 0;
    z-index: 10;
}
#event-slides {
    margin-top: 5.989583333vw;
    position: relative;
    min-height: 50%;
    width: 100%;
}
#event-icon-prev {
    position: absolute;
    left: 27%;
    top: 50%;
    z-index: 1;
    fill: #efeee4;
    cursor: pointer;
}
#event-icon-next {
    position: absolute;
    left: 72.9%;
    top: 50%;
    transform: translateX(-100%);
    z-index: 1;
    cursor: pointer;
}
#event-data {
    display: none;
}

.event-data-item {
    min-width: 20%;
    width: 40%;
}
.event-container {
    width: 100%;
    min-width: 100%;
    position: relative;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}
.single-event {
    width: 100%;
    min-height: 23.44vw;
    height: 23.44vw;
    background-color: #efeee4;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 60px;
}
.event-mask {
    position: relative;
    top: calc((100% - 100vw * 0.2344) / 2);
    left: 0;
    width: 100%;
    z-index: 5;
    height: 23.44vw;
    border-radius: 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.main-event .single-event {
    height: 26.15vw;
}
.main-event .event-mask {
    top: calc((100% - 100vw * 0.2615) / 2);
    height: 26.15vw;
}
.event-mask.event-to-brighter {
    transition: 0.7s;
    top: calc((100% - 100vw * 0.2615) / 2);
    height: 26.15vw;
}
.main-event .event-mask.event-to-darker {
    transition: 0.7s;
    top: calc((100% - 100vw * 0.2344) / 2);
    height: 23.44vw;
}
.event-mask::after {
    transition: 0.7s;
    content: "";
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 60px;
}
.main-event .event-mask::after {
    background-color: rgba(0, 0, 0, 0);
}
.event-mask.event-to-darker::after {
    background-color: rgba(0, 0, 0, 0.2);
}
.event-mask.event-to-brighter::after {
    background-color: rgba(0, 0, 0, 0);
}
.event-indent {
    min-width: 8.7%;
}
.event-title {
    margin-top: 4.427083333vw;
}
.event-title div {
    color: #ffbb00;
    text-align: center;
}
.event-ch-title {
    margin-top: 0.618rem;
    font-size: 2.083vw;
    line-height: 1.13;
    letter-spacing: 5px;
}
.event-en-title {
    margin-top: 0.618rem;
    font-size: 1.5625vw;
    line-height: 1.13;
    letter-spacing: 1.8px;
}
.single-event.event-to-bigger {
    transition: 0.7s;
    height: 26.15vw;
}
.single-event.event-to-smaller {
    transition: 0.7s;
    height: 23.44vw;
}

#event_readmore_btn {
    margin-top: 3.27vw;
    margin-bottom: 3.27vw;
}

.sm-event-pic {
    display: none;
}

/************************************/

/************************************/
/* Jennt: About us Block */
.About-container {
    width: 100vw;
    background-color: #e4dfd2;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: -2vw;
    /*padding-bottom: 13.8541666vw;*/
}

.abouttitle {
    position: relative;
    margin-top: 8.09vw;
}

.Aboutus-content-container {
    position: relative;
    width: 100vw;
    margin-top: 6.09vw;
}

.intro_content {
    float: left;
    margin-left: 9vw;
    width: 55.3vw;
    background-color: #e4dfd2;
    border-radius: 3.125vw;
    box-shadow: 25px 25px 65px 0 rgba(255, 111, 0, 0.3);
    font-family: "Noto Sans TC", sans-serif;
    color: #2e4565;
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 3.385416666vw;
}

.videos {
    margin-right: 9.010416666vw;
    float: right;
    margin-top: 8vw;
    width: 23.6vw;
    background-color: #e4dfd2;
    border-radius: 3.125vw;
    box-shadow: 15px 15px 40px 0 rgba(255, 111, 0, 0.3);
    display: flex;
    flex-direction: column;
    z-index: 2;
    padding-bottom: 3.385416666vw;
}

.intro_content-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.intro_content-text-en{
    margin-top: 3vw;
}

.iph_ch {
    width: 40.6vw;
    font-size: 3.385416666vw; /*60px -> 65px*/
    font-weight: bold;
    letter-spacing: 9.75px;
    text-align: left;
    margin-top: 4.5vw;
}

.iph_en_title{
    width: 40.6vw;
    font-size: 3.385833333vw;
    font-weight: bold;
    letter-spacing: 1px;
    text-align: left;
    margin-top: 4.5vw;
}

.iph_en {
    width: 40.6vw;
    font-size: 1.3025vw;
    font-weight: 900;
    line-height: 1.4;
    letter-spacing: 1.25px;
    margin-top: 1.2vw;
}

.iph_intro {
    width: 40.6vw;
    font-size: 1.14583vw;; /*20px -> 22px*/
    font-weight: normal;
    line-height: 2;
    letter-spacing: 3px;
    color: #647386;
    margin-top: 2.3vw;
}

.sphn-iph_intro{
    display: none;
}

.iph_intro_en{
    width: 40.6vw;
    font-size: 1.041667vw;
    font-weight: normal;
    line-height: 1.5;
    letter-spacing: 0.05vw;
    color: #647386;
    margin-top: 2.3vw;
    overflow-wrap: anywhere;
}

.icon_aboutus_1{
    width: 6.618rem;
    height: 10.683rem;
    position: absolute;
    left: 15%;
    top: 80.8%;
}

.module {
    display: flex;
    flex-direction: column;
    /*border: solid 2px #374a73;*/
    /*align-items: center;*/
    margin: 13% 16% 0%;
}

.bk_num {
    font-family: "TimesNewRoman";
    font-size: 2.96vw;
    font-weight: bold;
    font-stretch: normal;
    font-style: italic;
    line-height: 1.03;
    letter-spacing: normal;
    text-align: left;
    color: #2e4565;
}

.icon_aboutus_2 {
    width: 100%;
    height: auto;
    margin-top: 17%;
}

.video_title {
    font-family: "Noto Sans TC", sans-serif;
    font-size: 1.302083333vw;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: 3px;
    text-align: left;
    color: #2e4565;
    margin-top: 8%;
    margin-bottom: 8%;
}

.video_title-en{
    font-size: 1.302083333vw;
    line-height: 1.2;
    letter-spacing: 1px;
}

/*define the read-more botton in aboutUs block*/
#aboutUS_intro_btn {
    position: relative;
    margin-top: 5.2083vw;
}

/* the waves decorations */
.deco_waves {
    width: 100%;
}

/*video overlay*/
.overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.65);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    z-index: 10;
    /*overflow-y: hidden;
    overflow-x: hidden;*/
    transition: 0.5s ease-in-out;
}

.overlay_content {
    display: flex;
    flex-direction: row;
    width: 72%;
    height: 69%;
    margin: 10% 14% 0%;
}

.closebtn {
    width: 2.78rem;
    height: 5rem;
    margin-top: -1.2%;
    cursor: pointer;
}

.video_content {
    display: flex;
    width: 100%;
    height: 100%;
    margin-left: 2.6%;
}

.video_content iframe {
    width: 100%;
    height: 100%;
}

.Interview-container {
    position: relative;
    width: 100%;
    height: 216px;
    margin-top: 8vw;
    background-color: #e4dfd2;
    overflow: hidden;
}

.cards {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    pointer-events: none;
}

.interview-slide {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-left: 3.5vw;
    margin-right: 3.5vw;
    pointer-events: auto;
}

.interview-slide:hover .interview-picture > img {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%);
    width: 10.41vw;
    height: auto;
}

.interview-slide:hover .interview-picture {
    border-radius: 50%;
    border: solid 5px #ffa975;
}

.interview-picture {
    width: 10.41vw;
    height: 10.41vw;
    border-radius: 50%;
    overflow: hidden;
}

.interview-picture > img {
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
    width: 10.41vw;
    height: auto;
}

.interview-text-content {
    width: 20.520833vw;
    display: flex;
    flex-direction: column;
    position: relative;
    margin: 1.5vw;
}

.interview-text-content > a {
    position: relative;
    margin-top: 2.5%;
    font-size: 1.14583vw; /*20px -> 22px*/
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: 0.1953125vw;
    text-align: left;
    color: #2e4565;
    text-decoration: none;
    pointer-events: all;
}

.interview-text-content > span {
    position: relative;
    margin-top: 6.5%;
    font-size: 1.041667vw; /* 18px -> 20px*/
    line-height: 1.25;
    letter-spacing: 0.1rem;
    text-align: left;
    color: #647386;
}

.Specialization-container {
    width: 100%;
    background-color: #e4dfd2;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 2vw;
}

#Specialization_title {
    margin-top: 3%;
}

#SP_content_container {
    position: relative;
    min-height: 50vh;
    margin-top: 4vh;
    display: flex;
    flex-direction: row;
    justify-items: space-evenly;
}

.SP_content {
    align-items: center;
    display: flex;
    flex-direction: column;
    margin: 3vw;
    text-decoration: none;
}

.SP_img {
    width: 21.875vw;
    height: 14.114583333vw;
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
    transition-timing-function: ease-out;
    transition-duration: 0.5s;
}

.SP_img:hover {
    -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
    filter: grayscale(0%);
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.SP_img_shadow {
    width: 21.875vw;
    height: 14.114583333vw;
    border-radius: 25px;
    box-shadow: 7px 10px 20px 0 rgba(255, 111, 0, 0.6);
    overflow: hidden;
}

.SP_ch_title {
    font-family: "Noto Sans TC", sans-serif;
    font-size: 1.40625vw; /*25px -> 27px*/
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.4;
    letter-spacing: 1.5px;
    text-align: center;
    color: #2e4565;
    text-align: center;
    margin-top: 3vw;
}

.SP_en_title {
    font-family: "Noto Sans TC", sans-serif;
    font-size: 1.40625vw;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: 1.2px;
    text-align: center;
    color: #2e4565;
    text-align: center;
    margin-top: 0.5vw;
}

.SP_title-en_margin{
    margin-top: 1.8vw;
}
/* More resource part */
/* Milo: links開始 */
.Links-container {
    width: 100vw;
    background-color: #2e4565;
    position: relative;
    z-index: 2;
    border-radius: 1.3vw;
    transition: 0.6s;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: -2vw;
    padding-bottom: 22.552083333vw;
}

/* Jenny: change start */
.links_title {
    position: relative;
    margin-top: 6.09vw;
}

.links_title span {
    color: #ffbb00;
}

/* Jenny: end of change*/
/*.links-title{
    width: 15.5%;
    position: relative;
    top: 7.625rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.links-title div{
    color:#ffbb00;
    font-family: 'Noto Sans TC', sans-serif;
    font-weight: bold;
    text-align: center;
    font-size: 1.875rem;
    line-height: 1.13;
    letter-spacing: 5px;
    margin-top: 16px;
}
.links-title div:nth-child(3) {
    letter-spacing: 1.8px; 
}*/

.links-content {
    width: 58vw;
    position: relative;
    margin-top: 6.4vw;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    align-content: space-between;
    flex-wrap: wrap;
}

.links-flex-col {
    display: flex;
    flex-direction: column;
}

.links-category-item {
    position: relative;
    background-color: #efeee4;
    min-width: 25.104166666vw;
    min-height: 4.479166666vw;
    border-radius: 15px;
    margin-bottom: 1.25rem;
    display: inline-block;
    overflow: hidden;
    transition: 0.6s;
    max-height: 4.479166666vw;
}
.links-category-item.expanded {
    max-height: 33rem;
}
.links-category-item.expanded .links-item-title {
    transform: translate(0%, -50%);
    left: 2.34375vw;
}
.links-item-title {
    font-family: "Noto Sans TC", sans-serif;
    font-size: 1.3025vw;
    font-weight: bold;
    line-height: 1.4;
    letter-spacing: 3.75px;
    color: #2e4565;
    transition: 0.6s;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: 0.6s;
}

.links-icon-more-item {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 1.822916666vw;
    font-size: 1.563rem;
}
.links-item {
    font-family: "Noto Sans TC", sans-serif;
    font-size: 1.041667vw;
    line-height: 2;
    letter-spacing: 3px;
    text-align: left;
    color: #2e4565;
    transform: translateX(2.34375vw);
    border-bottom: #707070 solid 1px;
    width: calc(100% - 5.626rem);
    min-width: 81.327800829%;
}
.links-items .links-item:last-child {
    padding-bottom: 30px;
    border-bottom: none;
}
.links-upper-item {
    min-width: 25.104166666vw;
    min-height: 4.479166666vw;
    position: relative;
    cursor: pointer;
}
/* Milo: links結束，css檔案只有改動這一塊 */

/* Jenny: Contact us block start*/
.ContactUs-container {
    width: 100vw;
    background-color: #e4dfd2;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: -1vw;
}

.ContactUs-container-en{
    margin-top: -15vw;
}

.contactUS_title {
    position: relative;
    margin-top: 8.09vw;
}

#administor_profile_block {
    position: relative;
    width: 82.08333vw;
    margin-top: 6.09vw;
    display: flex;
    align-items: flex-start;
    flex-direction: row;
    justify-content: center;
    margin-bottom: 5vw;
}

#administor_profile_block .profile:first-child {
    margin-left: 0;
}

.profile {
    display: flex;
    flex-direction: column;
    margin-left: 9%;
    width: 19.583vw;
}

.profile-header {
    width: 19.583vw;
    height: 12.5vw;
    border-radius: 6%;
    overflow: hidden;
    cursor: pointer;
}

.profile-header img {
    width: 19.583vw;
    height: 12.5vw;
    transition-timing-function: ease-out;
    transition-duration: 0.5s;
}

.profile-header img:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.profile_content {
    display: flex;
    flex-direction: column;
    margin-top: 1vw;
}

.profile_p1, .profile_p2, .profile_p3 {
    line-height: 1.823333vw;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: space-between;
    flex-direction: row;
    color: #2e4565;
    margin-top: 1vw;
}

/*.profile_p2{
    margin-top: 2vw;
}*/

.contact_text {
    font-family: "Noto Sans TC", sans-serif;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    text-align: center;
    color: #2e4565;
}

.staff_name {
    font-size: 1.302083333vw; /*25px*/
    letter-spacing: 3px;
}


.work_respon{
    font-size: 1.041667vw; /*18px -> 20px*/
    letter-spacing: 2px;
    padding-top: 2%;    
    padding-bottom: 2.5%;  
}

.contact_title, .email, .phone_num, .self_intro{
    font-size: 1.041667vw;
    font-weight: normal;
    letter-spacing: 0.15625vw;
    line-height: 1.823333vw;
    text-align: left;
}

.overlayinContact {
    position: fixed;
    display: none;
    width: 100vw;
    height: 100vw;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.65);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    z-index: 2;
    transition: 1s ease-in-out;
}

.overlay_wapper {
    display: flex;
    flex-direction: row;
    width: 100vw;
    justify-content: space-between;
}

.cls_btn {
    /*width: 1.2rem;
    height: 1.2rem;*/
    margin-left: 33%;
    margin-top: 2%;
    cursor: pointer;
}

.overlay_profile_content{
    width: 60vw;
    height: 100vw;
    background-color: #efeee4;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 2;
}

.overlay_title, .overlay_middle, .overlay_bottom{
    width: 58vw;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    border-bottom: solid 1.5px rgba(46,69,101,0.2);
}

.profile_text{
    font-size: 0.9375vw;
    letter-spacing: 0.104vw;
}

.overlay_title img {
    width: 1.875rem;
    height: 1.688rem;
}

.overlay_middle {
    margin-top: 3vw;
    padding-bottom: 0.5vw;
    align-items: flex-start;
}

.overlay_img {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.profile_post_num {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 4.5%;
}

.profile_post_num p {
    font-family: "Noto Sans TC", sans-serif;
    font-size: 0.9rem;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: 1.5px;
    text-align: center;
    color: #2e4565;
}

.img_block {
    /*width: 30.26vw;
    height: 42.76vw;
    overflow: hidden;*/
    width: 25.26vw;
    height: 32.76vw;
    border-radius: 6%;
    overflow: hidden;
    object-fit: fill;
}

.img_block img {
    /*width: 30.26vw;
    height: 42.76vw;
    object-fit: fill;*/
    width: 25.26vw;
    height: 32.76vw;
}

.overlay_self_info{
    width: 35vw;
    margin-left: 3vw;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.overlay_staff_name {
    width: 100%;
    font-size: 3.38vw;
    padding-top: 10%;
    padding-bottom: 13%;
    text-align: left;
    border-bottom: solid 1.5px rgba(46,69,101,0.2);
}

.overlay_self_info > .profile_p2, .overlay_self_info > .profile_p3{
    width: 100%;
    justify-content: flex-start;
}
.overlay_self_info > .profile_p2{
    padding-top: 5%;
}

.overlay_self_info > .profile_p3{
    padding-bottom: 8%;
}

.overlay_phone_num, .overlay_mail{
    margin-left: 4%;
}

.overlay_bottom {
    border-bottom: none;
    margin-top: 0.5vw;
    margin-bottom: 3vw;
}

.self_intro {
    line-height: 2;
    letter-spacing: 3px;
    text-align: left;
    padding-bottom: 8%;
    padding-top: 8%;
}

.overlay_profile_pointer{
    cursor: pointer;
    z-index: inherit;
}

.links-item a {
    text-decoration: none;
}

.links-items{
    max-width: 25.104166666vw;;
}

@media (max-width: 1130px) {
    #event-slider-container-outer {
        transform: translateX(calc(-1000px + 32.6vw));
    }
    .event-slider-item {
        min-width: 400px;
    }
    #event-icon-prev {
        left: calc(45.65vw - 215px);
    }
    #event-icon-next {
        left: calc(54.35vw + 215px);
    }

    .links-category-item,
    .links-upper-item {
        min-width: 241px;
        min-height: 43px;
        width: 241px;
    }

    .links-content {
        width: 492px;
    }

    .links-item-title {
        font-size: 12.504px;
    }

    .links-item {
        font-size: 11px;
    }

    .work_respon{
        font-size: 11px;
    }
}

@media (max-width: 960px) {
    #event-slider-container {
        min-height: 251px;
    }
    .single-event {
        min-height: 225px;
        height: 225px;
    }
    .event-mask {
        top: calc((100% - 225px) / 2);
        height: 225px;
    }
    .main-event .single-event {
        height: 100%;
    }
    .main-event .event-mask {
        top: calc((100% - 251px) / 2);
        height: 100%;
    }
    .event-mask.event-to-brighter {
        top: calc((100% - 251px) / 2);
        height: 251px;
    }
    .main-event .event-mask.event-to-darker {
        top: calc((100% - 225px) / 2);
        height: 225px;
    }
    .single-event.event-to-bigger {
        transition: 0.7s;
        height: 251px;
    }
    .single-event.event-to-smaller {
        transition: 0.7s;
        height: 225px;
    }
    .links-category-item.expanded .links-item-title {
        left: 22.5px;
    }
    .links-item-title {
        font-size: 12.504px;
    }
    .links-icon-more-item {
        right: 17.5px;
    }
    .links-item {
        font-size: 11px;
        transform: translateX(22.5px);
    }

    .SP_ch_title,
    .SP_en_title {
        font-size: 12.504px;
    }

    .SP_ch_title {
        margin-top: 25px;
    }

    .interview-text-content > span {
        font-size: 11px;
    }
    .interview-text-content > a {
        font-size: 12px;
    }

    .interview-slide:hover .interview-picture > img {
        -webkit-filter: grayscale(0%);
        filter: grayscale(0%);
        width: 99.936px;
        height: auto;
    }
    .interview-picture > img {
        -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
        filter: grayscale(100%);
        width: 99.936px;
        height: auto;
    }
    .interview-picture {
        width: 99.936px;
        height: 99.936px;
        border-radius: 50%;
        overflow: hidden;
    }

    .ch-title {
        margin-top: 4.8px;
        letter-spacing: 3px;
        font-size: 20px;
        line-height: 22.504px;
    }
    .en-title {
        margin-top: 4.8px;
        font-size: 15px;
        letter-spacing: 0.75px;
    }

    .Links-container {
        border-radius: 10px;
    }

    .events {
        border-radius: 10px;
    }

    .images-container {
        margin-top: 16vw;
    }

    .img-slide-btn img,
    .social_media_links img {
        margin-left: 12.5px;
        width: 15px;
    }

    .iph_ch {
        font-size: 32.504px;
    }
    
    .iph_en {
        font-size: 12.504px;
    }

    .iph_intro {
        font-size: 12px;
    }

    .bk_num {
        font-size: 28.504px;
    }

    .video_title {
        font-size: 16px;
    }

    .staff_name {
        font-size: 16px;
    }

    .work_respon{
        font-size: 14px;
        padding: 0;
    }

    #out_WR {
        font-size: 9px;
    }

    .contact_title, .email, .phone_num, .self_intro {
        font-size: 14px;
        line-height: 17.504px;
    }

    .profile_p1, .profile_p2, .profile_p3 {
        line-height: 17.5px;
        flex-direction: column;
        align-items: flex-start;
    }

    .click_btn_bar img{
        width: 19.2px;
        height: 19.2px;
        margin-left: 6.25px;
        margin-right: 6.25px;
    }

    .dot {
        width: 22.08px;
        height: 3px;
        margin: 0 9.6px;
    }

    .Aboutus-content-container {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-top: 40px;
        min-height: 410px;
    }

    .iph_intro, .deco_waves, .Interview-container {
        display: none;
    }

    .sphn-iph_intro{
        display: block;
    }

    .intro_content{
        margin-left: 0;
        width: 68vw;
        padding: 7vw;
        box-shadow: 6px 6px 15px 0 rgb(255 111 0 / 30%);
    }

    .intro_content-text{
        margin: 2vw;
    }

    .iph_ch, .iph_en, .iph_en_title, .sphn-iph_intro, .iph_intro_en {
        width: unset;
        font-family: "Noto Sans TC", sans-serif;
        text-align: left;
    }

    .iph_ch{
        font-size: 24px;
        font-weight: bold;
        letter-spacing: 3.75px;
        color: #2e4565;
        margin-top: 0;
    }

    .iph_en, .iph_en_title {
        font-size: 16px;
        font-weight: bold;
        letter-spacing: 0.7px;
        color: #2e4565;
    }

    .iph_en_title{
        font-size: 18px;
        letter-spacing: 0;
        margin-bottom: 5vw;
    }

    .iph_intro_en {
        font-size: 16px;
        margin-top: 0;
        margin-left: 0;
        hyphens: auto;
    }

    .sphn-iph_intro{
        font-size: 16px;
        margin-top: 8vw;
        margin-left: 0;
        line-height: 1.79;
        letter-spacing: 2.1px;
        text-align: left;
        color: #647386;
    }

    .videos {
        width: 82vw;
        margin-right: 0vw;
        float: unset;
        background-color: transparent;
        border-radius: 0vw;
        box-shadow: none;
        display: flex;
        flex-direction: column;
    }

    .module{
        border-radius: 3.125vw;
        box-shadow: 6px 6px 15px 0 rgba(255, 111, 0, 0.3);
        padding: 7vw;
        align-items: center;
        margin: 4vw 0;
    }

    .ContactUs-container{
        padding: 10vw;
    }
}

@media (max-width: 800px) {
    .SP_content {
        margin: 3vw auto;
    }
    .SP_img {
        width: 60vw;
        height: 38.7142857143vw;
    }
    .SP_img_shadow {
        width: 60vw;
        height: 38.7142857143vw;
    }
    #SP_content_container {
        flex-wrap: wrap;
        padding-bottom: 30px;
    }
    .interview-text-content {
        width: 197px;
    }

    .images-container {
        margin-top: 18vw;
    }

}

@media (max-width: 640px) {
    .links-content {
        width: 75vw;
    }

    .links-flex-col {
        width: 241px;
        margin-left: auto;
        margin-right: auto;
    }

}

@media (max-width: 480px){
    #administor_profile_block{
        flex-direction: column;
        align-items: center;
        margin: 5vw 0;
    }

    .profile{
        margin-left: 0;
        width: auto;
        align-items: center;
        margin-top: 2vw;
    }

    .profile_p1, .profile_p2, .profile_p3 {
        margin: 4vw 0;
        flex-direction: column;
        align-items: flex-start;
    }

    .contact_title, .email, .phone_num, .self_intro{
        line-height: 4.2vw;
    }

    .images-container {
        width: 95.733vw;
        height: 57.333vw;
        margin-top: 85px;
    }

    #slide_btn, #social_btn {
        display: none;
    }

    .click_btn_bar {
        justify-content: center;
        width: 100vw;
        margin: 21px 0;
        padding: 0 auto;
    }

    .dot {
        width: 30px;
        height: 10px;
    }

    .news_title .icon, .event-icon-container img {
        width: 20px;
        height: 20px;
    }

    .ch-title {
        font-size: 22px;
        font-weight: bold;
        line-height: 25.008px;
        letter-spacing: 2.85px;
        margin: 5px 0;
    }

    .en-title {
        font-size: 18px;
        font-weight: bold;
        letter-spacing: 0.7px;
        margin: 0;
    }

    .event-title {
        margin-top: 40px;
    }

    .news_title{
        margin-top: 40px;
    }

    #event-slides {
        margin-top: 40px;
    }

    #event-slider-container-outer {
        transform: none;
    }

    .event-indent {
        min-width: 0;
        width: 0;
    }

    .event-slider-item {
        min-width: 0;
        max-width: none;
        margin-left: auto;
        margin-right: auto;
        width: 89.33vw;
        height: 68.26vw;
        margin-bottom: 20px;
    }

    #event-icon-prev, #event-icon-next {
        display: none;
    }

    .single-event {
        width: 100%;
        height: 100%;
    }

    .event-mask {
        width: 100%;
        height: 100%;
        top: 0;
    }

    .event-mask::after {
        background-color: rgba(0,0,0,0);
    }

    .sm-event-pic {
        display: none;
    }

    .event-mask, .single-event, .event-mask::after {
        border-radius: 6.666vw;
    }

    #event_readmore_btn, #news_readmore_btn {
        margin-top: 13.333vw;
        margin-bottom: 13.333vw;
    }

    .abouttitle .icon {
        width: 29px;
        height: 20px;
    }

    .abouttitle {
        margin-top: calc(2vw + 40px);
    }
    
    .icon_aboutus_2{
        margin: 0;
    }

    .bk_num{
        display: none;
    }

    .video_title{
        font-size: 16px;
    }

    .Specialization-container {
        margin-top: 40px;
    }

    #SP_content_container {
        margin-top: 40px;
        padding-bottom: calc(30px + 2vw);
    }

    #Specialization_title .icon {
        width: 22px;
        height: 20px;
    }

    .SP_content {
        margin: 0 auto 20px auto;
        position: relative;
    }

    .SP_ch_title, .SP_en_title {
        margin: 0;
        position: absolute;
        color: #efeee4;
        top: 23.4665vw;
        text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8);
        font-size: 4.5355vw;
        font-weight: bold;
        letter-spacing: 0.7px;
    }

    .SP_ch_title {
        transform: translateY(-100%);
        letter-spacing: 2.55px;
    }

    .SP_img_shadow, .SP_img {
        width: 89.333vw;
        height: 46.933vw;
        border-radius: 3.75vw;
        object-fit: cover;
    }

    .links_title .icon {
        width: 32px;
        height: 20px;
    }

    .contactUS_title .icon {
        width: 22px;
        height: 20px;
    }

    .links-content {
        width: 89.333vw;
    }

    .links-flex-col {
        width: 89.333vw;
        margin-left: auto;
        margin-right: auto;
    }

    .links-category-item,
    .links-upper-item {
        width: 89.333vw;
        min-width: 89.333vw;
        min-height: 17.333vw;
        position: relative;
    }

    .links-item-title {
        font-size: 4.535vw;
    }

    .links-icon-more-item {
        right: 30px;
    }

    .links-item-title {
        left: 0;
        transform: translate(30px,-50%);
    }

    .profile-header {
        width: 89.333vw;
        height: 52vw;
    }

    .profile-header img {
        width: 89.333vw;
        height: 52vw;
        object-fit: cover;
    }

    .profile_p1, .profile_p2, .profile_p3 {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 89.333vw;
        margin-top: 5px;
    }

    .profile_p1 {
        color: #2e4565;
        font-size: 4.535vw;
    }

    .profile_p2, .profile_p3 {
        color: #647386;
    }

    #event-slider-container {
        flex-direction: column;
    }

    .event-info .sdg-tag {
        margin-top: 6px;
        height: 16.5px;
    }
}