@charset "UTF-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);
h1, h2, h3, h4, h5, h6, ul{margin: 0;} /*reset*/
h4{font-size: 22px;}
h5{font-size: 20px;}
h6{font-size: 18px;}
a{ color:#fff;outline: none; /* for Firefox Google Chrome  */behavior:expression(this.onFocus=this.blur()); /* for IE */}
a:hover{color:#f5c4e7;}
body, input, nav ul a, button, textarea, .browser-default{font-family: 'Noto Sans TC';}
body{background-color: #5174ac;color: #fff;}
.logo img, .iphoto img, .footer_logo img, .pgm_img img, .box img{width: 100%;}/*圖片100%*/
.content, nav .nav-wrapper{max-width: 1200px;width: 100%;margin: 0 auto;}
.content{position: relative;}
input, textarea{color:#555;}/*灰字*/
.remark{color: #F44336!important;}/*紅字*/
.lang_select, .download li, .inews_block li span{background-color: #4d609d;}/*藍色*/
.input-field>label, .input_block h6, .collection a.collection-item{color:#ca6faa;}/*紫色*/
.alert{margin: 15px 0;padding: 15px; border: 2px dashed #ae70a199;color: #ae70a1;background-color: #ffffff69;border-radius: 4px;font-size: 16px;}
.alert p {margin: 0 0 10px;}
video {width: 100%;height: auto;}
hr {border: 0; height: 1px;background-image: linear-gradient(to right, rgba(0,0,0,0), rgba(0, 0, 0, 0.32), rgba(0,0,0,0));}
.box .li_disc li{list-style-type: disc!important;margin-left: 20px;}

/**************************************************/

button:focus {background-color: inherit}
i.left {margin-right: 5px;}
i.right{margin-left: 0;}
nav, .btn{ -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.04), 0 3px 1px -2px rgba(0,0,0,0.02), 0 1px 5px 0 rgba(0,0,0,0.2);box-shadow: 0 2px 2px 0 rgba(0,0,0,0.04), 0 3px 1px -2px rgba(0,0,0,0.02), 0 1px 5px 0 rgba(0,0,0,0.2);}
.row{margin: 0 -10px;}
.btn{color: #fff!important;}
.box a{color:#3e8fd0;}
.box a:hover{color:#057cb6;}
.left-align{text-align: left!important;}
.pagination{margin: 20px 0 0;}
.tabs {background-color: #faf6f9;border-bottom: 1px solid #f6b2b5;height: 60px;padding-top: 8px;}
.tabs .tab {line-height: 20px;height: 60px;}
.tabs .tab a, .tabs .tab a:hover, .tabs .tab a.active {height: 60px;margin-top: -10px;padding-top: 10px;}

/**************************************************/

#home .logo{padding-top: 160px;}
#home .kv{height: 700px}
.logo{width: 600px;padding-top: 50px;}
.kv{background: url(../images/bg.jpg) center center;background-size: cover;height: 500px;margin: 0;}
.lang_select{float: right;padding: 10px 15px;border-radius: 20px;position: absolute;right: 0;top: 50%;width: 290px;text-align: center; background-color: #ffffff;color: #555;}
.lang_select a{color:#ca6faa;padding: 0 10px;}/*粉紅字*/
.lang_select a:hover, .box a:hover{color: #96599e;}/*粉紅字*/
.navbar{margin-top: -64px;}
nav{background-color: #9760a382;}
nav ul.left {width: 100%;}
nav ul li {width: 10%;}
nav ul a{font-size: 1.2rem;text-align: center;}
.pinned {position: fixed !important;width: 100%;margin-top: initial;background-color: #9760a3d6;z-index: 100;background: url(../images/bg.jpg) top center;background-size: cover;}

section{margin: 50px 0;}
.btn_more{background-color: #fff;color: #555;padding: 3px 12px;border-radius: 20px;}
.btn_mypage{margin-top: 60px;}
.btn_mypage span{float: left;}

.title{padding-bottom: 20px;position: relative;margin-bottom: 10px;overflow: hidden;}
.title:after {content:"";position: absolute; border: 0;height: 1px;background-image: linear-gradient(to right,  rgb(255, 255, 255), rgba(0,0,0,0));width: 100%;bottom: 12px;}
.title i{font-size: 26px;}

.inews_block{margin: 10px 0;}
.inews_block li{border-bottom: 1px solid #ffffff3b;padding-bottom: 10px;}
.inews_block li{font-size: 18px;margin-bottom: 10px;}
.inews_block li span{font-size: 14px;margin-right: 10px;border-radius: 20px;padding: 3px 8px;}

.ibtn{background-color: #9467aa;text-align: center;height: 100px;font-size: 22px;line-height: 24px; margin-bottom: 20px;border-radius: 4px;border: 2px solid #fff9;vertical-align: middle;}
.ibtn:hover{border-color: #fff;}

.iphoto img{border-radius: 8px;border: 3px solid #fff;}

.iinfo .content{padding: 30px 0;}
.iinfo h6{margin: 0 0 20px 0; text-align: center;line-height:40px;}

.style_block:after { display: block;content: "";height: 30px;border-style: solid;border-color: #fff;border-width: 1px 0 0 0;border-radius: 20px;}

.download{margin: 20px 0 0;}
.download li{color: #ebecfb;border-radius: 20px;padding: 10px 20px;font-size: 16px;width: 46%;float: left;background-color: inherit;border: 1px solid;margin: 10px;}
.download li:hover{background-color: #4d609d9c;}

.footer{background-color: #fff;color: #555;margin-bottom: 0;text-align: center;}
.footer .content{padding: 30px 0;}
.footer_logo{max-width: 180px; margin: 20px auto;}
.footer .logo_block h6, .footer .logo_block2 h6{margin-bottom: 20px;color:#915ea3;}
.copyright{text-align: center;padding: 30px 0;background-image: url(../images/bg.jpg);background-position: 50% 10%;background-size: cover;color: #fff;}

.logo_block2 img{width: 180px;margin: 10px auto;}
.logo_block2 .partner{ display: inline-block;}

/************************************/

.box{background-color: #fff;color: #555; border-radius: 4px;padding: 30px;max-width: 900px;margin: 0 auto 20px;overflow: hidden;background-image: url(../images/box_bg.png);background-size: cover;min-height: 500px;}
.box{box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.22);}
.box_title{margin-bottom: 40px;color: #ae70a1;font-size: 24px;}
.box_icon{max-width: 300px;padding: 20px;}
.input_block{margin-bottom: 20px;overflow: hidden;}
.input_block h6{font-size: 16px;}
.input_block label{margin-right: 20px;}
form .check_box h6{margin-bottom: 10px;}
form .check_box p{margin: 1px 0;}
.radio_title{margin-bottom: 10px;}
#login .box, #reg .box{max-width: 650px;}
.pgm_genre_title{margin: 15px 0 5px!important;}
.pgm_list_icon i{font-size: 17px;color: #d3a0c8;margin: 10px 2px 0;}

/************************************/

/* mypage */
.alert_ul {list-style-type: decimal!important;font-size: 16px;}
.alert_ul li{margin-left: 20px;list-style-type: inherit!important;}
#mypage .collection{margin: 0 0 20px;border: inherit;}
#mypage .collection .collection-item.active {background-color: #ae70a1;color:#fff;}
#mypage .title{padding-left: 10px;}
.input_block p{font-size: 18px;font-weight: 500;color: #555;}
.mypage_left_fix{width: 270px;}
.upload_btn{margin: 20px auto;text-align: center;background-color: #fff;border-radius: 4px;display: table;width: 100%;border: 2px dashed #9E9E9E;min-height: 100px;padding: 20px 0 0 0;}

.btn_100{width: 100%;}
.input_block .pgm_img_box{width: 20%;float: left;padding: 10px;}
.input_block .pgm_img{background-size: cover;background-position: 50%;width: 100%;height: 100px;border: 1px solid #999;}
#mypage table{background-color: #ffffff69;border-radius: 4px;}
.btn_pgm_img_upload{border-radius: 100%;width: 45px;}
.plus_upload{background-color: #26a69a;width: 100px;margin: 20px auto;border-radius: 20px;color: #fff!important;font-size: 16px!important;}
.plus_upload:hover{background-color: #54c4b9;}
.name{font-size: 18px;color: #fa9f19;margin-bottom: 10px;}
.search{margin-bottom: 30px;border: 1px solid #d7d3d3;padding: 10px;border-radius: 4px;}
.search .btn{margin-top: 10px;}

/*LOADING overlayer*/
#block{position: fixed;top: 0;left: 0;height: 100%;width: 100%;background-image: url(../images/loading_overlay.png);background-repeat: repeat;z-index: 9999;visibility: hidden;	/*margin-bottom: -20px;*/}
#fm{position: absolute;height: 120px;width: 140px;margin-top: -60px;margin-left: -70px;left: 50%;top: 50%;text-align: center;font-size: 18px;color: #FFF;z-index: 9999;visibility: hidden;padding-top: 20px;-moz-border-radius: 10px; /* Firefox */-webkit-border-radius: 10px!important;; /* Safari, Chrome */-khtml-border-radius: 10px; /* Konqueror */border-radius: 10px!important; /* Opera 10.50 and later (CSS3 standard) */behavior: url(border-radius.html); /* IE6, IE7, IE8 */background-image: url(../images/loading_overlay_dark.png);background-repeat: repeat;}

.scrollup {width: 40px;height: 40px;position: fixed;bottom: 0px;right: 90px;display: none;text-indent: -9999px;background: url(../images/gotop.png) no-repeat;background-color: #985ca0;}

.fancybox-slide--iframe .fancybox-content {max-width: 1000px!important;}
.fancybox-slide>* {background-color: #fff0!important;padding: 10px!important;}

/**************************************************/

@media screen and (max-width: 960px){
	body, .wrapper{overflow-x: hidden;}
	h4, h5{font-size: 18px;}
	h6{font-size: 16px;}
	nav{position: fixed;top: 0;z-index: 100;}
	section{margin: 20px 0;}
	.mypage_left_fix, .company .right_fix{width: 100%!important;}/* width 100% */
	.row {margin: 0px;}
	.box_title {margin: 10px 0 20px;}
	.logo, #home .logo{max-width: 320px; width: 100%;margin: 0px auto;padding: 70px 10px 0;}
	.kv, #home .kv{height: 380px;}
	.navbar {margin-top: 0;}
	.sidenav-overlay {z-index: 1;}
	.lang_select{float: inherit;width: 270px;margin: 0 auto 10px;position: inherit;overflow: hidden;}
	.download li { font-size: 15px;padding: 10px;float: left;width: 90%;}
	.scrollup{right: 0;}
	.icard{margin-bottom: 30px;overflow: hidden;}
	.inews_block li span{display: table;}
	.footer{text-align: center;}
	.footer .logo_block img{max-width: 180px;margin-bottom: 20px;}
	.col{margin-bottom: 15px;}
	.box{padding: 10px;}
	.content{padding: 0 10px;}
	.input_block .pgm_img{height: 50px;}
	.upload_btn {margin: 10px auto -10px;min-height: 110px;padding: 10px 5px;}
	.fancybox-slide--iframe, .fancybox-slide--iframe .fancybox-content{padding: 10px!important;width: 100%!important;}
	.fancybox-slide>*, .popup_area{width: 100%!important;}

}