.in-main{
	width:100%;
	height:440px;
	position:relative;
	overflow:hidden}
	
.in-main h2{
	position: absolute;
	width:100%;
	display:block;
	text-align:center;
	font-size:6.86em;
	top:270px;
	z-index:2;
	text-shadow:0 0 10px rgba(0,0,0,0.8)
	}	
			
@media screen and (max-width: 990px) {
.in-main{
	height:250px;
 	}
	
.in-main h2{
	top:134px;
	font-size:5em;
 	}	
 	}
	
@media screen and (max-width: 420px) {
.in-main{
	height:170px;
 	}
	
.in-main h2{
	top:100px;
	font-size:3em;
 	}	
 	}	
	
.in-main .in-main-bg{
	width:100%;
	height:100%;
	background-position:center bottom;
	background-size:cover;
	background-repeat:no-repeat;
    position: absolute;
	-webkit-transform:scale(1);transform:scale(1);
    left: 0;
    top: 0;
    z-index: 1;
}
	
 


/*main 文字縮放效果*/	
	
.zoomOut-opt{
	-webkit-animation-name:zoomOut-opt;
	        animation-name:zoomOut-opt;
-webkit-animation-duration:1s ;
	    animation-duration:1s;
  	}


@-webkit-keyframes zoomOut-opt{
	  0%{ transform:scale(4); opacity:0; }
	  60%{ transform:scale(4); opacity:0}
	  90%{ transform:scale(0.9);}
	100%{ transform:scale(1); opacity:1}
	}
@keyframes zoomOut-opt{
	  0%{ transform:scale(4); opacity:0}
	  60%{ transform:scale(4); opacity:0}
	  90%{ transform:scale(0.9);}
	100%{ transform:scale(1); opacity:1}	
	}


/*main 背景縮放效果*/
.zoomOut1{
	-webkit-animation-name:zoomOut1;
	        animation-name:zoomOut1;
-webkit-animation-duration:10s ;
	    animation-duration:10s;
	}	
			
@-webkit-keyframes zoomOut1{
	0%{-webkit-transform:scale(1.2);transform:scale(1.2); }
	100%{-webkit-transform:scale(1);transform:scale(1); }
	}	
@keyframes zoomOut1{
	0%{-webkit-transform:scale(1.2);transform:scale(1.2)}
	100%{-webkit-transform:scale(1);transform:scale(1)}
	}

/* web-add*/

.web_add{
	min-height:40px;
	background-color:#f2f2f2;
	 }
	
.web_add .add{
	width:calc(100% - 100px);
	float:left;
	font-size:1.3em;
	color:#808080;
	}

.web_add .add a{
	display:inline-block;
	padding-right:20px;
	background:url(../images/inside/webadd-div.png) right center no-repeat;
	background-size:auto 40px;
	height:40px;
	line-height:40px;
	color:#808080;
	margin-right:7px;
  	}
.web_add .add a.home:before{
	content:'';
	display:inline-block;
	width:19px;
	height:17px;
	margin-right:7px;
	background:url(../images/inside/webadd-home.png) center no-repeat;
	background-size:contain;
	vertical-align: middle;
    margin-top: -2px;
 	}
	

	
.web_add .add a:hover, 
.web_add .add a:focus{
	color:#F60 !important}	
 
.web_add .back-btn{
	font-size:1.4em;
	float:right;
	display:inline-block;
	padding:6px 17px;
	background-color:#fff;
	color:#999999;
	line-height:1;
	vertical-align:middle;
	border-radius:15px;
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	margin-top:7px}	
	
.web_add .back-btn:before{
	display:inline-block;
	width:19px;
	height:14px;
	content:'';
	background:url(../images/inside/webadd-back.png) left center no-repeat;
	background-size:contain !important;
	vertical-align:middle}
	
.web_add .back-btn:hover, .web_add .back-btn:focus{
	color:#fff;
	background-color:#333 !important;
	outline:none}
	
.web_add .back-btn:hover:before, .web_add .back-btn:focus:before{
	background:url(../images/inside/webadd-back-on.png) left center no-repeat}	
	
@media screen and (max-width: 420px) {

.web_add .add{
	width:calc(100% - 40px);
	}
.web_add .add a.home:before{
	display:none
	}
.web_add .back-btn{
	padding:6px 8px;
	font-size:0}
	
			
	}
	
/*in-data 白底區*/

.in-data{
	padding:60px 0}	
						
@media screen and (max-width: 768px) {
.in-data{
	padding:40px 0}	
		
	}
	
@media screen and (max-width: 420px) {
.in-data{
	padding:30px 0}		
	}	
	
.in-data aside{
	display:block;
	width:240px;
	float:left}	
	
.in-data main{
	display:block;
	width:calc(100% - 240px);
	float:left;
	box-sizing:border-box;
	padding-left:5.2%}
	
.in-data aside .title{
	display:block;
	padding:38px 20px;
 	position:relative;
	overflow:hidden;
	margin-bottom:5px
	}


.in-data aside .title:before{
	content:'';
	display:block;
	position:absolute;
	width:164px;
	height:100%;
	left:0; top:0;
	background:url(../images/inside/snav-head-bglight.png) right center no-repeat;
	background-size:100% 100%;
	-webkit-animation-name:light_ef;
	        animation-name:light_ef;
-webkit-animation-duration:3s ;
	    animation-duration:3s;}
	
	
.light_ef{/*亮光移動特效*/
	-webkit-animation-name:light_ef;
	        animation-name:light_ef;
-webkit-animation-duration:3s ;
	    animation-duration:3s;
	}
 
@-webkit-keyframes light_ef{
	  0%{ left:-164px;}
	  60%{ left:15px; }
	  90%{ left:0; }
	100%{ transform:scale(1);left:0; }
	}
@keyframes light_ef{
	  0%{ left:-164px;}
	  60%{ left:15px; }
	  90%{ left:0; }
	100%{ transform:scale(1);left:0; }	
	}	
	
	
/*aside*/

.in-data aside nav{}	
.in-data aside nav > ul  >  li{
	margin-bottom:5px;
	display:block}
		
.in-data aside nav > ul  >  li > ul{/*abour*/
    transform:scale(1,0);
	transition:all 0.5s;
	transform-origin: center top;
	height:0;
	transition-duration:0s}
	
.in-data aside nav > ul  >  li.open > ul{/*abour 第2層開啟*/
	transform:scale(1,1);
	transition-duration:0.3s;
	height:auto;
	}
				
.in-data aside nav > ul > li > a{
	display:block;
	padding:18px 20px;
	color:#666;
	font-size:2em;
	line-height:1.2;
	position:relative;
	background-color:#f2f2f2}
	
.in-data aside nav > ul > li > a:after{
	display:block;
	content:'';
	position:absolute;
	right:11px;
	width:8px;
	height:12px;
	background-image:url(../images/inside/smenu-ar.png);
	background-position:right;
	background-repeat:no-repeat;
	background-size:contain;
	top:50%;
	margin-top:-6px;}
	
.in-data aside nav > ul.about_sm > li > a:before,
.in-data aside nav > ul.about_sm > li > a:after{
	display:block;
	content:'';
	position:absolute;
	right:10px;
	width:14px;
	height:2px;
	background-color:#b3b3b3;
 	top:50%;
	margin-top:-0.5px;
	transition:all 0.5s
	}
.in-data aside nav > ul.about_sm > li > a:before,
.in-data aside nav > ul.about_sm > li > a:after{}

.in-data aside nav > ul.about_sm > li > a.on:before,
.in-data aside nav > ul.about_sm > li > a.on:after{
	background-color:#fff}
	
.in-data aside nav > ul.about_sm > li > a:before{
	transform:rotate(90deg)}	
	
.in-data aside nav > ul.about_sm > li.open > a:before{
	transform:rotate(0deg)}		

.in-data aside nav > ul > li > a:hover, 
.in-data aside nav > ul > li > a:focus{
	background-color:#666;
	color:#fff;
	font-weight:bold
		}
	
.in-data aside nav > ul > li > a.on:after, 
.in-data aside nav > ul > li > a:hover:after, 
.in-data aside nav > ul > li > a:focus:after{
	background-image:url(../images/inside/smenu-ar-on.png);
	-webkit-animation-name:snavar;
	        animation-name:snavar;
-webkit-animation-duration:0.8s ;
	    animation-duration:0.8s;}
		
.about_sm li a:after, .about_sm li a:before{
	-webkit-animation-name: none !important;
	        animation-name: none !important;}	
						
.about_sm li a:hover:after, 
.about_sm li a:hover:before,
.about_sm li a:focus:after, 
.about_sm li a:focus:before
{
	background-color:#fff !important}	
			
.in-data aside nav > ul > li > a.on, 
.in-data aside nav > ul > li.on > a{
	background-color:#65c8d0 !important;
	color:#fff !important}
	
.in-data aside nav > ul > li.open > a{
	background-color:#fff;
	border:1px solid #ccc;
	color:#333;
	font-weight:bold}
	
.in-data aside nav > ul > li.on > ul{
	transform:scale(1,1);
	height:auto;transition-delay:0.3s;animation-delay:0.3s;
	transition:all 0.3s;
	transition-duration:0.3s}
		
.in-data aside nav > ul > li.on.close > ul{
	transform:scale(1,0);
	height:0;
	transition-delay:0s;animation-delay:0s;
	transition-duration:0s}/*再次點擊關閉*/	

/* 開始 沒有.on.close 必須點擊才有 若點擊產生.open.close 則原本的期他 .on 關
   但是 同時只能有一個 li 有 .close.open
*/	
	

	
.in-data aside nav > ul > li.open > a:before,
.in-data aside nav > ul > li.open > a:after{
	background-color:#333}	
 
.in-data aside nav > ul > li.open > a:hover:before,
.in-data aside nav > ul > li.open > a:hover:after,
.in-data aside nav > ul > li.open > a:focus:before,
.in-data aside nav > ul > li.open > a:focus:after
	{background-color:#333 !important}	 



.in-data aside nav > ul > li.open a:hover,
.in-data aside nav > ul > li.open a:focus{
	color:#167db6;
	}

 
.in-data aside nav > ul > li.on > a:before{
	transform:rotate(0deg);
	background-color:#fff !important}
.in-data aside nav > ul > li.on > a:after{
	background-color:#fff !important}		
.in-data aside nav > ul > li.on.close > a:before{
	transform:rotate(90deg)}
	
.in-data aside nav > ul > li.on.close.open > a:before,
.in-data aside nav > ul > li.on.close.open > a:after{
	background-color:#fff !important}		
		
@-webkit-keyframes snavar{
	  0%{ right:11px}
	  50%{ right:5px; }
	100%{ right:11px }
	}
@keyframes snavar{
	  0%{ right:11px}
	  50%{ right:5px; }
	100%{ right:11px }
	}			

/* SNAV */
@media screen and (min-width: 991px){
	.in-data aside .snav_btn{
	display:none}
}
.in-data aside .title h2{font-size:3.1em;}	
@media screen and (max-width: 990px) {/*no js*/
#SNAV nav{
	display:block;
	overflow:hidden}
#SNAV, main{
	width:100%;
	float:none;
	}
.in-data main{
 	width:100%;
 	padding-left:0}	
	
#SNAV{
	margin-bottom:25px}	
	
.in-data aside .title{
    padding: 15px 20px;
    margin-bottom: 5px;
	position:relative;
}
.in-data aside .title h2{font-size:2em;}

.in-data aside .snav_btn{
	position:absolute;
	width:100%;
	height:100%;
	left:0;
	top:0;
	cursor:pointer;
	z-index:3;
	font-size:0}

.in-data aside .snav_btn:after{
	content:'';
	display:block;
 	position:absolute;
	right:15px;
	width:20px;
	height:20px;
	top:50%;
	margin-top:-10px;
	background: url(../images/inside/smenu-ar-on.png) center no-repeat;
	background-size:contain;
  	transition:all 0.5s;
	}
	
.in-data aside .snav_btn:after	{
	transform:rotate(-90deg);}
		
.in-data aside.close .snav_btn:after	{
	transform:rotate(90deg);}	
	

	

.in-data aside > nav > ul > li > a{
	padding: 15px 20px;}


		
.in-data aside.close > nav{
	height:0}
	
.in-data aside > nav{
	height:auto
	}	
.in-data aside.close > nav > ul{
	display:block;
	transform:scale(1,0);
	transition:all 0.3s;
	transform-origin:50% 0%;}
		
.in-data aside > nav > ul{
	transform:scale(1,1);transition:all 0.3s;}	
	
ul.list-box > li:hover, ul.list-box > li:active{
	transform:scale(0.98);
	transition:all 0.3s}			 
}

/*smenu 2層*/
.about_sm   a:hover{
	cursor:pointer
	} 
	
.about_sm > .on > a:hover{
	cursor: pointer
	} 	
.about_sm > li > ul{
	background-color:#999;}  
	
.about_sm > li > ul > li > a{
	color:#fff !important;
	font-size:1.7em;
	padding:13px 23px;
	padding-left:40px;
	display:block
 	}
	
.about_sm > li > ul > li > a.on{}
	
.about_sm > li > ul > li{
	border-bottom:1px dashed #ccc;
 	}
.about_sm > li > ul > li:last-child{
	border-bottom: none;
 	}	
	

.about_sm > li > ul > li > a.on{
	background-color:#1a1a1a;
	font-weight:bold;
	position:relative;}	
.about_sm > li > ul > li > a:hover, 
.about_sm > li > ul > li > a:focus{
	background-color:#888;
	font-weight:bold;
	position:relative;
 	}	
.about_sm > li > ul > li > a:after,
.about_sm > li > ul > li > a.on:after{
	content:'';
	display:block;
	width:7px;
	height:12px;
	position:absolute;
	right:30px;
	top:50%;
	margin-top:-6px;
	background: url(../images/inside/smenu-ar-on.png) center no-repeat;
	background-color:transparent !important;
	background-size:contain;
	opacity:0;
	transition:all 0.5s
	
	}		
.about_sm > li > ul > li > a:hover:after, 
.about_sm > li > ul > li > a:focus:after,
.about_sm > li > ul > li > a.on:hover:after, 
.about_sm > li > ul > li > a.on:focus:after
	{
	right:10px;	background-color:transparent !important;
	opacity:1
	}
.about_sm > li > ul > li > a.on:after{
	right:10px;	background-color:transparent !important;
	opacity:1
	}	
	
.in-data aside nav > ul > li.open > a:hover:before,
.in-data aside nav > ul > li.open > a:hover:after,
.in-data aside nav > ul > li.open > a:focus:before,
.in-data aside nav > ul > li.open > a:focus:after
	{background-color:#333}	
	
.about_sm > li > ul > li.on > a:before, 
.about_sm > li > ul > li.on > a:after,
.about_sm > li > ul > li.on > a:hover:before, 
.about_sm > li > ul > li.on > a:hover:after,
.about_sm > li > ul > li.on > a:focus:before, 
.about_sm > li > ul > li.on > a:focus:after

	{
	background-color:#fff !important;
	cursor:pointer }	
	

			
/**/

.in-tit-box{
	position:relative;
 	border-bottom:4px solid #999;
	margin-bottom:35px;}
		
 .in-tit-box form{
	 float:right;
 	 display:block}	

 .in-tit-box h2{
	 font-size:3.4em;
	 font-family:'微软雅黑';
	font-weight:bold;
	color:#666666;
	display:block;
	margin-bottom:15PX;
	float:left;
	line-height:1.3}	
	
.in-tit-box .list-search .KEYBOX{
	display:inline-block;
	vertical-align:TOP;
	 margin-bottom:15PX;}
	 	

.in-tit-box .list-search #listkeyword{
	width:150px;
	height:30px;
	background-color:#f3f3f3;
	border:1px #eeeeee solid;
	vertical-align:top; letter-spacing:0;
	margin:0;
	margin-right:-8px;
	padding:0 10px;
	line-height:30px;
	color:#666;
	font-size:1.4em;
	display:inline-block;
	font-family:"微軟正黑體", Arial;
	}	
	
.in-tit-box .list-search .se3{
	height:30px;
	border:1px solid #ccc;
	line-height:30px;
	font-family:"微軟正黑體", Arial;
	font-size:1.4em;
	width:136px;
	position:relative;
	display: inline-block;
    padding: 0 5px;
	background:url(../images/inside/select-icon-v.png) 95% center no-repeat;
	background-size:6.5px auto;
	 margin-bottom:15PX;}
	 
.in-tit-box .list-search .se3.datepicker{
	background:none;
	padding-left:7px;
	width:136px}	 
.in-tit-box .list-search .se3-1{
	background:none}	
.in-tit-box .list-search .se3:after{
	content:'';
	display:block;
	width:6.6px;
	height:6.6px;
	background:url(../images/inside/select-icon-v.png) center no-repeat;
	background-size:contain;
	position:absolute;
	right:10px;
	top:12px}	
.in-tit-box .list-search .se3-1:after, .in-tit-box .list-search .se3.datepicker:after{
	display:none	
	}	
		
.in-tit-box .list-search #search{
	font-size:0;
	width:30px;
	height:30px;
	background-color:#666;
	border:0px;display:inline-block;
	vertical-align:top;
	margin:0;
	background-image: url(../images/inside/in-search-w.png);
	background-position:center;
	background-repeat:no-repeat;
	background-size: cover;
	cursor:pointer;
	position:relative;
	z-index:1;
}
	
.in-tit-box .list-search #search:hover, 
.in-tit-box .list-search #search:focus{
	background-color:#333}	
@media screen and (max-width: 420px) {
.in-tit-box .list-search .KEYBOX{
	width:100%}	
.in-tit-box form{
	display:block;
	width:100%;}
.in-tit-box .list-search #listkeyword{
	 width: calc(100% - 30px);
	box-sizing:border-box
	}	
.in-tit-box .list-search .se3{
	width: calc(50% - 4px);
	background: url(../images/inside/select-icon-v.png) 95% center no-repeat;
    background-size: 6.5px auto;
	}
	
.in-tit-box .list-search .se3.datepicker {
     width: calc(50% - 4px);
}			
	}




/*news indata*/

ul.list-box{
	display:block;}

ul.list-box > li{
	display:block;
	position:relative;
	padding-bottom:20px;
	margin-bottom:20px;
	border-bottom:1px solid #e6e6e6}
	
ul.list-box > li:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;}	
	
ul.list-box > li:last-child{
	border-bottom: none}		
	
ul.list-box > li .zoom-box{
	width:167px; height:106px;
	float:left;}

ul.list-box > li a.zoom-box:before{
	content:'';
	display:block;
	position:absolute;
	left:0; top:0;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0.4);
	background-image:url(../images/icon-temp/icon-zoom.png);
	background-position:center;
	background-repeat:no-repeat;
	background-size:41px;
	transform:scale(1.5);
	transition:all 0.5s;
	opacity:0;
	z-index:1}

ul.list-box > li a.zoom-box:hover:before, ul.list-box > li a.zoom-box:hover:before{
	transform:scale(1);
	opacity:1
	}

ul.list-box > li.new:before{
	content:"NEW";
 	display:block;
	position:absolute;
	left:10px;
	top:-7.6px;
	font-size:1.2em;
	color:#fff;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	padding:3px;
	z-index:2;
	background-color:#f15a24
	}
	
ul.list-box > li	.info-box{
	float:left;
	width:calc(100% - 167px);
	padding-left:14px;
	}
ul.list-box > li	.info-box h3 a{
	font-size:1.7em;
	line-height:1.3;
	font-weight:bold;
	color:#333;
	margin-bottom:10px;
	display:block}

ul.list-box > li .info-box h3 a:hover, ul.list-box > li .info-box h3 a:focus{
	color:#2f9fc6}

ul.list-box > li .info-box p{
	font-size:1.5em;}
	
ul.list-box > li .info-box p.info{
	color:#999;
	line-height:1.53;
	display:block;
	margin-top:15px;
	max-height:44px;
	overflow:hidden}
	
ul.list-box > li time:after {
    content: ' · ';
}	
	
ul.list-box > li p.tmlb {
	
	}

ul.list-box > li p.tmlb .lab{
	font-size:86%; /*外層為1.5em*/
	color:#fff;
	display:inline-block;
	padding:0 3px;
	height:16px;
	line-height:16px;
	background-color:#65c8d0
	}
	
ul.list-box > li p.tmlb .orange{
	margin-right:5px;
	overflow:hidden;
	white-space: nowrap;
	text-overflow: ellipsis;}	
	
		
@media screen and (max-width: 888px) {
ul.list-box > li .zoom-box{
	width:106px; height:106px;
	}
ul.list-box > li	.info-box{
	width:calc(100% - 106px);
 	}	
ul#event_searched >  li .info-box{
	width:calc(100% - 106px - 110px);}	
	}

@media screen and (max-width: 380px) {
ul.list-box > li .zoom-box, ul#event_searched >  li .zoom-box{
	width: 90px;
    height: 106px;
    
	}
ul.list-box > li .info-box, ul#event_searched >  li .info-box{
	width:calc(100% - 90px);
	padding-left:10px
 	}	
 
ul.list-box > li .info-box h3 a{
	margin-bottom:5px
 	}
ul.list-box > li p.tmlb .lab{
	margin-top:5px}	
	
ul.list-box > li .info-box p.info{
	margin-top: 8px;font-size:90%}	
	}

@media screen and (max-width: 330px){
ul.list-box > li .info-box h3 a {
     font-size: 1.5em;
    margin-bottom: 5px;
    text-overflow: ellipsis;
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    white-space: inherit;
    -webkit-line-clamp: 2;
}	
 
 
ul.list-box > li p.tmlb .orange{
	font-size:90%}   	
	}
	
			
/*公會標簽*/


.com_1 b:after, #event_searched .com_1:before{
	content:'全國聯合會'}
.com_2 b:after, #event_searched .com_2:before{
	content:'臺灣省公會'}	
.com_3 b:after, #event_searched .com_3:before{
	content:'台北市公會'}
.com_4 b:after, #event_searched .com_4:before{
	content:'高雄市公會'}
.com_5 b:after, #event_searched .com_5:before{
	content:'臺中市公會'}						

/*公會背景圖*/
/*不同的公會有不同的無圖片預設圖LOGO，1.全聯會 (.com_1) 2.臺灣省公會 (.com_2) 3.台北市公會 (.com_3) 4.高雄市公會 (.com_4) 5.臺中市公會 (.com_5)*/
.com_1 .zoom-pic{
	background-image:url(../images/inside/no-img-all.jpg)}	
.com_2 .zoom-pic{
	background-image: url(../images/inside/no-img-taiwan.jpg)}
.com_3 .zoom-pic{
	background-image: url(../images/inside/no-img-taiPei.jpg)}
.com_4 .zoom-pic{
	background-image: url(../images/inside/no-img-kaushon.jpg)}
.com_5 .zoom-pic{
	background-image: url(../images/inside/no-img-taiChung.jpg)}
	
/*event_searched*/
#event_searched li:before{
    display: block;
    position: absolute;
    left: 10px;
    top: -7.6px;
    font-size: 1.2em;
    color: #fff;
    font-family: "微軟正黑體", Arial;
    font-weight: bold;
    padding: 3px;
    z-index: 2;
    background-color: #f15a24;	}
 
ul#event_searched li .info-box {
     width: calc(100% - 167px - 110px);
}
ul#event_searched.Calendar-list li .info-box {
     width: calc(100% - 167px);
}
	
#event_searched li time:after{
	display:none}
@media screen and (max-width: 888px) {
 
 	 
ul#event_searched li .info-box{
	width:calc(100% - 106px - 110px);}	
	}
	
	
ul#event_searched li .state span, ul#event_searched li .state a.doing	{
	padding:25px; 
 	display:block;
	color:#fff;
	font-size:2.36em;
	line-height:1.1;
	font-family:微软雅黑;
	font-weight:bold;
	position:relative;
	width:97.5px;
	}
	

	
	
	
ul#event_searched li .state{
 
	float:right}
@media screen and (max-width: 480px) {
ul#event_searched li .state{
 	    float: right;
}
ul#event_searched li .state:after{
	clear: both;
	content:'';
	height:0;
	width:0
	}	
ul#event_searched li .state span, ul#event_searched li .state a.doing	{
    width: 106px;
    height: 106px;
    text-align: center;
    padding: 17px;
    font-size: 3em;
	clear:both
	
  	}
	
ul#event_searched li  .info-box	{
	float:none;
	width:100%;
	padding:0;
	float:left;
	}
	
ul#event_searched li  .info-box:before{
	clear: both;
	content:'';
	height:0;
	width:0}		
	
ul#event_searched li  .zoom-box	{
	width:calc(100% - 110px)}
	
ul#event_searched li h3{
	clear:both;
	margin-top:15px;
	display:block}	
	
ul#event_searched li .info-box p.info{
	margin-top:10px}	
	
	}
	
ul#event_searched li .state span:after{
	content:'';
	display:block;
	width:15px;
	height:15px;
	position:absolute;
	right:0;
	bottom:0;
	background:url(../images/inside/cut-w-r-b.png) right bottom no-repeat;
	background-size:100% 100%}	
	

	
ul#event_searched li .state span.doing, ul#event_searched li .state a.doing{
	background-color:#ff8c8c}

	
 ul#event_searched li .state a.doing:before	{
	 content:'';
	 display:block;
	 position:absolute;
	 width:100%; height:100%;
	 transform-origin:center center;
	 left:0;
	 top:0;
	 border:2px solid #ff8c8c;
	 box-sizing:border-box;
     -webkit-animation: zoo 3s infinite linear;
     animation: zoo 3s infinite linear;
	 z-index:10
 	 
	 }
 
	
ul#event_searched li .state a.doing:hover, ul#event_searched li .state a.doing:focus{
	background-color:#F30}		
ul#event_searched li .state a.doing:hover:after, ul#event_searched li .state a.doing:focus:after{
	content:'';
	display:block;
	width:15px;
	height:15px;
	position:absolute;
	right:0;
	bottom:0;
	background:url(../images/inside/cut-w-r-b.png) right bottom no-repeat;
	background-size:100% 100%;

	}	
	
ul#event_searched li .state a.doing:hover:before, ul#event_searched li .state a.doing:focus:before{
	animation: none !important;
	-webkit-animation: none !important;
	display:none
}
	
ul#event_searched li .state span.fulled{
	background-color:#ffe5e5;
	color:#ed1c24}		
ul#event_searched li .state span.end{
	background-color:#b3b3b3}
.ul#event_searched li .info-box h3 a{
	line-height:1.33}	
	
.userbox{
	background-color:#f2f2f2;
	box-sizing:border-box;
	padding:35px 25px;
	margin-bottom:33px;
	position:relative
	}
	
.userbox:before{
	content:'';
	display:block;
	position:absolute;
	width:22px;
	height:22px;
	right:0;
	bottom:0;
	background:url(../images/inside/cut-w-r-b.png) right bottom no-repeat;
	background-size:100% 100%}	
	
.userbox .mainicon{
	float:left;
	width:110px;
	height:110px;
	border-radius:50%;
	background-color:#cccccc;
	background-image:url(../images/inside/people-icon.png);
	background-size:cover}

.userbox p{
	display:block;
	float:left;
	width:calc(100% - 110px);
	padding-left:20px;
	padding-top:23px;
	font-size:2em;
	line-height:1.65;
	color:#666;}
	
.userbox p b{
	color:#000;}	

.userbox p .font-red{
	font-weight:bold}

@media screen and (max-width: 420px) {
.userbox {
	text-align:center}	
	
.userbox .mainicon{
	float: none;
	margin:0 auto;}

.userbox p{
	float: none;
	width:100%;
	padding-left:0px;
	padding-top:23px;
	}	
	
	}

			
ul#event_searched li ul.eve_icbox{
	display:block;
	margin-top:15px}	
	
ul#event_searched li ul.eve_icbox li{
	display:block;
	font-size:1.4em;
	color:#666;
	padding-left:20px;
	background-position:left top;
	background-size:16px auto;
	background-repeat:no-repeat;
	min-height:16px;
	line-height:1.3
 	}	
ul#event_searched li ul.eve_icbox li.tim{
	background-image:url(../images/inside/eventIco-1.png);
	margin-bottom:5px}
	
ul#event_searched li ul.eve_icbox li.loc{
	background-image: url(../images/inside/eventIco-2.png);
	margin-bottom:5px}	

ul#event_searched li ul.eve_icbox li.man{
	background-image: url(../images/inside/eventIco-3.png);
	background-size: 14px auto;}		
	
		
				
/** pageBot **/
.pageBot {
	float:left;
	width:100%;
	padding:0;
	margin-top:30px;
}
.pageBot .dn {
	color: #000;
    font-size: 2.8em;
    font-weight: bold;
    padding: 0;
    padding-left: 35px;
    background-position: left center;
    background-repeat: no-repeat;
    background-image: url(../images/icon-temp/icon-files.png);
    line-height: 40px;
    float: left;
}
.dnTable {
	width:100%;
	border-top-color:#000;
	border-collapse:collapse;
}
.dnTable th {
	color:#FFF;
	font-size:1.5em;
	line-height:150%;
	padding:15px 5px;
	border:1px dotted #06C;
	border-top:none;
	border-bottom:none;
	border-right:1px dotted #fff;
	/*background:#000;*/
	vertical-align:middle;
	box-sizing:border-box;
}
.dnTable tr:hover{
	background-color:#f2f2f2}
.dnTable th:first-child{
	text-align:left;
	padding-left:10px}
	
.dnTable th:last-child{
	border-right:#06C}	
	
.dnTable th.w10 {
	width:14%;
 }
.dnTable th.w12 {
	width:15%;
}
.dnTable td {
	color:#666;
	font-size:1.5em;
	line-height:150%;
	text-align:center;
	vertical-align:middle;
	padding:10px 5px;
	border:1px dotted #CCC;
	border-bottom:1px solid #CCC;
	word-break:break-all;
	box-sizing:border-box;
}
.dnTable td.file-name {
	color:#000;
	text-align:left;
	padding:10px;
	font-weight:bold;	
}
.dnTable td a {
	display:inline-block;
 	height:40px;
	line-height:40px;
	width:80px;
 	color:#FFF;
	padding:0 10px;
	background:#09C;text-transform:uppercase;
	-webkit-border-radius: 3px;
	   -moz-border-radius: 3px;
			border-radius: 3px;
}
.dnTable td a:hover {
	background:#F30;
}
@media screen and (max-width: 780px) {
	.dnTable th:nth-of-type(2),
	.dnTable th:nth-of-type(3) {
		display:none;
	}	
	.dnTable td.file-name {
		width:80%;
		padding:15px 10px;
	}
	.dnTable td:nth-of-type(2),
	.dnTable td:nth-of-type(3) {
		display:none;
	}
	.dnTable td:nth-of-type(4) {
		width:20%;
	}
}
@media screen and (max-width: 460px) {
	.dnTable td.file-name {
		width:75%;
	}
	.dnTable td:nth-of-type(4) {
		width:25%;
	}
}
@media screen and (max-width: 420px) {
	.dnTable td.file-name {
		width:70%;
	}
	.dnTable td:nth-of-type(4) {
		width:30%;
	}
}
@media screen and (min-width: 991px) {
	.pageBot {
		margin-top:40px;
	}
	.dnTable th {
		padding:15px 5px;
	}
	.dnTable th.w10 {
		width:100px;
	}
	.dnTable th.w12 {
		width:110px;
	}
	.dnTable td.file-name {
		font-size:1.7em;
	}
	.dnTable td a {
		height:30px;
	line-height:30px;
 	}
}	
	
/*--------------PAGE-----------------------*/
.page-num{
	padding-left:0 !important;
	padding-top:23px;
	border-top:4px solid #999}

.page-num span{
	float:right;
	line-height:32px;
	font-family:"微軟正黑體", Arial;
	font-size:1.4em}	
	
.page-num li{
	list-style:none;
	float:left;
	margin-right:4px;
	color:#666;
	font-size:1.4em;
	line-height:30px;
	height:30px;
	min-width:30px;
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
		border:1px solid #e6e6e6 !important;
		
}
.page-num li, .page-num li a, .page-num .btn{
	border-radius:50%  !important
	}
	
.page-num a:focus .clo, .page-num a:hover .clo{
	background-color:#ccc;
	color:#000;
	}
	
@media screen and (max-width: 480px) {
	.page-num .clo{
		display:none
	}
	}		
.page-box{
	margin-top:38px;  }
			
.page-box .total{
	display:inline-block;
	float: left;
	color:#666;
	font-size:13px;
	line-height:26px;}
	
.page-num .cur{
 	background: #e6e6e6
		}
.page-num .btn{
	width:30px;
	height:30px;
	overflow:hidden;
	border:0;
	text-indent:-9999px;
	background-position:center;
	background-repeat:no-repeat;	 
	background-color:#b3b3b3 ;
	border-radius:0;
	background-size: auto 12px  ;
	border:none  !important
		}

.page-num .btn-first{
	background-image: url(../images/icon/page-first.png);}		

.page-num .btn-prev{
	background-image: url(../images/icon/page-pre.png);}

.page-num .btn-next{
	background-image: url(../images/icon/page-nex.png);}

.page-num .btn-last{
	background-image: url(../images/icon/page-lastt.png) ;}

.page-num a:hover .btn, .page-num a:focus .btn{
	background-color:#333 !important 	} 
	
.page-txt{
	display:block;
	float:right;
	color:#666;
	font-size:1.4em;}	
	
/*page end*/

/*-------detail more 詳細頁 ---------*/	

#detail h3{
	font-size:2.3em;
	font-weight:bold;
	color:#069;
	margin-bottom:15px;
	line-height:1.3}

#detail .data-point{
	display:block;
	list-style:none;
	margin-bottom:20px;
	}
	
#detail .data-point li{
	display:inline-block;
	font-size:1.4em;
	padding-left:23px;
	margin-top:10px;
	background-position:left center;
	background-repeat:no-repeat;
	background-size:20px;
	height:20px;
	line-height:20px;
	margin-right:10px}	
		
#detail .data-point li.time{ 
	background-image:url(../images/icon/icon-date.png)}	
#detail .data-point li.source{	
	background-image: url(../images/icon/icon-source.png)}	
#detail .data-point li.visit{
	background-image: url(../images/icon/icon-view.png)}	
	
#detail .event-point{
	display:block;
	list-style:none;
	border-top:1px solid #333;
	border-bottom:1px solid #333;
	margin-bottom:40px}
	
#detail .event-point li{
	font-size:16px;
	padding:15px 0;
	border-bottom:1px dashed #ccc;
	line-height:1.3}
	
#detail .event-point li	.map-btn{
	display:inline-block;
	padding:5px;
	border-radius:3px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	color:#fff;
 	margin: 0 5px; margin-right:0;
	padding-left:20px;
	background:#F60 url(../images/icon/footer-loaction.png) 0px center no-repeat;
	background-size:  auto 20px}
/*--------------*/	
@media screen and (max-width: 480px) {
#detail .event-point li	.map-btn{
	font-size:0;
	border-radius:50%;
	padding:0;
	width:18px;
	height:18px;
	background-position:center;
	background-size:contain;
	vertical-align:top;}

}



#detail .event-point li	.map-btn:hover, #detail .event-point li	.map-btn:focus{
	background-color:#333}
		
#detail .event-point li .go, #detail .event-point li .gg{
	padding:10px;
	color:#fff;
	display:inline-block;
	margin:0 5px;
	font-weight:bold;
	border-radius:5px} 
	
#detail .event-point li .go{
 	padding-left:25px;
	background:#F66 url(../images/icon-temp/icon_joinform-w.png) 5px center no-repeat;
	background-size:20px;
	position:relative;
	overflow:visible}
#detail .event-point li .gg{
	background-color:#999}	
#detail .event-point li .go:hover, #detail .event-point li .go:focus{
	background-color:#333 !important;
	}		

#detail .event-point li .go:after{
	content:'';
	display:block;
	position:absolute;
	width:100%;
	height:100%;
	border:2px solid #f66;
	box-sizing:border-box;
	transform-origin:center center;
	left:0;
	top:0;
	border-radius:5px ;
	transform-origin: 50% 50%;
     -webkit-animation: zoo1 3s infinite;
    animation: zoo1 3s infinite;
	}
@-webkit-keyframes zoo1 {
  0% {
    opacity: 1;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
  }

  100% {
    opacity: 0;
    -webkit-transform:scale(1.2,1.4);
    transform: scale(1.2,1.4);
  }
}

@keyframes zoo1 {
  0% {
    opacity: 1;
    -webkit-transform: scale(1,1);
    transform: scale(1,1);
  }

  100% {
    opacity: 0;
    -webkit-transform:scale(1.2,1.4);
    transform: scale(1.2,1.4);
  }
}




#detail .event-point li:last-child{
	border-bottom:0px}	
	
#detail .event-point li:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;}
  	
#detail .event-point li b{
	padding-right:22px;
	background:url(../images/icon/icon_arrow3.png) right 1px no-repeat;
	width:95px;
	vertical-align: middle}	
	
#detail .event-point li div{
	width:calc(100% - 95px);
	display:inline-block;
	box-sizing:border-box;
	padding-left:10px;
	vertical-align: middle
	}	

#detail .event-point1{
	box-sizing:border-box;
 	margin:0;
	background-color:#f2f2f2}
	
#detail .event-point1 li{
	padding:15px;
	box-sizing:border-box}	
	
#detail .event-point1 li b{
	width:120px;
	display:block;
	float:left}	
	
#detail .event-point1 li div{
	width:calc(100% - 120px);
	display:inline-block;
	box-sizing:border-box;
	padding-left:10px;
	vertical-align: middle;
	float:right
	}	
	
#detail .event-tit{
	margin-top:20px;
	margin-bottom:15px;
	font-size:2em;
	font-weight:bold;}	

.html_edit{
	font-size:1.6em;
	line-height:1.5;
	margin-top:50px;
	padding-top:15px;
	border-top: 1px solid #333
	}
	
#event	.html_edit{
	margin-top: 0;
    padding-top: 0;
	border:none}
		
.html_edit h1{
	font-size:200%}
.html_edit h2{
	font-size:180%}
.html_edit h3{
	font-size:160%}
.html_edit h4{
	font-size:140%}
.html_edit h5{
	font-size:120%}
.html_edit h6{
	font-size:100%}								
.html_edit p{
	font-size:105%;
	margin:10px 0;
	line-height:1.8;}	
	
.html_edit ol, .html_edit ul{
	margin-left:1.7em;
	font-size:105%;}						
	
/*service_list*/	
	
#service_list{
	margin-bottom:40px;}
	
#service_list a{
	display:block;
	padding-left:95px;
	box-sizing:border-box;
	background-image:url(../images/inside/service-data-list.png);
	background-position: left top;
	background-repeat:no-repeat;
	background-size:78px auto;
	min-height:84px;
	margin-bottom:20px
 	}

#service_list.ab a {
    padding-left: 60px;
    background-size: 50px auto;
    min-height: 60px;
    margin-bottom: 15px;
	}
	
#service_list.ab a time{
	font-size:1.6em;
	color:#F60 !important}
		
#service_list a:hover, #service_list a:focus{
 	background-image: url(../images/inside/service-data-list-on.png);
 	}
	
#service_list a h3{
	color:#000;
	font-size:2em;
	margin-bottom:20px}
	
#service_list.ab a h3{
 	margin-bottom:10px}	
	
#service_list a:hover h3, #service_list a:focus h3{
	color:#48c1d6} 			
	
#service_list a p{
	display: -webkit-box ;
	color:#666666;
	line-height:1.53;
	font-size:1.5em}
	
#service_list a:after{
	content:'';
	display:block;
	height:1px;
 	margin-top:20px;
	border-bottom:1px solid #ccc}		
	
#service_list a:last-child:after{
	 
	display: none;
 	 }
	 
@media screen and (max-width: 480px) {
#service_list a{
	padding-left:60px;background-size:50px auto;}
	
#service_list.ab a{
	padding-left: 60px;
    background-size: 50px auto;
    min-height: 60px;
    margin-bottom: 15px;}	
	
#service_list a h3{
	margin-bottom:10px;
	font-size:1.5em;}		
.in-tit-box h2{
	font-size:2.5em}	
	
	} 

/*member-search*/
.in-tit-box#mem_search{
	border-bottom:0}

#mem_search   h2{
	float:none}	
#mem_search .m-search {
	padding:5.4%;
	float:none;
	text-align:center;}
	
#mem_search .m-search:after{
	content:'';
	display:block;
	width:100%;
	height:100%;
	position:absolute;
	background:url(../images/inside/search-bar-bglight.png) left center no-repeat;
	background-size:contain;
	left: 0;
    top: 0;
    z-index: 0;
	    -webkit-animation-name: light_ef;
    animation-name: light_ef;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;}	
		
	
#mem_search   .list-search .se3 {
	width:calc(30% - 6px);
    height: 45px;
    line-height: 45px;
    font-size: 1.6em;
    background:#fff url(../images/inside/select-icon-v.png) 95% center no-repeat;
    background-size: 6.5px auto;
	margin:5px 2px;
	z-index:2
 }
#mem_search   .list-search .se3-1{
	background:#fff ;
	width:calc(30% - 14px);

	}  
 #mem_search   .list-search .se3-2{
	background:#fff ;
	width:45%;
	padding-right:45px;
	background-image:url(../images/calendar.svg);
	background-repeat:no-repeat;
	background-position:calc(100% - 10px) center;
	background-size:25px auto

	}  
 
 #mem_search   .list-search .KEYBOX{
	margin-bottom:0;
	width:calc(40% - 4px);
	z-index:2;
	position:relative}
	
 #mem_search   .list-search #listkeyword {
    width:calc(100% - 48px);
    height: 45px;
    margin: 5px 2px;
    margin-right: -8px;
    padding: 0 10px;
    line-height: 45px;
    color: #666;
    font-size: 1.6em;z-index:2
}	
#mem_search   .list-search #search {
     width: 45px;
    height: 45px;
    margin: 5px;
	margin-right:0;
	margin-left:0;    background-color: #000;z-index:2

 }
 
#mem_search  .list-search #search:hover,
#mem_search   .list-search #search:focus {
    background-color: #F30;

 } 		
			
#mem_search .in-tit-box{
	border-bottom:0}
	
@media screen and (max-width: 600px) {
#mem_search   .list-search .se3 {
    width:calc(50% - 6px);
     height: 40px;
    line-height: 40px;
    font-size: 1.4em;
 }

#mem_search   .list-search .se3-1{
 	width:calc(50% - 14px);
     height: 40px;
    line-height:40px;
    font-size: 1.4em;
	}  
	
#mem_search   .list-search .se3-2{
 	width:calc(100% - 4px);
 
	} 	 
 
 #mem_search   .list-search .KEYBOX{
 	width:100%} 
 #mem_search   .list-search #listkeyword {
    height: 40px;
    line-height: 40px;
    font-size: 1.4em;
    width: calc(100% - 42px);
	margin-left:0
}	
#mem_search   .list-search #search {
     width: 40px;
    height: 40px;
	}
	
		
	}	
	
 
	
#mem_sh_tb tr th{
	background-color:#f2f2f2;
	padding:25px 2px;
	box-sizing:border-box;
	border-top:4px solid #999 !important;
	border-bottom:1px solid #999 !important;
	font-size:2em;
	color:#000;
	}
	
#mem_sh_tb tr td, #mem_sh_tb tr th{
	vertical-align:middle}	
	
#mem_sh_tb tr{
	border-bottom:1px dashed #808080;}
	
#mem_sh_tb tr:last-child{
	border-bottom:0}
	
#mem_sh_tb tr:first-child{
	border-bottom:0px}
	
#mem_sh_tb tr td{
	padding:15px 2px;
	color:#808080;
	text-align:leftl;
	font-size:1.8em;}
	
#mem_sh_tb tr td:first-child, #mem_sh_tb tr td:last-child{
	text-align:center}	
 	
		
#mem_sh_tb .t2, #mem_sh_tb .t3, #mem_sh_tb .t4{
	text-align:left}
	
#mem_sh_tb tr td:nth-child(2){
	font-weight:bold;
	color:#89e3e5}
	
#mem_sh_tb tr:hover{
	background-color:#ddfdfa}
	
#mem_sh_tb tr:hover td:nth-child(2){
	color:#f15a24}				
#mem_sh_tb td .more{
	font-size:0;
	display:inline-block;
	width:40px;
	height:45px;
	background:url(../images/inside/detail-link.png) center no-repeat;
	background-size:contain;
	opacity:0.5;
	vertical-align:middle}			
#mem_sh_tb tr:hover td .more{
	opacity:1}
		
/*註解區塊*/	
.UN{
	margin-top:15px;
	display:block;
	background-color:#ffe5e5;
	padding:20px;
	position:relative;
	display: none !important}
.UN:after{
	width:23px;
	height:23px;
	position:absolute;
	right:0;
	bottom:0;
	content:'';
	display:block;
	background:url(../images/inside/cut-w-r-b.png)  right bottom no-repeat;
	background-size:contain}		
.UN h4{
	font-size:2em;
	color:#000;
	padding-bottom:10px;
	border-bottom:1px solid #fff;
	margin-bottom:13px;}
	
.UN ol li{
	padding-left: 1.15em;
    color: #666;
    font-size: 1.6em;
    display: block;
    background-image: url(../images/icon/icon_arrow3.png);
    background-position: left 4px;
    background-repeat: no-repeat;
    background-size: 15px;
    line-height: 1.5;}
/**/

@media screen and (max-width: 480px) {

#mem_sh_tb{
	font-size:90%;
	}
#mem_sh_tb th{font-size:1.6em;}		
#mem_sh_tb tr td, #mem_sh_tb tr th{
	padding:13px 2px;
			
}	
}
	
	
@media screen and (min-width: 768px) {
	
#mem_sh_tb .t1{
	width:80px}
	
#mem_sh_tb .t5{
	width:100px}
	
#mem_sh_tb .t2{
	width:120px}
	
#mem_sh_tb .t3{
	width: auto}
/*#mem_sh_tb .t4{
	width:calc(40% - 60px}*/ 
	}	
			

/*詳細*/

.memberdata .event-point li b{
  	width:120px !important;
	max-width:120px;
	display:inline-block;
	padding-right: 20px !important;
    background: url(../images/icon/icon_arrow3.png) right top no-repeat;
	background-size:16px;
	min-height:17px;
	vertical-align:top}	
	
.memberdata .event-point li div{
	width:calc(100% - 120px) !important;
	display:inline-block;
	max-width:calc(100% - 130px) 
 	}	
.memberdata .datatit{
	margin-top:25px;
	margin-bottom:15px;
	color:#666}	
.memberdata .mmbox {
	margin-top:30px;
	list-style:none;} 
	
.memberdata .mmbox li{
	display:block;
	margin-bottom:25px;
	padding:2.8%;
	background-color:#f2f2f2;
	position:relative
	}
		
	
.memberdata .mmbox li:after{
	
	content:'';
	display:block;
	width:13px;
	height:13px;
	position:absolute;
	right:0; bottom:0;
	background:url(../images/inside/cut-w-r-b.png) right bottom no-repeat;
	background-size:100% 100%}	 
    
.memberdata .mmbox li h4{
	font-size:1.8em;
	margin-bottom:10px;
	border-bottom:1px solid #999;
	padding-bottom:10px
	}
.memberdata .mmbox li tr{
	border-bottom:1px  dashed#CCC}
	
.memberdata .mmbox li tr:last-child{
	border-bottom:0px}	
		
.memberdata .mmbox li th{
	width: 135px;
    text-align: left;
    padding: 10px 6px;
    font-size: 1.6em;
    vertical-align: middle;
    color: #666;
    padding-right: 12px;
    background: url(../images/icon/next-ss-g.png) right center no-repeat;
    background-size: auto 16px;
	}
	
.memberdata .mmbox li td{
 	text-align:left;
	padding:10px 6px;
	font-size:1.6em;
	vertical-align:middle;
	color:#069;
	padding-left:15px
	}			

/*檔案下載 download*/
.file-list{
	padding-top:}

	
.file-list a{
	display:block;
	width:100%;
	float:left;
	border:#b3b3b3 1px solid;
	height:90px;
	padding-top:20px;
	padding-left:100px;
	padding-bottom:20px;
	padding-right:64px;
	box-sizing:border-box;
	margin-bottom:25px;
	position:relative}
	
@media screen and (min-width: 1200px) {
.file-list a{
	width:calc(50% - 12px);}
	
.file-list a:nth-child(odd){
	margin-right:12px;}
	
.file-list a:nth-child(even){
	margin-left:12px;}		
}
	
@media screen and (max-width: 768px) and (min-width: 700px) {
.file-list a{
	width:calc(50% - 12px);}
	
.file-list a:nth-child(odd){
	margin-right:12px;}
	
.file-list a:nth-child(even){
	margin-left:12px;}		
}
	
.file-list a:before{
	content:'';
	width:90px;
	height:90px;
	position:absolute;
	left:0;
	top:0;
	background:url(../images/inside/download-list.gif) center no-repeat ;
	background-size:cover;}	
	
.file-list a:after{
	content:'';
	width:38px;
	height:38px;
	position:absolute;
	right:18px;
	top:50%;
	margin-top:-19px;
  	background: url(../images/inside/download.png);
	background-size: contain;
	}
	
.file-list a:hover:after, .file-list a:focus:after{
   	background: url(../images/inside/download-on.png);
	background-size: contain;
	}		
	
.file-list a:hover, .file-list a:focus{
	background-color:#f2f2f2}
		
.file-list a:hover:before, .file-list a:focus:before{
	background: url(../images/inside/download-list-on.gif) center no-repeat ;
	background-size:cover;
	}
	
.file-list a h4{
	font-size: 2.2em;
    color: #48c1d6;
    margin-bottom: 10px;
    display: block;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;}
	
.file-list a p{
	display:block;
	color:#666;
	font-size:1.5em;}
	
 	
	
@media screen and (max-width: 480px) {
.file-list a{
 	width:100%;
 	height:60px;
	padding-top:10px;
	padding-left:70px;
	padding-bottom:10px;
	padding-right:45px;
	margin-bottom:15px;
	}	
.file-list a:before{
	width:60px;
	height:60px;
	}
.file-list a h4{
	font-size: 1.8em;
     margin-bottom: 5px;}
	 
.file-list a:after{
	content:'';
	width:28px;
	height:28px;
 	right:14px;
 	margin-top:-14px;
 	}	 
	 	
}


/** pageBot **/
.pageBot {
	float:left;	
	width:100%;
	padding:0;
	margin:40px 0 40px 0;
}
.pageBot .dn {
	color:#000;
	font-family: 微軟雅黑, "Microsoft YaHei";
	font-size:2.1em;
	font-weight:bold;
	line-height:160%;
	padding:0 0 0 38px;
	background:url(../images/pageBot-download.svg)  no-repeat 0 50%;
}
.dnLink {
	float:left;
	width:100%;
	list-style:none;
	margin-top:15px;
	border-top:1px solid #DDD;
	border-bottom:1px solid #DDD;
}
.dnLink li {
	float:left;
	width:100%;
	padding:20px 0;
	border-bottom:1px solid #DDD;
}
.dnLink li:last-child {
	border-bottom: none;
}
.dnLink a {
	position:relative;
	float:left;
	color:#000;
	display:block;
	width:100%
}
.dnLink a:hover,
.dnLink a:focus {
	color: #f00;
}
.dnLink .fileIcon {
	display:inline-block;
	width:50px;
	height:62px;
	vertical-align:top;
	margin-right:10px;
	background:url(../images/file-icon.svg) no-repeat 50% 50%;
}
.dnLink a:hover .fileIcon,
.dnLink a:focus .fileIcon {
	background-image:url(../images/file-icon-hover.svg);
}
.dnLink .fileIcon span {
	display:block;
	width:100%;
	color: #fff;
	font-size:1.4em;
	text-align:center;
	margin-top:27px;
	text-transform:uppercase
}
.dnLink dl {
	display:inline-block;
	vertical-align:top;
	max-width:calc(100% - 65px)
}
.dnLink dt {
	width:100%;
	font-size:1.8em;
	font-weight:bold;
	line-height:125%;
	/*margin-top:10px;*/	
}
.dnLink dd {
	color:#666;
	font-size:1.4em;
	margin-top:5px;
}
.dnLink dd span {
	margin-right:10px;
}
.dnLink a:hover dd,
.dnLink a:focus dd {
	color:#f00;
}
@media screen and (max-width: 990px) {	
	.dnLink a {
		float:left;
		padding-left:65px;
		box-sizing:border-box;
	}
	.dnLink .fileIcon {
		position:absolute;
		left:0;
		display:block;
	}
}
@media screen and (max-width: 360px) {	
	.dnLink dd {
		margin-top:0;
	}
	.dnLink dd span {
		display:block;
		width:100%;
		margin-top:5px;
		margin-right:0;
	}
}
@media screen and (min-width: 991px) {	
	.dnLink a:hover,
	.dnLink a:focus {
		margin-left:10px;
		-webkit-transform: scale(1.05);
		   -moz-transform: scale(1.05);
			-ms-transform: scale(1.05);
			 -o-transform: scale(1.05);    
				transform: scale(1.05);
	}
}

.pageBot .dn {
    color: #000;
    font-size: 2.5em;
    font-weight: bold;
    padding: 0;
    padding-left: 35px;
    background-position: left center;
    background-repeat: no-repeat;
    background-image: url(../images/icon-temp/icon-files.png);
    line-height: 40px;
    float: left;
}

.downset{
	margin-bottom:0}
	
	
/*books*/

.books-list {
	display:block;
	background-image:url(../images/BG/book-bottom.gif) ;
	background-position:left top;
	background-repeat: repeat-x;
	background-size:;
	text-align:center}
	
.books-list a{
	display: inline-block;
	width:195px  ;
	height:261px;
 	overflow:hidden;
	position:relative;
	margin:0 12px 81.2px 12px;
	background-position:center top;
	background-size:cover;
	background-repeat:no-repeat;
	box-shadow:5px 5px 10px rgba(0,0,0,0.4)
	}
	

.books-list a img{
	width:100%;
	height:100%;}
		
.books-list a .info{
	position:absolute;
	bottom:-100%;
	display:block;
	padding:6.67%;
	background-color:rgba(0,0,0,0.5);
	color:#fff;
	font-size:1.68em;
	line-height:1.2;
	box-sizing:border-box;
	width:100%;
	left:0;
	opacity:0;
	transition:all 0.5s;
	text-align:left}	
.books-list a:hover .info{
	bottom:0;
	opacity:1;}	
.books-list a .info time{
	display:block}	
	
@media screen and (max-width: 480px) {
.books-list {
  	background-size: auto 98.6%;;
	}	
	
	.books-list a{
 	width:137px ;
	height:182.77px;
 	margin:0 2px 57.61px 2px;
 	box-shadow:3px 3px 6px rgba(0,0,0,0.4)
	}
	
.books-list a .info{
	 
	font-size:1.3em;
	 }	
		}			
.book_year_tit{
	margin-bottom:40px}		
.book_year_tit h3{
	display:inline-block;
	padding:10px 15px;
	font-family:微软雅黑;
	font-weight:bold;
	font-size:2.2em;
	color:#fff;
	border-radius:20px;
	background-color:#a67c52}	
	
/*修正*/
.about_sm li.on > a:before,
.about_sm li.on > a:after,
	{background-color:#fff !important} 		
/*報名*/		
/** join-Step **/
.join-Step {
	margin:40px auto;	
}
.join-Step ul li{	
	list-style:none;				
    float: left;				
}
.join-Step ul li.step {		
    font-size: 1.7em;
    font-weight: bold;
    text-align: center;		
	width:140px;
	height:140px;
	-webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;	
}
.join-Step ul li.line-1 {
	width: 19%;
	height:140px;	
	background: url(../images/step-line-1.png) no-repeat 50% 50%;
}
.join-Step ul li.line-2 {
	width: 19%;
	height:140px;	
	background: url(../images/step-line-2.png) no-repeat 50% 50%;
}
.join-Step ul li.s1{
    background: url(../images/s1-ico.png) no-repeat 50% 25px;
	border:solid 2px #60c6cd;
	color:#60c6cd;	
}
.join-Step ul li.s1-on{
    background: #60c6cd url(../images/s1-ico-on.png) no-repeat 50% 25px;
	border:solid 2px #60c6cd;
	color:#fff;	
}
.join-Step ul li.s2{
    background: url(../images/s2-ico.png) no-repeat 50% 25px;
	border:solid 2px #3cb4d0;
	color:#3cb4d0;	
}
.join-Step ul li.s2-on{
    background: #3cb4d0 url(../images/s2-ico-on.png) no-repeat 50% 25px;
	border:solid 2px #3cb4d0;
	color:#fff;	
}
.join-Step ul li.s3{
    background: url(../images/s3-ico.png) no-repeat 50% 25px;
	border:solid 2px #18a1d2;
	color:#18a1d2;		
}
.join-Step ul li.s3-on{
    background: #18a1d2 url(../images/s3-ico-on.png) no-repeat 50% 25px;
	border:solid 2px #18a1d2;
	color:#fff;		
}
.join-Step ul li.s1 span, .join-Step ul li.s2 span, .join-Step ul li.s3 span,
.join-Step ul li.s1-on span, .join-Step ul li.s2-on span, .join-Step ul li.s3-on span {
	float: left;
    width: 100%;
    padding-top: 95px;		
}
@media screen and (max-width: 1199px) {
	.join-Step ul li.line-1, .join-Step ul li.line-2 {width: 19%;}
}
@media screen and (max-width: 780px) {
	.join-Step ul li.step {font-size: 1.6em;}	
	.join-Step ul li.line-1, .join-Step ul li.line-2 {width: 15%;}
}
@media screen and (max-width: 650px) {
	.join-Step ul li.step {		
		width:120px;
		height:120px;
	}
	.join-Step ul li.line-1 {
		width: 8%;
		height:120px;	
	}
	.join-Step ul li.line-2 {
		width: 8%;
		height:120px;	
	}
	.join-Step ul li.s1, .join-Step ul li.s1-on, 
	.join-Step ul li.s2, .join-Step ul li.s2-on, 
	.join-Step ul li.s3, .join-Step ul li.s3-on {
		background-size: 45%;
		background-position: 50% 18px;
	}
	.join-Step ul li.s1 span, .join-Step ul li.s2 span, .join-Step ul li.s3 span,
	.join-Step ul li.s1-on span, .join-Step ul li.s2-on span, .join-Step ul li.s3-on span {
		padding-top: 78px;		
	}
}
@media screen and (max-width: 499px) {
	.join-Step ul li.step {		
		font-size: 1.5em;
		width:100px;
		height:100px;
	}
	.join-Step ul li.line-1 {
		height:100px;	
	}
	.join-Step ul li.line-2 {
		height:100px;	
	}
	.join-Step ul li.s1, .join-Step ul li.s1-on, 
	.join-Step ul li.s2, .join-Step ul li.s2-on, 
	.join-Step ul li.s3, .join-Step ul li.s3-on {
		background-size: 45%;
		background-position: 50% 15px;
	}
	.join-Step ul li.s1 span, .join-Step ul li.s2 span, .join-Step ul li.s3 span,
	.join-Step ul li.s1-on span, .join-Step ul li.s2-on span, .join-Step ul li.s3-on span {
		padding-top: 65px;		
	}
}
@media screen and (max-width: 419px) {
	.join-Step ul li.step {		
    font-size: 1.5em;
    width: 75px;
    height: 75px;
    padding: 0 15px;
    padding-top: 2px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
	 
	.join-Step ul li.line-1 {height:75px;}
	.join-Step ul li.line-2 {height:75px;}
	.join-Step ul li.s1, .join-Step ul li.s1-on, 
	.join-Step ul li.s2, .join-Step ul li.s2-on, 
	.join-Step ul li.s3, .join-Step ul li.s3-on {
		background-image: none;
	}
	.join-Step ul li.s1 span, .join-Step ul li.s2 span, .join-Step ul li.s3 span,
	.join-Step ul li.s1-on span, .join-Step ul li.s2-on span, .join-Step ul li.s3-on span {
		padding-top: 45%;		
	}
}

/**  contract **/
.contractTit {
	font-family: "微軟雅黑","Microsoft YaHei";
	color:#FFF;
	font-size:2.5em;
	font-weight:bold;
	text-align:center;
	padding:20px 0;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#008cc8+0,50c8e6+100 */
	background:  rgb(0,140,200); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(0,140,200,1) 0%, rgba(80,200,230,1) 100%); /* FF3.6-15 */
	background:  -webkit-linear-gradient(left, rgba(0,140,200,1) 0%,rgba(80,200,230,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background:  linear-gradient(to right, rgba(0,140,200,1) 0%,rgba(80,200,230,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008cc8', endColorstr='#50c8e6',GradientType=1 ); /* IE6-9 */
	position:relative
 
}

.contractTit:after {
	content:'';
	display:block;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background: url(../images/inside/search-bar-bglight.png) center no-repeat;
	background-size:contain;
 	position:absolute
	}
	
.contractTit:before{
	content:'';
	display:block;
	right:-1px;	top:-1px;
	width:30px;
	height:30px;
	background: url(../images/cut-rt.png) right top no-repeat;
	background-size:100% 100%;
 	position:absolute
	}	
	
.contract {	
	width:100%;
	background:#f8f8f8;		
	margin:0 auto;
	padding:35px 50px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
			border:#ccc 1px solid	
}
.contract ol{
    font-size: 1.7em;
	line-height:2;	
	width:95%;
	margin-left:5%;
}
.contract p{
    font-size: 1.7em;
	line-height:2;	
}
.sp {	
    font-size: 1.7em;
	line-height:2;
	position:relative;
	text-align:center;	
	margin-top:30px;
	background:#000;
}
.sp input[type=checkbox] + span {
	display:inline-block;
	background:none;
}
.sp .checkbox {
	position:absolute;
    display: block;
	top:22px;
	left:50%;
    vertical-align: middle;
    margin: 0 0 0 -240px;
    padding:0;
    width: 22px;
    height: 22px;
    background: url(../images/checkbox-box.png) no-repeat 50% 50%;
    cursor: pointer;
}
.sp .checkbox.focus {
	outline: dotted 1px;
}
.sp .checkbox.checked {
	background:url(../images/checkbox-check.png) no-repeat 50% 50%;
}
.sp span {
	display: block;
	color: #B50808;
	padding:15px;
	cursor: pointer;
	vertical-align: middle;
	background:rgba(255,255,255,.9);
}

@media screen and (max-width: 633px) {
.sp {	
	text-align: left}

.sp span {
	padding-left:48px

	}	
.sp .checkbox {
 	top:22px;
	left:15px;
     margin:0;
     
}	
	}
/**/
.sp .checkbox.checked ~ span { /*"~"表示下一個鄰居*/
	color:#FFF;
	background:#B50808;
}

.sp span  strong{
	color:#000;
	margin-left:5px}

.sp .checkbox.checked ~ span  strong{
	color:#fff  }
 
	
@media screen and (max-width: 1199px) {
	.contract {	
		padding:25px 35px;
	}
}
@media screen and (max-width: 480px) {
	.contract {	
		padding:20px;
	}
}


/** form-btn **/
.form-btn {
	float:left;
	width:100%;
	text-align:center;
	margin-top:30px;
}
.form-btn a {
	position: relative;	
	display: inline-block;
	color: #fff !important;
	font-size:1.7em;
	font-weight:bold;
	padding: 12px 18px 12px 42px;
	background:#000;
	margin:0 5px;
	-webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
}
.form-btn .btnSend {
	background: #e76d26;
	padding: 15px 18px 15px 42px;	
}
.form-btn .btnSend:hover {
	background: #ff0000;
}
.form-btn .btnClear {
	background: #999;
}
.form-btn .btnClear:hover {
	background: #666;
}
.form-btn .btnJoin {
	color:#e76d26 !important;
	background: #fff;	
}
.form-btn .btnJoin:hover {
	color:#F00;
}
.form-btn .btnPwd {
	color:#e76d26 !important;
	background: #fff;	
}
.form-btn .btnPwd:hover {
	color:#F00;
}
.form-btn a span:after {
	content: '';
	position: absolute;
	top: 10px;
	left:18px;
	display:block;
	width:20px;
	height:20px;
	-webkit-transition:all 0.3s ease;
	   -moz-transition:all 0.3s ease;
	     -o-transition:all 0.3s ease;
	        transition:all 0.3s ease;			
}
.form-btn a.txtL {
	font-size:2.2em;	
}
.form-btn a.txtL span:after {
	top: 17px;		
}
.form-btn a:hover span:after {
	left: 12px;		
}
.form-btn .btnSend span:after {
	background:url(../images/form-btnSend.png) no-repeat;
}
.form-btn .btnClear span:after {
	background:url(../images/form-btnClear.png) no-repeat;
}
.form-btn .btnJoin span:after {
	background:url(../images/form-btnJoin.png) no-repeat;
}
.form-btn .btnPwd span:after {
	background:url(../images/form-btnPwd.png) no-repeat;
}

/** formHead **/
.formHead {
	width:100%;
    font-size: 1.7em;
	line-height:2;		
}
.tbspac{
	margin:30px 0;	
}
.ttspac{
	margin-top:30px;	
}
.formHead .L {
	float:left;	
	width:98px;
	padding-right:2%;
}
.formHead .R {
	float:left;
	width:calc(100% - 98px);	
}

.formHead .L img {
	width:100%;
	height:auto;
}
.formHead .L-contact {
	float:left;	
	width:98px;
	padding:0 2% 0 1%;
}
.formHead .L-contact img {
	width:100%;
	height:auto;
}

.formHead .R h3 {
	font-family: 微軟雅黑, "Microsoft YaHei";
	font-size: 1.2em !important;
	margin:-10px 0 5px 0;
	line-height:1.5;
}
.formHead .R p {
	color: #888;
	font-size: 0.9em;
}
.formHead .R p.ora {
	color: #000;
	font-size: 1em;
}
.formHead .R p span {
	color: #fff;
	padding: 0 8px;
	margin-right:5px;
	background:#888;
}
@media screen and (max-width: 1199px) {
.formHead .L-contact {
		width:73px;
	}
	.formHead .R {
		width: calc(100% - 73px);	
	}
	
	.formHead .L{width:73px;}				
}
@media screen and (max-width: 640px) {	
	.formHead .L, .formHead .L-contact {
		display:none;
	}
	.formHead .R {
		width:100%;	
	}		
}


/** subHead **/
.subHead {
	float:left;
    font-size: 1.7em;
	line-height:2;		
	width:100%;
	padding:30px 0 10px 0;
	border-bottom: solid 1px #000;
}
.subHead .L {
	float: left;
	width: 180px;
	font-family: "微軟雅黑", "Microsoft YaHei";
	font-weight: bold;	
	font-size: 1.3em;
}
.subHead .L span.ico3 {
	background: url(../images/sub-ico1.png) no-repeat 0 50%;
	padding-left:35px;		
}
.subHead .L span.ico4 {
	background: url(../images/sub-ico2.png) no-repeat 0 50%;
	padding-left:35px;		
}
.subHead .R {
	float: right;
	width:calc(100% - 180px);
	text-align: right;
	color: #e60012;
	font-size: 0.9em;
	margin-top: 5px;
}
@media screen and (max-width: 1200px) {	
	.subHead .L {
		width:100%;	
	}
	.subHead .R {
		width:100%;
		text-align: left;
		line-height:1.2;	
	}	
}

/**  contact-Form **/
.contact-Form {
	float:left;
	width:100%;	
	margin-top:30px;
	border-top:1px dashed #CCC;
}
.form-list {	
	float:left;
	width:100%;	
	margin:0;
	padding:15px 0;
	border-bottom:1px dashed #CCC;
}
.form-list.set2 input{

	-webkit-appearance:normal !important;
	appearance: normal !important;
	-moz-appearance:normal !important}
 

.form-list.spc{
	background-color:rgba(255,255,255,0.7)}
.form-list .formLabel {
	float: left;
	width: 120px;
	color: #000;
    font-size: 1.7em;
    font-weight: bold;
	line-height: 40px;
	text-align:center;
}
.form-list .formLabel span {
    font-size: 1.0em;
    font-weight: bold;	
	padding:0 0 0 20px;
}
.form-list .formLabel span.sp {
	background:url(../images/icon-required.png) no-repeat 0 50%;
}
.form-list .formBox {
	float: left;
	width:calc(100% - 135px);
	color: #000;
	font-size: 1.7em;
}
.form-list .formInput {
	width: 100%;
	height: 40px;
    padding:0 10px;
    font-family:"微軟正黑體", Helvetica, sans-serif;
	font-size: 1rem;
    line-height: 40px;    
    vertical-align: middle;
	background: #fff;
	box-sizing:border-box;
    border:solid 1px #e5e5e5;
	-webkit-border-radius: 5px;
       -moz-border-radius: 5px;
            border-radius: 5px;		
}
.form-list .formInput:focus {
	background-color: #FFFFFF;
    border:1px solid #FF9933;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(255,153,51,0.6);
	   -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(255,153,51,0.6);
            box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(255,153,51,0.6);
}
.form-list .formInput.w1 {
    width: 50%;
}
.form-list .formInput.w2 {
    width: 100px;
	margin-right:10px;
}
.form-list input[type=radio] {
	margin-left:5px;
}
.form-list .formRadio {
    display: inline-block;
    *display: inline;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    width: 22px;
    height: 22px;
    background: url(../images/radio-box.png) no-repeat 50% 50%;
	margin:0 5px 0 10px;
    cursor: pointer;
}
.form-list .formRadio.focus {
	outline: dotted 1px;
}
.form-list .formRadio.checked {
	background: url(../images/radio-check.png) no-repeat 50% 50%;
}
.form-list .formRadio[disabled] {
	background: url(../images/radio-check.png) no-repeat 50% 50%;
}
.form-list .formRadio + label {
    cursor: pointer;
}

.form-list .qu{	
	float: left;
	/*width: 85%;*/
	color: #000;
	font-size: 1.7em;
	line-height:1.7;
	list-style:none;
}

.form-list .qu li{
	float:left;	
    width:30%;
}
.form-list .qu input[type=checkbox] {
	margin-left:5px;
}
.form-list .qu .checkbox {
    display: inline-block;
    *display: inline;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    width: 22px;
    height: 22px;
    background: url(../images/checkbox-box2.png) no-repeat 50% 50%;
	margin:0 5px 0 10px;	
    cursor: pointer;
}
.form-list .qu .checkbox.focus {
	outline: dotted 1px;
}
.form-list .qu .checkbox.checked {
	background:url(../images/checkbox-check2.png) no-repeat 50% 50%;
}
.form-list .qu .checkbox + label {
    cursor: pointer;
}

.form-list .formText {
	width: 100%;
    padding:10px;
    font-family:"微軟正黑體", Helvetica, sans-serif;
	font-size: 1rem;
    line-height:160%;
    vertical-align: middle;
	background: #fff;
	box-sizing:border-box;
    border:solid 1px #e5e5e5;
	-webkit-border-radius: 5px;
       -moz-border-radius: 5px;
            border-radius: 5px;	
}
.form-list .formText:focus {
	background-color: #FFFFFF;
    border:1px solid #FF9933;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(255,153,51,0.6);
	   -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(255,153,51,0.6);
            box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(255,153,51,0.6);
}

.form-list .fileBox {
	font-family: "微軟正黑體", Arial, Helvetica, sans-serif;
	width: 60%;
	font-size: 1rem;
	padding:8px 5px;
	border:none;
	box-sizing:border-box;
	margin-right:5px;
	background: #ededed;
	vertical-align:middle;
}
.form-list .fileBtn {
	font-family: "微軟正黑體", Arial, Helvetica, sans-serif;
	color:#FFF;
	width: 20%;
	height:40px;
	font-size: 1rem;
	line-height:40px;
	background:#000;
	box-sizing:border-box;
	border:none;
	vertical-align:middle;
	cursor:pointer;
	-webkit-border-radius:5px;
	   -moz-border-radius:5px;
	        border-radius:5px;	
	-webkit-transition:all 0.3s ease;
	   -moz-transition:all 0.3s ease;
	     -o-transition:all 0.3s ease;
	        transition:all 0.3s ease;
}
.form-list .fileBtn:hover,
.form-list .fileBtn:focus {
    background: #0068b7;
}
.form-list .fileList {
	clear:both;
	width:100%;
	margin-top:15px;
}
.form-list .fileList ul {
	list-style:none;
}
.form-list .fileList ul li {
	font-size:1rem;
	padding-left:23px;
	margin:10px 0;
	background:url(../images/fileList-icon.png) no-repeat 0 4px;
}
.form-list .fileList ul li span {
	color:#666;
	font-size:0.95rem;
	margin-left:5px;
}
.form-list .fileList ul li .btnDelet {
	display:inline-block;
	color: #FFF;
	font-size:0.9rem;
    padding: 5px 10px;
    background: #B50808;
	margin-left:10px;
	-webkit-border-radius:4px;
	   -moz-border-radius:4px;
	        border-radius:4px;
}
.form-list .fileList ul li .btnDelet:hover,
.form-list .fileList ul li .btnDelet:focus {
    background: #0068b7;
}

.form-list .note{
	clear:both;
	width: 100%;
	color:#159fd2;
	font-size:1rem;
	line-height:130%;
	margin:10px 0 0 0;
}
.form-list .note.n1 {
	display:inline;
	width:40%;
	margin-left:10px;
}
.form-list .note.n2 {
	display:block;
	width:100%;
	margin:10px 0;
}
.form-list .note.n3 {
	margin-bottom:0;
}
.form-list .captcha {
	margin:0 0 0 10px;
}
.form-Sp {
	float:left;
	width:100%;
	padding:25px 0;
	border-bottom:1px dashed #CCC;
}
.form-Sp p {
	color:#000;
	font-size:1.0em;
	line-height:160%;
	text-align:justify;
	margin:5px 0;
}

.form-list .com_se{
	padding:10px;
	border:solid 1px #e5e5e5;
	border-radius:5px;
	font-family:"微軟正黑體", Arial;
	font-size:1.6em;
	padding-right:25px;
	background: url(../images/inside/select-icon-v.png) 92% center no-repeat;
    background-size: 6.5px auto;}
	
.form-list .seleBox{
	padding:10px;
	border:solid 1px #e5e5e5;
	border-radius:5px;
	font-family:"微軟正黑體", Arial;
	font-size:1em;
	padding-right:25px;
	background: url(../images/inside/select-icon-v.png) 92% center no-repeat;
    background-size: 6.5px auto;}
		
@media screen and (max-width: 990px) {
	.form-list .formLabel {
		 
	}
	.form-list .formBox {
		 
	}
}
@media screen and (max-width: 768px) {
	.form-list .formLabel {
		 
	}
	.form-list .formBox {
		 
	}
}
@media screen and (max-width: 560px) {
	.form-list {
		padding:20px 0;
	}
	.form-list .formLabel {
		width:100%;
		text-align:left;
		line-height:100%;
		margin-bottom:15px;
	}
	.form-list .formLabel span {
		padding-left:0;
	}
	.form-list .formLabel span.sp {
		padding:0 45px 0 0;
		background-position:right 50%;
	}
	.form-list .formBox {
		width:100%;
	}
	.form-list .fileBox {
		width: 70%;
	}
	.form-list .fileBtn {
		width: 25%;
	}
}
@media screen and (max-width: 460px) {
	.form-list .formInput.w1 {
		width: 100%;
	}
	.form-list .formInput.w2 {
		width: 85px;
		margin-left:10px;
	}
	.form-list .formRadio {
		margin:0 5px 0 0;
	}
	.form-list .formRadio + label {
		display:inline-block;
		margin-top:15px;
		margin-right:15px;
	}
	.form-list .note.n1 {
		display:inherit;
		width:100%;
		margin-left:0;
	}
}



/** join **/
.join-Border {
	width:100%;
	background: rgb(0,140,200); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(0,140,200,1) 0%, rgba(80,200,230,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(0,140,200,1) 0%,rgba(80,200,230,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(0,140,200,1) 0%,rgba(80,200,230,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008cc8', endColorstr='#50c8e6',GradientType=1 ); /* IE6-9 */
}
.join-Border.bd1 {
	margin-top:25px;
}
.join-Border .slBg {
	float:left;
	width:100%;
	background-image: url(../images/newsHito-bg.png);	
	margin:0 auto;
	padding:10px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.join-Border .Box {
	padding:30px;
	background:#fff;
}
@media screen and (max-width: 480px) {
	.join-Border {
		background:none;
	}
	.join-Border .slBg {
		background:none	;
		padding:0;		
	}	
	.join-Border .Box {
		padding:0;
	}	
}


/** join-Step **/
.join-Step {
	margin:40px auto;	
}
.join-Step ul li{	
	list-style:none;				
    float: left;				
}
.join-Step ul li.step {		
    font-size: 1.7em;
    font-weight: bold;
    text-align: center;		
	width:140px;
	height:140px;
	-webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;	
}
.join-Step ul li.line-1 {
	width:calc(50% - 210px);
	height:140px;	
	background: url(../images/step-line-1.png) no-repeat 50% 50%;
}
.join-Step ul li.line-2 {
	width:calc(50% - 210px);
	height:140px;	
	background: url(../images/step-line-2.png) no-repeat 50% 50%;
}
.join-Step ul li.s1{
    background: url(../images/s1-ico.png) no-repeat 50% 25px;
	border:solid 2px #60c6cd;
	color:#60c6cd;	
}
.join-Step ul li.s1-on{
    background: #60c6cd url(../images/s1-ico-on.png) no-repeat 50% 25px;
	border:solid 2px #60c6cd;
	color:#fff;	
}
.join-Step ul li.s2{
    background: url(../images/s2-ico.png) no-repeat 50% 25px;
	border:solid 2px #3cb4d0;
	color:#3cb4d0;	
}
.join-Step ul li.s2-on{
    background: #3cb4d0 url(../images/s2-ico-on.png) no-repeat 50% 25px;
	border:solid 2px #3cb4d0;
	color:#fff;	
}
.join-Step ul li.s3{
    background: url(../images/s3-ico.png) no-repeat 50% 25px;
	border:solid 2px #18a1d2;
	color:#18a1d2;		
}
.join-Step ul li.s3-on{
    background: #18a1d2 url(../images/s3-ico-on.png) no-repeat 50% 25px;
	border:solid 2px #18a1d2;
	color:#fff;		
}

.join-Step ul li{
	position:relative;overflow:visible;}
	
 
	
.join-Step ul li.s1-on:after, 
.join-Step ul li.s2-on:after, 
.join-Step ul li.s3-on:after{
	content: '';
    display: block;
    position: absolute;
    left:0;
    width: 100%;
    height: 100%;
	box-sizing:border-box;
    top:0;
 
    transform-origin: 50% 50%;
    border: 2px solid #0CF;
    border-radius: 60% 60%;
    -webkit-animation: zoo 3s infinite;
    animation: zoo 3s infinite;
 	}	
@-webkit-keyframes zoo {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  100% {
    opacity: 0;
    -webkit-transform:scale(1.4);
    transform: scale(1.4);
  }
}

@keyframes zoo {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  100% {
    opacity: 0;
    -webkit-transform:scale(1.4);
    transform: scale(1.4);
  }
}

.join-Step ul li.s1 span, .join-Step ul li.s2 span, .join-Step ul li.s3 span,
.join-Step ul li.s1-on span, .join-Step ul li.s2-on span, .join-Step ul li.s3-on span {
	float: left;
    width: 100%;
    padding-top: 95px;		
}
 
@media screen and (max-width: 700px) {
	.join-Step ul li.step {		
		width:110px;
		height:110px;
	}
	.join-Step ul li.line-1, .join-Step ul li.line-2{
		width: calc(50% - 165px);
		height:110px;	
	}
	
	.join-Step ul li.s1, .join-Step ul li.s1-on, 
	.join-Step ul li.s2, .join-Step ul li.s2-on, 
	.join-Step ul li.s3, .join-Step ul li.s3-on {
		background-size: 45%;
		background-position: 50% 18px;
	}
	.join-Step ul li.s1 span, .join-Step ul li.s2 span, .join-Step ul li.s3 span,
	.join-Step ul li.s1-on span, .join-Step ul li.s2-on span, .join-Step ul li.s3-on span {
		padding-top: 73px;		
	}
}
@media screen and (max-width: 499px) {
	.join-Step ul li.step {		
		font-size: 1.6em;
		width:100px;
		height:100px;
	}
	.join-Step ul li.line-1 {
		height:100px;	
	}
	.join-Step ul li.line-2 {
		height:100px;	
	}
	.join-Step ul li.s1, .join-Step ul li.s1-on, 
	.join-Step ul li.s2, .join-Step ul li.s2-on, 
	.join-Step ul li.s3, .join-Step ul li.s3-on {
		background-size: 45%;
		background-position: 50% 15px;
	}
	.join-Step ul li.s1 span, .join-Step ul li.s2 span, .join-Step ul li.s3 span,
	.join-Step ul li.s1-on span, .join-Step ul li.s2-on span, .join-Step ul li.s3-on span {
		padding-top: 65px;		
	}
	
.join-Step ul li.line-1, .join-Step ul li.line-2{
		width: calc(50% - 150px);
	}
}
@media screen and (max-width: 419px) {
	.join-Step ul li.step {		
	font-size: 1.6em;
    width: 75px;
    height: 75px;
    padding: 0 15px;
    padding-top: 2px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	}
	.join-Step ul li.line-1, .join-Step ul li.line-2{height:75px; width: calc(50% - 115px)}
	  
	.join-Step ul li.s1, .join-Step ul li.s1-on, 
	.join-Step ul li.s2, .join-Step ul li.s2-on, 
	.join-Step ul li.s3, .join-Step ul li.s3-on {
		background-image: none;
	}
	.join-Step ul li.s1 span, .join-Step ul li.s2 span, .join-Step ul li.s3 span,
	.join-Step ul li.s1-on span, .join-Step ul li.s2-on span, .join-Step ul li.s3-on span {
		padding-top: 45%;		
	}
}

/** login **/
.mbLog {
	float:left;
  	margin-top:30px;
	width: 46%;
}
.normal {
	width: 90%;
}
.vs-icon {
	float: left;
	width: 8%;
	height: 150px;
	background: url(../images/or_icon.png) no-repeat 50% 50%;
	margin-top:30px;
}
.mbLog h4 {
	font-family: "微軟雅黑","Microsoft YaHei";
	color:#FFF;
	font-size:2.5em;
	font-weight:bold;
	text-align:center;
	padding:15px 0;	
	margin-bottom:10px;
	background: #149fd2; /* Old browsers */
	background: -moz-linear-gradient(left, #64c8cd 0%, #3cb4d0 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #64c8cd 0%,#3cb4d0 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #64c8cd 0%,#3cb4d0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#64c8cd', endColorstr='#3cb4d0',GradientType=1 ); /* IE6-9 */
 }
.mbLog.noMB h4 {
	background: #149fd2; /* Old browsers */
	background: -moz-linear-gradient(left, #3cb4d0 0%, #14a0d2 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #3cb4d0 0%,#14a0d2 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #3cb4d0 0%,#14a0d2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3cb4d0', endColorstr='#14a0d2',GradientType=1 ); /* IE6-9 */	
}
.mbLog h5 {
	font-family: "微軟雅黑","Microsoft YaHei";
	color:#f09600;
	font-size:2.5em;
	font-weight:bold;
	margin:3px 0 10px 0;
 }
 .mbLog h5.normalMB {
	color:#eb6478;
 }
.mbLog p {font-size: 1.5em;}
.mbLog .memIco {float:left; width:48px; margin:0 15px 0 5px} 	
.mbLog ul {
	float:left;
	width:100%;
	list-style:none;
	margin-top:10px;
}		
.mbLog li {
	float:left;
	width:100%;
	margin:8px 0;
}
.mbLog li label  {
	float: left;
	font-size:1.7em;
	font-weight:bold;
	line-height: 45px;		
	width:80px;
	height:45px;
}
.txt-ar{
	text-align:right;
}
.mbLog li .input-text {
	float: right;
	font-family: "微軟正黑體", Arial, Helvetica, sans-serif;
	color: #000;
	font-size: 1.7em;
	line-height: 45px;	
	width:calc(100% - 95px);
	height: 45px;
	background: #eee;
	border: solid 1px #eee;
	padding:0 2%;
	-webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;	
}



.mbLog li .input-text.w1 {
	float: left;	
	width: 110px;
	margin: 0 10px 0 15px;
}
.mbLog li .input-text:focus {
	color: #f00;
	background-color: #fff;
    border-color:#f00;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(255,0,0,0.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(255,0,0,0.6);
}
.mbLog li .formBox {
	float: left;
	width: 80%;
}
.mbLog li .formBox label  {
	font-weight: normal;
	width: auto;
}
.mbLog li .formBox input[type=radio] {
	margin:0 10px 0 20px;
	float: left;
}
.mbLog li .formBox .formRadio {
	float: left;	
    display: inline-block;
    *display: inline;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    width: 22px;
    height: 22px;
    background: url(../images/radio-box.png) no-repeat 50% 50%;
	margin:10px 5px 0 10px;
    cursor: pointer;
}
.mbLog li .formBox .formRadio.focus {
	outline: dotted 1px;
}
.mbLog li .formBox .formRadio.checked {
	background: url(../images/radio-check.png) no-repeat 50% 50%;
}
.mbLog li .formBox .formRadio + label {
    cursor: pointer;
}
.btn-join {
	display:block;
	width:100%;
	border:5px solid #FFF;
	margin:0 auto;
	padding:20px;
	color:#FFF !important;
	font-size:2.0em;
	font-weight:bold;
	text-align:left;	 
	-webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
	-moz-box-shadow:0 0px 7px rgba(0%,0%,0%,0.3);
	-webkit-box-shadow:0 0px 7px rgba(0%,0%,0%,0.3);
	box-shadow:0 0px 7px rgba(0%,0%,0%,0.3);
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;			
}
.btn-join .com-ico2{
	display: inline-block;
	background: url(../images/com-ico2.png) no-repeat 50% 50%;
	width: 21px;
	height: 21px;
	padding-left: 10px;

}
.btn-join.yjoin {
	background: url(../images/join-btn1.png) no-repeat 100% 50%;	
}
.btn-join.yjoin:hover, .btn-join.yjoin:focus {
	color:#FFF;
	background: url(../images/join-btn1-ov.png) no-repeat 100% 50%;	
}
.btn-join.njoin {
	background: url(../images/join-btn2.png) no-repeat 100% 50%;	
}
.btn-join.njoin:hover, .btn-join.njoin:focus {
	color:#FFF;
	background: url(../images/join-btn2-ov.png) no-repeat 100% 50%;	
}
@media screen and (max-width: 1199px) {
	.mbLog li label span {
		display:none;
	}
	
	.mbLog li label  {
			
	width:50px;
	text-align:left

}
.mbLog li .input-text.w1 {
 
	margin: 0 10px 0 0px;
}	
	.mbLog li .input-text {
		width:calc(100% - 50px);
		
	}
		
	.btn-join {
		padding:20px 15px;
		font-size:2.0em;		
	}
	.btn-join.yjoin {
		background: #f49a00; /* Old browsers */
		background: -moz-linear-gradient(top,  #ffd200 0%, #f49a00 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #ffd200 0%,#f49a00 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #ffd200 0%,#f49a00 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */	
	}
	.btn-join.njoin {
		background: #eb6b79; /* Old browsers */
		background: -moz-linear-gradient(top,  #f09b9d 0%, #eb6b79 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #f09b9d 0%,#eb6b79 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #f09b9d 0%,#eb6b79 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */	
	}
	.btn-join.yjoin:hover, .btn-join.njoin:hover {
		background: #fa2b1b; /* Old browsers */
		background: -moz-linear-gradient(top,  #ff6600 0%, #fa2b1b 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #ff6600 0%,#fa2b1b 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #ff6600 0%,#fa2b1b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */	
	}					
}
@media screen and (max-width: 760px) {
	.mbLog {
		width: 100%;
		padding-bottom:30px;
		border-bottom:1px dashed #999
	}
	.mbLog:last-hcild {
		border-bottom:0px
	}
	.vs-icon {
		display:none;
	}
	.mbLog.noMB h4 {
  		margin-top:30px;
	}
	/*.mbLog li label  {	
		width:10%;
	}
	.mbLog li .input-text {
		width: 84%;
	}		*/	
}	
@media screen and (max-width: 480px) {
	/*.mbLog li label  {	
		width:15%;
	}*/
	.txt-ar {
		text-align:left;
	}	
	.mbLog li .input-text {
		float:left;		
		/*width: 77%;*/		
	}
	.mbLog li .input-text.w1 {
		/*width: 77%;*/
		margin: 0;
	}
	.mbLog li .formBox .formRadio + label {
		/*width: 77%;*/
	}			
	.mbLog li a.captcha-img {
		float:left;
		margin-top:15px;
		padding-left:15%;
	}							
}

/** form-btn **/
.form-btn {
	float:left;
	width:100%;
	text-align:center;
	margin-top:30px;
}
.form-btn a, .form-btn input {
	position: relative;	
	display: inline-block;
	border:none;
	color: #fff;
	font-size:1.7em;
	font-weight:bold;
	padding: 12px 18px 12px 42px;
	background:#000;
	margin:0 5px;
	-webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
}
.form-btn .btnSend {
	background: #e76d26;
}
.form-btn .btnSend:hover {
	background: #ff0000;
}
.form-btn .btnClear {
	background: #999;
}
.form-btn .btnClear:hover {
	background: #666;
}
.form-btn .btnJoin {
	color:#e76d26;
	background: #fff;	
}
.form-btn .btnJoin:hover {
	color:#F00;
}
.form-btn .btnPwd {
	color:#e76d26;
	background: #fff;	
}
.form-btn .btnPwd:hover {
	color:#F00;
}
.form-btn a span:after {
	content: '';
	position: absolute;
	top: 10px;
	left:18px;
	display:block;
	width:20px;
	height:20px;
	-webkit-transition:all 0.3s ease;
	   -moz-transition:all 0.3s ease;
	     -o-transition:all 0.3s ease;
	        transition:all 0.3s ease;			
}
.form-btn a:hover span:after {
	left: 12px;		
}
.form-btn .btnSend span:after {
	background:url(../images/form-btnSend.png) no-repeat;
}
.form-btn .btnClear span:after {
	background:url(../images/form-btnClear.png) no-repeat;
}

.form-btn input.btnClear{
	background:url(../images/form-btnClear.png) 10px center no-repeat;}

.form-btn .btnJoin span:after {
	background:url(../images/form-btnJoin.png) no-repeat;
}
.form-btn .btnPwd span:after {
	background:url(../images/form-btnPwd.png) no-repeat;
}
/** Sitemap **/
#sitemap {
	width: 100%;
}
#sitemap .treelist {
	width:100%;
	margin:0;
}
#sitemap .treelist > ul {
	list-style: none;
	margin-top:30px;
}
#sitemap .treelist > ul > li {
	display:inline-block;
	width:calc(33.33% - 5px);
	padding:0 10px;
	margin:10px 0;
	vertical-align:top;
	box-sizing:border-box;	
}
#sitemap .treelist > ul > li > a {
	display: block;
	color: #FFF;
	font-size:1.7em ;
	font-weight: bold;
	line-height:170%;
	padding:15px 20px;
	background:#65c8d0 url(../images/inside/search-bar-bglight.png) left center no-repeat;
	background-size:auto 100%;
 }
#sitemap .treelist > ul > li > a:after{
	}
#sitemap .treelist > ul > li > a:hover,
#sitemap .treelist > ul > li > a:focus {
	background:#066   url(../images/inside/search-bar-bglight.png) left center no-repeat;
	background-size:auto 100%;
}
#sitemap .treelist > ul > li > ul {/*1*/
	list-style:none;
 	background:#F4F4F4;
}
#sitemap .treelist > ul > li > ul > li { /*2*/
	
}
#sitemap .treelist > ul > li  > ul > li > a { /*2*/
	position:relative;
	display: block;
	color: #000;
	font-size:1.7em ;
	line-height:170%;padding:10px;
	border-bottom:1px solid #CCC;
	padding-left:15px;	
}

#sitemap .treelist > ul > li  > ul > li > ul{/*3*/
	background-color:#666;
	color:#fff !important;
	display:none}


#sitemap .treelist > ul > li  > ul > li > ul > li{/*3*/
 
	
 	}
#sitemap .treelist > ul > li  > ul > li > ul > li a{
	color:#fff;padding:10px 15px;border-bottom:1px dashed #CCCCCC;
	display:block;
	font-size:1.6em;
	padding-left:25px
	}	
#sitemap .treelist > ul > li  > ul > li > ul > li a:hover,
#sitemap .treelist > ul > li  > ul > li > ul > li a:focus{
	background-color:#000
 	}	 	
#sitemap .treelist > ul > li  > ul > li:hover > ul{
	display:block}	
	
	
 	

#sitemap .treelist > ul > li > li > a > span {
	position:absolute;
	left:0;
	top:0;
}
#sitemap .treelist > ul > li  > ul > li > a:hover,
#sitemap .treelist > ul > li  > ul > li > a:focus,
#sitemap .treelist > ul > li  > ul > li:hover > a {/*1*/
	color:#65c8d0;
}
#sitemap .treelist > ul > li  > ul > li:hover{
	background-color:#fff}
	
	
	
@media screen and (max-width: 990px) {	
	#sitemap .treelist {
		margin:30px 0 0 0;
	}
	#sitemap .treelist > ul {
		margin-top:20px;
	}
}
@media screen and (max-width: 867px) {
	#sitemap .treelist > ul > li {
		width:calc(50% - 5px);
	}
}
@media screen and (max-width: 420px) {
	#sitemap .treelist > ul > li {
		width:100%;
		margin:15px 0 0 0;
	}
}

/*contact*/
.info-contact {
    margin-bottom: 40px;
    line-height: 1.5;
    font-size: 16px;
    color: #666;
}
.info-contact .info-c{
	padding:15px 0;
	border-bottom:1px solid #ccc;
	font-size:17px;
	padding-left:60px;
	display:block;
	margin-bottom:35px;
	background:url(../images/icon-service.png) left 15px no-repeat;
	background-size:50px auto;
	 }

.contact-info {
	margin:15px 0;}

.contact-info dt {
    font-size: 23px;
    margin-bottom: 20px;
    font-weight: bold;
}
	
.contact-info dd {
    margin-bottom: 12px;
    padding-left: 20px;
    font-size: 17px;
    background: url(../images/icon2/icon-dot-R-1.png) left center no-repeat;
}
	
.google-map	{
	width:100%;
	height:300px;
	margin:30px 0}
	
.search_zone{
	margin-bottom:20px;
	padding-bottom:20px;
	border-bottom:3px solid #ccc;
	}	
	
.search_zone form{
	display:block;
 	border:1px solid #999;
	padding:3px;
	padding-right:5px;
	border-radius:25px;
	box-sizing:border-box;
	padding-left:15px;
	position:relative;
	float:right}	
	
.search_zone form .search-txt{
	width:180px;
	height:30px;
	border:0;
	font-family:"微軟正黑體", Arial  !important  
 	}	
	
.search_zone form .search-txt:focus{
	outline:none}	
	
.search_zone form .search-btn{
	width:30px;
	height:30px;
	border-radius:50%;
	background-color:#666;
	background-image:url(../images/icons/head-search.svg);
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
	cursor:pointer;
	border:0}	
	
.search_zone form .search-btn:focus{
	outline: none;}
	
.search_zone form .search-btn:hover{
	background-color:#000}
	
.trafficInfo {
 	width:100%;
}
.trafficInfo dl {
	width: 100%;
	padding: 15px 0 15px 60px;
	border-bottom: 1px dashed #99cccc;
	box-sizing: border-box;
}
.trafficInfo dl.ico1 {
	background: url(../images/tf-ico-tel.png) no-repeat 10px 15px;
	background-size:40px
}
 
.trafficInfo dt {
	font-size: 2.0em;
	font-weight: bold;
	color: #008cc8;
	line-height:2;
	margin-top:-5px;
}
.trafficInfo dd {
	font-size: 1.7em;	
	color:#000;
	text-align:justify;
	line-height:1.7;
}

/*隱私權*/

.editer {
    font-size: 16px;
    color: #666;
    line-height: 1.8;
}
.editer a{
	color:#F60; font-weight:bold; font-size:16px; vertical-align:baseline}
	
.editer p {
    text-indent: 2em;
    margin-bottom: 20px;
}	
	
	
.editer > ul > li {
    list-style-type: disc;
    list-style-position: outside;
    margin-left: 2.4em;
}	
.editer .stit {
    color: #09C !important;
    font-size: 1.5em !important;
    margin: 40px 0 10px 0 !important;
    clear: both;
    text-indent:1em !important;
}	
	
	
.editer > UL > li > ol li {
    list-style: decimal;
    list-style-position: outside;
    margin-left: 1.2em;
    line-height: 1.7;
}	

.contact-join{
	margin-top:30px;
	border-top:2px solid #999;
	border-bottom:2px solid #999;
	}
	
.contact-join	li{
	display:block;
	list-style:none;
	padding:15px 0;
	padding-left:43px;
	background: url(../images/icon-temp/icon-eventpoint.png)10px center no-repeat;
	background-size:25px;
	font-size:18px;
	border-bottom:dashed 1px #ccc;
	line-height:1.33;}
	
.contact-join	li:last-child{
	border-bottom:0}
	
.contact-join	li:hover{
	background-color:#f2f2f2}		
	
@media screen and (max-width: 420px) {
.contact-join li b,.contact-join	li span{
	display:block;}	
}
.captcha-img{
	margin:10px 0}		
.captcha-img img{
	height:40px;
	width:auto;
	border:1px solid #ccc}

.ind3{
	text-indent:-3em;
	margin-left:3em}
	
/*about 理監事*/
.dtab p, .dmenu dd{
	font-size:1.6em;
	line-height:1.6
	}
	
.dtab p, .dmenu dd ul{
	list-style:none}	
.dtab .dmenu{
	display:block;
	padding:10px 15px;
 	border:1px solid #09C;
	border-radius:20px;
	position:relative;
	margin-bottom:15px;
	background-color:#F7F7F7

	}
.dtab dt{
		cursor:pointer
		}
.history {
	position: relative
	}
.history:before {
    position: absolute;
    width: 2px;
    content: '';
    display: block;
    height: 100%;
    z-index: 1;
    left: 25px;
    border-left: 1px solid #39C;
}		
			
.history .dmenu {
    background: url(../images/inside/history-time.png) 10px 7px no-repeat;
    background-size: 30px auto;
    position: relative;
    z-index: 2;
    background-color: #fff;
}


	
.history .dmenu	dt{
	padding-left:30px}
			
.dtab .dmenu dt .opbtn{
	position: absolute;
    width: 30px;
    height: 30px;
    right: 5px;
    top: 6px;
    border-radius: 50%;
    background: url(../images/lookbtn-close-on.png) center no-repeat;
    background-size: 70%;
    background-color: #666;
    transform: rotate(45deg);
    font-size: 0;
    transition: all 0.5s;}	
	
.dtab  dt:hover .opbtn{
	background-color:#3CC}
				
.dtab .dmenu.open dt .opbtn{
	transform:rotate(0deg);
	background-color:#000}

.dmenu dt h4{
	color:#999;
	padding-right: 25px;}	
.dmenu.open	{
	background-color:#Fff;
	box-shadow:3px 3px 5px #ccc}
.dmenu.open dt h4 {
    color: #167db6;    
}
.dmenu dd{
	transform:scale(1,0);
	transform-origin:center top;
	transition-duration:0.5s;
	transition:all 0.8s;
	height:0;
	overflow:hidden;
	margin-top: 0px;
	padding-top: 0px;
	border-top: 1px solid #09C;
	 }
	
.dmenu.open dd{
	transform:scale(1,1);
	transition:all 0.8s;
	transition-duration:0.5s;
	height:auto;
	margin-top: 15px;
	padding-top: 10px
	}	
 	
.dmenu dt.open h4 small {
    color: #999;    
}

.dtab dt h4{
	font-size:1.8em;
	line-height:1.3}
	
.dtab dt h4 small{
	font-size:70%}	
	
.job span{
	text-indent:-2em;
	margin-left:2em;
	display:block !important;
	margin-bottom:0 !important
	} 
 	
.job > div{
	line-height:1;
	margin-top:10px;
	margin-bottom:0;}
	
.job > div > ol li{
	list-style:cjk-ideographic;
	margin-left:1.5em;
	line-height:1.5;
	margin-bottom:8px;
	text-align:left}	
			
.job span.nom{
	text-indent:0em;
	margin-left:0em;
	line-height:1.5;
	margin-bottom:8px
 	} 	
	
.dmenu dd ul.compli > li b{
	display:block;
	padding-left:20px;
	background:url(../images/icon-temp/icon-writer-info.png) left center no-repeat;
	background-size:16px;
	width:105px;
	float:left
	}
	
.dmenu dd ul.compli > li.job b{
 	background: url(../images/icon-temp/icon-info.png) left center no-repeat;
	background-size:17px;
 	}	

	
	
.dmenu dd ul.compli.set2 > li > b{
	width:100% !important;}	
	
.dmenu dd ul.compli > li > div{
	width:calc(100% - 105px);
	float:left;
	display:block}
	
.dmenu dd ul.compli.set2 > li > div{
	width:100% !important;
	padding-left:20px;
	margin-bottom:15px}		
.popo {
	line-height:1;
	margin-top:8px;}
.popo > li{
	padding:0;
	list-style:none;
	margin:0;}


@media screen and (max-width: 420px){
.dmenu dd ul.compli > li b{
	width:100% !important;}	

	
.dmenu dd ul.compli > li div{
	width:100% !important;
	padding-left:20px;
	margin-bottom:15px}			
	
	}

	
.dmenu dd ul.compli > li div span{
	display:inline-block}
	
li.job div　span{
	display:block;
	width:100% !important}		
		 	
.dmenu dd ul.compli > li div span small{
	color:#999;
	font-size:70%}	
		
 .dmenu:has(> dt.open) {
	background-color:#f2f2f2}
	
.gp-img{
	margin-top:20px;
	text-align:center;
	}
	
.gp-img img{
	max-width:100%}	
			
	
/*日期選擇*/

.ui-widget {
    font-family: Arial,Helvetica,sans-serif;
    font-size: 2em !important;
    box-shadow: 1px 1px 10px #333 !important;
}	
@media screen and (max-width: 768px) {
.ui-widget {
    font-size: 1.85em !important;

}	
}
@media screen and (max-width: 420px) {

.ui-widget {
     font-size: 1.75em !important;
	 left:10px !important
 }	
}

.input-buttons, .step-controls, .ws-popover-opener{
	vertical-align:baseline !important}	
	
.list-search span.dateto{
    vertical-align: top;
    line-height: 30px;
    position: relative;
    margin: 0 -10.5px;
    width: 18px;
    height: 18px;
    display: inline-block;
    border-radius: 50%;
    font-size: 0;
    background: #fff url(../images/icon-temp/ad-nav-R.png) 57% center no-repeat;
    background-size: auto 85%;
    border: 1px solid #999;
    margin-top: 6px;
    z-index: 3;
	
	}	
	
/*calender*/	
.close .Calendar{
	display:block !important}

@media screen and (min-width: 991px) {
.close .Calendar{
	display:block}	
	
}
				
.Calendar{
 	padding:15px;
	position:relative;
	background-color:#f2f2f2;
	display:block;
 	transition:all 0.5s}

.Calendar .title1 a {
    color: #000;
}	
.Calendar .title1 a:hover, .Calendar .title1 a:focus {
    color: #F60;
}
.Calendar .title1 {
    font-size: 2em;
    color: #000;
    display: block;
    font-family: 微软雅黑;
    font-weight: bold;
    padding-bottom: 10px;
    border-bottom: 1px solid #dbdfe0;
}

.Calendar .date-tb tr td {
    vertical-align: middle;
    text-align: center;
    font-family: Arial;
    font-size: 1.7em;
    line-height: 1;
    color: #000;
    height: 38px;
	
}


.Calendar .control-LR, 
.Calendar .owl-nav {
    position: absolute;
    right: 10px;
    top: 10px;
}


.Calendar .control-LR a, 
.Calendar .owl-nav .owl-prev, 
.Calendar .owl-nav .owl-next {
    font-size: 0;
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin: 0;
    margin-left: 5px;
    font-size: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(../images/icon/h-next.png);
    line-height: 30px;
}
	
.Calendar .control-LR a.prev, 
.Calendar .owl-nav .owl-prev {
    transform: rotate(180deg);
}
	
.Calendar  .control-LR a:hover, 
.Calendar  .control-LR a:focus, 
.Calendar  .owl-nav > div:hover {
    background-image: url(../images/icon/h-next-on.png);
    background-color: #b3b3b3;
}	


.Calendar .date-tb tr td:first-child, 
.Calendar .date-tb tr td:nth-child(7) {
    color: #ed1c24 !important;
}

.Calendar .date-tb tr td a {
    display: inline-block;
    margin: 0;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #b1e3e7;
    color: #000;
    line-height: 30px;
    text-align: center;}
	
.Calendar .date-tb tr td a:hover, 
.Calendar .date-tb tr td a:focus,
.Calendar .date-tb tr td a.on {
    color: #fff !important;
    background-color: #F30;
    font-weight: bold;
}
.Calendar .date-tb tr td a.on:hover,
.Calendar .date-tb tr td a.on:focus{
	background-color:#333}

.Calendar-list .info-box{
	width: calc(100% - 167px);}

.html_edit table td, .html_edit table th{
	border:1px solid #999;
	color:#666}	
.html_edit table th{
	color:#000;
	background-color:#DFF}	
article#detail	{
	padding-bottom:20px}
	
	
	
/** reg-Step **/
.reg-Step {
	display:block;
	width:100%;
	margin:50px auto;
	text-align:center;	
}
.reg-Step ul li{	
	list-style:none;
    float: left;				
}
.reg-Step ul li.arrow {
	width: calc(((100% - 445px)/2));
	height:145px;
	background: url(../images/step-arrow.png) no-repeat 50% 50%;
}
.reg-Step ul li.step {
	position:relative;		
	width:145px;
	height:145px;
	color: #333;	
    font-size: 1.8em;
	line-height:1.3;
    font-weight: bold;	
    text-align: center;	
	-webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
}
.reg-Step ul li.step:before{
	content:"";
	display:block;
	position:absolute;
	top:21%;
	left:50%;
	width:60px;
	height:53px;
	margin-left:-30px;
}
.reg-Step ul li.step span:after{
	display:block;
	position:absolute;
	top:67%;
	left:50%;
	color:#fff;
	margin-left:-23px;
	font-size:0.9em;
}

.reg-Step ul li.s1{ background: #52bfce;}
.reg-Step ul li.s1:before{ background:url(../images/step-ico-1.png) 50% 50% no-repeat;}
.reg-Step ul li.s1 span:after{ content:"Step1";}

.reg-Step ul li.s2{ background: #3cb4d0;}
.reg-Step ul li.s2:before{ background:url(../images/step-ico-2.png) 50% 50% no-repeat;}
.reg-Step ul li.s2 span:after{ content:"Step2";}

.reg-Step ul li.s3{ background: #18a1d2;}
.reg-Step ul li.s3:before{ background:url(../images/step-ico-3.png) 50% 50% no-repeat;}
.reg-Step ul li.s3 span:after{ content:"Step3";}

.reg-Step ul li.s1 span,    .reg-Step ul li.s2 span,    .reg-Step ul li.s3 span {
	float: left;
    width: 100%;
    padding-top: 160px;		
}	
@media screen and (max-width:680px) {
	.reg-Step {
		margin:30px auto;
	}	
	.reg-Step ul li.arrow {
		width: calc(((100% - 360px)/2));		
		height:120px;
		background-size:16px auto;		
	}
	.reg-Step ul li.step {	
		width:120px;
		height:120px;
		margin-bottom:20px;		
	}
	.reg-Step ul li.step:before{
		top:18%;
	}	
	.reg-Step ul li.s1 span,    .reg-Step ul li.s2 span,    .reg-Step ul li.s3 span {
		padding-top: 140px;		
	}	
}
@media screen and (max-width:520px) {
	.reg-Step ul li.arrow {
		width: calc(((100% - 285px)/2));		
		height:95px;
		background-size:10px auto;		
	}
	.reg-Step ul li.step {	
		width:95px;
		height:95px;
		font-size:1.55em;		
	}	
	.reg-Step ul li.s1 span:after, .reg-Step ul li.s2 span:after, .reg-Step ul li.s3 span:after{
		display:none;
	}
	.reg-Step ul li.s1 span,    .reg-Step ul li.s2 span,    .reg-Step ul li.s3 span {
		padding-top: 100px;		
	}			
}
@media screen and (max-width:420px) {
	.reg-Step ul li.arrow {
		width: calc(((100% - 210px)/2));		
		height:70px;		
	}
	.reg-Step ul li.step {	
		width:70px;
		height:70px;	
	}
	.reg-Step ul li.step:before{
		top:14%;
	}	
	.reg-Step ul li.s1:before, .reg-Step ul li.s2:before, .reg-Step ul li.s3:before{ 
		background-size:75%;
	}		
	.reg-Step ul li.s1 span,    .reg-Step ul li.s2 span,    .reg-Step ul li.s3 span {
		padding-top: 80px;
	}			
}


/*process_zone*/
ul.process_zone{
	display:block;
	padding:15px 24px;
	background:#f4f4f4;
	border-top:1px solid #64c8d0;
	border-bottom:1px solid #64c8d0;
	list-style:none;
	} 	
ul.process_zone	li{
	display:block;
	padding:8px 0;
	border-bottom:1px dotted #c6ad7a;}	
ul.process_zone	li:last-child{
	border-bottom:0;}		
ul.process_zone	li strong{
	background-color:#64c8d0;
	display:block;
	float:left;
	padding:14px 34px;
	height:45px;
	border-radius:24px;
	color:#fff;
	font-size:2em;
	line-height:1;
	width:150px}
ul.process_zone	li strong.ans{
	background-color:#a67c52;}			
ul.process_zone	li .rig{
	float:left;
	box-sizing:border-box;
	padding-left:25px;
	font-size:2em;
	width:calc(100% - 150px);}
		
@media screen and (max-width: 768px) {
	ul.process_zone	li strong{
		float:left;
		padding:14px 20px;
		font-size:1.7em;
		width:110px}	
	ul.process_zone	li .rig{
		padding-left:15px;
		font-size:1.7em;
		width:calc(100% - 110px);}
}

@media screen and (max-width: 480px) {
	ul.process_zone	li .rig{
		padding-left:0px;
		width:100%;}		
	ul.process_zone	li strong{
		padding:10px 20px;
		font-size:1.7em;
		height:auto;
		margin-top:10px;
	 }
}

	
ul.process_zone	li .rig	p{
	display:block;
	margin:11px 0;
	line-height:1.5;
	word-break: break-all;}

ul.process_zone	li .rig.number{
	color:#0066a6;
	font-weight:bold;
	line-height:45px}	
	
ul.process_zone	li .rig > span{
	display:inline-block;
	vertical-align:middle;
	height:45px;
	line-height:45px;
	margin-right:20px;
	padding-left:38px;
	background-position:left center;
	background-repeat:no-repeat;
	background-size:30px;
	font-weight:bold;}

ul.process_zone	li .rig > span.tobe{
	color:#0066a6;
	background-image:url(../images/process-tobe.svg);}	
		
ul.process_zone	li .rig > span.ing{
	color:#339900;
	background-image:url(../images/process-ing.svg);}		
	
ul.process_zone	li .rig > span.end{
	color:#ff6600;
	background-image:url(../images/process-end.svg);}		

ul.process_zone	li .rig > span.not{
	color:#333;
	background-image:url(../images/process-not.svg);}	
			
ul.process_zone	li .rig a.files{
	display:block;
	margin:10px 0;
	padding-left:27px;
	background:url(../images/fileList-icon.png) left center no-repeat;
	color:#000;}

ul.process_zone	li .rig a.files:hover, ul.process_zone	li .rig a.files:focus{
	color:#F60}
	
ul.process_zone	li .rig a.files .gray{
	color:#999;}		






.info_txt{	
	padding-left:40px;
	box-sizing:border-box;
	background:url(../images/form-icon-info.png) left 3px no-repeat;
	font-size:2em;
	line-height:1.8;
	color:#000;
	margin-top:30px;
	margin-bottom:10px;}