@charset "utf-8";



 *:after, *:before{
 	-webkit-box-sizing:border-box;
 	-moz-box-sizing:border-box;
 	box-sizing:border-box;
 }
body{
	overflow-y: scroll;
	overflow-x: hidden;
}
.dis{display:none;}
.dis2{display:block;}
.radius7{-webkit-border-radius: 7px;-moz-border-radius: 7px;border-radius: 7px;}
@keyframes fade-in {  
    0% {opacity: 0;}
    100% {opacity: 1;}  
}  
@-webkit-keyframes fade-in {
    0% {opacity: 0;}  
    100% {opacity: 1;}  
} 

.index_content_top,.bigbanner_hover{
	width:100%;
	height:85vh;
	min-height: 650px;
	overflow: hidden;
}
.index_content_top a:hover{cursor:hand;}
.index_bigbanner{
	height:315px;
	margin:22vh auto;
	background:url(../images/index/twnihao_title.png) no-repeat center center;
	text-indent:-9999px;
}
.bigbanner_hover{
	display:none;
	position: absolute;
	cursor:hand; 
	z-index:2;
	top:0;
	margin:0 auto;
	padding-top:150px; 
	background:rgba(0, 0, 0, 0.75);
	animation: fade-in;
    nimation-duration: 1s;
    -webkit-animation:fade-in 1s;
} 
.bigbanner_hover_logo{
	margin:0 auto;
	width: 117px;
	height: 188px;
	background:url(../images/index/twnihao_LOGO.png) no-repeat center center;
	text-indent:-9999px;
}
.bigbanner_hover_title{
	margin:0 auto;
	padding-top:50px;
	padding-left:66px; 
	color:#ffeb0f;
	font-size: 36px;
	width: 350px;
}
.bigbanner_hover_title img{margin-left: 10px; margin-bottom: 0.2em; }
.bigbanner_hover_text{
	margin:0 auto;
	padding-top:20px;
	line-height:33px ;
	color:#fff;
	font-size: 22px;
	text-align:center;
	width: 260px;
}
.bigbanner_box:hover .bigbanner_hover{ 
	cursor:hand;
	display:block;	
}
.index_bigbanner_button{
	margin:35px auto;
	text-align: center;
	background: none;
	line-height: 45px;
	width:157px;
	height: 45px;
	cursor:hand;
	font-size: 18px;
	border: 2px solid #ffeb0f; 
	color:#ffeb0f;
}
.index_bigbanner_button:hover{
	background-color:#555555;
}

.index_mid{
	background:#e3edff;
	padding:35px 0 50px 0;
}
.index_mid_wrp{	
	position:relative;
	width:980px;
	margin:0 auto;
	overflow: hidden;
}
.index_mid_tit_1{font-size:18px; color:#a2b6e8;}
.index_mid_tit_2{font-size:37px; color:#0047c3; font-weight: bold; margin-top:3px;}
.index_mid_tit_3{position:absolute; font-size:18px; top:35px; left:290px;}
.index_mid_tit_4{ 
	top:20px; 
	left:895px; 
	background:white; 
	padding:10px 15px; 
	font-weight: bold;
	color:#0047c3;
	margin-right: 20px;
	-webkit-transition: opacity 1s ease-in-out;
  	-moz-transition: opacity 1s ease-in-out;
  	-o-transition: opacity 1s ease-in-out;
 	transition: opacity 1s ease-in-out;
}
.index_mid_tit_4:hover{
	background:#a2b6e8; 
	opacity:0.6;
	-webkit-transition: opacity 1s ease-in-out;
  	-moz-transition: opacity 1s ease-in-out;
  	-o-transition: opacity 1s ease-in-out;
  	transition: opacity 1s ease-in-out;
}

.index_mid_content{
	position:relative;
	margin:27px 19px 0 0;
	width:310px;
}

.index_mid_wrp img{
	width:306px;
	height: 226px;
}
.index_mid_img_hover{
	display: none;
	z-index: 3;
	width:306px;
	height: 226px;
	position: absolute;
	background:rgba(0, 71, 195, 0.62);
	animation: fade-in;
    nimation-duration: 1s;
    -webkit-animation:fade-in 1s;
}
.index_mid_img_box:hover .index_mid_img_hover{display: block;}

/*--數位行銷動態按鈕--*/
.index_mid_img_button{
	display: block;
	margin:80px auto;
	padding: 18px 18px;
	height:15px;
	width:15px;
	color: inherit;
	vertical-align: middle;
	position: relative;
	border: 2px solid #fff;
	z-index: 4;
	-webkit-backface-visibility: hidden;
	-moz-osx-font-smoothing: grayscale;
}

/*--按鈕1--*/
.index_mid_img_button_01{background:url(../images/index/facebook_button.png) no-repeat center center;margin-right:25px;margin-left:82px;}
.index_mid_img_butt01_effect::before{
	content: '';
	position: absolute;
	top: -2.6px;
	left: -2.2px;
	width: 111%;
	height: 111%;
	border: 2px solid #0047c3;
	z-index: -1;
	border-radius: inherit;
	opacity: 0;
	-webkit-transform: scale3d(0.6, 0.6, 1);
	transform: scale3d(0.6, 0.6, 1);
	-webkit-transition: -webkit-transform 0.6s, opacity 0.3s;
	transition: transform 0.6s, opacity 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.index_mid_img_butt01_effect:hover{background: url(../images/index/facebook_button_hover.png) no-repeat center center #fff;
	color: #3f51b5;}
.index_mid_img_butt01_effect:hover::before {
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
	opacity: 1;
}

/*--按鈕2--*/
.index_mid_img_button_02{background:url(../images/index/seeoffice_button.png) no-repeat center center;}
.index_mid_img_butt02_effect::before{
	content: '';
	position: absolute;
	top: -2.6px;
	left: -2.2px;
	width: 111%;
	height: 111%;
	border: 2px solid #0047c3;
	z-index: -1;
	border-radius: inherit;
	opacity: 0;
	-webkit-transform: scale3d(0.6, 0.6, 1);
	transform: scale3d(0.6, 0.6, 1);
	-webkit-transition: -webkit-transform 0.6s, opacity 0.3s;
	transition: transform 0.6s, opacity 0.3s;
	-webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
	transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
}
.index_mid_img_butt02_effect:hover{background: url(../images/index/seeoffice_button_hover.png) no-repeat center center #fff;
	color: #3f51b5;}
.index_mid_img_butt02_effect:hover::before {
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
	opacity: 1;
}


.index_mid_pad a:hover .index_mid_cont_title,.index_mid_pad a:hover .index_mid_cont_text{color:#0047c3;}
.index_mid_pad{padding:0 30px;}
.index_mid_cont_title{
	font-size:18px;
	font-weight:bold;
	color:#0047c3;
	margin: 25px 0 15px 0;
}
.index_mid_cont_text{font-size:12px; color:#000; line-height: 18px}
.index_bb_lft_char{
	width:538px;
	height:550px;
	position: relative;
	left:-150px;
	opacity:0;
	z-index:100;

}
.index_bb_rt_title{
	width:446px;
	height:163px;
	position: relative;
	display:block;
	left:-150px;
	opacity:0;
	z-index:80;
}
.index_bb_rt_link{
	width:446px;
	height:136px;
	position: relative;
	display:block;
	opacity:0;
	z-index:70;
}

.loading{
	width:100%;
	height:550px;
	background:url(../images/index/loading.gif) no-repeat center center;
	text-indent: -9999px;
}

.index_bigbanner img {
      background: transparent;
      -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */
       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);   /* IE6 & 7 */      
       zoom: 1;
}

.index_content_bot{background:#fff;min-height:100px;padding-top:50px;width:1024px;margin:0 auto;padding-bottom:50px;}

.indexcontent_bot_activity,.indexcontent_bot_activity2{
	width:314px;
	margin-left:22px;
	margin-top: 7px;
}
.activity_title{font-size:18px;font-weight:bold;color:#083e9e;padding-bottom:12px;}
.activity_line{background:#d2d2d2;height:1px;}

.activity_inner{
	padding:11px 0 21px;
}


.activity_inner a .activity_inner_title, .activity_inner a  .activity_inner_con{color:#000;}
.activity_inner a:hover .activity_inner_title, .activity_inner a:hover  .activity_inner_con{color:#1b4eab;}
.activity_inner_date{color:#083e9e;-webkit-text-size-adjust:none;font-size:1em;}
.activity_inner_title{
	padding-top:7px;
	font-size:1.5em;
	font-weight:bold;
	overflow:hidden;
	height:20px;
	line-height:20px;
}
.activity_inner_con{
	padding-top:16px;
	line-height:17px;
	font-size:1.2em;
	overflow:hidden;
	height:3em;
}

.indexcontent_bot_boss{
	width:298px;
	margin-left:37px;
}
.boss{position:relative;width:298px;height:236px;background:url(../images/index/boss.jpg) no-repeat;}

.boss_a{width:298px;height:236px;background:url(../images/index/spacer.gif);display:block;}
.boss_link{
	position:absolute;
	top:185px;
	left:24px;
}