

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: '微軟正黑體';
  color: #000;
}
*:not(.fa) {
  font-family: '微軟正黑體'!important;
}

a:hover {
  text-decoration: none!important;
}

html{color: #000;}

img {
  max-width: 100%;
}

p {
  line-height: 32px;
  letter-spacing: 1px;
  font-size: 19px;
}

body::-webkit-scrollbar {
  width: 5px;
}

body::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey;
}

body::-webkit-scrollbar-thumb {
  background: #3da3cc;
}

body::-webkit-scrollbar-thumb:hover {
  background: #3da3cc;
}


body {
  overflow-x: hidden;
  width: 100%;
  background-color: #fff;
}

@keyframes arrow-move1 {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(-8px);
  }
  100% {
    transform: translateX(0);
  }
}

@keyframes image-move1 {
  0% {
    transform: translateY(0);
  }
  33% {
    transform: translateY(-15px);
  }
  66% {
    transform: translateY(15px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes image-move2 {
  0% {
    transform: translateY(0);
  }
  33% {
    transform: translateY(15px);
  }
  66% {
    transform: translateY(-15px);
  }
  100% {
    transform: translateY(0);
  }
}

    .img_container{overflow: hidden;}
    .lang_active{border-bottom: 3px solid #222b65;}

    #logo{width: 40%;}
    header{padding: 20px 5%;display: flex;justify-content: space-between;border-bottom: 3px solid #3da3cc;align-items: center;}
    header .lang_box img{vertical-align: top;width: 30px;}
    header .lang_box a{color: #222b65;display: inline-block;font-size: 20px;font-weight: 800;margin-left: 8px;}

    #index h1,#index h2.index_h2{color: #00514E;font-size: 32px;line-height: 48px;text-align: center;font-weight: 800;margin: 60px auto 40px;}
    #index h2.index_h2{font-size: 24px;font-weight: 800;text-align: left;line-height: 36px;}
    .support_h2{color: #3da3cc;font-size: 25px;line-height: 40px;text-align: center;font-weight: 800;margin: 40px auto 30px;}
    .text_div{line-height: 32px;font-size: 18px;}
    .reg_now{display: block;width: 500px;max-width: 100%;padding: 20px 60px;text-align: center;color: #fff;background-color: #3da3cc;border-radius: 50px;margin: 30px auto;font-size: 32px;font-weight: 800;border:1px solid #3da3cc;transition: 0.5s ease;}
    .reg_now:hover{background-color: #fff;color: #3da3cc;}

    #index .white_bg{padding: 40px 0 80px;}
    .white_bg{background-color: #fff;}
    .linear_blue_bg{background: rgb(226,244,253);background: linear-gradient(180deg, rgba(226,244,253,1) 0%, rgba(255,255,255,1) 100%);}

    #index h2.index_h2{color: #006361;font-size: 28px;}
    .support_org{text-align: left;}
    /*
    .support_org_gallery{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;}
    .support_org_gallery img{max-height: 50px;margin-right: 30px;margin-bottom: 40px;}*/
    .support_org_gallery{margin: 40px auto;}

    footer{padding: 30px 5%;display: flex;border-top: 3px solid #3da3cc;justify-content: space-between;margin-top: 40px;}
    footer a{color: #000;}
    footer .footer_left img{width: 30px;margin-right: 10px;display: inline-block;}
    footer .footer_left span:nth-child(2){margin-left: 20px;}
    footer .footer_right img{width: 70px;display: block;margin: 0 auto;}
    footer .footer_right{text-align: right;}
    footer .footer_right p{margin-top: 0;font-size: 14px;}
    footer .footer_right a{text-align: center;font-size: 14px;padding: 0 6px;}
    footer .footer_right .uk-grid{justify-content: end;}



    .form_h2{color: #006361;font-size: 24px;font-weight: 800;margin: 30px 0;}
    .form_block .form_name_div input:first-child{width: 40%;margin-right: 2%;}
    .form_block .form_name_div input:last-child{width: 57%;}
    .form_block{padding: 10px 0;}
    .form_block input,.form_select select{padding: 15px 20px;}
    .form_block input::placeholder,.form_select select{color: #ccc;font-size: 16px;}
    .form_block table{border-collapse:collapse;border-color: #c0c0c0;width: 100%;}
    .form_block table th, .form_block table td{padding: 4px 8px;text-align: center;}
    .form_block table .checkbox_box{left: 50%;top: 50%;transform: translate(-50%,-50%);}

    .form_time label{margin-top: 0!important;}
    .form_div p{line-height: 28px;margin-top: 20px;margin-bottom: 0;}
    .remark{line-height: 22px;font-size: 16px;margin: 0;margin-top:0!important;}

    input[type=radio]{zoom:1.8;vertical-align: sub;position: relative;margin-right: 10px;}
    .radio_text{display: block;}
    .form_text input[type=text],.form_text input[type=email]{border-radius: 8px;border:1px solid #c0c0c0;margin: 8px 0;}
    .form_phone label,.form_text label{display: block;}
    .form_text input,.form_select select{width: 100%;}
    .form_phone input,.form_select select{border-radius: 8px;border:1px solid #c0c0c0;}
    .form_phone input.phone_zip{width: 120px;margin-right: 20px;}
    .form_phone input.phone{width: 40%;}

    .form_agree label{margin-top: 30px;display: flex;}
    .form_agree label input{top: 5px;}
    .form_div .reg_now{background-color: #c0c0c0;border-color: #c0c0c0;}
    .form_div .reg_now:hover{color: #c0c0c0;background-color: transparent;}
    .form_select select {
        -moz-appearance:none; /* Firefox */
        -webkit-appearance:none; /* Safari and Chrome */
        appearance:none;
        position: relative;

        background-image:
            linear-gradient(45deg, transparent 50%, gray 50%),
            linear-gradient(135deg, gray 50%, transparent 50%);
          background-position:
            calc(100% - 20px) calc(1em + 10px),
            calc(100% - 15px) calc(1em + 10px),
            calc(100% - 2.5em) 0.5em;
          background-size:
            5px 5px,
            5px 5px,
            1px 1.5em;
          background-repeat: no-repeat;
          color: #000!important;

    }


    .checkbox_text{position: relative;padding-left: 50px;}
    .checkbox_text input{opacity: 0;width: 1px;height: 1px;}
    .checkbox_box{position: absolute;left: 0;top: 5px;content: '';width: 25px;height: 25px;border:1px solid #ccc;border-radius: 50%;}

    .checkbox_text input:checked + .checkbox_box{border-color: #0075ff;}
    .checkbox_text input:checked + .checkbox_box:after{position: absolute;left: 4px;top: 4px;width: 15px;height: 15px;background-color: #0075ff;content: '';border-radius: 50%;}









    @media(max-width: 1200px){

    }

    @media(max-width: 960px){
      footer{display: block;}
      footer .footer_right{text-align: left;}
      a:not(.reg_now){word-break: break-all;}
      .reg_now{font-size: 22px;}
    }
    @media screen and (min-width:640px) and (max-width:959px){
    }
    @media(max-width: 480px){
      footer .footer_left > span{display: block;margin: 10px 0;}
      footer .footer_left span:nth-child(2){margin-left: 0;}
      .form_phone input,.form_block .form_name_div input{width: 100%!important;margin: 6px 0;}
      .text_div{font-size: 16px;}
      #index h1, #index h2.index_h2{font-size: 26px;line-height: 40px;margin: 30px auto;}

    }




@keyframes fly_slide_img {
  0% {
    opacity: 0;
  }
  80% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fly_slide_left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(300%);
  }
}


.width80 {
  width: 80vw;
  margin: 0 auto;
}


.img_overmask {
  position: relative;
}

.img_overmask .overmask_block {
  position: absolute;
  top: 0;
  left: 0;
  width: 0%;
  height: 100%;
  background-image: linear-gradient(120deg, #c3e361 0%, #c3e361ff 100%);
  animation: block-appear 1s ease forwards;
}

.img_overmask .overmask_block_blue {
  position: absolute;
  top: 0;
  left: 0;
  width: 0%;
  height: 100%;
  background-image: linear-gradient(120deg, #89f7fe 0%, #66a6ff 100%);
  animation: block-appear 1s ease forwards;
}




.img_overmask .img_block {
  opacity: 0;
  animation: image-appear 0.0001s linear forwards;
  animation-delay: 0.5s;
}

.img_overmask img {
  opacity: 0;
  animation: image-appear 1s linear forwards;
}
.img_overmask .hidden {
  opacity: 0;
  animation: image-appear 1s linear forwards;
}
.img_overmask .c1 {
  animation-delay: 0.4s;
}
.img_overmask .c2 {
  animation-delay: 0.6s;
}
.img_overmask .c3 {
  animation-delay: 0.6s;
}


