.tecrm_chat_icon { /*width: calc( 20em + 75px);*/ height: 62px; text-align: right; bottom: 75px; right: -3px; position: fixed; cursor: pointer; z-index: 99;}

.tecrm_chat_icon .pic{ width: 62px; height: 62px; display: inline-block; position:relative; background: url(../images/tecrm_chat_icon@3x.gif) no-repeat; background-size: contain;}
.tecrm_chat_icon img{ width: 62px; height: auto;}
.tecrm_chat_icon .info_number{ display: inline-block; padding:3px; min-width: 40px; height: 40px; text-align: center; border: 1px solid #fff; background: #3ea2af; color: #fff; font: normal 24px/42px "arial"; position: absolute; top: -10px; right: 60%; z-index: 2;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    -webkit-transform: scale(0.5);
    transform: scale(0.5); }
.tecrm_chat_icon{ width: 150px; height:auto;}
.tecrm_chat_icon p{ margin-bottom: 10px; padding: 10px; font-size: 16px; display: block; white-space: inherit; word-wrap: break-word; font-family: "Helvetica Neue", "Hiragino Sans GB","微軟正黑體", "Microsoft JhengHei"; color: #333; background: #fff; border: solid 1px #ccc; text-align: left; line-height: 1.25; position: relative; top: inherit; right: 5px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: 0px 0px 10px rgba( 0, 0, 0, 0.2);
    box-shadow: 0px 0px 10px rgba( 0, 0, 0, 0.2);}
.tecrm_chat_icon p::after{ content: ""; display: block; width: 10px; height: 10px; background: #fff; border-top: solid 1px #ccc; border-right: solid 1px #ccc;  position: absolute;
    top: inherit; right: 15px; bottom: -6px;
    transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -sand-transform: rotate(135deg);}
/*.tecrm_chat_icon_v .pic{ width: 62px; height: 62px; background: url(../images/tecrm_chat_icon.gif) no-repeat; background-size: contain;}*/

.tecrm_chat_icon p span{ color: #ba0001; font-weight: bold;}

.tecrm_chatArea_off{ display:none;}/*tecrm_chatArea 預設*/
.tecrm_chatArea{ display:block; width:100%; max-width: 500px; bottom: 75px; right: 0; position:fixed; z-index:100;}/*tecrm_chatArea turn on*/
.tecrm_chatArea_m{ height: 100%; max-width: 100%; bottom: 0;}/*tecrm_chatArea turn on and on mobile*/
.tecrm_iframe_rwd { width: 100%; height: 500px; border: 1px solid #ddd; position: relative; overflow: hidden; }
.tecrm_iframe_rwd iframe { top: 0; left: 0; width: 100%; height: 100%; background: #ddd; overflow: hidden; }

/*範例按鈕*/
.OpenRobot{
 display: inline-block;
 border:1px solid #bfbfbf;
 color: #8c8c8c;
 border-radius: 5px 5px 5px 5px;
 -webkit-border-radius: 5px 5px 5px 5px;
 -moz-border-radius: 5px 5px 5px 5px;
 font-family: Verdana;
 width: auto;
 height: auto;
 font-size: 16px;
 padding: 10px 40px;
 box-shadow: inset 0 1px 0 0 #fff,inset 0 -1px 0 0 #d9d9d9,inset 0 0 0 1px #f2f2f2,0 2px 4px 0 #f2f2f2;
 -moz-box-shadow: inset 0 1px 0 0 #fff,inset 0 -1px 0 0 #d9d9d9,inset 0 0 0 1px #f2f2f2,0 2px 4px 0 #f2f2f2;
 -webkit-box-shadow: inset 0 1px 0 0 #fff,inset 0 -1px 0 0 #d9d9d9,inset 0 0 0 1px #f2f2f2,0 2px 4px 0 #f2f2f2;
 text-shadow: 0 1px 0 #fff;
 background-image: linear-gradient(to right, #f2f2f2, #f2f2f2);
 background-color: #f2f2f2;
}
.OpenRobot:hover, .OpenRobot:active{
 border:1px solid #8c8c8c;
 color: #8c8c8c;
 box-shadow: inset 0 1px 0 0 #ffffff,inset 0 -1px 0 0 #d9d9d9,inset 0 0 0 1px #f2f2f2;
 -moz-box-shadow: inset 0 1px 0 0 #ffffff,inset 0 -1px 0 0 #d9d9d9,inset 0 0 0 1px #f2f2f2;
 -webkit-box-shadow: inset 0 1px 0 0 #ffffff,inset 0 -1px 0 0 #d9d9d9,inset 0 0 0 1px #f2f2f2;
 background-color: #f2f2f2;
}



/*gogoro客制化*/
.gogoro .tecrm_chat_icon { height: auto; text-align: right; /*bottom: 102px;*/ bottom: 31px; right: 28px;}
.gogoro .tecrm_chat_icon .pic{
    -webkit-box-shadow: 0px 10px 15px rgba(34,87,152,0.2);
    box-shadow: 0px 10px 15px rgba(34,87,152,0.2);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
}
.gogoro .tecrm_chat_icon .pic{ width: 100px; height: 100px; display: inline-block; position:relative; background: url(../images/tecrm_chat_icon_gogoro@3x.png) no-repeat; background-size: contain;}
.gogoro .tecrm_chat_icon .pic img{ display: none; }
.gogoro .tecrm_chatArea { max-width: 752px; bottom: 30px; right: 28px;
    -webkit-box-shadow: 0px 20px 20px rgba(34,87,152,0.2);
    box-shadow: 0px 20px 20px rgba(34,87,152,0.2); }
.gogoro .tecrm_iframe_rwd{ height: 604px; border: 0; }


@media only screen and (max-width: 768px) {
.tecrm_chat_icon p{margin-right: 10px; padding: 0 10px; display: none; white-space:nowrap; line-height: 40px; padding: 5px 10px; position: absolute; top: 5px; right: 48px;}
.tecrm_chat_icon p::after{
    top: 18px; right: -6px;
    transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -sand-transform: rotate(45deg);}
    .tecrm_chat_icon .pic,
    .tecrm_chat_icon img{ width: 48px; height: 48px;}

}