#mainWrite .w3-col, #mainWrite .w3-half, #mainWrite .w3-third, .w3-twothird, .w3-threequarter, .w3-quarter {
    float: left;
    width: 100%;
}
@media (min-width: 601px) {
    #mainWrite .w3-col.m6, #mainWrite .w3-half {
        width: 49.99999%;
    }
}
@media (min-width: 1171px) {
    #mainWrite .w3-container {
        max-width: 1600px;
        padding: 0;
        margin: auto;
    }
}
#mainWrite section .w3-row {display: flex;}
#mainWrite section{position: relative;max-width: 1600px;overflow: hidden;}
#mainWrite section>img{width: 100%;}
#mainWrite section .group{position: absolute;}
#mainWrite h3{border: none}
#mainWrite p{text-align: justify;font-family : PingFang, "Microsoft JhengHei", Arial, sans-serif}
.pchide{display: none}
.mhide{display: block}
@media(max-width:1000px){
    .pchide{display: block}
    .mhide{display: none}
}
#mainWrite .w3-container {padding: 0;}
@media (min-width: 992px){
    #mainWrite .w3-container {padding: 0;}
}
@media(max-width:1000px){
    .content>.w3-container{padding: 0;}
}

#section01 h1{top: 20%;right: 7%;color: #fff;}
@media(max-width:1200px){
    #section01 h1{right: 5%;font-size: 25px;}
}
@media(max-width:1000px){
    #section01 h1{position: static;text-align: center;color: #000;margin: 5% 0;font-size: 30px;}
}
@media(max-width:600px){
    #section01 h1{font-size: 20px;}
}

#section02 {padding: 5% 0}
#section02 h1{text-align: center}


#section03 .group{width: 100%;top: 5%;padding: 0 5%}
#section03 .group h1,#section03 .group p{text-align: center}
#section03 .group p{font-size: 18px;}
@media(max-width:1200px){
    #section03 .group h1{font-size: 30px;}
    #section03 .group p{font-size: 15px;}
}
@media(max-width:1000px){
    #section03 .group h1{font-size: 25px;}
}
@media(max-width:600px){
    #section03 .group{top: 1%;padding: 0;}
    #section03 .group h1{font-size: 20px;margin: 0;}
    #section03 .group p{font-size: 12px;margin: 0;}
}

#section04 .group{width: 100%;top: 5%;padding: 0 8%}
#section04 .group h1,#section04 .group p{text-align: center}
#section04 .group h1{color: #ff910f}
#section04 .group p{color: #ffffff;font-size: 18px;}
@media(max-width:1200px){
    #section04 .group h1{font-size: 30px;}
    #section04 .group p{font-size: 15px;}
}
@media(max-width:1000px){
    #section04 .group h1{font-size: 25px;}
}
@media(max-width:600px){
    #section04 .group{top: 0;padding: 0 4%}
    #section04 .group h1{font-size: 20px;}
    #section04 .group p{font-size: 12px;}
}

#section05>.w3-row,#section06>.w3-row,#section07>.w3-row {background-color: #818f9a;color: #fff;display: flex;}
#section05>.w3-row>.w3-half>img,#section06>.w3-row>.w3-half>img,#section07>.w3-row>.w3-half>img{width: 100%;}

@media (max-width: 601px){
    #section05>.w3-row>.w3-half:nth-of-type(2)>.w3-row>.w3-half{width: 50%;}
}

#section05>.w3-row>.w3-half>img{width: 100%;}
#section05>.w3-row>.w3-half:nth-of-type(2){width: 40%;margin: 9% 5% 0;}
@media(max-width:1000px){
    #section05>.w3-row>.w3-half:nth-of-type(2){width: 100%;margin: 0;}
}

#section05>.w3-row>.w3-half:nth-of-type(2)>h2,#section06>.w3-row>.w3-half:nth-of-type(1)>h2,#section07>.w3-row>.w3-half:nth-of-type(2)>h2{font-size: 40px;}
@media(max-width:1200px){
    #section05>.w3-row>.w3-half:nth-of-type(2)>h2,#section06>.w3-row>.w3-half:nth-of-type(1)>h2,#section07>.w3-row>.w3-half:nth-of-type(2)>h2{font-size: 30px;}
}

@media(max-width:1000px){
    #section05>.w3-row>.w3-half:nth-of-type(2)>h2,#section06>.w3-row>.w3-half:nth-of-type(2) h2,#section07>.w3-row>.w3-half:nth-of-type(2)>h2{text-align: center;}
    #section05>.w3-row>.w3-half:nth-of-type(2)>p,#section06>.w3-row>.w3-half:nth-of-type(2) p,#section07>.w3-row>.w3-half:nth-of-type(2)>p{text-align: center;padding: 0 10%}
}
@media(max-width:600px){
    #section05>.w3-row>.w3-half:nth-of-type(2)>h2,#section06>.w3-row>.w3-half:nth-of-type(2) h2,#section07>.w3-row>.w3-half:nth-of-type(2)>h2{font-size: 20px;}
    #section05>.w3-row>.w3-half:nth-of-type(2)>p,#section06>.w3-row>.w3-half:nth-of-type(2) p,#section07>.w3-row>.w3-half:nth-of-type(2)>p{padding: 0 5%}
}
#section05>.w3-row>.w3-half:nth-of-type(2)>p,#section06>.w3-row>.w3-half:nth-of-type(2) p,#section07>.w3-row>.w3-half:nth-of-type(2)>p{font-size: 15px;}
@media(max-width:600px){
    #section05>.w3-row>.w3-half:nth-of-type(2)>p,#section06>.w3-row>.w3-half:nth-of-type(2) p,#section07>.w3-row>.w3-half:nth-of-type(2)>p{font-size: 12px;}
}

#section05>.w3-row>.w3-half:nth-of-type(2)>.w3-row{margin-top: 15%}
@media(max-width:1200px){
    #section05>.w3-row>.w3-half:nth-of-type(2)>.w3-row{margin: 5% 8%}
}
@media (max-width: 601px){
    #section05>.w3-row>.w3-half:nth-of-type(2)>.w3-row{margin: 5% }
}
#section05>.w3-row>.w3-half:nth-of-type(2)>.w3-row>.w3-half>h2{display: inline-block;color: #b7ccdc;font-family : PingFang, "Microsoft JhengHei", Arial, sans-serif}
#section05>.w3-row>.w3-half:nth-of-type(2)>.w3-row>.w3-half>img{vertical-align: top;}
@media(max-width:1200px){
    #section05>.w3-row>.w3-half:nth-of-type(2)>.w3-row>.w3-half>img{width: 40%;}
    #section05>.w3-row>.w3-half:nth-of-type(2)>.w3-row>.w3-half>h2{margin: 0;line-height: 1.2;font-size: 33px;} 
}
@media(max-width:600px){
    #section05>.w3-row>.w3-half:nth-of-type(2)>.w3-row>.w3-half>h2{font-size: 18px;} 
}

#section06>.w3-row>.w3-half:nth-of-type(1){padding: 10% 5% 0}
@media(max-width:1000px){
    #section06>.w3-row>.w3-half:nth-of-type(1){padding: 0}
}

#section07>.w3-row>.w3-half:nth-of-type(2){padding: 9% 8% 0}

@media(max-width:1000px){
    /*#section07>.w3-row>.w3-half:nth-of-type(2){padding: 0 8%}*/
    #section05>.w3-row>.w3-half,#section06>.w3-row>.w3-half,#section07>.w3-row>.w3-half{width: 100%;}
    #section05>.w3-row>.w3-half:nth-of-type(2),#section06>.w3-row>.w3-half:nth-of-type(2),#section07>.w3-row>.w3-half:nth-of-type(2){padding: 8% 0}
}

#section08>.group{width: 100%;top: 15%;}
@media(max-width:600px){
    #section08>.group{top: 3%;}

}
#section08>.group>h1,#section08>.group>p{text-align: center}

#section09>.group{color: #fff;text-align: center;top: 50%;transform: translate(0,-50%);width: 100%;}
@media(max-width:1300px){
    #section09>.group,#section08>.group>h1{font-size: 25px;}
}
@media(max-width:600px){
    #section09>.group,#section08>.group>h1{font-size: 16px;}
    #section08>.group>p{font-size: 12px;}
}
#section10 {padding-top: 5%}
#section10 h1,#section10 h2{text-align: center}
#section10 h1{font-size: 30px;}
#section10 h1:nth-of-type(2){margin: 5% 0;font-size: 35px;}
#section10 h2{font-size: 15px;margin-bottom: 2%}
#section10 .w3-row {background-color: #818f9a;display: flex;}
#section10 .w3-row .w3-col{position: relative;padding: 0;width: 20%;overflow: hidden;}
#section10 .w3-row .w3-col h3{opacity: .5;z-index: 1;transition: .8s ease;-webkit-transition:.3s ease; color: #fff;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);width: 100%;text-align: center;font-family : PingFang, "Microsoft JhengHei", Arial, sans-serif;line-height: 1.2;font-size: 28px;}
#section10 .w3-row .w3-col img{width: 100%;transition: .5s ease;-webkit-transition: .5s ease;}
#section10 .w3-row .w3-col:hover img{transform: scale(1.2,1.2)}
#section10 .w3-row .w3-col:hover h3{opacity: 1}

@media(max-width:1300px){
    #section10 .w3-row .w3-col h3{font-size: 20px;}
}
@media(max-width:1000px){
    #section10 .w3-row .w3-col{width: 33.3%;}
    #section10 .w3-row .w3-col h3{font-size: 18px;}
}
@media(max-width:600px){
    #section10 h1,#section10 h1:nth-of-type(2){font-size: 20px;}
    #section10 .w3-row .w3-col h3{font-size: 13px;}
}
@media(max-width:1000px){
    #section10 .w3-row .w3-col h3{opacity: 1}
}        
#section12 {
    padding-top: 2%;
}

#section12 .w3-row img {
    width: 50%;
    margin-left: 35%
}

@media screen and (min-width:576px) and (max-width:767px) {
    #section12 .w3-row img {
        margin-left: 22%
    }
}

@media screen and (min-width:420px) and (max-width:575px) {
    #section12 .w3-row img {
        margin-left: 22%
    }
}

@media screen and (min-width:320px) and (max-width:419px) {
    #section12 .w3-row img {
        margin-left: 22%
    }
}

#sectiona .w3-row {
    display: flex;
    flex-wrap: wrap
}

#sectiona:not(:first-of-type) {
    padding-top: 5%
}

#sectiona .w3-row .w3-half {
    position: relative;
    overflow: hidden
}

#sectiona .w3-row .w3-half img {
    height: 100%;
    z-index: 1;
    transition: .6s cubic-bezier(0.165, 0.84, 0.44, 1)
}

#sectiona .w3-row .w3-half .mask {
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
    position: absolute;
    z-index: 99;
    top: 90%;
    left: 0;
    height: 100%;
    width: 100%;
    padding-top: 2%;
    transition: .6s cubic-bezier(0.165, 0.84, 0.44, 1)
}

#sectiona .w3-row .w3-half .mask h4 {
    font-size: 1.3rem;
    font-weight: bold
}

#sectiona .w3-row .w3-half .imgWrapper {
    width: 60%;
    margin: 0 auto
}

#sectiona .w3-row .w3-half .imgWrapper img {
    width: 40%
}

#sectiona .w3-row .w3-half ul {
    width: 65%;
    padding: 0;
    margin: 2% auto 0
}

#sectiona .w3-row .w3-half li {
    margin: 1% 0;
    font-size: 1.2rem
}

#sectiona .w3-row .w3-half:last-of-type {
    background-color: #c3f1f1;
    padding: 5% 2%
}

#sectiona .w3-row .w3-half:last-of-type h4 {
    font-size: 2rem
}

#sectiona .w3-row .w3-half:last-of-type span {
    color: #ed7ba0
}

@media(min-width:1000px) {
    #sectiona .w3-row .w3-half:first-of-type:hover .mask {
        top: 0
    }

    #sectiona .w3-row .w3-half:first-of-type:hover img {
        transform: scale(.9, .9)
    }

    #sectiona .w3-row .w3-half:first-of-type:hover .mask h4 {
        top: 50%;
        position: absolute;
        width: 100%;
        font-size: 1.8rem;
        transform: translate(0, -50%);
        padding: 0 5%
    }
}

@media(max-width:1400px) {
    #mainWrite h1 {
        font-size: 2.5rem
    }

    #mainWrite h2 {
        font-size: 2rem
    }

    #sectiona .w3-row .w3-half .mask h4 {
        font-size: 1rem
    }

    #sectiona .w3-row .w3-half ul {
        width: 85%
    }
}

@media(max-width:1200px) {
    #mainWrite h1 {
        font-size: 2rem
    }

    #mainWrite h2 {
        font-size: 1.8rem
    }

    #mainWrite p {
        font-size: 1.2rem
    }

    #section2 .group:nth-child(5) {
        right: 18%;
        font-size: 1.1rem
    }

    #sectiona .w3-row .w3-half .mask {
        top: 83%;
        padding-top: 1%
    }

    #sectiona .w3-row .w3-half .mask h4 {
        font-size: 1.2rem
    }

    .thisfooter .w3-container {
        width: 72%
    }

    #sectiona .w3-row .w3-half li,
    #section4 .w3-row .w3-half li,
    #section5 .w3-row .w3-half li {
        font-size: 1rem
    }

    #sectiona .w3-row .w3-half:last-of-type h4 {
        font-size: 1.5rem
    }
}

@media(max-width:999px) {
    #mainWrite h1 {
        font-size: 2.5rem
    }

    #mainWrite h2 {
        font-size: 2rem
    }

    #mainWrite p {
        font-size: 1.1rem
    }

    #sectiona .w3-row .w3-half {
        width: 100%
    }

    #sectiona .w3-row .w3-half .mask h4 {
        font-size: 1.3rem
    }

    #sectiona .w3-row .w3-half .mask {
        top: 90%
    }

    #sectiona .w3-row .w3-half:last-of-type h4 {
        font-size: 2rem
    }

    #sectiona .w3-row .w3-half li {
        font-size: 1.5rem
    }

    #sectiona .w3-row .w3-half ul {
        width: 75%
    }
}

@media(max-width:750px) {
    #mainWrite p {
        font-size: 1.1rem
    }

    #sectiona .w3-row .w3-half .mask {
        top: 83%
    }

    #sectiona .w3-row .w3-half ul {
        width: 80%
    }

    #sectiona .w3-row .w3-half li {
        font-size: 1.3rem
    }
}

@media(max-width:650px) {
    #section1 .group h1 {
        font-size: 2rem
    }

    #mainWrite p {
        font-size: 1.0rem
    }

    #sectiona .w3-row .w3-half .mask {
        top: 83%
    }

    #sectiona .w3-row .w3-half ul {
        width: 90%
    }

    #sectiona .w3-row .w3-half:last-of-type h4 {
        font-size: 1.5rem
    }
}

@media(max-width:450px) {
    #section1 .group h1 {
        font-size: 1.5rem
    }

    #sectiona .w3-row .w3-half ul {
        width: 90%
    }

    #sectiona .w3-row .w3-half .mask h4 {
        font-size: 1rem
    }

    #sectiona .w3-row .w3-half li {
        font-size: 1rem
    }
}

.pchide {
    display: none
}

.mhide {
    display: block
}

@media(max-width:999px) {
    .pchide {
        display: block
    }

    .mhide {
        display: none
    }
}

#sectionb .group {
    position: absolute;
    top: 78%;
    right: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%
}

#sectionb .group {
    top: 8%;
    padding: 0px 13% 0%;
    left: 1%
}

#sectionb .group {
    top: 16%;
    padding: 0px 30% 0%;
    left: 12%
}

@media(max-width:999px) {
    #sectionb .group {
        top: 10%;
        padding: 0px 17% 0%;
        left: 1%
    }
}

@media(max-width:450px) {
    #sectionb .group {
        top: 3%;
        padding: 0px 6% 0%
    }
}

@media screen and (min-width:420px) and (max-width:575px) {
    #sectionb .group {
        top: 3%;
        padding: 0px 0% 0%
    }
}

@media screen and (min-width:320px) and (max-width:419px) {
    #sectionb .group {
        top: 3%;
        padding: 0px 9% 0%
    }

    #sectionb .group h2 {
        font-size: 1.5rem
    }

    #sectionb .group P {
        font-size: 0.8rem
    }
}
