a.workshop-header {
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1000;
	color: #fff;
	line-height: 50px;
	font-size: 1em;
	background: #b5003a;
	height: 50px;
	text-align: center;
	overflow: hidden;
}

a.workshop-header { color: #fff; }
a.workshop-header:hover{ color: #ffff00; }

/* ========================================== 輪播用 ================================== */
/* ========================================== 輪播用 ================================== */
.top_header_div{ 
	display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    color: #fff;
    line-height: 50px;
    font-size: 0.9em;
    background: #b5003a;
    height: 50px;
    text-align: center;
    overflow: hidden; 

}
a.top_header{ color: #fff; display: block; position: absolute; width: 100%;  background: #b5003a; top:-45px;
transition: top 1s;
-moz-transition: top 1s;	/* Firefox 4 */
-webkit-transition: top 1s;	/* Safari 和 Chrome */
-o-transition: top 1s;	/* Opera */
 }
 a.top_header:hover{ color: #ffff00; }

 a.top_header_down{ top:0px; }

 .phone_header_div{ display: none; }
/* ========================================== 輪播用 END ================================== */
/* ========================================== 輪播用 END ================================== */


/*
.workshop-header-btn{ display: inline-block; height: 30px; color: #fff; padding: 3px 6px; margin: 0 0 0 10px; border: 1px solid #fff; }
*/
.servicephone { display: block; position: fixed; top: 0; right: 130px; font-family: Times new roman, Georgia; font-style: italic; font-size: 1.4em; color: #ffffff; text-align: center; line-height: 50px; padding: 0 0.8em; z-index: 1000; background: #fc4882; }
.servicephone a{ color: #ffffff; }
.servicephone a:hover{ color: #ffffff; }
.servicephone a:link{ color: #ffffff; }
.servicephone a:visited{ color: #ffffff; }

a.chat { display: block; position: fixed; top: 0; right: 80px; z-index: 1000; background: #d60044; }
a.chat:hover{ background: #b5003a; }
a.language { display: block; position: fixed; top: 0; right: 0; z-index: 1000; background: #fc4882; width:80px; height:50px; text-align:center; line-height:50px; }
a.language:hover{ background: #b5003a; }
a.language:link{ color: #ffffff; }
a.language:visited{ color: #ffffff; }


a.members { display: none; position: fixed; top: 0; right: 100; z-index: 1000; background: #b5003a; color:rgba(255,255,255,1.00); width:50px; height:50px; text-align:center; line-height:50px; }
a.members:hover{ background: #d60044; }
a.members > i{ margin-top:15px; font-size:1.2em}

.workshop-header-s { display: none; }
.servicephone-s { display: none }
.servicephone-s a{ color: #ffffff; }
.servicephone-s a:hover{ color: #ffffff; }
.servicephone-s a:link{ color: #ffffff; }
.servicephone-s a:visited{ color: #ffffff; }

a.chat-s { display: none }
a.language-s { display: none }
a.member-s{ display: none }


.logo { width: 200px; padding: 9px 0; }

.cbp-af-header {
	position: fixed;
	top: 50;
	left: 0;
	width: 100%;
	z-index: 1002;
	background: rgba(255,255,255,1);
	height: 72px;
	border-bottom: solid 1px rgba(0,0,0,0.1);
	overflow: hidden;
	-moz-box-shadow:4px 4px 8px 1px rgba(20%,20%,40%,0.1);
	-webkit-box-shadow:4px 4px 8px 1px rgba(20%,20%,40%,0.1);
	box-shadow:4px 4px 8px 1px rgba(20%,20%,40%,0.1);
}

.cbp-af-inner {
	width: 95%;
	/*max-width: 960px;*/	
	margin: 0 auto;
}

.cbp-af-header h1 {
	margin: 0;
	display: inline-block;
	float: left;
	position: relative;
}

.navicon { 
	display: none;
	border: none;
	background: none;
	float: right;
	color: #bc121a;
	width: auto;
	cursor: pointer;
	margin: 20px 0;
	font-size: 0.8em;
}

  #drop-nav {display: block; position:fixed; right:2%; top:50px; }
  #drop-nav,#drop-nav li,#drop-nav li ul,#drop-nav li a  {z-index:8000;}
  #drop-nav,#drop-nav li:hover ul  {list-style: none;padding: 0px;margin: 0px;}
  #drop-nav li {display: block;position: relative;float: left;  }
  #drop-nav li ul {display: none;}
  #drop-nav >li >ul >li >a {width:180px; height:50px; line-height:50px; color: #333; border-top:1px rgba(1,1,1,0.10) solid}
  #drop-nav li a {display: block;background: #fff;padding: 0px 20px 0px 20px;text-decoration: none;
           white-space: nowrap;color: #666; height:71px; line-height:71px;}
  #drop-nav li a:hover {background: #ffe4ed; color:#b21723}
  #drop-nav li:hover ul {display: block; position: absolute;}
  #drop-nav li:hover li {float: none;}
  #drop-nav li:hover a {background: #fff;}
  #drop-nav li:hover li a:hover {background: #fff7fa;}
  #drop-nav li ul li {border-top: 0px;}


/* Example Media Queries */
@media screen and (max-width: 1000px) {
	
.workshop-header { text-align: left; padding-left: 1em; }

.navicon {
	display: block;
}
#drop-nav {display: none;}

}

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

.cbp-af-header { top: 0; }
.logo { padding: 11px 0 0 11px; }
.navicon { padding-right: 20px; }

.workshop-header { display: none; }
.servicephone { display: none }
a.chat { display: none }
a.language { display: none }
a.members { display: none }

.workshop-header-s {
	display: block;
	position: fixed;
	bottom: 50;
	left: 0;
	width: 100%;
	z-index: 1000;
	color: #fff;
	line-height: 50px;
	font-size: 0.9em;
	background: #b5003a;
	height: 50px;
	text-align: center;
	overflow: hidden;
}

a.workshop-header-s { color: #fff; }
a.workshop-header-s:hover{ color: #ffff00; }

/* =========================================== 輪播用 ================================== */
/* =========================================== 輪播用 ================================== */
 .phone_header_div{ 
 	display: block;
	position: fixed;
	bottom: 50;
	left: 0;
	width: 100%;
	z-index: 1000;
	color: #fff;
	line-height: 50px;
	font-size: 0.8em;
	background: #b5003a;
	height: 50px;
	text-align: center;
	overflow: hidden; 
}

a.phone_header{ color: #fff; display: block; position: absolute; width: 100%;  background: #b5003a; top:-45px;
transition: top 1s;
-moz-transition: top 1s;	
-webkit-transition: top 1s;	
-o-transition: top 1s;	
 }
 a.phone_header:hover{ color: #ffff00; }

 a.phone_header_down{ top:0px; }
/* =========================================== 輪播用 END ================================== */
/* =========================================== 輪播用 END ================================== */

.servicephone-s { display: block; position: relative; bottom: 0; right: 0px; margin-top: 50px; width: calc( 100% - 130px ); font-family: Times new roman, Georgia; font-style: italic; font-size: 1.4em; color: #ffffff; text-align: center; line-height: 50px; padding: 0; z-index: 1000; background: #fc4882; }
a.chat-s { display: block; position: absolute; bottom: 0; right: 80px; z-index: 1000; background: #d60044; }
a.chat-s:hover{ background: #b5003a; }
a.language-s { display: block; position: absolute; bottom: 0; right: 0; z-index: 1000; background: #fc4882; width:80px; height:50px; line-height:50px; text-align:center;}
a.language-s:hover{ background: #b5003a; }
a.language-s:link{ color: #ffffff; }
a.language-s:visited{ color: #ffffff; }


a.member-s { display: none; position: fixed; bottom: 0; right: 100; z-index: 1000; background: #b5003a; width:50px; height:50px;  text-align:center;color:rgba(255,255,255,1.00);}
a.member-s:hover{ background: #999; }

}
a.member-s > i{ margin-top:15px; font-size:1.2em}