/* Font: Merriweather */
@import url("https://fonts.googleapis.com/css2?family=Merriweather:ital,opsz,wght@0,18..144,300..900;1,18..144,300..900&display=swap");
/* Font: Poppins */
@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
/* Bootstrap Icons */
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");

/* Bootstrapt add */
@media (min-width: 992px) { .col-lg-35 {flex: 0 0 auto; width: 31%; } }
@media (min-width: 992px) { .col-lg-55 {flex: 0 0 auto; width: 47%; } }
@media (min-width: 1200px) { .col-xl-55 {flex: 0 0 auto; width: 47%; } }
@media (min-width: 1400px) { .col-xxl-55 {flex: 0 0 auto; width: 47%; } }
.gap-y-3 {row-gap: 1rem;}
.gap-y-4 {row-gap: 2rem;}
.gap-y-5 {row-gap: 3rem;}
.gap-x-3 {column-gap: 1rem;}
.gap-x-4 {column-gap: 2rem;}
.gap-x-5 {column-gap: 3rem;}

/* Font Setting */
.font-serif {font-family: "Merriweather", "Times New Roman", "Georgia", serif;}
.font-bl01 {color: #236bc4;}
.note {color: #236bc4; font-weight: 600;}
.font-w3 {font-weight: 300;}
.font-w6 {font-weight: 600;}
.font-small {font-size: small;}
.text-justify {text-align: justify;}
.text-indent {text-indent: 2em}
.list-123 {list-style: decimal;}
.list-none {list-style: none;}
.list-abc {list-style-type: lower-alpha;}
.list-LH15 li {line-height: 1.5rem;padding-bottom: 0.5rem;}


/* Layout */
body {
    background-color: #eee;
    font-family: 'Poppins', 'Helvetica', 'Arial', sans-serif;
}
.frame {background-color: #fff; box-shadow: 0 0 10px #ccc;}
@media (max-width: 576px) { .frame {width: 100%;}}
main {
    padding-right: 1rem;
    padding-left: 1rem;
    margin-top: 2rem;
    margin-bottom: 5rem;
}
@media (max-width: 576px) {main {padding-left: 0; padding-right: 0;}}
.Contents {padding-left: 3rem; padding-right: 3rem; width: 100%;}
@media (max-width: 576px) { .Contents {padding-left: 0; padding-right: 0;}}
main h3 {color: #45a9c0; font-weight: 600; margin-bottom: 1rem;}
.table-hover>tbody>tr:hover>* {--bs-table-accent-bg: rgba(69, 169, 192, 0.1);}
a {color: #000; text-decoration: none;}
a:hover {color: #45a9c0;}
.link-btn, .link-btn-div a {
    color: #000;
    text-decoration: none;
    border-radius: 4px;
    padding: 0.1rem 0.3rem;
    background-color: #45a9c040;
}
.link-btn:hover, .link-btn:focus, .link-btn-div a:hover, .link-btn-div a:focus {
    color: #fff;
    background-color: #45a9c0;
}

/* border */
.border-1 {border: 1px solid #45a9c0; border-radius: 1rem;}

/* table-vertical */
@media (max-width: 767.98px) {
    .table-vertical table,
    .table-vertical tbody,
    .table-vertical tr,
    .table-vertical td,
    .table-vertical th {
        display: block;
        width: 100%;
    }
    .table-vertical tr {
        margin-bottom: 1rem;
        padding: 1rem 0;
        box-sizing: border-box;
        overflow: hidden;
    }
    .table-vertical td,
    .table-vertical th {
        box-sizing: border-box;
        clear: both;
    }
    .table-vertical td img {
        display: block;
        position: static;
        float: none;
        width: auto;
    }
}

/* Nano-Menu */
.Nano-Menu {padding-top: 1rem;}
.Nano-Menu1 {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 0.7rem;
    row-gap: 0.5rem;
}
.Nano-Menu1 h1 {
    font-size: 1.8rem;
    font-weight: 700;
    letter-spacing: 0.05rem;
    padding-left: 1rem;
}
.Nano-Menu1>div:first-child {width: 500px;}
.Nano-Menu1>div:last-of-type {
    column-gap: 1.5rem;
    justify-content: flex-end;
    text-align: right;
}
.Nano-Menu1>div:last-of-type>a {font-size: 0.8rem; font-weight: 300;}
.menu-btn {
    border: 0;
    font-weight: 600;
    width: 100%;
    text-align: left;
    padding: 0.5rem 0.5rem;
    color: #fff;
    background: linear-gradient(-90deg,
                #FFFFFF 5%,
                #78b8c6 35%,
                #35639b 70%,
                #1f3375 100%);
}
.Nano-Menu2 {margin-bottom: 0.3rem;}
.Nano-Menu2-list {
    background: linear-gradient(-90deg,
                #FFFFFF 5%,
                #78b8c6 35%,
                #35639b 70%,
                #1f3375 100%);
    padding-left: 0.5rem;
}
.Nano-Menu2-list .nav-link {font-size: 1rem; font-weight: 400;}
.Nano-Menu2-list .nav-link {
    color: #fff;
    margin-right: 0.5rem;
    padding: 0.5rem;
}
.Nano-Menu2-list .nav-link:hover, .Nano-Menu2-list .nav-link:focus {
    color: #fff;
    background-color: #78b8c680;
}
.Nano-Menu2-list .dropdown-item {font-size: 0.9rem; font-weight: 400;}
.Nano-Menu2-list .dropdown-item:hover {background-color: #78b8c680;}
.Nano-Menu2-list .dropdown-item:focus {background-color: #78b8c6;}
@media (max-width: 992px) {
    .Nano-Menu1 {margin-bottom: 0.4rem;}
    .Nano-Menu1 h1 {font-size: 1rem; padding-left: 0.5rem; letter-spacing: 0rem;}
    .Nano-Menu1 img {height: 35px;}
    .Nano-Menu1>div:first-child {width: 260px;}
    .Nano-Menu1>div:last-of-type {align-items: center;}
    .Nano-Menu2-list {background: #00000000; padding-left: 0;}
    .Nano-Menu2-list .nav-link {color: #000; margin-right: 0;}
    .Nano-Menu2-list .nav-link:hover {
        color: #000;
        background-color: #00000000;
        background: linear-gradient(90deg, #78b8c680 35%, #FFFFFF 100%);
    }
    .Nano-Menu2-list .nav-link:focus {
        color: #fff;
        background-color: #00000000;
        background: linear-gradient(90deg, #78b8c6 35%, #FFFFFF 100%);
    }
    .Nano-Menu2-list .dropdown-item:hover {
        background-color: #00000000;
        background: linear-gradient(90deg, #78b8c680 35%, #FFFFFF 100%);
    }
    .Nano-Menu2-list .dropdown-item:focus {
        background-color: #00000000;
        background: linear-gradient(90deg, #78b8c6 35%, #FFFFFF 100%);
    }
    .Nano-Menu2-list>ul>li>a::before {content: "— ";}
    .Nano-Menu2-list .dropdown-menu {
        border: 0;
    }
}

/* Index: Organize */
.organize>div {
    border-radius: 1rem;
    padding: 1.5rem;
}
.organize dd {
    text-align: center;
    color: #666;
    font-size: 0.9rem;
    font-weight: 300;
    margin-bottom: 1.5rem;
    background-color: #fff;
    width: fit-content;
    padding: 0.3rem 0.8rem 0.2rem 0.8rem;
    border-radius: 1rem;
}
.organize h5 {
    margin-top: 1rem;
    text-align: center;
    font-family: "Merriweather", "Times New Roman", "Georgia", serif;
    font-weight: 700;
}
.organize ul {
    width: 100%;    
    list-style: none;
    margin-top: 1rem;
    padding: 1.5rem 0.5rem 0 0.5rem;
    font-size: 0.8rem;
    font-weight: 300;
    text-align: center;
    border-top: 1px solid #ccc;
}
.organize ul li {padding-bottom: 0.5rem;}


/* Index: 響應式垂直分隔線 */
.index-col-hr-1 {padding: 1.5rem 3.5rem 1.5rem 1.5rem;}
.index-col-hr-2 {padding: 1.5rem 1.5rem 1.5rem 3.5rem;}
@media (min-width: 1200px) {
    .index-col-hr-1+.index-col-hr-2 {
        border-left: 1px solid #45a9c040;
    }
}
@media (max-width: 1199px) {
    .index-col-hr-1 {padding-left: 0rem; padding-right: 0rem;}
    .index-col-hr-2 {padding-left: 0rem; padding-right: 0rem;}
}

/* Index: News and Events */
.news ul li {line-height: 1.5rem; padding-bottom: 0.5rem;}
.news ul a {
    color: #000;
    text-decoration: none;
    border-radius: 4px;
    padding: 0.1rem 0.3rem;
    background-color: #45a9c040;
}
.news ul a:hover, .news ul a:focus {
    color: #fff;
    background-color: #45a9c0;
}
/* Index: New Student Guide */
.ns_guide {
    background-color: #45a9c080;
    border-radius: 1rem;
    min-height: 4rem;
    margin-bottom: 2.5rem;
}
.ns_guide a{
    font-family: "Merriweather";
    font-size: 1.3rem;
    font-weight: 600;
    text-align: center;
    color: #1f3375;
}
.ns_guide:hover {background-color: #45a9c0;}
.ns_guide a:hover {color: #fff;}

/* Index: Life Info */
.lifeinfo ul {font-size: 0.9rem; font-weight: 300;}
.lifeinfo ul li {line-height: 1.5rem;}

/* Footer */
footer {
    text-align: right;
    color: #fff;
    font-size: 0.8rem;
    padding: 1rem;
    background: linear-gradient(90deg,
                #FFFFFF 5%,
                #78b8c6 35%,
                #35639b 70%,
                #1f3375 100%);
}

/* New Student Guide */
.guide-style>div>ul>li {margin-top: 1.5rem;}
.guide-style>div>ul>li:first-of-type {margin-top: 0;}
.guide-style div dt {
    margin-bottom: 0.5rem;
    color: #45a9c0;
    border-bottom: 1px solid #45a9c080;
    padding-bottom: 0.5rem;
    text-align: center;
}
.guide-style h4 {padding-top: 2.2rem; border-top: 1px solid #45a9c080;}
.guide-style h4:first-child {padding-top:0;border-top: 0;}

/* News Archieves */
.NewsA-style li {line-height: 1.5rem; padding-bottom: 0.5rem;}
.NewsA-style b {font-weight: 600;}

/* Academic Structure */
.ACStructure {
    background-color: rgba(69, 169, 192, 0.2);
    padding: 2rem;
    border-radius: 1rem;
}

/* Research Topics */
.RTopic-style h4 {padding-top: 2.2rem; border-top: 1px solid #45a9c080;}
.RTopic-style>div:first-child h4 {padding-top:0;border-top: 0;}
.RTopic-style p {
    text-indent: 2em;
    text-align: justify;
    margin: 0;
}
@media (max-width: 768px) {
    .RTopic-style p {text-align: start;}
}
.topic-wrap {margin-top: 2rem;}
.topic-wrap::after {
    content: "";
    display: block;
    clear: both;
}
.topic-images {
    float: left;
    display: flex;
    gap: 1rem;
    margin: 0 2rem 1rem 0;
}
.topic-images img {
    object-fit: cover;
    display: block;
}
@media (max-width: 900px) {
    .topic-images {
        float: none;
        flex-direction: column;
        align-items: center;
        margin: 0 0 1rem 0;
    }
}

/* Faculty */
.comm-style .card {width: 100%; box-shadow: 0 0 10px #ccc;}
@media (min-width: 768px) { .comm-style .card {width: 18rem; } }
.comm-style .card .card-subtitle {color: #999;}
.comm-style .card .card-title {
    font-family: 'Merriweather';
    font-weight: 700;
    margin: 0.3rem 0 1rem 0;
}
.comm-style .card h6 {font-size: 0.9rem; text-align: center;}
.comm-style .card h5 {text-align: center;}
.comm-style .card p {margin: 0 0; font-size: 0.9rem; font-weight: 300; }
.comm-style .card p i:first-child {margin-right: 0.7rem;}
.comm-style .card .card-body div {flex-direction: column; padding-left: 0.5rem;}
@media (max-width: 768px) {
    .comm-style .card .card-body div {
        flex-direction:row;
        justify-content: space-evenly;
        padding-left: 0;
    }
}
.comm-style .card a {background-color: #00000000; color: #000; padding: 0;}
.comm-style .card a:hover, .comm-style .card a:focus {color: white;}
.comm-style .card-body:hover {background-color: #45a9c0; color: white;}
.comm-style .card-body:hover h6 {color: #ddd;}
.comm-style .card-body:focus {background-color: #45a9c0; color: white;}
.comm-style .card-body:focus h6 {color: #ddd;}
.faculty-style {margin-bottom: 5rem;}
.faculty-style .card {
    flex: 0 0 auto;
    width: 100%;
    flex-direction: row;
    box-shadow: 0 0 10px #ccc;
}
@media (min-width: 1400px) { .faculty-style .card {flex: 0 0 auto; width: 47%; } }
.faculty-style .card-img {width: 10rem; padding-left: 1rem; padding-right: 1.5rem;}
.faculty-style .card-img img {max-width: 120px;}
@media (max-width: 1400px) { .faculty-style .card-img {width: 9rem;} }
@media (max-width: 1400px) { .faculty-style .card-img img {max-width: 100px;} }
.faculty-style .card-img a {background-color:#00000000}
.faculty-style .card:hover {
    background-color: #45a9c0;
    color: white;
    border: 1px solid #ccc;
}
.faculty-style .card-body {padding-top: 1.5rem; padding-bottom: 1.5rem; padding-left: 0;}
.faculty-style .card-body h5 {
    font-family: 'Merriweather';
    font-weight: 700;
    margin-bottom: 1rem;
}
.faculty-style .card-body p {margin: 0; font-size: 0.8rem; font-weight: 300;}

/* Admission */
.adm-style b {font-weight: 600;}

/* General Requirements for the Ph.D. Degree */
.GR-style>div {padding-bottom: 1.5rem;}
.GR-style h5 {
    font-family: 'Merriweather';
    font-weight: 600;
}
.GR-style p {text-indent: 2em;}

/* Current Students */
.CS-list a {
    display: block;
    width: 10rem;
}
.CS-year h4 {
    margin: 2rem 0 1rem 0 ;
    padding: 0.5rem;
    background: linear-gradient(90deg, #4f81bc 50%, white 100%);
    color: white;
}
.CS-abbr {
    display: grid;
    grid-template-columns: 2rem auto;
    grid-row-gap: 0.2rem;
    grid-column-gap: 1rem;
    margin: 0;
    background-color: #45a9c020;
    border-radius: 1rem;
    padding: 1rem;
}
.CS-abbr dt, .CS-abbr dd {margin: 0; padding: 0;}
.CS-stu-card .card {
    flex: 0 0 auto;
    width: 100%;
    box-shadow: 0 0 10px #ccc;
    padding: 1rem;
}
@media (min-width: 1200px) { .CS-stu-card .card {flex: 0 0 auto; width: 45%; } }
@media (min-width: 1400px) { .CS-stu-card .card {flex: 0 0 auto; width: 31%; } }
.CS-stu-card .card-img {
    display: flex;
    justify-content: center;
    margin-top: 1rem;
}
.CS-stu-card .card-img img {width: 120px; border-radius: 50%;}
.CS-stu-card .card-body h5, .CS-stu-card .card-body h6 {text-align: center;}
.CS-stu-card .card-body h5 {font-family: 'Merriweather'; font-weight: 700;}
.CS-stu-card .card-body dl {
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-row-gap: 0.5rem;
    grid-column-gap: 1rem;
    margin: 0;
}
.CS-stu-card .card-body dt, .CS-stu-card .card-body dd {
    margin: 0;
    padding: 0;
    font-size: 0.8rem;
}
.CS-stu-card .card-body dt {text-align: right; }
.CS-stu-card .card-body a {
    background-color: #00000000;
    text-decoration: underline;
    padding: 0;
}
.CS-stu-card .card-body a:hover, .CS-stu-card .card-body a:focus {
    color: #45a9c0;
}
/* Current Students-2 */
.CS2-table table {vertical-align: middle !important;}
.CS2-table table tr td:first-child img {margin-bottom: 0.5rem;}
.CS2-table table tr td:first-child {
    width: 15rem;
    text-align: center;
    font-weight: 700;
    font-family: 'Merriweather';
}
.CS2-table table tr td:nth-of-type(2) {
    width: 10rem;
    text-align: center;
}
.CS2-table table ul {margin-bottom: 0;}
@media (max-width: 767.98px) {
    .CS2-table table tr td:first-child img {height: 140px;margin: 0 auto;}
    .CS2-table table tr td:first-child {width:100%;}
    .CS2-table table tr td:nth-of-type(2) {width:100%;}
    .CS2-table table tr td:nth-of-type(2) p {margin: 0;}
    .CS2-table table ul {font-size: 0.8rem;}
}

/* Course */
.required-mark {font-size: 2rem; position: relative; top: 0.4rem; line-height: 0;}
.course b {font-weight: 600;}
.course tr {vertical-align: middle;}
.course tbody tr td {text-align: center;}
.course thead {
    background-color: #45a9c0;
    color: white;
    text-align: center;
    font-size: 1.2rem;
    font-family: 'Merriweather';
    font-weight: 700;
}
.course thead th:nth-child(n+3):nth-child(-n+5) {font-size: 0.8rem; font-weight: 500;}
.course tbody tr td:first-of-type {text-align: start}
.course tbody tr td:nth-of-type(2) {width: 15rem;}
.course tbody tr td:nth-child(n+3):nth-child(-n+5) {font-size: 2rem; width: 5.5rem;}
.course tbody tr td:nth-of-type(6) {width: 10rem;}
.course tbody tr td:nth-of-type(7) {width: 15rem;}
.course .bg-primary-sub {font-weight: 400; background-color: #0d6efd90;}
.course .bg-secondary {font-weight: 400; }
.course .offer-MST, .course .offer-SCST, .course .offer-CBMB {
    font-size: 0.9rem;
    padding: 0 0.5rem;
    color: white;
    border-radius: 1rem;
}
.course .offer-MST {background-color: #0ABF24;}
.course .offer-SCST {background-color: #AF20E5;}
.course .offer-CBMB {background-color: blue;}

.modal .modal-header {background-color: #45a9c0;}
.modal .modal-header h5 {
    color: white;
    font-size: 1.2rem;
    font-family: 'Merriweather';
    font-weight: 700;
}
.modal .modal-footer {background-color: #45a9c0;}
.modal table th, .modal table td {vertical-align: middle;}
.modal table ul, .modal table ol {margin: 0.5rem 0 0 0 ; padding-left: 1rem;}
.modal-body table:first-child tbody th {width: 10rem;}
#Adv_NanoB .modal-body table:last-child thead th:first-child {width: 10rem;}
#Seminar .modal-body table:last-child tbody th {text-align: center;}
#Seminar .modal-body table:last-child ul {list-style-type: upper-alpha;}
#Seminar .modal-body table:last-child thead th:first-child {text-align: center;}
#Seminar .modal-body table:last-child thead th:nth-child(4) {text-align: center;}
.weekly-schedule tr {vertical-align: middle;}
.weekly-schedule thead {background-color: #45a9c0; color: white; font-size: 1.2rem;}
.weekly-schedule thead, .weekly-schedule tr:nth-of-type(2) {
    text-align: center;
    font-family: 'Merriweather';
    font-weight: 700;
}
.weekly-schedule td p {font-size: 0.9rem;margin: 0;}
.weekly-schedule td hr {padding: 0;margin: 0.5rem 0;}
.weekly-schedule .offer-MST {color: #0ABF24;}
.weekly-schedule .offer-SCST {color: #AF20E5;}
.weekly-schedule .offer-TIGP {color: blue;}
/* Publication */
.pub-s-style ul li {
    line-height: 1.3rem;
    padding-bottom: 1rem;
    font-size: 0.9rem;
}
.pub-s-style b {font-weight: 600;}

/* Contact */
.contact img {height: 60px;}
@media (max-width:350px) { .contact img {width: 100%; height: auto;}}

/* Button: Go to top */
.go-top-btn {
    display: none;
    position: fixed;
    bottom: 4rem;
    right: 2rem;
    z-index: 5;
    font-size: 1rem;
    border: none;
    background-color: rgba(69, 169, 192, 0.5);
    color: white;
    cursor: pointer;
    padding: 1rem;
    border-radius: 4px;
}
.go-top-btn:hover {background-color: rgba(69, 169, 192, 1);}
.go-top-btn.is-visible {display: block;}

.test {border: 1px solid red;}