@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;700;900&family=Noto+Serif+TC:wght@400;500;700;900&family=Roboto:wght@100;500&display=swap");

.s1 {
    margin-bottom: 50px
}

.s2 {
    margin-bottom: 54px
}

    .s2 .stitle {
        text-align: center
    }

    .s2 .imgwrap {
        width: 64%;
        margin: 0 auto
    }

@media (max-width:767px) {
    .s2 {
        margin-bottom: 50px
    }

        .s2 .imgwrap {
            width: 100%
        }
}

.s3 {
    margin-bottom: 90px
}

    .s3 .scontent {
        margin-bottom: 47px
    }

    .s3 .imgwrap {
        overflow-x: auto;
        margin-bottom: 66px
    }

        .s3 .imgwrap img {
            width: 1168px;
            max-width: initial
        }

    .s3 .stitle {
        margin-bottom: 1px;
        text-align: center
    }

    .s3 .form {
        overflow-x: auto
    }

        .s3 .form .form-detail {
            width: 750px;
            margin: 0 auto
        }

        .s3 .form .note {
            line-height: 30px;
            text-align: right
        }

        .s3 .form .form-content ul, .s3 .form .form-title ul {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            line-height: 30px
        }

            .s3 .form .form-content ul .l1, .s3 .form .form-title ul .l1 {
                width: 270px
            }

            .s3 .form .form-content ul .l2, .s3 .form .form-content ul .l3, .s3 .form .form-content ul .l4, .s3 .form .form-title ul .l2, .s3 .form .form-title ul .l3, .s3 .form .form-title ul .l4, .s3 .form .form-title ul .l5, .s3 .form .form-content ul .l5 {
                width: 160px;
                text-align: center
            }

        .s3 .form .form-title {
            background-color: #204390;
            color: white;
            text-align: center;
            border-bottom: 2px solid white
        }

            .s3 .form .form-title li {
                padding: 6px 0
            }

                .s3 .form .form-title li:not(:last-child) {
                    border-right: 2px solid white
                }

        .s3 .form .form-content {
            text-align: center;
            border-bottom: 2px solid white;
            color: black
        }

            .s3 .form .form-content li {
                padding: 6px 0
            }

                .s3 .form .form-content li:not(:last-child) {
                    border-right: 2px solid white
                }

            .s3 .form .form-content:nth-child(2n) {
                background-color: rgba(32,67,144,0.15)
            }

            .s3 .form .form-content:nth-child(odd) {
                background-color: rgba(32,67,144,0.3)
            }

@media (max-width:767px) {
    .s3 {
        margin-bottom: 50px
    }

        .s3 .imgwrap {
            margin-bottom: 30px
        }
}

.s4 {
    margin-bottom: 90px
}

    .s4 .info {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

        .s4 .info .form {
            width: 100%;
            /*order: 1;*/
        }
        .s4 .info .scontent {
            width: 53%;
            /*order: 2;*/
            margin-top: 2.5%;
        }

    .s4 .form {
        overflow-x: auto
    }

        .s4 .form .form-detail {
            width: 494px
        }

        .s4 .form .form-content ul, .s4 .form .form-title ul {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            line-height: 30px
        }

            .s4 .form .form-content ul .l1, .s4 .form .form-title ul .l1 {
                width: 226px
            }

            .s4 .form .form-content ul .l2, .s4 .form .form-content ul .l3, .s4 .form .form-title ul .l2, .s4 .form .form-title ul .l3 {
                width: 134px
            }

        .s4 .form .form-title {
            background-color: #ed701c;
            color: white;
            text-align: center;
            border-bottom: 2px solid white
        }

            .s4 .form .form-title li {
                padding: 6px 0
            }

                .s4 .form .form-title li:not(:last-child) {
                    border-right: 2px solid white
                }

        .s4 .form .form-content {
            text-align: center;
            border-bottom: 2px solid white;
            color: black
        }

            .s4 .form .form-content li {
                padding: 6px 0;
                background-color: rgba(237,112,28,0.3)
            }

                .s4 .form .form-content li:not(:last-child) {
                    border-right: 2px solid white
                }

            .s4 .form .form-content:last-child li {
                background-color: rgba(142,142,142,0.3)
            }

@media (max-width:1200px) {
    .s4 .info {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column-reverse;
    }

        .s4 .info .form {
            width: 100%;
            margin-bottom: 20px;
        }

        .s4 .info .scontent {
            width: 100%;
            margin-top:0;
        }
}

@media (max-width:767px) {
    .s4 {
        margin-bottom: 20px
    }
}

.s5 {
    margin-bottom: 78px
}

    .s5 .info1 {
        position: relative
    }

        .s5 .info1 ul {
            position: absolute;
            top: 20px
        }

            .s5 .info1 ul li {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                margin-bottom: 20px;
                font-size: 0.875rem;
                line-height: 24px
            }

                .s5 .info1 ul li img {
                    margin-right: 20px
                }

        .s5 .info1 .imgwrap {
            text-align: right
        }

    .s5 .info2 {
        margin-top: 50px;
        margin-bottom: 90px
    }

        .s5 .info2 ul {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center
        }

        .s5 .info2 li {
            position: relative;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center
        }

            .s5 .info2 li:first-child {
                width: 38.5%;
                margin-right: 60px
            }

                .s5 .info2 li:first-child .wrap {
                    border: 3px solid #40a81c;
                }

                .s5 .info2 li:first-child .f22 {
                    color: #40a81c
                }

                .s5 .info2 li:first-child .filter-color {
                    /* filter >>>  https://codepen.io/sosuke/pen/Pjoqqp  */
                    filter: invert(58%) sepia(30%) saturate(7045%) hue-rotate(70deg) brightness(98%) contrast(78%);
                }

            .s5 .info2 li:nth-child(2) {
                width: 25%;
                margin-right: 60px
            }

                .s5 .info2 li:nth-child(2) .wrap {
                    border: 3px solid #ed701c
                }

                .s5 .info2 li:nth-child(2) .f22 {
                    color: #ed701c
                }

                .s5 .info2 li:nth-child(2) .filter-color {
                    /* filter >>>  https://codepen.io/sosuke/pen/Pjoqqp  */
                    filter: invert(44%) sepia(93%) saturate(834%) hue-rotate(350deg) brightness(96%) contrast(92%);
                }

            .s5 .info2 li:nth-child(3) {
                width: 25%
            }

                .s5 .info2 li:nth-child(3) .wrap {
                    border: 3px solid #ff190e
                }

                .s5 .info2 li:nth-child(3) .f22 {
                    color: #ff190e
                }

        .s5 .info2 .wrap {
            border-radius: 70px;
            padding: 10px 20px 10px 10px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center
        }

        .s5 .info2 .circle {
            min-width: 113px;
            height: 113px;
            -webkit-box-shadow: 1.5px 5.8px 12.2px 5.8px rgba(0,121,153,0.14);
            box-shadow: 1.5px 5.8px 12.2px 5.8px rgba(0,121,153,0.14);
            border-radius: 50%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            text-align: center;
            color: black;
            margin-right: 25px
        }

            .s5 .info2 .circle .f22 {
                font-family: "Roboto",sans-serif;
                font-weight: normal
            }

        .s5 .info2 .txt {
            color: black
        }

        .s5 .info2 .arrow-wrap {
            width: 70px;
            height: 70px;
            position: absolute;
            right: -64px
        }

    .s5 .info3 {
        margin-top: 25px;
        margin-bottom: 90px
    }

        .s5 .info3 ul {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center
        }

        .s5 .info3 li {
            position: relative;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center
        }

            .s5 .info3 li:first-child {
                width: 25.5%
            }

                .s5 .info3 li:first-child .circle {
                    border: 1px solid #40a81c;
                }

                .s5 .info3 li:first-child .f22 {
                    color: #40a81c
                }

            .s5 .info3 li:nth-child(2) {
                width: 38%
            }

                .s5 .info3 li:nth-child(2) .circle {
                    border: 1px solid #ed701c
                }

                .s5 .info3 li:nth-child(2) .f22 {
                    color: #ed701c
                }

            .s5 .info3 li:nth-child(3) {
                width: 36.5%
            }

                .s5 .info3 li:nth-child(3) .circle {
                    border: 1px solid #ff190e
                }

                .s5 .info3 li:nth-child(3) .f22 {
                    color: #ff190e
                }

        .s5 .info3 .circle {
            min-width: 113px;
            height: 113px;
            -webkit-box-shadow: 1.5px 5.8px 12.2px 5.8px rgba(0,121,153,0.14);
            box-shadow: 1.5px 5.8px 12.2px 5.8px rgba(0,121,153,0.14);
            border-radius: 50%;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            text-align: center;
            color: black;
            margin-right: 25px
        }

            .s5 .info3 .circle .f22 {
                font-family: "Roboto",sans-serif;
                font-weight: normal
            }

        .s5 .info3 .f18 div {
            line-height: 30px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex
        }

            .s5 .info3 .f18 div span:first-child {
                margin-right: 5px
            }

    .s5 .info4 {
        margin-top: 32px;
        margin-bottom: 50px
    }

        .s5 .info4 ul {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            justify-content: space-between
        }

            .s5 .info4 ul li {
                /*width: 24%;*/
                text-align: center
            }

                .s5 .info4 ul li .f18 {
                    color: black;
                    margin-top: 10px
                }

    .s5 .info5 {
        margin-top: 44px;
        margin-bottom: 34px;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

        .s5 .info5 div:first-child {
            width: 51%
        }

        .s5 .info5 div:last-child {
            width: 49%;
            margin-top: -70px;
        }

@media (max-width:991px) {
    .s5 .info1 {
        margin-bottom: 50px
    }

        .s5 .info1 ul {
            position: relative;
            top: 0
        }

    .s5 .info2 {
        margin-bottom: 50px
    }

        .s5 .info2 ul {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column
        }

        .s5 .info2 li:first-child {
            width: 100%;
            margin-right: 0px;
            margin-bottom: 40px
        }

        .s5 .info2 li:nth-child(2) {
            width: 100%;
            margin-right: 0px;
            margin-bottom: 40px
        }

        .s5 .info2 li:nth-child(3) {
            width: 100%
        }

        .s5 .info2 .arrow-wrap {
            right: 50%;
            bottom: -54px;
            -webkit-transform: rotate(90deg);
            transform: rotate(90deg)
        }

    .s5 .info3 {
        margin-bottom: 50px
    }

        .s5 .info3 ul {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
            flex-direction: column
        }

        .s5 .info3 li:first-child {
            width: 100%;
            margin-bottom: 20px
        }

        .s5 .info3 li:nth-child(2) {
            width: 100%;
            margin-bottom: 20px
        }

        .s5 .info3 li:nth-child(3) {
            width: 100%
        }
}

@media (max-width:767px) {
    .s5 {
        margin-bottom: 50px
    }

        .s5 .info4 {
            margin-bottom: 0;
            overflow-x: auto;
        }

            .s5 .info4 ul {
                -ms-flex-wrap: wrap;
                flex-wrap: wrap;
                min-width: 432px;
            }

                .s5 .info4 ul li {
                    /*width: 49%;*/
                    margin-bottom: 10px
                }

        .s5 .info5 {
            margin-bottom: 20px;
            margin-top: 20px;
            flex-flow: column;
        }


            .s5 .info5 div:first-child {
                width: 100%;
            }

            .s5 .info5 div:last-child {
                width: 100%;
                margin-top: 0px;
            }
}

.s6 {
    margin-bottom: 52px
}

    .s6 .scontent {
        margin-bottom: 41px
    }

    .s6 .stitle {
        margin-bottom: 0
    }

    .s6 .info4 {
        margin-bottom: 50px;
    }

        .s6 .info4 ul {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            justify-content: space-between;
            /*flex-wrap: wrap;*/
        }

            .s6 .info4 ul li {
                /*width: 24%;*/
                text-align: center
            }

                .s6 .info4 ul li .f18 {
                    color: black;
                    margin-top: 10px
                }

    .s6 .form {
        overflow-x: auto
    }

        .s6 .form .form-detail {
            width: 1149px
        }

        .s6 .form .bnote {
            -webkit-box-pack: end;
            -ms-flex-pack: end;
            justify-content: flex-end
        }

        .s6 .form .note {
            margin-top: 5px
        }

        .s6 .form .form-content ul, .s6 .form .form-title ul, .s6 .form .li-group {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            line-height: 30px
        }

            .s6 .form .form-content ul .l-name, .s6 .form .form-title ul .l-name, .s6 .form .li-group .l-name {
                width: 245px;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center
            }

                .s6 .form .form-content ul .l-name .ln-1, .s6 .form .form-title ul .l-name .ln-1, .s6 .form .li-group .l-name .ln-1 {
                    width: 116px;
                    background-color: #204390;
                    color: white;
                    -ms-flex-item-align: stretch;
                    -ms-grid-row-align: stretch;
                    align-self: stretch;
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                    -ms-flex-align: center;
                    align-items: center;
                    -webkit-box-pack: center;
                    -ms-flex-pack: center;
                    justify-content: center
                }

                .s6 .form .form-content ul .l-name .ln-2, .s6 .form .form-title ul .l-name .ln-2, .s6 .form .li-group .l-name .ln-2 {
                    color: black;
                    width: 101px
                }

                    .s6 .form .form-content ul .l-name .ln-2 div:first-child, .s6 .form .form-title ul .l-name .ln-2 div:first-child, .s6 .form .li-group .l-name .ln-2 div:first-child {
                        background-color: #a7a7a7;
                        padding: 9px 0
                    }

                    .s6 .form .form-content ul .l-name .ln-2 div:nth-child(2), .s6 .form .form-title ul .l-name .ln-2 div:nth-child(2), .s6 .form .li-group .l-name .ln-2 div:nth-child(2) {
                        background-color: #f69679;
                        padding: 9px 0
                    }

            .s6 .form .form-content ul .l1, .s6 .form .form-content ul .l3, .s6 .form .form-title ul .l1, .s6 .form .form-title ul .l3, .s6 .form .li-group .l1, .s6 .form .li-group .l3 {
                width: 91px
            }

            .s6 .form .form-content ul .l2, .s6 .form .form-title ul .l2, .s6 .form .li-group .l2 {
                width: 76px
            }

            .s6 .form .form-content ul .l4, .s6 .form .form-content ul .l5, .s6 .form .form-content ul .l6, .s6 .form .form-content ul .l7, .s6 .form .form-content ul .l8, .s6 .form .form-content ul .l9, .s6 .form .form-content ul .l10, .s6 .form .form-title ul .l4, .s6 .form .form-title ul .l5, .s6 .form .form-title ul .l6, .s6 .form .form-title ul .l7, .s6 .form .form-title ul .l8, .s6 .form .form-title ul .l9, .s6 .form .form-title ul .l10, .s6 .form .li-group .l4, .s6 .form .li-group .l5, .s6 .form .li-group .l6, .s6 .form .li-group .l7, .s6 .form .li-group .l8, .s6 .form .li-group .l9, .s6 .form .li-group .l10 {
                width: 112px
            }

            .s6 .form .form-content ul .l1-9, .s6 .form .form-title ul .l1-9, .s6 .form .li-group .l1-9 {
                width: 930px
            }

        .s6 .form .form-title {
            background-color: #204390;
            color: white;
            border-bottom: 2px solid white;
            text-align: center
        }

            .s6 .form .form-title li {
                padding: 4px 0;
                -ms-flex-item-align: stretch;
                -ms-grid-row-align: stretch;
                align-self: stretch;
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center
            }

                .s6 .form .form-title li:not(:last-child) {
                    border-right: 2px solid white
                }

            .s6 .form .form-title .l-name {
                background: linear-gradient(197deg,transparent 49.5%,white 49.5%,white 50.5%,transparent 50.5%);
                background-color: #1b3265;
                position: relative
            }

                .s6 .form .form-title .l-name span:first-child {
                    position: absolute;
                    left: 20px;
                    bottom: 10px
                }

                .s6 .form .form-title .l-name span:nth-child(2) {
                    position: absolute;
                    right: 20px;
                    top: 10px
                }

        .s6 .form .form-content {
            color: black;
            text-align: center;
            border-bottom: 2px solid white
        }

            .s6 .form .form-content li:not(:last-child) {
                border-right: 2px solid white
            }

            .s6 .form .form-content .l1-9 div {
                padding: 4px 0
            }

            .s6 .form .form-content .l1-9 .line {
                width: 19px;
                height: 3px;
                display: inline-block;
                background-color: black
            }

            .s6 .form .form-content .l1-9 .li-group:first-child {
                background-color: rgba(167,167,167,0.1);
                border-bottom: 2px solid white
            }

                .s6 .form .form-content .l1-9 .li-group:first-child div:not(:last-child) {
                    border-right: 2px solid white
                }

            .s6 .form .form-content .l1-9 .li-group:nth-child(2n) {
                background-color: rgba(246,150,121,0.1);
                color: #ff204f
            }

    .s6 .dis-flex {
        display: flex;
        justify-content: left;
    }

    .s6 .info4 table {
        width: 100%;
        text-align: center;
    }

        .s6 .info4 table td {
            padding: 10px;
        }

@media (max-width:767px) {
    .s6 {
        margin-bottom: 50px
    }
}

.s7 {
    margin-bottom: 84px
}

    .s7 .btitle {
        margin-bottom: 50px
    }

    .s7 .picwrap {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .s7 .imgwrap {
        width: 49%
    }

@media (max-width:767px) {
    .s7 {
        margin-bottom: 50px
    }

        .s7 .btitle {
            margin-bottom: 32px
        }
}

.s8 {
    margin-bottom: 114px
}

    .s8 .info {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

        .s8 .info .imgwrap {
            width: 54%
        }

    .s8 .form {
        overflow-x: auto
    }

        .s8 .form .form-detail {
            width: 494px
        }

        .s8 .form .form-content ul, .s8 .form .form-title ul {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            line-height: 30px
        }

            .s8 .form .form-content ul .l1, .s8 .form .form-title ul .l1 {
                width: 226px
            }

            .s8 .form .form-content ul .l2, .s8 .form .form-content ul .l3, .s8 .form .form-title ul .l2, .s8 .form .form-title ul .l3 {
                width: 134px;
                text-align: center
            }

        .s8 .form .stitle {
            margin-bottom: 30px
        }

        .s8 .form .form-title {
            background-color: #ed701c;
            color: white;
            text-align: center;
            border-bottom: 2px solid white
        }

            .s8 .form .form-title li {
                padding: 6px 0
            }

                .s8 .form .form-title li:not(:last-child) {
                    border-right: 2px solid white
                }

        .s8 .form .form-content {
            text-align: center;
            border-bottom: 2px solid white;
            color: black
        }

            .s8 .form .form-content li {
                padding: 6px 0;
                background-color: rgba(237,112,28,0.3)
            }

                .s8 .form .form-content li:not(:last-child) {
                    border-right: 2px solid white
                }

            .s8 .form .form-content:last-child li {
                background-color: rgba(142,142,142,0.3)
            }

    .s8 .imgwrap {
        text-align: center
    }

@media (max-width:991px) {
    .s8 .info {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .s8 .form {
        margin-bottom: 20px
    }
}

@media (max-width:767px) {
    .s8 {
        margin-bottom: 50px
    }

        .s8 .info .imgwrap {
            width: 100%
        }

        .s8 .info .form {
            width: 100%
        }
}

.s9 {
    margin-bottom: 125px
}

    .s9 .stitle {
        margin-bottom: 50px
    }

    .s9 ul li {
        position: relative;
        margin-bottom: 50px
    }

        .s9 ul li:first-child .f16 {
            background: url(../image/04society/c_circle01.png) top 0px left 0/contain no-repeat
        }

        .s9 ul li:first-child .txt {
            background-color: #e6e6e6
        }

        .s9 ul li:first-child .dotlist:before {
            background-color: #3e6592
        }

        .s9 ul li:nth-child(2) .f16 {
            background: url(../image/04society/c_circle02.png) top 0px left 0/contain no-repeat
        }

        .s9 ul li:nth-child(2) .txt {
            background-color: #cbf2fa
        }

        .s9 ul li:nth-child(2) .dotlist:before {
            background-color: #16809f
        }

        .s9 ul li:nth-child(3) .f16 {
            background: url(../image/04society/c_circle03.png) top 0px left 0/contain no-repeat
        }

        .s9 ul li:nth-child(3) .txt {
            background-color: #cdffe7
        }

        .s9 ul li:nth-child(3) .dotlist:before {
            background-color: #239f7d
        }

        .s9 ul li:nth-child(4) .f16 {
            background: url(../image/04society/c_circle04.png) top 0px left 0/contain no-repeat
        }

        .s9 ul li:nth-child(4) .txt {
            background-color: #ffe8de
        }

        .s9 ul li:nth-child(4) .dotlist:before {
            background-color: #cf7159
        }

        .s9 ul li:nth-child(5) .f16 {
            background: url(../image/04society/c_circle05.png) top 0px left 0/contain no-repeat
        }

        .s9 ul li:nth-child(5) .txt {
            background-color: #ffeb8b
        }

        .s9 ul li:nth-child(5) .dotlist:before {
            background-color: #e78122
        }

        .s9 ul li.line1 .f16 {
            padding: 60px 65px 0 20px
        }

        .s9 ul li.line2 .f16 {
            padding: 47px 65px 0 20px
        }

        .s9 ul li.line3 .f16 {
            padding: 35px 65px 0 15px
        }

    .s9 ul .f16 {
        color: black;
        width: 200px;
        height: 200px;
        text-align: center;
        position: absolute;
        top: -10px;
        white-space: nowrap
    }

    .s9 ul .txt {
        min-height: 116px;
        color: black;
        border-radius: 70px;
        padding: 15px 120px 15px 200px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    .s9 .top {
        margin-top: 8px;
    }

@media (max-width:1366px) {
    .s9 ul .txt {
        padding: 15px 30px 15px 200px
    }
}

@media (max-width:991px) {
    .s9 ul .f16 {
        top: 50%;
        -webkit-transform: translateY(-44%);
        transform: translateY(-44%)
    }
}

@media (max-width:767px) {
    .s9 {
        margin-bottom: 50px
    }

        .s9 .stitle {
            margin-bottom: 80px
        }

        .s9 ul li {
            margin-bottom: 80px
        }

        .s9 ul .f16 {
            top: -65px;
            -webkit-transform: translateY(0);
            transform: translateY(0)
        }

        .s9 ul .txt {
            border-radius: 50px;
            padding: 90px 30px 30px
        }
}

.s10 {
    margin-bottom: 145px
}

    .s10 .imgwrap {
        overflow-x: auto
    }

        .s10 .imgwrap img {
            width: 1168px;
            max-width: initial
        }

@media (max-width:767px) {
    .s10 {
        margin-bottom: 100px
    }
}

.s11 {
    margin-bottom: 65px
}

    .s11 .imgwrap {
        overflow-x: auto
    }

        .s11 .imgwrap img {
            width: 1168px;
            max-width: initial
        }

    .s11 .s11table {
        width: 48%;
    }

@media (max-width:767px) {
    .s11 {
        margin-bottom: 100px
    }

        .s11 .s11table {
            border-collapse: collapse;
            border-spacing: 0;
        }
    /*.paddingtop-170{
        padding-top:170px !important;
    }*/
}

.s11 .dis-flex {
    display: flex;
    justify-content: space-between;
}

.s11 .w50 {
    width: 50%;
}

.s11 .content {
    font-size: 16px;
}

.s11 .left {
    font-size: 16px;
    padding: 2% 3%;
    /*padding-top:11%;*/
}

    .s11 .left .titleLeft {
        text-align: center;
        background-color: #ffc000;
        color: black;
        padding: 15px 0;
        text-align: center;
        font-weight: 500;
        border-radius: 12px 12px 0 0;
    }

    .s11 .left .content2 {
        padding: 20px;
        border: 6px solid #ffc000;
    }

        .s11 .left .content2 .left2 {
            margin-right: 10px;
            margin-top: 20px;
        }

            .s11 .left .content2 .left2 .title2 {
                border-block-end: solid #ffc000;
                margin-bottom: 20px;
                font-size: 18px;
            }

                .s11 .left .content2 .left2 .title2 .text {
                    padding: 5px;
                    background-color: #fbe5d6;
                    font-weight: bolder;
                }

        .s11 .left .content2 .text {
            margin-top: 20px;
            line-height: 36px;
        }


.s11 .right {
    padding: 15px;
}

    .s11 .right td {
        padding: 5px;
    }

.s11 .twoword {
    margin-left: 33px;
}

.d-flex {
    display: flex;
}

.s11 .fourbox > div {
    width: 50%;
    padding: 3%;
}

.s11 .fourbox span {
    font-weight: bolder;
    font-size: 20px;
}

.s12 {
    margin-bottom: 84px;
}

.marginLR40 {
    margin: 0 40px;
}

.text-center {
    text-align: center;
}

.clickshine {
    color: #FFC000 !important;
}

.s13 > .abgne_tab > ul:first-child {
    width: 34%;
    margin: auto;
}

@media (max-width:991px) {
    .s13 > .abgne_tab > ul:first-child {
        width: 85%;
    }
}
.s16{
    margin-bottom:90px;
}
    .s16 span {
        color: #1a3c76;
        font-size: large;
        font-weight: 500;
    }
.s16 .d-flex {
    justify-content: space-between;
}

    .s16 .d-flex>  div {
        width: 32%;
    }


@media (max-width:991px) {
    .s16 .d-flex {
        justify-content: space-between;
        flex-direction:column;
    }

        .s16 .d-flex>  div{
            width: 100% !important;
        }
        .s16 .d-flex > div .imgwrap
       {
            justify-self: center;
        }

}
.s17 .d-flex {
    justify-content: space-evenly;
}
.s17{
    margin-bottom:90px;
}