.common-header:before {
    background: rgba(47, 76, 160, .4);
}


.introduce-content {

}

@media (max-width: 1024px) {
    .ml20 {
        margin-left: 9%;
    }

    .pb42 {
        padding-bottom: 18vh !important;
    }

    .mb42 {
        margin-bottom: 18vh !important;
    }

    .introduce-content {
        width: 90%;
    }
}

@media (max-width: 768px) {

    .introduce-content {
    }
}

.teacher-introduce .teacher-introduce-select {
    position: relative;
    animation: example .5s forwards;
}

@keyframes example {
    0% {
        width: calc(100% / 4 - 7.5px);
    }
    100% {
        width: calc(50% - 7.5px);
    }
}

.teacher-introduce .teacher-introduce-select:after {
    content: '';
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    background: rgba(72, 98, 172, .6);
}

.teacher-introduce .teacher-introduce-select p:last-child {
    display: block !important;
}

.teacher-introduce .teacher-introduce-item {
    height: 370px;
    overflow: hidden;
    position: relative;
    padding: 42px 18px;
    border-radius: 10px;
    background-position: center;
    width: calc(100% / 4 - 7.5px);
}

.teacher-introduce .teacher-introduce-item:first-child {
    background: url("../images/teacher-one.png") no-repeat;
    background-position-x: 100% !important;
    background-size: cover !important;
}

.teacher-introduce .teacher-introduce-item:nth-child(2) {
    background: url("../images/teacher-tow.png") no-repeat;
    background-position-x: 87% !important;
    background-size: cover !important;
}

.teacher-introduce .teacher-introduce-item:nth-child(3) {
    background: url("../images/teacher-three.png") no-repeat;
    background-position-x: 97% !important;
    background-size: cover !important;
}

.teacher-introduce .teacher-introduce-item .teacher-introduce-content {
    position: absolute;
    bottom: 42px;
    left: 18px;
    width: calc(100% - 36px);
    z-index: 2;
}

.teacher-introduce .teacher-introduce-item p:last-child {
    display: none;
}

.teacher-introduce-swiper-area {
    border-radius: 10px;
}

.teacher-introduce-content-mask {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(73, 98, 172, 0.6);
}

.teacher-introduce-content-mask-inner {
    position: absolute;
    bottom: 40px;
    left: 15px;
}


@media (min-width: 950px) {
    .a-pc-flex{
        display: flex;
    }
    .t-i1s2-text{
        font-size:18px;
        line-height: 2rem;
    }
}
@media (max-width: 1120px) {
    .t-i1s2-text{
        font-size: 17px;
        line-height: 1.8rem;
    }
}
@media (max-width: 950px) {

    .een .show-content:nth-child(1){
        padding: 0 3rem !important;
    }

    .advantage-item-tow:nth-child(odd), .advantage-item-tow:nth-child(odd) .t-i1s2-text{
        padding-right: 0 !important;
    }
    .advantage-item-tow:nth-child(even), .advantage-item-tow:nth-child(even) .t-i1s2-text{
        padding-left: 0 !important;
    }
    .advantage-item-tow:nth-child(even), .advantage-item-tow:nth-child(even) .s232-img{
        left: 0 !important;
    }
    .s232-img{
        width: 100% !important;
    }
    .t-i1s2-text{
        padding-bottom: 30px !important;
        width: 102%;
        position: relative;
        left: -15px;
        line-height: 1.8;
    }
}


.advantage-item-tow:nth-child(odd), .advantage-item-tow:nth-child(odd) .t-i1s2-text{
    padding-right: 30px;
}
.advantage-item-tow:nth-child(even), .advantage-item-tow:nth-child(even) {
    flex-direction: row-reverse;
}

.advantage-item-tow:nth-child(even), .advantage-item-tow:nth-child(even) .t-i1s2-text{
    padding-left: 30px;
}
.advantage-item-tow:nth-child(even), .advantage-item-tow:nth-child(even) .s232-img{
    position: relative;
    left: -7px;
}

.advantage-item .content:hover {
    /*background: #eaa139;*/
}
@media (min-width: 1115px) {
    .iitem-image{
        display: none;
    }
    .iitem{
        height: 395px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding-left: 1.5rem;
    }
    .iitem-wrap-l:hover{
        background-position-x: -35% !important;
    }
    .iitem-wrap-r:hover{
        background-position-x: 125% !important;
    }
    .iitem-wrap:hover .iitem{
        width: 75%;
        background: #eaa139;
        padding-right: 1.5rem;
        text-overflow: unset;
        max-height: 395px;
        height: 33vw;
        border-radius: 15px;
    }

    .iitem-wrap:hover .iitem .text{
        color: white;
    }
    .iitem-wrap:hover .tdesc{
        -webkit-line-clamp: 28;
        -webkit-box-orient: vertical;
    }



    .tdesc {
        font-size: 18px;
        line-height: 1.5 !important;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 8;
        -webkit-box-orient: vertical;
    }

}

@media (max-width: 1115px) {
    .iitem{
        width: 100% !important;
        height: max-content;;
    }
    .iitem-image{
        display: block;
        width: 100%;
    }
    .iitem-wrap{
        background-image: none !important;
        overflow: unset !important;
        height: fit-content !important;
        padding: 15px 15px !important;
        max-height: unset !important;
    }
    .tdesc {
        font-size: 18px;
        line-height: 1.5 !important;
        padding-right: 0 !important;
    }

    .iitem-wrap .iitem{
        padding-top: 15px;
    }
}

@media (max-width: 1050px) {
    .a-pc-hidden{
        display: none;
    }

    .a-mobile-hidden{
        display: block;
    }

    .a-mobile-hidden .swiper-slide{
        width: 100% !important;
    }
}

@media (min-width: 1050px) {
    .a-pc-hidden{
        display: block;
    }

    .a-mobile-hidden{
        display: none;
    }
}

.advantage-item .select {
    display: none;
}

.advantage-item .content:hover .advantage-icon {
    display: none;
}

.advantage-item .content:hover .select {
    display: block;
}

/*.advantage-item .content:hover .text {*/
/*    color: white;*/
/*}*/

.advantage-item .content:hover .main-title {
    color: #eaa139 !important;
    background: white;
}

.advantage-icon {
    width: 1.5rem;
    height: 1.5rem;
    margin-right: 10px !important;
}

@keyframes exampleTow {
    0% {
        width: calc(100% / 4 - 7.5px);
    }
    100% {
        width: calc(100% / 3 - 7.5px);
    }
}

.swiper-slide-shift-out {
    animation: exampleThree .5s forwards;
}

@keyframes exampleThree {
    0% {
        width: calc(100% / 3 - 7.5px);
    }
    100% {
        width: calc(100% / 4 - 7.5px);
    }
}

.supervisor-introduce-swiper-area-one {
}

.supervisor-introduce-swiper-area-one .swiper-slide {
    width: calc(100% / 3 - 20px) !important;
}

.supervisor-introduce-swiper-area-one .swiper-slide img {
    margin-top: 10px;
    height: 235px;
    border-radius: 10px;
}

.supervisor-introduce-swiper-area-one .swiper-slide-active {
    width: calc(100% / 3) !important;
}

.supervisor-introduce-swiper-area-one .swiper-slide-active img {
    height: 255px;
    margin-top: 0 !important;
}


.supervisor-introduce-swiper-area .swiper-slide-active {
}

.supervisor-introduce-swiper-area .swiper-slide img {
    border-radius: 10px;
}


.serve-area {
    position: relative;
}

/*.serve-area:before {*/
/*    content: ' ';*/
/*    height: 100%;*/
/*    width: 100vw;*/
/*    position: absolute;*/
/*    background: url(../images/icon-one-1.png) no-repeat;*/
/*    background-size: 18%;*/
/*    background-position-y: 20%;*/
/*    background-position-x: 18%;*/
/*}*/

.teacher-introduce-area {
    position: relative;
}

.teacher-introduce-area:before {
    top: 10px;
    content: ' ';
    width: 8vw;
    height: 8vw;
    position: absolute;
    background: url("../images/icon-tow.png") no-repeat;
    background-size: 100% 100%;
}

.teacher-introduce-area:after {
    content: ' ';
    right: 0;
    width: 6vw;
    height: 6vw;
    bottom: 2rem;
    position: absolute;
    background: url("../images/icon-three.png") no-repeat;
    background-size: 100% 100%;
}

.dd-p {
    white-space: pre-wrap;
    word-wrap: break-word;
    line-height: 1.5;
}



.serve-area-inner-bg{
    height: 100%;
    width: 450px;
    position: absolute;
    background: url(../images/icon-one-1.png) no-repeat;
    background-size: 450px;
    left: -300px;
}

.serve-area .l-text-wrap{
    width: 120%;
}

@media (max-width: 1025px) {
    .serve-area .l-text-wrap {
        width: 90% !important;
        margin-top:  50% !important;
    }
    .r-image{
        width: 90% !important;
        max-height: max-content !important;
        height: auto !important;
    }
    .serve-area .l-text-wrap p{
        font-size: 16px;
        line-height: 1.8;
    }

    .r-image-en{
        width: 90% !important;
        max-height: max-content !important;
        height: auto !important;
    }

    .serve-area-inner-bg{
        height: 100%;
        width: 450px;
        position: absolute;
        background: url(../images/icon-one-1.png) no-repeat;
        background-size: 350px;
        left: -200px;
    }





}


@media (min-width: 1280px) {
    .teacher-introduce-content p:first-child{
        font-size: 20px;
        margin-bottom: 5px;
    }

    .teacher-introduce-content p:last-child{
        font-size: 16px;
    }






    .main-title {
        font-size: 18px;
    }
    .dd-p{
        font-size: 20px;
        line-height: 1.8 ;
    }


    .serve-area .l-text-wrap{
        margin-top: 1.2rem;
        z-index: 9;
        position: relative;
        padding: 30px 15px;
    }


    .serve-area .l-text-wrap-en{
      width: 125% !important;
    }
    .serve-area .l-text-wrap-en p{
        font-size: 18px;
        line-height: 1.6;
        text-align: justify;
    }
    .serve-area-title{
        font-size: 26px;

    }

    .t-i1s2-text{
        font-size: 18px;
        line-height: 1.7;
    }
}
.r-image{
    max-height: 500px;
}
@media (max-width: 1280px) {
    .teacher-introduce-content p:first-child{
        font-size: 18px;
    }

    .teacher-introduce-content p:last-child {
        font-size: 14px;
    }

    .teacher-introduce-content-mask-inner p:first-child{
        font-size: 20px;
        margin-bottom: 5px;
    }
    .teacher-introduce-content-mask-inner p:first-child {
        font-size: 16px;
    }


    .dd-p{
        font-size: 1.6rem;
        line-height: 3rem;
    }

    .serve-area .l-text-wrap{
        margin-top: 1.2rem;
        z-index: 9;
        position: relative;
        padding: 2rem 1.5rem;
        width: 110%;

    }

    .serve-area .l-text-wrap p{
        font-size: 18px;
        line-height: 1.8;
    }
    .serve-area-title{
        font-size: 1.8rem;
        line-height: 1.2;
    }
    .r-image{
        max-height: 450px;
    }

    .serve-area .l-text-wrap-en{
        /*margin-top: 1.2rem;*/
        /*z-index: 9;*/
        /*position: relative;*/
        /*padding: 30px 30px;*/
        /*width: 121%;*/
    }

    .serve-area .l-text-wrap-en p{
        font-size: 18px;
        line-height: 1.6;
        text-align: justify;
    }
}

@media (min-width: 1280px) {
    .serve-area .l-text-wrap{
        width: 110%;
    }

    .l-text-wrap-en p{
        line-height: 1.5 !important;

    }
    .serve-area .l-text-wrap p{
        font-size: 18px;
        line-height: 2.0;
    }
}

@media (max-width: 768px) {
    .serve-area-title{
        font-size: 22px !important;
    }
}
@media (max-width: 1125px) {
    .serve-area-title{
        font-size: 22px !important;
    }
    .r-image{
        max-height: 400px;
    }

}
@media (max-width: 1024px) {
    .serve-area-title{
        font-size: 22px !important;
    }

}


@media (min-width: 1500px) {


    /*.l-text-wrap-en p{*/
    /*    font-size: 1rem;*/
    /*    line-height:1.5rem;*/
    /*}*/
}





@media (max-width: 768px) {
    .advantage-item:nth-of-type(3) .u-fffaf3-bg {
        padding: 15px !important;
        line-height: 1.8 !important;

    }

    .advantage-item:nth-of-type(4) .u-fffaf3-bg {
        padding: 15px !important;
        line-height: 1.8 !important;
    }

    .u-fffaf3-bg {
        padding: 15px !important;
        line-height: 1.8 !important;
    }

    .dd-p{
        font-size: 1.2rem;
        line-height: 2.2rem;
    }

    .s232-img{
        width: 100% !important;
    }
    .t-i1s2-text{
        padding-bottom: 35px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

}

.advantage-item-tow:nth-child(1) .s232-img{
    border-radius: 0 15px 0 0;
    box-shadow: -15px 15px 0 #d9e1f4;
}
.advantage-item-tow:nth-child(2) .s232-img{
    border-radius: 0  0 15px  0;
    box-shadow: -15px -15px 0 #d9e1f4;
}
.advantage-item-tow:nth-child(3) .s232-img{
    border-radius: 0  0   0 15px;
    box-shadow: -15px -15px 0 #d9e1f4;
}
