/* --------------------------------------------------*/
html{    
    font-family: 'Noto Sans TC', 'Microsoft JhengHei', Arial;
    background-image: url(../img/background.jpg);
    background-repeat: repeat;
    background-position: center top;
    background-attachment: fixed;
    background-size: cover;
    cursor: default;
}

body {
    margin: 0;
}

article .sect {
    width: 100%;
    position: relative;
    /* overflow-x: hidden; */
    /* overflow-y: visible; */
}

article .sect .ctx {
    width: 1200px;
    margin: 0 auto;
    padding: 40px 0;
    box-sizing: border-box;
}

article .sect .sectTit {
    margin: 0 0 10px;
    text-align: center;
    font-weight: bold;
    font-size: 40px;
    letter-spacing: 3px;
    line-height: 2em;
    color: #517632;
    text-shadow: 5px 5px 0 #00000011;
}

footer {
    padding: 5px 0;
    text-align: center;
    font-size: 12px;
    color: #fff;
    background: #517632;
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    html, body {
        background-image: url(../img/background.jpg);
        background-attachment: scroll;
        background-size: contain;
    }
}

@media screen and (min-width: 1px) and (max-width: 767px) {
    html, body {
        background-image: url(../img/background.jpg);
        background-attachment: scroll;
        background-size: contain;
    }

    article .sect .ctx {
        width: 100%;
        padding: 20px;
    }

    article .sect .sectTit {
        line-height: 1.6em;
        letter-spacing: 1px;
        font-size: 28px;
    }

    .phoneBreak {
        display: block;
    }
}
/* --------------------------------------------------*/


/* --------------------------------------------------*/
article .sect.caption .kv {
    width: 100%;
    border-bottom: solid 1px #fff;
}

article .sect.caption .kvMobi {
    width: 100%;
    display: none;
    border-bottom: solid 1px #fff;    
}

@media screen and (min-width: 1px) and (max-width: 767px) {
    article .sect.caption .kv {
        display: none;
    }

    article .sect.caption .kvMobi {
        display: block;
    }
}
/* --------------------------------------------------*/


/* --------------------------------------------------*/
.sect1 {
}

.sect1 table {
    width: 100%;
    box-sizing: border-box;
}

.sect1 table tr td {
    padding: 12px 5px 12px 20px;
    box-sizing: border-box;
    border-bottom: dotted 2px #00000044;
    background: #ffffff88;
}

.sect1 table tr td:nth-child(1) {
    width: 160px;
    align-items: center;
    font-weight: bold;
    color: #866b3e;
    color: #517632;
}

.sect1 table tr td:nth-child(2) {
    background: linear-gradient(to right, #ffffff88 50%, #ffffff00 100%);
}

.sect1 table tr td i {
    width: 45px;
    font-size: 28px;
    color: #51763288;
}

.sect1 .admit {
    width: 1000px;
    margin: auto;
    box-sizing: border-box;
    display: block;
    border: solid 1px #c0c0c0;
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
}

@media screen and (min-width: 1px) and (max-width: 767px) {
    .sect1 table tr td {
        width: 100%;        
        float: left;
    }

    .sect1 table tr td:nth-child(1) {
        width: 100%;
        padding: 10px 5px 0px 10px;
        border-bottom: none;
        background: linear-gradient(to right, #ffffff88 50%, #ffffff00 100%);
    }

    .sect1 table tr td:nth-child(2) {
        padding: 0px 5px 10px 50px;
    }

    .sect1 table tr td i {
        font-size: 24px;
        width: 40px;
    }

    .sect1 .admit {
        width: 100%;
    }
}
/* --------------------------------------------------*/


/* --------------------------------------------------*/
.sect2 {
}

.sect2 .sectTit {
    color: #866b3e !important;
}

.sect2 .Q {
    font-weight: bold;
    font-size: 24px;
    color: #866b3e;
    color: #34a160;
    color: #db6e00;
}

.sect2 .block {
    margin: 20px 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.sect2 .block .left,
.sect2 .block .right {
    flex: 0 0 47%;
}

.sect2 .block p {
    letter-spacing: 3px;
    line-height: 1.8em;
    text-align: justify;
    font-weight: 500;
    font-size: 20px;
    color: #866b3e;
}

.sect2 .block p a {
    color: #517632;
    /* text-decoration: none; */
}

.sect2 .block div img {
    width: 100%;
    border-radius: 3px;
}

.sect2 .block div .highlight {
    color: #34a160;
    color: #db6e00;
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
}

@media screen and (min-width: 1px) and (max-width: 767px) {
    .sect2 .Q {
        font-size: 20px;
    }

    .sect2 .block .left,
    .sect2 .block .right {
        flex: 0 0 100%;
    }

    .sect2 .block:nth-child(3) .left,
    .sect2 .block:nth-child(5) .left {
        order: 2;
    }

    .sect2 .block:nth-child(3) .right,
    .sect2 .block:nth-child(5) .right {
        order: 1;
    }
}
/* --------------------------------------------------*/


/* --------------------------------------------------*/
.sect3 {
    background: url(../img/sectBack_01.jpg);
    background-attachment: fixed;
    background-position: center top;
    background-size: cover;
}

.sect3 .ctx {
    padding: 80px 0 !important;
}

.sect3 .sectTit {
    color: #fff !important;
}

.sect3 .list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.sect3 .list .item {
    flex: 0 0 30%;
    margin: 20px 0;
    padding: 20px;
    box-sizing: border-box;    
    border-top: solid 5px #517632;
    border-bottom: solid 2px #fff;
    border-radius: 3px;
    text-align: justify;
    line-height: 1.6em;
    letter-spacing: 2px;    
    font-size: 18px;
    background: #ffffffcc;
    background: linear-gradient(135deg, #ffffffcc 0%, #ffffffee 80%);
}

.sect3 .list .item:nth-child(even) {    
    border-top: solid 5px #9f7b55;
}

.sect3 .list .item .num {
    margin: 0 0 10px;
    line-height: 1em;
    text-align: center;
    font-family: arial;
    font-style: italic;
    font-size: 2em;
    color: #808080;
    text-shadow: 5px 5px 2px #00000022;
}

.sect3 .list .item .tit {
    margin: 10px 0;
    text-align: left;
    font-weight: bold;
    font-size: 24px;
    color: #517632;
}

.sect3 .list .item:nth-child(even) .tit {
    color: #9f7b55;
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
}

@media screen and (min-width: 1px) and (max-width: 767px) {
    .sect3 .ctx {
        padding: 20px !important;
    }

    .sect3 .list .item {
        flex: 0 0 100%;
        margin: 10px 0;
    }
}
/* --------------------------------------------------*/


/* --------------------------------------------------*/
.sect4 {
}

.sect4 .teacher .item {
    width: 85%;
    margin: 10px 15% 10px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* flex-wrap: wrap; */
}

.sect4 .teacher .item:nth-child(even) {
    margin: 10px 0 10px 15%;
}

.sect4 .teacher .item .author {
    flex: 0 0 180px;
    width: 180px;
    height: 180px;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
    border: solid 4px #34a160;
    border-radius: 100%;
    overflow: hidden;
    background: #fff;
    box-shadow: 5px 5px 5px #00000018;
}

.sect4 .teacher .item:nth-child(even) .author {
    box-sizing: border-box;
    border: solid 4px #db6e00;
}

.sect4 .teacher .item .author .avatar {
    width: 96%;
    height: 96%;
    margin: 2%;
    box-sizing: border-box;
    border: solid 2px #34a160;
    border-radius: 100%;    
}

.sect4 .teacher .item:nth-child(even) .author .avatar {
    border: solid 2px #db6e00;
}

.sect4 .teacher .item .desp {
    flex: 1 1 auto;
    margin: 0 0 0 -30px;
    padding: 10px 20px 10px 50px;
    border-top: dotted 5px #c0c0c0;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    letter-spacing: 1px;
    text-align: justify;
    background: #ffffff88;
    box-shadow: 5px 5px 5px #00000011;
}

.sect4 .teacher .item .desp .job {
    line-height: 2em;
    font-size: 1.2em;
    color: #517632
}

.sect4 .teacher .item:nth-child(even) .desp .job {
    color: #9f7b55;
}

.sect4 .partner {
    display: flex;
    justify-content: space-between;
}

.sect4 .partner .item {
    flex: 0 0 40%;
}

.sect4 .partner .item:nth-child(2) {
    flex: 0 0 55%;
}

.sect4 .partner .item .author {
    /* flex: 0 0 180px; */
    width: 150px;
    height: 150px;
    margin: 0 12px 0 0;
    display: inline-block;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
    border: solid 4px #34a160;
    border-radius: 100%;
    overflow: hidden;
    background: #fff;
    box-shadow: 5px 5px 5px #00000018;
}

.sect4 .partner .item:nth-child(even) .author {
    box-sizing: border-box;
    border: solid 4px #db6e00;
}

.sect4 .partner .item .author .avatar {
    width: 96%;
    height: 96%;
    margin: 2%;
    box-sizing: border-box;
    border: solid 2px #34a160;
    border-radius: 100%;    
}

.sect4 .partner .item:nth-child(even) .author .avatar {
    border: dashed 2px #db6e00;
}

.sect4 .partner .item .desp {
    flex: 1 1 auto;
    min-height: 205px;
    margin: -45px 0 0 0;
    padding: 50px 20px 15px 20px;
    border-top: dotted 5px #c0c0c0;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    letter-spacing: 1px;
    text-align: justify;
    background: #ffffff88;
    box-shadow: 5px 5px 5px #00000011;
}

.sect4 .partner .item .desp .job {
    line-height: 1.6em;
    font-size: 1.2em;
    color: #517632
}

.sect4 .partner .item:nth-child(even) .desp .job {
    line-height: 2em;
    color: #9f7b55;
}

.sect4 .partner .item .desp .logo {
    width: 120px;
    display: block;
    margin: 5px 0 5px auto;
}

.sect4 .divLine {
    width: 100%;
    max-width: 1200px;
    margin: 60px auto;
    /* border-bottom: dotted 5px #c0c0c0; */
    height: 2px;
    background: linear-gradient(to right, #ffffff00 0%, #c0c0c0 50%, #ffffff00 100%);
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
}

@media screen and (min-width: 1px) and (max-width: 767px) {
    .sect4 .teacher .item {
        width: 100%;
        margin: 20px 0;
        flex-wrap: wrap;
    }
    
    .sect4 .teacher .item:nth-child(even) {
        margin: 20px 0;
    }
    
    .sect4 .teacher .item .author {
        margin: auto;
        display: block;
    }

    .sect4 .teacher .item .desp {
        flex: 1 1 auto;
        margin: -45px 0 0;
        padding: 50px 20px 20px;
        border-radius: 3px;
        box-shadow: 0 0 5px #00000022;
    }

    .sect4 .teacher .item .desp .job {
        margin: 0 0 10px;
        line-height: 1.6em;
    }
}
/* --------------------------------------------------*/


/* --------------------------------------------------*/
.sect5 {
    background: #ffffff88;
}

.sect5 .ctx {
    padding: 80px 0 !important;
}

.sect5 .sectTit {
    color: #866b3e !important;
}

.sect5 .board {
    padding: 20px 40px 40px;
    box-sizing: border-box;
    border-radius: 5px;
    border: solid 1px #866b3e44;
    /* background: #ffffff88; */
    background: #866b3e33;
    background: linear-gradient(135deg, #866b3e11 0%, #866b3e33 80%), url(../img/background.jpg);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.sect5 .board .inner {
    padding: 20px;
    box-sizing: border-box;
    border-radius: 5px;
    border: dashed 2px #866b3e;
    line-height: 1.6em;
    letter-spacing: 1px;
    font-size: 18px;
    background: #ffffffcc;
}

.sect5 .board .inner ol>li {
    padding: 10px 0;
    font-weight: bold;
    color: #9f7b55;
}

.sect5 .board .inner ol>li .cont {
    font-weight: normal;
    color: #303030;
}

.sect5 .board .inner ol>li .cont ul {
    padding: 0 0 0 25px;
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
}

@media screen and (min-width: 1px) and (max-width: 767px) {
    .sect5 .ctx {
        padding: 40px 10px !important;
    }

    .sect5 .board {
        padding: 10px 10px 10px;
    }

    .sect5 .board .inner {
        padding: 0 10px;
    }
}
/* --------------------------------------------------*/


/* --------------------------------------------------*/
.sect6 {
}

.sect6 .contact {
    width: 800px;
    margin: auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.sect6 .contact .item {
    flex: 0 0 48%;
    margin: 20px 0 30px;
    padding: 30px 10px 20px;
    box-sizing: border-box;    
    border-top: solid 5px #517632;
    border-radius: 3px;
    text-align: center;
    letter-spacing: 2px;
    font-size: 18px;
    /* background: #ffffffcc; */
    background: linear-gradient(145deg, #ffffff66 0%, #ffffffcc 80%);
    box-shadow: 5px 5px 5px #00000011;
}

.sect6 .contact .item i {
    font-size: 60px;
    color: #517632;
}

.sect6 .contact .item .tit {
    margin: 20px 0 5px;
    font-size: 24px;
    color: #517632;
}

.sect6 .contact .item .cont {    
    letter-spacing: 0;
    font-size: 16px;
    color: #808080;
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
}

@media screen and (min-width: 1px) and (max-width: 767px) {
    .sect6 .contact {
        width: 100%;
    }

    .sect6 .contact .item {
        flex: 0 0 100%;
        margin: 10px 0;
    }

    .sect6 .contact .item i {
        font-size: 52px;
    }
    
    .sect6 .contact .item .tit {
        font-size: 20px;
    }
}
/* --------------------------------------------------*/


/* --------------------------------------------------*/
.sect7 {
    background: #ffffff88;
}

.sect7 .unit {
    width: 700px;
    margin: 20px auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

.sect7 .unit .item {
    flex: 0 0 300px;
    text-align: center;
    font-weight: bold;
    font-size: 24px;
    color: #808080;
}

.sect7 .unit .item img {
    width: 100%
}

.sect7 .unit .sign {
    flex: 0 0 100px;
    text-align: center;
}

.sect7 .unit .sign i {
    margin: 5px 0;
    font-size: 40px;
    color: #c0c0c0
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
}

@media screen and (min-width: 1px) and (max-width: 767px) {
    .sect7 .unit {
        width: 100%;
    }

    .sect7 .unit .item {
        flex: 0 0 100%;
        font-size: 20px;
    }

    .sect7 .unit .sign {
        flex: 0 0 100%;
    }

    .sect7 .unit .sign i {
        font-size: 28px;
    }
}
/* --------------------------------------------------*/


/* --------------------------------------------------*/
.sect8 {
    background: #ffffff88;
}

.sect8 .slideshowPC {
    width: 100%;
    margin: 10px 0 20px;
}

.sect8 .slideshowPC .item {
    width: 50%;
    /* height: 100px; */
    margin: 0;
    padding: 0 10px;
    box-sizing: border-box;
    display: inline;
    vertical-align: bottom;
    border: solid 1px #fff;
}

.sect8 .slideshowPC .item1 {
    background: url(../img/c1s.jpg) center;
    background-size: cover;
}

.sect8 .slideshowPC .item2 {
    background: url(../img/c2s.jpg) center;
    background-size: cover;
}

.sect8 .slideshowPC .item3 {
    background: url(../img/c3s.jpg) center;
    background-size: cover;
}

.sect8 .slideshowPC .item4 {
    background: url(../img/c4s.jpg) center;
    background-size: cover;
}

.sect8 .slideshowPC .item5 {
    background: url(../img/c5s.jpg) center;
    background-size: cover;
}

.sect8 .slideshowPC .item6 {
    background: url(../img/c6s.jpg) center;
    background-size: cover;
}

.sect8 .slideshowPC .item7 {
    background: url(../img/c7s.jpg) center;
    background-size: cover;
}

.sect8 .slideshowPC .item8 {
    background: url(../img/c8s.jpg) center;
    background-size: cover;
}

.sect8 .slideshowPC .item9 {
    background: url(../img/c9s.jpg) center;
    background-size: cover;
}

.sect8 .slideshowPC .pager {
    width: 100%;
    display: block;
    text-align: center;
    /* background: #ccc; */
}

.sect8 .slideshowPC .pager span  {
    width: 10px;
    height: 10px;
    margin: 0 8px;
    border-radius: 100%;
    display: inline-block;
    font-size: 0px;
    color: #ddd;
    background: rgba(0, 0, 0, 0.5);
    cursor: pointer; 
}

.sect8 .slideshowPC .pager span.cycle-pager-active {
    color: #0066bc;
    background: rgba(255, 255, 255, 0.5);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
}

.sect8 .slideshowPC .pager > *  {
    cursor: pointer;
}
@media screen and (min-width: 1025px) and (max-width: 1200px) {
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
}

@media screen and (min-width: 1px) and (max-width: 767px) {
    .sect8 .slideshowPC .item {
        width: 100%;
    }
}
/* --------------------------------------------------*/


/* --------------------------------------------------*/
.sect9 {

}

.sect9 .sectTit {
    font-weight: bold;
    font-size: 24px;
    color: #517632;
}

.sect9 .relatedInfo {
    width: 100%;
    margin: 0 0 40px;
    padding: 0 0 0 27px;
    box-sizing: border-box;
}

.sect9 .relatedInfo .item {
    display: inline-block;
    margin: 7px 0;
    /* font-weight: bold; */
    color: #866b3e;
}

.sect9 .relatedInfo .item .name {
    border-bottom: solid 1px #866b3e;
}

.sect9 .relatedInfo .item i {
    margin: 0 0 0 5px;
    vertical-align: bottom;
    font-size: 20px;
    color: #000;
    transform: translateY(2px);
}

.sect9 .gallery {
    margin: 40px 0 20px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.sect9 .gallery .item {
    flex: 0 0 33%;
    color: #517632;
}

.sect9 .gallery .item .pic {
    height: 150px;
    margin: 0 0 5px;
}

.sect9 .gallery .item:nth-child(1) .pic {
    background: url(../img/camp_02.jpg) right top;
    background-size: cover;
}

.sect9 .gallery .item:nth-child(2) .pic {
    background: url(../img/camp_03.jpg) center;
    background-size: cover;
}

.sect9 .gallery .item:nth-child(3) .pic {
    background: url(../img/camp_04.jpg) left bottom;
    background-size: cover;
}

@media screen and (min-width: 1025px) and (max-width: 1200px) {
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
}

@media screen and (min-width: 1px) and (max-width: 767px) {
    .sect9 .relatedInfo {
        margin: 0 0 20px;
    }

    .sect9 .gallery {
        margin: 20px 0 0;
    }

    .sect9 .gallery .item {
        flex: 0 0 100%;
        margin: 0 0 20px;
    }
}
/* --------------------------------------------------*/


/* --------------------------------------------------*/
.floatIcon {
    width: 100px;
    padding: 10px;
    box-sizing: border-box;
    /* display: inline-block; */
    text-align: center;
    position: fixed;
    right: 0;
    top: 45%;
    z-index: 100;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    text-decoration: none;
    color: #303030;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.floatIcon i {
    margin: 5px 0;
    font-size: 40px;
    color: #34a160;
}

/* .floatIcon img {
    width: 100%;
    margin: 10px 0 0;
    display: block;
    opacity: 0.75;
} */

@media screen and (min-width: 1px) and (max-width: 767px) {
    .floatIcon {
        width: 50px;
        padding: 10px 5px;
    }

    .floatIcon i {
        font-size: 28px;
    }
}
/* --------------------------------------------------*/