@import url('/css/font-awesome.min.css');
@import url('/css/fontawesome-all.css');
@import url('/css/font-awesome-ie7.min.css');
@import url('/css/font-awesome-ie7.css');
@import url('/css/font-awesome.css');
@import url('https://fonts.googleapis.com/css?family=Carrois+Gothic+SC|Hind|Julius+Sans+One|Noto+Sans+TC|Quicksand&display=swap');

body{margin:0;border:0;width:100%;color:#274385;font-size:14px;line-height:170%}
div,h1,h2,h3,h4,hr,p,form,label,input,textarea,img,span{text-align:left;vertical-align:middle;margin:0px;padding:0px;word-wrap:normal;word-break:normal;border-width:0;font-family:'Noto Sans TC',sans-serif,"Lucida Grande","Arial","Arial Narrow";transition:all linear 0.5s;-moz-transition:all linear 0.5s;-ms-transition:all linear 0.5s;-o-transition:all linear 0.5s;-webkit-transition:all linear 0.5s}
hr{noshade:noshade}
th{font-weight:normal}
ul{list-style:none;margin:0;padding:0;overflow:hidden}
li{list-style:none}
a,a:hover{text-decoration:none;cursor:pointer}
img{max-width:100%}
.wrapper >h1, .wrapper .h1{display:none;}
section{width:100%;margin:0 auto;overflow:hidden}
header{position:fixed;width:100%;background:#fff;top:0;z-index:999;box-shadow:0 0 15px 0px #0a0a0a2e}
header a{color:#000}
header section{padding:28px 0 0}
#top-nav{position:absolute;width:100%;height:42px;right:0;top:0;background:#1d805f;text-align:right}
#top-nav ul{margin-top:8px;margin-right:12vw}
#top-nav ul li{display:inline-block}
header #top-nav a.btn{padding:5px 20px;margin-right:5px;color:#ffffff}
header #top-nav a.btn:hover{filter:brightness(110%)}
header #top-nav a.join{background:#f19825}
header #top-nav a.red{background:#0000003b;color:#ffffff57}
header #top-nav a.register{background:#2cbe8d}
#top-nav ul li a{color:#fff}
/*#cis{float:left;width:15%;margin-top:30px;/*margin-left:10vw}*/
#cis{position: absolute;left: 30px;top: 70%;transform: translateY(-50%);width: 15%;max-width: 160px;}
.nav-func{display:none}
#main-menu{float:right;overflow:hidden;margin-top:15px;width:85%}
#main-menu li{float:left;padding:20px 24px;position:relative}
#main-menu li a{font-size:15px;font-weight:bolder;display:block;z-index:2;position:relative;transition:all ease .3s}
#main-menu li a:hover{font-weight:900;color:#00a05d}
#main-menu li a:after{position:absolute;top:4px;right:-26px;width:1px;height:15px;background:#cacaca;content:""}
#main-menu li a:before{content:'';height:6px;background-color:#00000000;position:absolute;width:30%;left:0;right:0;bottom:-20px;margin:0 auto;transition:width ease .3s;pointer-events:none}
#main-menu li:hover a:before{background-color:#00a05d;width:100%}
#main-menu li span{display:none}
#main-menu li.last{margin-right:20px}
footer{padding-top:50px;background:#232426}
footer section >div{display:inline-block;overflow:hidden;width:32%}
footer section .one #footer-cis{text-align:center}
footer section .one #community{overflow:hidden;text-align:center;margin-top:20px}
footer section .one #community a{display:inline-block;color:#fff;font-size:30px;background:#3b5998;border-radius:50%;width:50px;height:50px;line-height:45px;text-align:center;margin:0 2px}
footer section .one #community a:nth-child(2){background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);box-shadow:0px 3px 10px rgba(0,0,0,.25)}
footer section .one #community a:nth-child(3){background:#00bb00}
footer section .one #community a:nth-child(4){background:#f4b459}
footer section .two .border{padding:0 60px}
footer section .two .border p{font-size:12px;text-align:center;background:#f19826;padding:8px 30px;margin:13px 5px}
footer section .two .border p:nth-child(2){background:#1e7f5f}
footer section .two .border p:hover{opacity:0.9}
footer section .two .border p a{color:rgba(255,255,255,0.95);font-size:14px;padding:8px 36px}
footer section .three ul{text-align:center}
footer section .three li{display:inline-block;width:100%;margin:3px 0}
footer section .three li a{color:#9c9c9c;font-size:14px}
footer section .four #footer-qrcode2{width:150px;margin:0 auto}
footer section .four #cellphone{text-align:center}
footer section .four .leftborder #cellphone li{margin-top:15px}
footer .footer2{border-top:1px solid #333333;padding:20px 0 2px;margin-top:30px}
footer .maq > div{float:none;width:100%;padding:15px 0;font-size:12px !important;color:#636363}
#webSeo .seo > div{-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none}
footer .footer2 .info{text-align:center;font-size:12px;color:#c5c5c5;width:100%;float:none}
footer .footer2 .info a{color:#c5c5c5}
footer .footer2 .info >p{color:#6e6e6e;display:inline-block;text-align:center;margin-right:10px}
footer .footer2 .footernav{width:100%;text-align:center}
#footer_left{position:fixed;left: 0;bottom: 3%;width: 250px;z-index: 999;}
#footer_right{position:fixed;right: 0;bottom: 0;z-index: 999;width: 250px;}
.phoneWrap{display:none}
#gotop{position:fixed;right:20px;bottom:30px;font-size:40px;color:#fff;text-shadow:0 0 10px #000;z-index:9}
#indexBox{width:100%;height:100%;background:rgba(0,0,0,0.4);position:fixed;z-index:9999999999999999;top:0;text-align:center}
#indexBox #ask-wrap{margin:0 auto;display:table;position:relative;float:left;top:50%;left:50%;width:auto;text-align:center;transform:translate(-50%,-50%)}
#indexBox #ask-wrap a{display:block}
#indexBox #ask-wrap #close-wrap{text-align:center;position:relative;width:270px;background:rgba(255,255,255,0.95);height:150px;border-radius:20px;color:#000}
#indexBox #ask-wrap #close-wrap .ter .text p{font-size:18px;padding:15px}
#indexBox #ask-wrap #close-wrap .ter .text{position:absolute;width:100%;height:calc(100% - 51px);overflow:hidden}
#indexBox #ask-wrap #close-wrap .ter .gogogog{position:absolute;width:100%;height:50px;bottom:0;border-top:1px solid #d7d7d7}
#indexBox #ask-wrap #close-wrap .ter .gogogog a{color:#163e86;display:inline-block;width:calc(50% - 4px);text-align:center;line-height:50px;font-size:20px;font-weight:bold}
#lineBox{display:none;width:100%;height:100%;background:rgba(0,0,0,0.4);position:fixed;z-index:9999999999999999;top:0;text-align:center}
#lineBox #ask-wrap{margin:0 auto;display:table;position:relative;float:left;top:50%;left:50%;width:auto;text-align:center;transform:translate(-50%,-50%);width:270px;background:rgba(255,255,255,0.95);height:180px;border-radius:20px;color:#000}
#lineBox #ask-wrap a{display:block;font-size:40px}
#lineBox #ask-wrap .text p{font-size:18px;margin:10px 20px;text-align:center;line-height:27px}
#lineBox #ask-wrap .text ul{margin:0;padding:0;text-align:center}
#lineBox #ask-wrap .text ul li{display:inline-block;margin:0 10px}
#lineBox #ask-wrap .text{position:absolute;width:100%;height:calc(100% - 51px);overflow:hidden}
#lineBox #ask-wrap .gogogog{position:absolute;width:100%;height:50px;bottom:0;border-top:1px solid #d7d7d7;text-align:center}
#lineBox #ask-wrap .gogogog a{color:#163e86;display:inline-block;line-height:50px;font-size:20px;font-weight:bold;text-decoration:none}
#linejoin{position:fixed;top:10%;z-index:99999999999}
#linejoin .text a{display:none}
#linejoin .gogogog{position:absolute;top:50%;margin-left:180px}
#linejoin .gogogog a{text-decoration:none;background:#f39800;padding:5px;color:#fff;border-bottom-right-radius:10px;border-top-right-radius:10px}
#linejoin .gogogog #clickclose{display:block}
#linejoin .gogogog #clickopen{display:none;padding:15px}
.Floating_menu_A{position:relative;z-index:999999;left:17px;padding:12px;background-color:rgba(127,127,127,0.8);border-radius:50px;overflow:hidden;transition:all 0.6s;transition-timing-function:linear;height:36px;width:36px;box-shadow:0 0 0 2px rgba(255,255,255,0.15);animation-name:animeBoxLight;animation-duration:4s;animation-iteration-count:infinite}
.Floating_menu_A:hover{width:180px;animation-name:none}
.Floating_menu_A ul,.Floating_menu_A li{margin:inherit;line-height:inherit}
@keyframes box-shadow:0 0 0 2px rgba(255,255,255,0.15);animation-name:animeBoxLight;animation-duration:4s;animation-iteration-count:infinite;{0%{box-shadow:0 0 0 2px rgba(255,255,255,0.15)}30%{box-shadow:0 0 0 30px rgba(255,255,255,0.0)}100%{box-shadow:0 0 0 30px rgba(255,255,255,0.0)}}
.menu_list{opacity:100}
.menu_list li{list-style-type:none;text-align:center;margin-left:15px;float:left;cursor:pointer}
.menu_list li a{text-decoration:none}
.menu_list i{font-size:2em;padding:2px 0}
.menu_list li:hover i{color:white;background:linear-gradient(#fff,#fff);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.pic_logo_530{width:36px;margin-bottom:15px;float:left}
.pic_logo_530 img{width:100%;height:auto}
.anime_A_top,.anime_B_top{position:absolute;z-index:99999;left:-25px;transform-origin:left center}
#linejoin .anime_A_top{top:222px;transform:scale(0.3)}
#linejoin .anime_B_top{top:335px;transform:scale(0.55)}
.fb_color{background:-webkit-linear-gradient(#3b5998,#2b4170);background:-o-linear-gradient(#3b5998,#2b4170);background:linear-gradient(#3b5998,#2b4170);color:rgba(66,103,178,1.0);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.line_color{color:rgba(0,185,0,1)}
.instagram_color{background:-webkit-linear-gradient(bottom left,rgb(240,148,51) 0%,rgb(230,104,60) 25%,rgb(220,39,67) 50%,rgb(204,35,102) 75%,rgb(188,24,136) 100%);background:-o-linear-gradient(bottom left,rgb(240,148,51) 0%,rgb(230,104,60) 25%,rgb(220,39,67) 50%,rgb(204,35,102) 75%,rgb(188,24,136) 100%);background:linear-gradient(to top right,rgb(240,148,51) 0%,rgb(230,104,60) 25%,rgb(220,39,67) 50%,rgb(204,35,102) 75%,rgb(188,24,136) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.animeArea_A{background-image:url("/lightEffect_A_02.png");width:calc(1920px / 4);height:calc(1920px / 4);animation:lightAnime_X 0.5s steps(4) infinite,lightAnime_Y 1.5s steps(3) infinite}
@keyframes lightAnime_X{0%{background-position-x:0}100%{background-position-x:-1920px}}
@keyframes lightAnime_Y{0%{background-position-y:0}100%{background-position-y:-1440px}}
.animeArea_B{background-image:url("/lightEffect_A_01.png");width:calc(1280px / 5);height:calc(1536px / 6);animation:lightAnime_B_X 0.5s steps(5) infinite,lightAnime_B_Y 3.0s steps(6) infinite}
@keyframes lightAnime_B_X{0%{background-position-x:0}100%{background-position-x:-1280px}}
@keyframes lightAnime_B_Y{0%{background-position-y:0}100%{background-position-y:-1536px}}

@media screen and (max-width:1440px){
    #footer_left{width: 140px;}
    #footer_right{width: 140px;}
}
@media screen and (max-width:1024px){
    #linejoin{display:none}
	#lineBox{display:block}
    #main-menu li{padding: 20px ;}
}
@media screen and (max-width:1280px){
    #main-menu{width: calc(100%/7 - );}
    #cis{margin-left: 0;}
    section{width: 95%;}
    #main-menu li a{font-size:16px}
    footer section .one{width:100%;margin-bottom:30px}
    footer section >div{width:49%}
    footer section .two .border{padding:0px 80px}
}
@media screen and (max-width:980px){
    header section{padding:15px 0;overflow:visible;height:58px}
    /*#cis{width:165px;padding:12px 0;margin-left:1vw}*/
    #cis{width:142px;padding:12px 0;margin: 4px 5px;}
    .nav-func{display:block;position:absolute;right:50px;top:59px;font-size:28px;z-index:99;color:#1e7f5f}
    #main-menu{position:absolute;top:89px;z-index:9999;left:0;background:rgba(255,255,255,0.95);width:100%}
    #main-menu li{width:60%;margin:0 auto;text-align:center;float:none;padding:20px;border-bottom:1px solid #dedede}
    #main-menu li:hover:after{display:none}
    #main-menu li:hover a:before{bottom:-10px}
    #main-menu li a{margin-left:0;padding:0 20px}
    #main-menu li a:after{display:none}
    footer section >div{width:49%}
    footer section .four .leftborder{border-left:0;padding-left:0}
}
@media screen and (max-width:768px){
    #footer_left, #footer_right{display:none;}
    footer section >div{width:100%;margin-bottom:7px}
    footer section .two .border{padding:0px 150px}
    footer section .four{display:none}
}
@media screen and (max-width:640px){
    #top-nav{display:none}
    header section{height:40px;width:100%}
    header section:after{content:url(/images/32/ku-logo.jpg);position: absolute;right: 16%;top: 38px;zoom: 45%;}
    /*#cis{width:130px;float:none;margin-top:0;padding:7px 0;margin-left:6vw}  0428改tu logo 換css*/
    #cis{width:120px;float:none;padding:7px 0;margin: -15px 12px;} 
    #cis h1{text-align:center}
    #cis h1 img{height:40px}
    .nav-func{top:23px;right:5%}
    #main-menu{top:55px}
    footer{margin-bottom:36px}
    footer section .four .leftborder >div{margin:0 1%;width:48%}
    footer section .four .leftborder #cellphone{position:fixed;left:0;bottom:0;margin:0;width:100%}
    footer section .four .leftborder #cellphone ul{text-align:center}
    footer section .four .leftborder #cellphone li{display:inline-block;margin-top:0;margin-bottom:10px}
    footer section .two .border{padding:0px 80px}
    .phoneWrap{display:block;position:fixed;bottom:0;left:0;width:100%;z-index:9}
    .phoneWrap ul li{float:left;width:50%;background:rgb(243,156,18);text-align:center;font-size:18px;padding:12px 0}
    .phoneWrap ul li a{color:#fff;padding:10px 15px}
    .phoneWrap ul li:last-child{background: #02a1d6;}
    .phoneWrap ul li:nth-child(2){display:none;}
}
@media screen and (max-width:480px){
    footer section >div{width:100%}
    footer section .two .border{border-right:0;padding:0 40px}
    footer section .two .border p{text-align:center}
    footer section .three{margin-top:30px}
    footer section .four .leftborder #footer-qrcode,footer section .four .leftborder #footer-qrcode2{display:none}
    footer .maq > div{padding:5px 0}
}
@media screen and (max-width:380px){
    #cis{width:110px;float:none;padding:7px 0;margin: -15px -15px;} 
}