/*======================================================================== 
  Copyright: 匯豐汽車網路事業
  Author: IRIS
  ========================================================================*/

@media screen,
projection {
    /*======================================================================== 
  Global
  ========================================================================*/
    
    html {
        width: 100%;
        height: 100%;
    }
    body {
        background-color: #FFF;
        color: #333;
        text-decoration: none;
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "新細明體", sans-serif;
        font-size: 63%;
        line-height: 200%;
        margin: 0px;
        width: 100%;
        text-align: center;
        /*向下相容舊版IE無法判別margin:0 auto的置中語法*/
        
        -moz-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
        text-rendering: optimizeLegibility;
        -webkit-font-smoothing: antialiased;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "微軟正黑體", sans-serif;
    }
    a:link {
        text-decoration: none;
        color: #333;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		-o-transition: all 0.3s;
		transition: all 0.3s;
    }
    a:visited {
        text-decoration: none;
        color: #333;
    }
    a:hover {
        text-decoration: none;
        color: #333;
    }
    a:active {
        text-decoration: none;
        color: #333;
    }
    #wrapper {
        background: #faf8f5;
        width: 100%;
        height: auto;
        overflow: hidden;
    }
    sup.required {
        vertical-align: 10%;
        color: #FF0000;
    }
    .mainContent {
        margin: 0px;
        width: 100%;
    }
    .warrentyCardContent {
        margin: 0px;
        width: 100%;
        background-color: #b4a495;
        padding-top: 45px;
    }
    .mainContentDiv {
        background-color: #faf8f5;
        width: 940px;
        padding: 20px 0px 30px;
        margin: 0px auto;
        height: auto!important;
        height: 300px;
        min-height: 300px;
        margin: 0 auto;
        text-align: left;
        position: relative;
        /*配合body text-align設定，向下相容舊版IE無法判別margin:0 auto的置中語法*/
    }
    /*======================================================================== 
  Header
  ========================================================================*/
    
    #header {
        width: 100%;
        text-align: center;
        z-index: 999;
        position: relative;
        border-top: 20px solid #ff7300;
        height: 160px;
    }
    #header .headerDiv {
        width: 940px;
        margin: 0px auto;
        padding: 0;
        /* position: relative;*/
        /* height: 125px;*/
    }
    #header a:link {
        color: #333;
    }
    #header a:visited {
        color: #333;
    }
    #header a:hover {
        color: #333;
        text-decoration: none;
    }
    #header a:active {
        color: #333;
    }
     #header .otherSite{
        margin: -16px 0 0 0;
        padding: 0;
        clear: both;

  
     }
     #header .otherSite li{
        margin: 0 0 20px 0;
        padding: 0;
        float: right;
        display:block;
     }
    #header a.combibabyLink,#header a.combiTaiwan {
        color: #fff;
        font-size: 1.2em;
        
        padding: 0px;
        padding-left: 5px;
        
        line-height: 1.2em;
        margin-left: 30px;
    }
    #header .combibabyLink:before,#header .combiTaiwan:before {
        content: "";
        width: 0px;
        height: 0px;
        border-style: solid;
        border-width: 3px 0 3px 4px;
        border-color: transparent transparent transparent #fff;
        position: absolute;
        /* left: 0px;
      top:0px;*/
        margin-left: -10px;
        margin-left: -38px\0;
        margin-top: 4px;
    }
    #header .logo {
        float: left;
        width: 145px;
        height: 55px;
        display: block;
        background: url(../images/logo.png);
        text-indent: -300%;
        overflow: hidden;
        margin-top: -5px;
        /*margin-top: 10px;*/
    }
    .warrentyCardLogo {
        float: left;
        width: 145px;
        height: 40px;
        display: block;
        background: url(../images/logo.png);
        text-indent: -300%;
        overflow: hidden;
        margin-top: 20px;
        margin-left: 35px;
        margin-bottom: 30px;
    }
    #header ul.quickLinks {
        clear: both;
    }
    #header ul.quickLinks li {
        display: block;
        float: right;
        width: auto;
        margin: 0 5px;
        padding-left: 18px;
        background: url(../images/icon02.png) left center no-repeat;
        font-size: 1.2em;
		line-height: 13px;
    }
    #header ul.quickLinks li.back {
        background: #fcfaf8 url(../images/icon01.png) 6px center no-repeat;
        border: solid 1px #ddddcf;
        -moz-border-radius: 3px 3px 3px 3px;
        -webkit-border-radius: 3px 3px 3px 3px;
        border-radius: 3px 3px 3px 3px;
        padding: 2px 6px 2px 25px;
    }
	#header ul.quickLinks i.fa-youtube-play,
	#header ul.quickLinks i.fa-facebook-square {
		font-size: 15px;
    }
    #header ul.navi {
        width: 100%;
        padding: 0px;
        float: left;
        margin: 22px 0 0 0;
    }
    #header ul.navi > li {
        float: left;
        width: 188px;
        height: 62px;
        line-height: 62px;
        margin: 0px;
        padding: 0px;
        

    }
    #header ul.navi > li > a {
        width: 100%;
        height: 100%;
        display: block;
        overflow: hidden;
        text-align: center;
        color: #333;
        font-size: 1.5em;
        position: relative;
        padding: 0px;
        margin: 0px;
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "微軟正黑體", sans-serif;
        font-weight: bold;
        -webkit-transition: all 0.3s;
        -o-transition: all 0.3s;
        -moz-transition: all 0.3s;
        transition: all 0.3s;
    }

    #header ul.navi > li > a:hover {
        text-decoration: none;
        color: #ff7300;
    }
    #header ul.navi > li > a:before {
        content: "";
        height: 35px;
        border-left: 2px solid #e8e8e8;
        position: absolute;
        left: 0px;
        top: 15px;
    }
    #header ul.navi > li.last a:after {
        content: "";
        height: 35px;
        border-right: 2px solid #e8e8e8;
        position: absolute;
        right: 0px;
        top: 13px;
    }
    #header ul.navi > li .subMenu {
        display: none;
        width: 100%;
        height: 350px;
        margin: 0px auto;
        padding: 0px;
        background: #eee4db;
        text-align: left;
        position: absolute;
        /*top: 157px;*/
        left: 0px;
        z-index: 200;
    }
    #header ul.navi > li .subMenu .subMenuDiv {
        margin: 0 auto;
        display: block;
        width: 940px;
    }
    .subMenuDiv .proList {
        padding: 0px;
        margin: 0px;
    }
    .subMenuDiv .proList > li {
        padding: 0px;
        float: left;
        width: 230px;
        height: 60px;
        display: block;
        overflow: hidden;
        margin: 20px 0px 0 0;
    }
    .subMenuDiv .proList > li a {
        display: block;
        width: 100%;
        height: 100%;
    }
    .subMenuDiv .proList > li a img {
        float: left;
        display: block;
    }
    .subMenuDiv .proList > li a:hover img {
        opacity: 0.5;
        filter: alpha( opacity=50);
    }
    .subMenuDiv .proList > li img {
        -moz-transition: opacity .3s cubic-bezier(0.2, 0.4, 0.7, 0.8);
        -webkit-transition: opacity .3s cubic-bezier(0.2, 0.4, 0.7, 0.8);
        transition: opacity .3s cubic-bezier(0.2, 0.4, 0.7, 0.8);
    }
    .subMenuDiv .proList > li a div {
        margin-left: 70px;
        display: table;
        height: 60px;
    }
    .subMenuDiv .proList > li a div span {
        display: table-cell;
        vertical-align: middle;
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "微軟正黑體", sans-serif;
        font-size: 1.5em;
        line-height: 1;
    }
    .subMenuDiv .proList > li a:hover div span {
        color: #ff7400;
        text-decoration: none;
    }
    .subMenu a.all {
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        color: #fff!important;
        font-size: 1.8em;
        width: 180px;
        text-align: center;
        background: #ff7200 url(../images/icon03.png) 20px center no-repeat;
        padding-left: 40px;
        display: block;
        height: 60px;
        text-align: left;
        line-height: 60px;
        margin-top: 20px;
        float: left;
        overflow: hidden;
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "微軟正黑體", sans-serif;
    }
    /*======================================================================== 
  root
  ========================================================================*/
    
    .root {
        border-top: 1px dotted #ddddcf;
        width: 900px;
        margin-top: 4px;
        display: block;
        text-align: left;
        height: 40px;
        margin: 0 auto;
        font-size: 1.4em;
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "微軟正黑體", sans-serif;
        background: url(../images/icon04.png) left center no-repeat;
        padding-left: 30px;
        line-height: 40px;
    }
    .mainBannerIndex {
        margin: 0px;
        width: 100%;
        overflow: hidden;
        background: #faf8f5;
        padding-bottom: 20px;
        border-bottom: 1px solid #eee4db;
    }
    .mainBanner {
        margin: 0px;
        width: 100%;
        overflow: hidden;
        background: #ede2dc;
        padding: 10px 0;
        border-bottom: 1px solid #eee4db;
    }
    .mainBannerDiv {
        width: 940px;
        margin: 0px auto;
        text-align: left;
    }
    #gallery-index {
        width: 100%;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
    }
    .subImg {
        width: 940px;
        height: 140px;
        overflow: hidden;
        display: block;
        position: relative;
    }
    .heading {
        width: 220px;
        height: 30px;
        position: absolute;
        top: 45px;
        background: #ff7300;
        color: #fff;
        -moz-border-radius: 0px 5px 5px 0px;
        -webkit-border-radius: 0px 5px 5px 0px;
        border-radius: 0px 5px 5px 0px;
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "微軟正黑體", sans-serif;
        padding: 10px 10px;
    }
    .heading .chFont {
        font-size: 1.8em;
        line-height: 30px;
        display: block;
    }
    .heading .enFont {
        font-size: 1.2em;
        line-height: 1.1;
        display: block;
    }
    /*======================================================================== 
  Sidebar
  ========================================================================*/
    
    .leftPart {
        float: left;
        width: 160px;
        overflow: hidden;
        /* position: absolute;
        top: 20px;
        left: 0px;*/
    }
    .leftBanner {
        width: 160px;
        margin-top: 10px;
    }
    .leftBanner img {
        margin-bottom: 10px;
    }
    .sidebar {
        width: 150px;
        padding: 5px;
        background-color: #fff;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px;
    }
    .sidebar h1 {
        font-size: 1.6em;
        color: #333;
        margin: 0px;
        line-height: 2.2;
    }
    .sidebar a {
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        background: #cfc3b5;
        color: #333;
        display: block;
        margin-bottom: 5px;
        font-size: 1.3em;
        line-height: 1.3em;
        padding: 5px 10px;
        text-decoration: none;
    }
    .sidebar a.sel,
    .sidebar a:hover {
        background: #ff7300;
        color: #FFF;
    }
    /*======================================================================== 
  Main Content
  ========================================================================*/
    
    .indexRightBanner {
        width: 160px;
        margin-top: 10px;
        float: right;
    }
    .indexRightBanner img {
        margin-bottom: 10px;
    }
    /*======================================================================== 
  subject
  ========================================================================*/
    
    .subject {
        background: #fff;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        padding-right: 20px;
        margin-left: 10px;
        padding-left: 30px;
        padding-bottom: 20px;
        margin-top: 0px;
        margin-bottom: 30px;
        zoom: 1;
    }
    /*撐開 內含子項需FLOAT的項目*/
    
    .subject:after {
        clear: left;
        content: '.';
        display: block;
        height: 0;
        overflow: hidden;
    }
    .w220 {
        width: 220px;
    }
    .w465 {
        width: 405px;
    }
    .w420 {
        width: 420px;
    }
    .w770 {
        width: 710px;
    }
    .w760 {
        width: 700px;
    }
    .w940 {
        width: 880px;
    }
    .positionRight {
        float: right;
    }
    .floatRight {
        float: right;
    }
    .positionMiddle {
        margin: 30px auto;
    }
    .subject h2 {
        /*background:url(../images/triangle.png) left bottom no-repeat;*/
        
        padding-bottom: 0px;
        margin-left: -30px;
        position: relative;
        margin-top: 10px;
    }
    .subject h2:before {
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 10px 10px 0;
        border-color: transparent #ada28a transparent transparent;
        position: absolute;
        bottom: 0px;
        left: -10px;
    }
    .subject h2:after {
        content: "";
        width: 98%;
        border-bottom: 1px dotted #ddddcf;
        height: 0px;
        display: block;
        position: absolute;
        bottom: 3px;
        right: 0px;
    }
    .subject h2 span {
        font-size: 16px;
        color: #fff;
        -moz-border-radius: 3px 3px 3px 0px;
        -webkit-border-radius: 3px 3px 3px 0px;
        border-radius: 3px 3px 3px 0px;
        min-height: 20px;
        display: inline-block;
        vertical-align: bottom;
        width: 130px;
        background: #ff7300;
        line-height: 1.2;
        padding: 15px 10px 5px;
        position: relative;
        top: -10px;
        left: -10px;
    }
    .subject h2 strong {
        font-size: 16px;
        display: table-cell;
        position: absolute;
        bottom: 10px;
        left: 150px;
        color: #333;
    }
    .subject h2 a {
        display: table-cell;
        font-size: 12px;
        background: #fcfaf8 url(../images/icon02.png) 5px 4px no-repeat;
        border: solid 1px #ddddcf;
        -moz-border-radius: 3px 3px 3px 3px;
        -webkit-border-radius: 3px 3px 3px 3px;
        border-radius: 3px 3px 3px 3px;
        padding: 0px 5px 0px 22px;
        line-height: 150%;
        margin-top: 8px;
        position: absolute;
        right: 10px;
        bottom: 10px;
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "新細明體", sans-serif;
    }
    .indexlist {
        margin: 0px;
        padding: 0px
    }
    .indexlist li {
        margin: 0px;
        padding: 0px;
        line-height: 200%;
        overflow: hidden;
    }
    .indexlist span {
        float: left;
        color: #333;
        display: block;
        font-size: 1.3em;
    }
    .indexlist a {
        color: #333;
        margin-left: 100px;
        display: block;
        font-size: 1.3em;
    }
    .indexShop {}
    .indexBaby {}
    .indexShop div {
        margin-bottom: 13px;
        overflow: hidden;
    }
    .indexShop p {
        font-size: 1.3em;
        color: #333;
    }
    .indexShop div img {
        float: left;
        width: 85px;
        height: 85px;
    }
    .indexShop div h4 {
        background: #b4a495;
        color: #fff;
        -moz-border-radius: 3px 3px 3px 3px;
        -webkit-border-radius: 3px 3px 3px 3px;
        border-radius: 3px 3px 3px 3px;
        text-align: center;
        font-size: 1.5em;
        display: block;
        margin: 0 0 0 100px;
    }
    .indexShop div p {
        font-size: 1.3em;
        line-height: 1.5;
        margin-left: 100px;
    }
    .indexBaby div {
        clear: both;
        margin-bottom: 10px;
        overflow: hidden;
    }
    .indexBaby div img {
        float: left;
        width: 105px;
        height: 70px;
    }
    .indexBaby div span {
        font-weight: bold;
        color: #000;
        font-size: 1.3em;
        display: block;
        margin: 0 0 0 120px;
    }
    .indexBaby div a {
        font-size: 1.3em;
        line-height: 1.5;
        margin-left: 120px;
        display: block;
    }
    /*======================================================================== 
  colorBlock
  ========================================================================*/
    
    .colorBlock {
        background: #f5f2e9;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        padding: 15px;
        position: relative;
        overflow: hidden;
    }
    .colorBlock .info {
        position: absolute;
        top: 10px;
        right: 20px;
        background: url(../images/icon06.png) center center no-repeat;
        display: block;
        width: 24px;
        height: 24px;
    }
    .colorBlock .IndexProBanner {
        margin: 3px 5px;
    }
    /*======================================================================== 
  indexProject
  ========================================================================*/
    
    .indexProject {
        margin: 10px auto;
        overflow: hidden;
    }
    .indexProject > div {
        width: 210px;
        margin: 10px 5px 10px 5px;
        float: left;
        ;
    }
    .indexProject > div img {
        width: 210px;
        height: 183px;
        display: block;
        overflow: hidden;
    }
    .indexProject > div p {
        font-size: 1.3em;
        color: #333;
        line-height: 1.5;
        width: 90%;
        margin: 5px auto;
    }
    .indexProject > div ul {
        width: 90%;
        margin: 5px auto;
        padding: 0px;
    }
    .indexProject > div li {
        font-size: 1.2em;
        color: #333;
        line-height: 1.5;
        margin: 0px;
        padding: 0px;
        font-size: 1.3em;
        text-decoration: underline;
        background: url(../images/icon02.png) left center no-repeat;
        padding-left: 18px;
    }
    /*======================================================================== 
  tabs
  ========================================================================*/
    
    h3.indexRank {
        /*background:url(../images/triangle.png) left bottom no-repeat;*/
        
        padding-bottom: 0px;
        margin-left: -15px;
        position: relative;
        margin-top: 5px;
        width: 25%;
        float: left;
        margin-bottom: 0px;
    }
    h3.indexRank:before {
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 10px 10px 0;
        border-color: transparent #ada28a transparent transparent;
        position: absolute;
        bottom: 0px;
        left: -10px;
    }
    h3.indexRank span {
        font-size: 15px;
        color: #fff;
        -moz-border-radius: 3px 3px 3px 0px;
        -webkit-border-radius: 3px 3px 3px 0px;
        border-radius: 3px 3px 3px 0px;
        min-height: 20px;
        display: inline-block;
        vertical-align: bottom;
        width: 120px;
        background: #ff7300;
        line-height: 1.2;
        padding: 5px 10px 5px;
        position: relative;
        top: -10px;
        left: -10px;
    }
    .tabs {
        margin-left: 20px;
        padding: 0px;
        display: block;
    }
    .tabs li {
        display: block;
        float: left;
    }
    .tabs li a {
        display: block;
        text-decoration: none;
        overflow: hidden;
        color: #333;
        font-size: 1.3em;
        font-weight: bold;
        padding: 2px 20px;
        float: left;
        margin: 2px 2px 0px 2px;
        border-left: solid 1px #e5decc;
        border-top: solid 1px #e5decc;
        border-right: solid 1px #e5decc;
        -moz-border-radius: 5px 5px 0px 0px;
        -webkit-border-radius: 5px 5px 0px 0px;
        border-radius: 5px 5px 0px 0px;
        background: #f3ecdc;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YzZWNkYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNWRkYzgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top, #f3ecdc 0%, #e5ddc8 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f3ecdc), color-stop(100%, #e5ddc8));
        background: -webkit-linear-gradient(top, #f3ecdc 0%, #e5ddc8 100%);
        background: -o-linear-gradient(top, #f3ecdc 0%, #e5ddc8 100%);
        background: -ms-linear-gradient(top, #f3ecdc 0%, #e5ddc8 100%);
        background: linear-gradient(to bottom, #f3ecdc 0%, #e5ddc8 100%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f3ecdc', endColorstr='#e5ddc8', GradientType=0);
    }
    .tabs .current,
    .tabs .current:hover,
    .tabs li.current a {
        color: #ff7300;
        border-left: solid 1px #fffefa;
        border-top: solid 1px #fffefa;
        border-right: solid 1px #fffefa;
        background: #f5f4ef;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2Y1ZjRlZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top, #f5f4ef 1%, #ffffff 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #f5f4ef), color-stop(100%, #ffffff));
        background: -webkit-linear-gradient(top, #f5f4ef 1%, #ffffff 100%);
        background: -o-linear-gradient(top, #f5f4ef 1%, #ffffff 100%);
        background: -ms-linear-gradient(top, #f5f4ef 1%, #ffffff 100%);
        background: linear-gradient(to bottom, #f5f4ef 1%, #ffffff 100%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f5f4ef', endColorstr='#ffffff', GradientType=0);
    }
    .panes {
        clear: both;
        overflow: hidden;
    }
    /* tab pane styling */
    
    .panes > div {
        display: none;
        padding: 15px 10px;
        background: #fff;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        overflow: hidden;
    }
    /*======================================================================== 
  indexRankList
  ========================================================================*/
    
    .indexRankList {
        overflow: hidden;
        float: left;
        border-right: 1px dashed #ddddcf;
        width: 235px;
        padding-right: 30px;
        margin: 5px;
    }
    .indexRankList:last-child {
        border-right: none;
    }
    .indexRankList img {
        overflow: hidden;
        float: left;
        width: 90px;
        height: 130px;
        margin-right: 5px;
    }
    .indexRankList h4 {
        font-size: 12px;
        color: #fff;
        -moz-border-radius: 3px 3px 3px 0px;
        -webkit-border-radius: 3px 3px 3px 0px;
        border-radius: 3px 3px 3px 0px;
        height: 16px;
        line-height: 16px;
        display: block;
        background: #ff7300;
        padding: 0px 10px 0px;
        position: relative;
        font-weight: normal;
        margin-left: 100px;
        margin-top: 10px;
    }
    .indexRankList h4 strong {
        font-size: 10px;
    }
    .indexRankList h4:after {
        position: absolute;
        bottom: -10px;
        left: 0px;
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 10px 10px 0;
        border-color: transparent #ada28a transparent transparent;
        position: absolute;
    }
    .indexRankList p {
        font-size: 1.3em;
        color: #333;
        padding: 0px 0px 0px 0px;
        margin-left: 100px;
        line-height: 140%;
        color: #333;
    }
    .indexRankList p a {
        text-decoration: underline;
        color: #333;
    }
    .indexRankList span {
        font-size: 1.3em;
        margin-left: 100px;
        font-size: 1.2em;
        background: url(../images/icon02.png) left center no-repeat;
        padding-left: 18px;
        display: block;
    }
    .indexRankList span a {
        text-decoration: underline;
        color: #333;
    }
    /*======================================================================== 
    news
  ========================================================================*/
    
    .newsItem {
        margin: 15px 0px 15px;
        overflow: hidden;
    }
    .newsItem a {
        text-decoration: none;
    }
    .newsItem .newsImg {
        float: left;
        width: 180px;
        height: 140px;
        overflow: hidden;
    }
    .newsItem h4 {
        font-size: 1.6em;
        margin-left: 200px;
        color: #ff7300;
        padding-left: 15px;
        background: url(../images/icon05.png) left center no-repeat;
        margin-top: 0px;
        margin-bottom: 0px;
    }
    .newsItem span {
        color: #333;
        font-size: 1.3em;
        margin-left: 200px;
        display: block;
        margin-top: 5px;
        margin-bottom: 5px;
    }
    .newsItem span strong {
        background: #e7dbd1;
        padding: 2px 5px;
        font-weight: normal;
        /*margin-left: 10px;*/
    }
    .newsItem p {
        font-size: 1.3em;
        margin-left: 200px;
        display: block;
        margin-top: 0px;
        margin-bottom: 0px;
        line-height: 1.5;
    }
    .newsContent {}
    .newsContent .date {
        background: url(../images/icon05.png) left 3px no-repeat;
        font-size: 1.3em;
        line-height: 1.8;
        margin-bottom: 30px;
        padding-left: 13px;
        display: block;
    }
    .newsContent p {
        font-size: 1.3em;
        line-height: 1.8;
        padding-left: 13px;
    }
    .newsContent img {
        padding-left: 13px;
    }
    /*======================================================================== 
  頁次
  ========================================================================*/
    
    .pageNum {
        text-align: center;
        display: block;
        margin-top: 40px;
        white-space: nowrap;
        width: auto;
        font-size: 12px;
        /*width:727px;*/
        
        margin-bottom: 30px;
        clear: both;
        border-top: #ddddcf 1px dotted;
        overflow: hidden;
        padding-top: 10px;
    }
    .pageNum a {
        display: block;
    }
    .pageNum .left {
        background: url(../images/icon01.png) right center no-repeat;
        padding-right: 20px;
        margin-right: 40px;
    }
    .pageNum .right {
        background: url(../images/icon02.png) left center no-repeat;
        padding-left: 20px;
        margin-left: 40px;
    }
    .pageNum .page-sel {
        display: inline;
        margin: 0px 5px;
    }
    .pageNum .seled {
        color: #ff7300;
        text-decoration: underline;
    }
    /*======================================================================== 
    shop
  ========================================================================*/
    
    .shopClass .colorBlock {
        position: relative;
    }
    .shopClass .colorBlock p,
    .shopDepart .colorBlock p,
    .shopCenter .colorBlock p,
    .shopStore .colorBlock p {
        font-size: 1.3em;
        color: #cc9966;
        line-height: 1.5;
        margin: 10px 40px 10px 20px;
    }
    .shopClass {
        overflow: hidden;
    }
    .shopClassDiv {
        width: 90%;
        margin: 30px auto;
        clear: both;
        overflow: hidden;
        background: url(../images/shadow01.png)right top no-repeat;
    }
    .shopClassDiv img {
        float: left;
    }
    .shopClassDiv h5 {
        color: #ff7300;
        font-size: 1.5em;
        margin-left: 190px;
        margin-top: 20px;
        margin-bottom: 0px;
    }
    .shopClassDiv p {
        margin-top: 0px;
        margin-bottom: 0px;
        font-size: 1.3em;
        margin-left: 190px;
    }
    .shopDepart {
        overflow: hidden;
    }
    .shopDepartDiv {
        width: 340px;
        margin: 20px 10px 20px 0;
        overflow: hidden;
        background: url(../images/shadow02.png) center top no-repeat;
        padding-top: 15px;
        position: relative;
        /*外層採相對位置設定自身左上角為(0,0)*/
        /*以下為居家旅行必備良方*/
        
        vertical-align: top;
        display: -moz-inline-stack;
        /*FF*/
        
        display: inline-block;
        /*非IE, FF Browser*/
        
        zoom: 1;
        /*IE*/
        
        *display: inline;
        /*IE*/
        
        height: auto!important;
        height: 100px;
        min-height: 100px;
    }
    .shopDepartDiv img {
        float: left;
    }
    .shopDepartDiv h5 {
        color: #ff7300;
        font-size: 1.4em;
        margin-left: 110px;
        margin-top: 10px;
        margin-bottom: 0px;
    }
    .shopDepartDiv p {
        margin-top: 0px;
        margin-bottom: 0px;
        font-size: 1.3em;
        margin-left: 110px;
        line-height: 1.5;
    }
    .shopDepartDiv span {
        font-size: 1.3em;
        margin-left: 110px;
        line-height: 30px;
        display: block;
    }
    .shopDepartDiv span a {
        color: #333;
        padding-left: 20px;
        margin-right: 20px;
        display: inline-block;
    }
    .shopDepartDiv span a.map {
        background: url(../images/icon07.png) left center no-repeat;
    }
    .shopDepartDiv span a.link {
        background: url(../images/icon08.png) left center no-repeat;
    }
    .shopCenter {
        overflow: hidden;
    }
    .shopCenterDiv {
        width: 340px;
        margin: 20px 10px 20px 0;
        background: url(../images/shadow02.png) center top no-repeat;
        padding-top: 15px;
        position: relative;
        /*外層採相對位置設定自身左上角為(0,0)*/
        /*以下為居家旅行必備良方*/
        
        vertical-align: top;
        display: -moz-inline-stack;
        /*FF*/
        
        display: inline-block;
        /*非IE, FF Browser*/
        
        zoom: 1;
        /*IE*/
        
        *display: inline;
        /*IE*/
        
        height: auto!important;
        height: 100px;
        min-height: 100px;
    }
    .shopCenterDiv img {
        float: left;
    }
    .shopCenterDiv h5 {
        color: #ff7300;
        font-size: 1.4em;
        margin-left: 110px;
        margin-top: 10px;
        margin-bottom: 0px;
    }
    .shopCenterDiv p {
        margin-top: 0px;
        margin-bottom: 0px;
        font-size: 1.3em;
        margin-left: 110px;
        line-height: 1.5;
    }
    .shopCenterDiv span {
        font-size: 1.3em;
        margin-left: 110px;
        line-height: 30px;
        display: block;
    }
    .shopCenterDiv span a {
        color: #333;
        padding-left: 20px;
        margin-right: 20px;
        display: inline-block;
    }
    .shopCenterDiv span a.map {
        background: url(../images/icon07.png) left center no-repeat;
    }
    .shopCenterDiv span a.link {
        background: url(../images/icon08.png) left center no-repeat;
    }
    .shopStore .note {
        border-top: 1px dotted #ddddcf;
        padding: 10px 30px 0px 30px;
        font-size: 1.3em;
        color: #cc9966;
    }
    .shopStore .note .intro01 {
        color: #dd6863;
        background: url(../images/icon09.png) left center no-repeat;
        float: left;
    }
    .shopStore .note .iconDiv {
        margin-left: 110px;
        line-height: 280%;
    }
    .shopStore .note .intro02 {
        background: url(../images/icon10.png) left center no-repeat;
    }
    .shopStore .note .intro03 {
        background: url(../images/icon11.png) left center no-repeat;
    }
    .shopStore .note .intro04 {
        background: url(../images/icon12.png) left center no-repeat;
    }
    .shopStore .note .intro05 {
        background: url(../images/icon13.png) left center no-repeat;
    }
    .shopStore .note span {
        padding-left: 40px;
        margin-right: 10px;
        height: 25px;
        display: inline-block;
    }
    .shopStore h4 {
        font-size: 1.6em;
        color: #333;
        padding-left: 30px;
        background: url(../images/icon14.png) left center no-repeat;
        margin-bottom: 20px;
    }
    .shopStoreMap {
        float: left;
        width: 45%;
        margin-top: 20px;
    }
    .shopStoreSearch {
        float: right;
        width: 45%;
        margin-top: 20px;
    }
    .shoplistDiv {
        height: 330px;
        overflow-x: hidden;
        overflow-y: auto;
    }
    .shopSearchList {
        margin: 0px 10px 10px 10px;
        border-bottom: 1px dashed #ddddcf;
    }
    .shopSearchList h5 {
        color: #ff7300;
        font-size: 1.4em;
        margin-top: 0px;
        margin-bottom: 0px;
    }
    .shopSearchList p.address {
        margin-top: 3px;
        margin-bottom: 3px;
        font-size: 1.3em;
        line-height: 1.3;
        color: #333;
        margin-left: 0px;
        padding: 0px;
    }
    .shopSearchList span {
        font-size: 1.3em;
        line-height: 30px;
        display: block;
    }
    .shopSearchList span a {
        color: #333;
        padding-left: 20px;
        margin-right: 20px;
        display: inline-block;
    }
    .shopSearchList span a.map {
        background: url(../images/icon07.png) left center no-repeat;
    }
    .shopSearchList span a.link {
        background: url(../images/icon08.png) left center no-repeat;
    }
    .shopSearchList .equ {
        text-align: right;
        margin: 5px 0;
    }
    /*======================================================================== 
    support
  ========================================================================*/
    
    .supportQA p {
        font-size: 1.3em;
    }
    .supportQA .search {
        text-align: right;
        font-size: 1.3em;
        line-height: 25px;
        margin-bottom: 40px;
    }
    .supportQA .search:before {
        content: "";
        background: url(../images/icon14.png) left center no-repeat;
        width: 24px;
        height: 24px;
        padding-left: 30px;
        padding-top: 5px;
        padding-bottom: 5px;
        line-height: 25px;
    }
    .supportQA .list {
        margin: 0px;
        padding: 0px;
    }
    .supportQA .list li {
        background: #f5f2e9;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        padding: 10px 15px;
        display: block;
        font-size: 1.3em;
        margin-top: 15px;
        margin-bottom: 15px;
        margin-left: 0px;
        color: #ff7300;
    }
    .supportQA .list li a {
        color: #ff7300;
    }
    .supportQA a.bannerMessage {
        background: url(../images/bannerMessage.png) center center no-repeat;
        width: 335px;
        height: 116px;
        display: block;
        overflow: hidden;
        text-indent: -300%;
        float: left;
    }
    .supportQA .address {
        margin-left: 350px;
        font-size: 1.3em;
        background: #ff7300;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        padding: 10px 15px;
        color: #fff;
        margin-top: 10px;
    }
    .supportQA .address span {}
    .supportQA h3 {
        font-size: 1.5em;
        color: #ff7300;
        padding-left: 15px;
        background: url(../images/icon05.png) left center no-repeat;
    }
    .supportQA .answer {
        padding-left: 15px;
    }
    .supportQA .back {
        font-size: 1.3em;
        border-top: 1px dotted #ddddcf;
        margin-top: 40px;
        padding-top: 10px;
        text-align: right;
    }
    .supportQA .back a {
        padding-right: 20px;
        background: url(../images/icon01.png) right center no-repeat;
    }
    .supportDownload p {
        font-size: 1.3em;
    }
    .supportDownload .search {
        text-align: left;
        font-size: 1.3em;
        line-height: 25px;
        margin-bottom: 20px;
        margin-top: 30px;
    }
    .supportDownload .search:before {
        content: "";
        background: url(../images/icon14.png) left center no-repeat;
        width: 24px;
        height: 24px;
        padding-left: 30px;
        padding-top: 5px;
        padding-bottom: 5px;
        line-height: 25px;
    }
    .downloadTable {
        font-size: 1.3em;
        line-height: 1.5;
        margin: 10px 0px;
    }
    .downloadTable thead th {
        background: #ada38a;
        color: #fff;
        text-align: left;
        padding: 10px 10px;
        vertical-align: top;
    }
    .downloadTable td {
        padding: 20px 30px 10px 15px;
        vertical-align: top;
        color: #333;
    }
    .downloadTable td a {
        text-decoration: underline;
        padding-left: 20px;
        background: url(../images/icon02.png) left center no-repeat;
        display: block;
        line-height: 1;
    }
    .downloadTable tbody tr {
        background: #f5f2e9 url(../images/line01.png) center bottom repeat-x;
    }
    .downloadTable td img {
        border: 1px solid #ddded0;
    }
    .supportMessage p {
        font-size: 1.3em;
    }
    .supportMessage h3 {
        padding-left: 40px;
        font-size: 1.3em;
        background: url(../images/icon19.png) left center no-repeat;
        margin-left: 30px;
    }
    .supportAfterSale .note {
        color: #ff7300;
        font-size: 1.3em;
        float: left;
    }
    .supportAfterSale .btnCard {
        width: 160px;
        height: 30px;
        display: block;
        background: url(../images/btnCard.png) center center no-repeat;
        text-indent: -300%;
        overflow: hidden;
        float: right;
        margin-top: 10px;
        margin-right: 20px;
    }
    .supportAfterSale .btnMessage {
        width: 112px;
        height: 30px;
        display: block;
        background: url(../images/btnMessage.png) center center no-repeat;
        text-indent: -300%;
        overflow: hidden;
        float: right;
        margin-top: 10px;
        margin-right: 20px;
    }
    .supportAfterSale .search {
        font-size: 1.3em;
        line-height: 25px;
        margin-top: 30px;
        margin-bottom: 40px;
        margin-left: 10px;
    }
    .supportAfterSale .search:before {
        content: "";
        background: url(../images/icon14.png) left center no-repeat;
        width: 24px;
        height: 24px;
        padding-left: 30px;
        padding-top: 5px;
        padding-bottom: 5px;
        line-height: 25px;
    }
    .supportAfterSale h3 {
        font-size: 1.5em;
        color: #ff7300;
        margin-left: 10px;
    }
    .supportAfterSale .proIntro {
        float: left;
        margin-left: 10px;
    }
    .supportAfterSale .proIntro img.proPic {
        width: 290px;
        height: 290px;
        overflow: hidden;
        border: 1px solid #dcddcf;
    }
    .supportAfterSale .proIntro .number {
        font-size: 1.3em;
        clear: both;
    }
    .proSaleTable {
        font-size: 1.3em;
        line-height: 1.5;
        margin: 10px 0px;
        width: 50%;
        margin-left: 320px;
    }
    .proSaleTable thead th {
        background: #ada38a;
        color: #fff;
        text-align: left;
        padding: 10px 10px;
        vertical-align: top;
    }
    .proSaleTable td {
        padding: 10px 10px 10px 10px;
        vertical-align: top;
        color: #333;
    }
    .proSaleTable tbody tr {
        background: #f5f2e9 url(../images/line01.png) center bottom repeat-x;
    }
    .supportAfterSale .notePro {
        color: #ff7300;
        font-size: 1.3em;
        margin-top: 30px;
        margin-bottom: 30px;
        float: left;
    }
    .supportAfterSale .serviceIntro {
        padding: 0 20px 30px;
    }
    .supportAfterSale .serviceIntro p {
        font-size: 1.3em;
    }
    .supportAfterSale .serviceIntro h1 {
        font-size: 1.5em;
        color: #ff6b00;
        margin-top: 30px;
    }
    .supportAfterSale .serviceIntro ol {
        list-style: decimal;
        padding-left: 20px;
        margin-left: 10px;
        font-size: 1.3em;
    }
    .supportAfterSale .serviceIntro strong {
        color: #ff7300;
    }
    .serviceIntroTable {
        width: 600px;
        font-size: 1.3em;
        border-top: 1px solid #ccc;
    }
    .serviceIntroTable th {
        background: #ff7300;
        color: #fff;
        text-align: center;
        border-bottom: 1px solid #ccc;
        border-right: 1px solid #ccc;
    }
    .serviceIntroTable tr {
        border-left: 1px solid #ccc;
    }
    .serviceIntroTable td {
        vertical-align: middle;
        border-bottom: 1px solid #ccc;
        border-right: 1px solid #ccc;
        padding: 5px 10px;
    }
    .serviceIntro > div {
        margin-top: 30px;
    }
    .serviceIntro ul {
        font-size: 1.3em;
        margin: 0px 0 0 0;
        padding: 0;
        color: #666;
        float: left;
    }
    .serviceIntro ul li.title {
        color: #ff6b00;
    }
    .serviceIntro ul span {
        color: #333;
    }
    .serviceIntro div {
        overflow: hidden;
    }
    .serviceIntro .googleMap {
        width: 150px;
        height: 150px;
        display: block;
        border: 1px solid #ccc;
        margin-left: 450px;
    }
    .epaperDiv p {
        font-size: 1.3em;
        margin-left: 30px;
    }
    .epaperDiv .formDiv li label {
        width: 6em;
    }
    .epaperDiv .formDiv li div.inputDiv {
        margin-left: 6em;
    }
    .catalogDiv strong {
        font-size: 1.3em;
    }
    .catalogDiv ol {
        margin: 10px;
        padding: 0px;
    }
    .catalogDiv ol li {
        font-size: 1.3em;
        padding: 0px;
        list-style: decimal;
        margin-left: 30px;
    }
    .catalogDiv p {
        font-size: 1.3em;
        margin-left: 30px;
    }
    .catalogDiv em {
        color: #990000;
    }
    .catalogDiv .formDiv.style01 li label {
        width: 3em;
    }
    .catalogDiv .formDiv.style01 li div.inputDiv {
        margin-left: 3em;
    }
    .catalogDiv .formDiv.style02 li label {
        width: 15em;
    }
    .catalogDiv .formDiv.style02 li div.inputDiv {
        margin-left: 15em;
    }
    .catalogDiv .colorBlock p,
    .catalogDiv .colorBlock strong {
        font-size: 1.3em;
        margin-left: 30px;
    }
    /*======================================================================== 
  warrentyCardContent
  ========================================================================*/
    
    .warrentyCardContent {}
    .warrentyCardContent .CardTitle {
        width: 484px;
        height: 72px;
        background: #f5f2e9 url(../images/privacyTitle.png) center center no-repeat;
        text-indent: -300%;
        overflow: hidden;
        display: block;
        clear: left;
        margin-bottom: 30px;
    }
    .warrentyCardContent p.cardIntro {
        font-size: 1.3em;
        width: 760px;
        margin: 20px auto;
    }
    .warrentyCardContent p.cardIntro > em {
        display: block;
        text-align: right;
        width: 100%;
    }
    .warrentyCardDiv strong {
        font-size: 1.3em;
    }
    .warrentyCardDiv p {
        font-size: 1.3em;
        margin-left: 30px;
    }
    .warrentyCardDiv em {
        color: #990000;
    }
    .warrentyCardDiv .formDiv.style01 li label {
        width: 3em;
    }
    .warrentyCardDiv .formDiv.style01 li div.inputDiv {
        margin-left: 3em;
    }
    .warrentyCardDiv .formDiv.style02 li label {
        width: 15em;
    }
    .warrentyCardDiv .formDiv.style02 li div.inputDiv {
        margin-left: 15em;
    }
    .warrentyCardDiv .colorBlock p,
    .warrentyCardDiv .colorBlock strong {
        font-size: 1.3em;
        margin-left: 30px;
    }
    .warrentyCardDiv .formDiv.style01 li label {
        width: 7em;
    }
    .warrentyCardDiv .formDiv.style01 li div.inputDiv {
        margin-left: 7em;
    }
    .warrentyCardDiv .formDiv.style02 li label {
        width: 7em;
    }
    .warrentyCardDiv .formDiv.style02 li div.inputDiv {
        margin-left: 7em;
    }
    .warrentyCardDiv .formDiv.style03 li label {
        width: 8em;
    }
    .warrentyCardDiv .formDiv.style03 li div.inputDiv {
        margin-left: 8em;
    }
    .knowHow a {
        color: #990000;
        text-decoration: underline;
    }
    .btnCard {
        text-align: center;
    }
    .btnCard input[type="button"] {
        font-size: 1.3em;
        margin: 30px
    }
    .yellowBlock {
        background: #ffffcc;
        border: 1px solid #ffcc66;
        overflow: hidden;
    }
    .warrentyCardDiv .yellowBlock .cardPic {
        width: 153px;
        height: 153px;
        overflow: hidden;
        border: 3px dashed #a0a0a0;
        float: right;
        margin: 10px 80px 10px 0;
    }
    .yellowBlock.protect {
        padding: 20px 20px;
        margin: 20px auto;
        width: 670px;
        display: block;
        font-size: 1.3em;
    }
    /*======================================================================== 
  production 產品介紹
  ========================================================================*/
    
    .proMainDivList {
        width: 220px;
        float: left;
        margin: 0px 10px 30px 0px;
    }
    .proMainDivList a {
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "微軟正黑體", sans-serif;
        font-size: 1.5em;
        color: #000;
        background: url(../images/icon20.png) left center no-repeat;
        padding-left: 33px;
        line-height: 2em;
    }
    .proMainDivList .proMainImg {
        width: 220px;
        height: 175px;
    }
    .catalogDiv p {
        font-size: 1.3em;
        margin: 0 0 20px 0;
        padding: 0;
    }
    .catalogDiv .catelogPic {
        margin: 0 auto 30px;
        clear: both;
        display: block;
        width: 180px;
        border: 1px #ccc solid;
        padding: 5px;
    }
    .catalogDiv .catelog01 {
        float: left;
    }
    .catalogDiv .catelog02 {
        float: right;
    }
    .newsSample {
        overflow-y: scroll;
        overflow-x: hidden;
        height: 100px;
    }
    .newsSample a {
        font-size: 1.3em;
        display: block;
    }
    .newsSample a span {
        margin-right: 10px;
    }
    .proList h3.proTitle {
        font-size: 1.6em;
        padding-left: 15px;
        background: url(../images/icon05.png) left center no-repeat;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: -15px;
    }
    .proList p {
        font-size: 1.3em;
        line-height: 1.5;
        margin-bottom: 40px;
    }
    .proList .row {
        overflow: hidden;
        margin-bottom: 25px;
    }
    .proList .row .proListDiv {
        width: 300px;
        background: #f7eee6;
        padding: 10px;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        margin-right: 25px;
        float: left;
        margin-bottom: -9999px;
        padding-bottom: 9999px;
    }
    .proList .proListDiv a {
        font-size: 1.3em;
        background: #ffffff;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        display: block;
        padding: 5px 10px;
        margin-bottom: 10px;
    }
    .proList .proListDiv p {
        line-height: 1.5;
    }
    .proList .proListDiv .proListImg {
        width: 300px;
        height: 175px;
    }
    .functionLink {
        overflow: hidden;
    }
    .functionLink p {
        font-size: 1.3em;
    }
    .functionLink a.linkWay {
        background: #fcfaf8 url(../images/icon02.png) 6px center no-repeat;
        border: solid 1px #ddddcf;
        -moz-border-radius: 3px 3px 3px 3px;
        -webkit-border-radius: 3px 3px 3px 3px;
        border-radius: 3px 3px 3px 3px;
        padding: 5px 6px 5px 25px;
        margin: 20px 0 0;
        float: right;
    }
    .functionEdit {}
    .proMainContent {
        padding-bottom: 15px;
        border-bottom: 1px #ddddcf dotted;
        overflow: hidden;
        margin-bottom: 20px;
    }
    .proScroll {
        background: #f7eee5;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        padding: 10px;
        margin: 0 0 0 0;
        float: left;
        width: 370px;
    }
    .proScroll #image_wrap {
        width: 365px;
        padding: 0;
        text-align: center;
    }
    .proScroll .scrollable {
        /* required settings */
        
        position: relative;
        overflow: hidden;
        width: 340px;
        height: 77px;
    }
    /*
   root element for scrollable items. Must be absolutely positioned
   and it should have a extremely large width to accomodate scrollable
   items.  it's enough that you set the width and height for the root
   element and not for this element.
*/
    
    .proScroll .ScrollImageDiv {
        margin-top: 10px;
    }
    .proScroll .scrollable .items {
        /* this cannot be too large */
        
        width: 20000em;
        position: absolute;
        clear: both;
    }
    .proScroll .items div {
        float: left;
        width: 340px;
    }
    /* single scrollable item */
    
    .proScroll .scrollable img {
        float: left;
        margin: 0px 4px 0px 4px;
        background-color: #fff;
        border: 1px solid #ccc;
        width: 75px;
        height: 75px;
    }
    /* active item */
    
    .proScroll .scrollable .active {
        border: 1px solid #000;
        position: relative;
        cursor: default;
    }
    /* this makes it possible to add next button beside scrollable */
    
    .proScroll .scrollable {
        float: left;
    }
    /* prev, next, prevPage and nextPage buttons */
    
    .proScroll a.browse {
        display: block;
        width: 11px;
        height: 17px;
        float: left;
        cursor: pointer;
        font-size: 1px;
        margin-top: 30px;
    }
    /* right */
    
    .proScroll a.right {
        background: url(../images/arrowScrollRight.png) center no-repeat;
    }
    /* left */
    
    .proScroll a.left {
        background: url(../images/arrowScrollLeft.png) center no-repeat;
    }
    /* disabled navigational button */
    
    .proScroll a.disabled {
        visibility: hidden !important;
    }
    .proIntroDetail {
        margin-left: 410px;
    }
    .proIntroDetail h3.proMainTitle {
        font-size: 1.6em;
        padding-left: 15px;
        background: url(../images/icon05.png) left center no-repeat;
        margin-top: 0px;
        margin-bottom: 0px;
    }
    .proIntroDetail p.intro {
        font-size: 1.3em;
        line-height: 1.5;
    }
    .proIntroDetail table.tableIntro {
        margin-top: 20px;
        border-bottom: 1px solid #e6ddc9;
    }
    .proIntroDetail table.tableIntro tr {
        border-top: 1px solid #e6ddc9;
        padding: 10px 10px;
        display: block;
    }
    .proIntroDetail table.tableIntro td.tableTitle {
        width: 5em;
        font-size: 1.2em;
        color: #000;
        line-height: 1.5;
    }
    .proIntroDetail table.tableIntro td.tableContent {
        font-size: 1.2em;
        color: #666666;
        line-height: 1.5;
    }
    .proIntroDetail .recommendLink {
        margin: 10px auto;
    }
    .proIntroDetail .recommendLink a {
        width: 140px;
        height: 40px;
        display: block;
        overflow: hidden;
        text-indent: -300%;
        margin: 5px;
        float: left;
    }
    .proIntroDetail .recommendLink a.recommendLink01 {
        background: url(../images/btnArticle.png) center center no-repeat;
    }
    .proIntroDetail .recommendLink a.recommendLink02 {
        background: url(../images/btnRecommend.png) center center no-repeat;
    }
    .proIntroDetail .proIntroEditor {}
    .OtherProDiv {
        overflow: hidden;
        clear: both;
    }
    .OtherProDiv h4 {
        font-size: 1.6em;
        padding-left: 15px;
        background: url(../images/icon05.png) left center no-repeat;
        margin-top: 0px;
        margin-bottom: 10px;
    }
    .proMainContentDiv .skim {
        border-top: 1px dotted #ddddcf;
        margin-top: 40px;
        padding-top: 10px;
    }
    .proMainContentDiv .skim a {
        background: url(../images/btnBrowse.png) center center no-repeat;
        width: 125px;
        height: 30px;
        display: block;
        overflow: hidden;
        text-indent: -300%;
        float: right;
        margin-bottom: 20px;
    }
    .proMainContentDiv .back {
        font-size: 1.3em;
        border-top: 1px dotted #ddddcf;
        margin-top: 40px;
        padding-top: 10px;
        text-align: right;
    }
    .proMainContentDiv .back a {
        padding-right: 20px;
        background: url(../images/icon01.png) right center no-repeat;
    }
    .ScrollOtherPro {
        margin: 0 auto;
    }
    .ScrollOtherPro .scrollable {
        /* required settings */
        
        position: relative;
        overflow: hidden;
        width: 625px;
        height: 150px;
        background: #fff;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        padding: 5px;
    }
    /*
   root element for scrollable items. Must be absolutely positioned
   and it should have a extremely large width to accomodate scrollable
   items.  it's enough that you set the width and height for the root
   element and not for this element.
*/
    
    .ScrollOtherPro .scrollable .items {
        /* this cannot be too large */
        
        width: 20000em;
        position: absolute;
        clear: both;
    }
    .ScrollOtherPro .items div {
        float: left;
        width: 635px;
    }
    /* single scrollable item */
    
    .ScrollOtherPro .scrollable a {
        float: left;
        margin: 0px 4px 0px 4px;
        width: 117px;
    }
    .ScrollOtherPro .scrollable a span {
        font-size: 1.2em;
        line-height: 1.5;
        display: block;
        padding: 0 5px;
    }
    .ScrollOtherPro .scrollable img {
        background-color: #fff;
        border: 1px solid #ccc;
        width: 115px;
        height: 115px;
    }
    /* active item */
    
    .ScrollOtherPro .scrollable .active {
        border: 1px solid #000;
        position: relative;
        cursor: default;
    }
    /* this makes it possible to add next button beside scrollable */
    
    .ScrollOtherPro .scrollable {
        float: left;
    }
    /* prev, next, prevPage and nextPage buttons */
    
    .ScrollOtherPro a.browse {
        display: block;
        width: 11px;
        height: 20px;
        float: left;
        cursor: pointer;
        font-size: 1px;
        margin: 70px 5px 0;
    }
    /* right */
    
    .ScrollOtherPro a.right {
        background: url(../images/arrowScrollRight.png) center no-repeat;
    }
    /* left */
    
    .ScrollOtherPro a.left {
        background: url(../images/arrowScrollLeft.png) center no-repeat;
    }
    /* disabled navigational button */
    
    .ScrollOtherPro a.disabled {
        visibility: hidden !important;
    }
    .recommendContentDiv {
        width: 850px;
        padding: 10px;
        text-align: left;
    }
    .recommendContentDiv h1 {
        font-size: 1.8em;
        line-height: 2;
        background: url(../images/icon21.png) left center no-repeat;
        padding-left: 30px;
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "微軟正黑體", sans-serif;
        margin: 0px;
    }
    .recommendContentDiv .colorDiv {
        background: #f7eee5;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        padding: 0px 10px 10px;
        overflow: hidden;
        margin-bottom: 20px;
    }
    .recommendContentDiv h2 {
        background: #fff;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        font-size: 1.6em;
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "微軟正黑體", sans-serif;
        padding: 5px 10px;
        margin: 10px 0px;
    }
    .recommendContentDiv h2 span {
        float: right;
        color: #ff6600;
        font-size: 13px;
    }
    .recommendContentDiv .mainStyleDiv {
        background: #fff;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        padding: 10px;
        overflow: hidden;
    }
    .recommendContentDiv .mainStyleDiv img.uploadImg {
        margin: 5px;
        width: 255px;
        height: 192px;
        overflow: hidden;
    }
    .recommendContentDiv .mainStyleDiv p {
        font-size: 1.3em;
        line-height: 1.5;
    }
    .recommendContentDiv .mainStyleDiv .youtubeDiv {
        width: 200px;
        height: 200px;
        float: left;
    }
    .recommendContentDiv .mainStyleDiv .YoutubeTxt {
        margin-left: 220px;
        display: block;
    }
    .recommendFormDiv {
        width: 850px;
        padding: 10px;
        text-align: left;
    }
    .recommendFormDiv h1 {
        font-size: 1.8em;
        line-height: 2;
        background: url(../images/icon22.png) left center no-repeat;
        padding-left: 30px;
        font-family: Verdana, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "微軟正黑體", sans-serif;
        margin: 0px;
    }
    .recommendFormDiv .colorDiv {
        background: #f7eee5;
        -moz-border-radius: 5px 5px 5px 5px;
        -webkit-border-radius: 5px 5px 5px 5px;
        border-radius: 5px 5px 5px 5px;
        padding: 0px 10px 10px;
        overflow: hidden;
        margin-bottom: 20px;
    }
    /*======================================================================== 
  formDiv
  ========================================================================*/
    
    .formDiv {
        font-size: 1.3em;
    }
    .formDiv li {
        line-height: 20px;
        text-align: left;
        margin-bottom: 10px;
        margin-top: 10px;
    }
    .formDiv li label {
        float: left;
        width: 10.5em;
        color: #333;
        text-align: right;
    }
    .formDiv li div.inputDiv {
        margin-left: 11em;
    }
    .formDiv li div .note {
        color: #857767;
    }
    .formDiv li div a {
        color: #f67500;
    }
    .formDiv li div input[type="checkbox"] {
        vertical-align: middle;
    }
    .btn {
        text-align: center;
    }
    .btn input[type="button"] {
        margin: 40px;
        font-size: 1.3em;
    }
    /*======================================================================== 
  privateTxt
  ========================================================================*/
    
    .privateTxt {
        text-align: left;
        font-size: 1.3em;
    }
    .privateTxt a {
        color: #f67500;
    }
    .privateTxt .date {
        color: #f67500;
        text-align: right;
        width: 100%;
        display: block;
    }
    .privateTxt .custom-counter {
        padding-left: 10px;
        margin-left: 0;
        padding-right: 0;
        list-style-type: none;
    }
    .privateTxt ul.custom-counter strong {
        color: #f67500;
    }
    .privateTxt ul.custom-counter > li {
        margin-bottom: 10px;
        counter-increment: step-counter;
        margin-left: 30px;
    }
    .custom-counter > li::before {
        content: counter(step-counter);
        margin-right: 5px;
        margin-left: -30px;
        color: #f67500;
        padding: 3px 8px;
        font-weight: bold;
    }
    .privateTxt ul.custom-counter > li ol,
    .privateTxt ul.custom-counter > li li {
        margin-left: 0;
        padding-left: 0;
    }
    /*======================================================================== 
  siteMapDiv
  ========================================================================*/
    
    .siteMapDiv {
        width: 850px;
        padding: 10px;
        text-align: left;
    }
    .siteMapDiv .mapList {
        float: left;
        display: block;
        margin: 10px 20px;
        border: 1px #ccc dotted;
        padding: 10px;
    }
    .siteMapDiv .mapList a:hover {
        text-decoration: underline;
    }
    .siteMapDiv .mapList dt {
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        background: #ff7300;
        color: #fff;
        display: block;
        margin-bottom: 5px;
        font-size: 1.3em;
        line-height: 1.3em;
        padding: 5px 10px;
        text-decoration: none;
    }
    .siteMapDiv .mapList dt a {
        color: #fff;
        /* border-bottom: 1px #fff solid;
     padding-bottom: 1px;*/
    }
    .siteMapDiv .mapList dd a {
        /* border-bottom: 1px #333 solid;
     padding-bottom: 1px;*/
    }
    .siteMapDiv .mapList dd {
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        background: #cfc3b5;
        color: #333;
        display: block;
        margin: 0 2px 5px 2px;
        font-size: 1.3em;
        line-height: 1.3em;
        padding: 5px 10px;
        text-decoration: none;
    }
    .siteMapDiv .mapList dd.pro {
        float: left;
    }
    /*======================================================================== 
  aboutDiv
  ========================================================================*/
    
    .aboutDiv {}
    .aboutDiv h3 {}
    .aboutDiv h3 {
        background: url(../images/icon05.png) left 8px no-repeat;
        font-size: 1.8em;
        line-height: 1.8;
        padding-left: 13px;
        display: block;
        margin-bottom: 0px;
        margin-top: 30px;
    }
    .aboutDiv p {
        font-size: 1.3em;
        line-height: 1.8;
        margin: 0 0 0 0;

    }
    .aboutDiv p strong {
        color: #ff7300;
    }
    .aboutImg01 {
        float: left;
        margin-right: 10px;
        margin-bottom: 10px;
    }
    .aboutImg02 {
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .aboutImg03 {
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .aboutImgBusiness {
        float: left;
        margin-right: 10px;
        margin-bottom: 30px;
    }
    .aboutImgBusiness + p {
        /* margin-left: 100px; */
    }

.aboutLink{
        float: right;


  
    }
.aboutLink li{

        float: left;
        margin:0 10px 0 0;
  
    }
.aboutLink a{
        display: table-cell;
        font-size: 12px;
        color: #fff;
        background: #ff7300 url(../images/icon02.png) 5px 4px no-repeat;
        -moz-border-radius: 3px 3px 3px 3px;
        -webkit-border-radius: 3px 3px 3px 3px;
        border-radius: 3px 3px 3px 3px;
        padding: 0px 5px 0px 22px;
        line-height: 150%;
       


  
    }

    /*======================================================================== 
  aboutDiv
  ========================================================================*/

    .historyDiv{}
    .timeline {
        border-left: 2px #ccc solid;
        margin-left: 80px;
    }

    .timeline dt{
        background: #fff;
        color: #9e8465;
        margin-left: -25px;
        font-size: 2em;
        margin-top: 30px;
    }
    .timeline dd {
        clear: both;

    }

    .timeline dd strong{
        -moz-border-radius: 20px;
        -webkit-border-radius: 20px;
        border-radius: 20px;
        background: #ff7300;
        color: #fff;
        display:inline-block;
        font-size: 1.3em;
        line-height: 1.3em;
        padding: 5px;
        
        font-weight: normal;
        margin-top: -5px;
        vertical-align: top;
    }
    .timeline dd span{
        font-size: 1.3em;
        line-height: 1.3em;
        margin-left: 5px;
        display:inline-block;
        width: 80%;
        border-bottom: 1px #ccc dotted;
        padding-bottom: 2px;
        margin-bottom: 20px;

    }
 /*======================================================================== 
  aboutDiv
  ========================================================================*/
.IndustryList li{
        display:block;
        font-size: 13px;
        background: #f5f2e9 url(../images/icon02.png) 20px center no-repeat;
        border: solid 1px #ddddcf;
        -moz-border-radius: 3px 3px 3px 3px;
        -webkit-border-radius: 3px 3px 3px 3px;
        border-radius: 3px 3px 3px 3px;
        padding: 10px 5px 10px 45px;
        line-height: 150%;
        margin-top: 15px;
    }
    .IndustryList li a{

        width: 100%;
        height: 100%;
        display:block;
        
    }


    .IndustryList li a:hover{
        color: #ff7300;
        text-decoration: underline;

        
    }



    /*======================================================================== 
  Footer
  ========================================================================*/
    
    #footer {
        width: 100%;
        background-color: #eee4db;
        text-align: center;
        clear: both;
    }
    .footerDiv {
        width: 940px;
        margin: 0 auto;
        overflow: hidden;
        text-align: center;
    }
    .siteMap {
        width: 265px;
        height: 25px;
        background: url(../images/siteMap.png);
        display: block;
        overflow: hidden;
        text-indent: -300%;
        margin: 0 auto;
    }
    #footer p {
        color: #333;
        clear: none;
        float: none;
        font-size: 1.3em;
        margin-top: 10px;
    }
    #warrentyCardfooter {
        width: 100%;
        background-color: #b4a495;
        text-align: center;
        clear: both;
    }
    .warrentyCardfooterDiv {
        width: 940px;
        margin: 0 auto;
        overflow: hidden;
        text-align: center;
    }
    #warrentyCardfooter p {
        color: #fff;
        clear: none;
        float: none;
        font-size: 1.3em;
        margin-top: 10px;
    }
}


.shopBox{
	
}
.shopBox h3{
	color:#CB5F02;
	border-bottom: 1px solid #CB5F02;
	padding: 3px 0px;
}
.shopBox h3 i{
	font-size: 16px;
	margin-right: 3px;
}
.shopInfo{
	
}
.storeLine{
	margin-bottom: 25px;
}
.storeLine td{
	vertical-align: top;
}
.shopPhoto{
	background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% 150px;
}
.shopMap{
	max-height: 150px;
}
.shopMap iframe{
	
	padding-left: 18px !important;
	 -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.shopInfoTable{
	padding-right: 10px !important;
}
.shopInfoTable tr{
	/*border-bottom: 1px solid #DCDCDC;*/
}
.shopName{
	font-weight: bold;
	border-bottom: 1px solid #DCDCDC;
}
.titleH1{
	color: #FF7300;
    font: Verdana;
    margin-top: 0px;
    margin-bottom: 15px;
    line-height: 36px;
    padding-bottom: 8px;
    font-size: 26px;
    font-weight: normal;
    text-shadow: 0 0 1px rgba(0, 0, 0, .01);
    border-bottom: 1px solid #FF7300;
}