﻿  /* GLOBAL STYLES
-------------------------------------------------- */
  /* Padding below the footer and lighter body text */
  
  body {
      padding-bottom: 0px;
      color: #FFF;
      background-color: #000;
      background-image: url("../imgg/bg.jpg");
      background-repeat: repeat;
      line-height: 1.3em;
      font-family: "Arial", "微軟正黑體", "新細明體";
      overflow-x: hidden;
  }
  /* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */
  /* Special class on .container surrounding .navbar, used for positioning it into place. */
  
  .navbar-wrapper {
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      z-index: 20;
  }
  /* Flip around the padding for proper display in narrow viewports */
  
  .navbar-wrapper > .container {
      padding-right: 0;
      padding-left: 0;
  }
  
  .navbar-wrapper .navbar {
      padding-right: 15px;
      padding-left: 15px;
  }
  
  .navbar-wrapper .navbar .container {
      width: auto;
  }
  /* MARKETING CONTENT
-------------------------------------------------- */
  /* Center align the text within the three columns below the carousel */
  
  .marketing .col-sm-4 {
      margin-bottom: 0px;
      text-align: center;
  }
  
  .marketing h2 {
      font-weight: normal;
  }
  
  .marketing .col-sm-4 p {
      margin-right: 10px;
      margin-left: 10px;
  }
  
  .marketing {
      position: relative;
      display: block;
      top: 0px;
  }
  
  .container {
      max-width: 1024px;
  }
  
  .mobilehide {
      display: block;
  }
  
  .pic {
      position: relative;
      display: block;
      width: 100%;
      height: auto;
  }
  
  .paddingL {
      padding-left: 20px;
  }
  
  .paddingR {
      padding-right: 20px;
  }
  
  .padding {
      padding: 20px;
  }
  /* Featurettes
------------------------- */
  
  .featurette-divider {
      margin: 80px 0;
      /* Space out the Bootstrap <hr> more */
  }
  /* Thin out the marketing headings */
  
  .featurette-heading {
      font-weight: 300;
      line-height: 1;
      letter-spacing: -1px;
  }
  /* RESPONSIVE CSS
-------------------------------------------------- */
  
  @media (min-width: 790px) {
      /* mobile or pad size */
      /* Navbar positioning foo */
      
      .navbar-wrapper {
          margin-top: 20px;
      }
      .navbar-wrapper .container {
          padding-right: 15px;
          padding-left: 15px;
      }
      .navbar-wrapper .navbar {
          padding-right: 0;
          padding-left: 0;
      }
      /* The navbar becomes detached from the top, so we round the corners */
      
      .navbar-wrapper .navbar {
          border-radius: 4px;
      }
      /* Bump up size of carousel content */
      
      .carousel-caption p {
          margin-bottom: 20px;
          font-size: 21px;
          line-height: 1.4;
      }
      .featurette-heading {
          font-size: 50px;
      }
  }
  /* Self added
------------------------- */
  /* Head */
  
  .headPic {
      position: relative;
      display: block;
      width: 1920px;
      padding: 0;
      margin: 0;
      height: 818px;
	  left: 50%;
      margin-left: -960px;
	  background-image:url("../imgg/headbg.png");
	  background-repeat:no-repeat;
	  
  }
  .head1000{
      position: relative;
      display: block;
      width: 1000px;
      padding: 0;
      margin: 0;
      height: 610px;
	   left: 50%;
      margin-left: -500px;
  
  }
  
  .qr{
	  position:absolute;
	  width:211px;
	  height:371px;
	 background-image:url("../imgg/qr.png");
	  top:0px;
	  left:-150px;
	  display:block;
	  }
	  
   
	  
  .logo_centerit {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		display: block;
		width: 30%;
		position:absolute;
		top:30px;
		left:50%;
		margin-left:-15%;
	    z-index: 9999999;
	  
	  }
	 
  .headPic_M {
      position: relative;
      display: none;
      width: 100%;        
	  background-image:url("../imgg/top_s.png");
	  background-size:cover;
	  background-position: center top;
	  height:0;
	  padding-bottom:59.57%;
     } 
	 
	 .headLink {
	 position: absolute;
      width: 100%;
      height:0;
	  padding-bottom:59.57%;
	 }
	 
  .top_s {
      position: relative;
      width: 100%;
      height: auto;
      display: none;
      /* position: absolute*/
  }
  
  .mobileshow {
      display: none;
      min-width: 320px;
      position: relative;
  }
  
  .boxA {
      min-width: 320px;
	  max-width:100%;
      position: relative;
      display: block;
      color: ##e3e2e2;
      margin-bottom: 22px;
      min-height: 100px;
      width: 100%;    
      margin-left: auto;
      margin-right: auto;
/*       border-image: url("../imgg/boxborder.png") 87 87 87 87 stretch repeat;
	  border-style: solid;
	  border-width: 45px; */
	  background-color: #04131f;
	  border-image: url("../imgg/boxborder.png") 92 100/92px 100px repeat stretch;
      /* border-image-outset: 35px; */	 
	 padding: 50px 23px 60px 23px; 
 
  }
  
  .boxTittle{
     display: inline-block;
     border-image: url("../imgg/dobar.png") 10 100/10px 100px repeat stretch; 
     position: relative;
      width: 100%;
      height: 60px;
	  margin-left: auto;
      margin-right: auto;
	  font-size: 1.5em;
	  padding-top:20px;
	 color: #5484a7;
	 margin-bottom:10px;
     margin-top: 25px;
  
  }
  
  .boxA2 {
      position: relative;
      display: block;
      color: #331800;
      min-width: 320px;       
      padding: 100px 10px 60px 13px; 
      margin-bottom: 22px;
      min-height: 100px;
      width: 100%;
      margin-left: auto;
      margin-right: auto;
     border-image: url("../imgg/boxborder.png") 92 100/92px 100px repeat stretch;
      border-image-repeat: stretch;
      background-color: #04131f;
  }
  
  .newsbox {
      position: relative;
      display: block;
      width: 100%;
      padding: 20px;
      font-size: 1em;
      text-align: left;
      margin-top: 20px;
      width: 100%;
      min-height: 100px;
      margin-left: auto;
      margin-right: auto;
      border: 1px solid #1c363f;
	  background-color:#00070d;
    /*   border-image-source: url("../imgg/boxA_bg.png");
      border-image-slice: 6;
      border-image-repeat: stretch;
      background-image: url("../imgg/boxA.jpg"); 
      background-repeat: repeat;*/
	  overflow: hidden;
      
  }
  
   .pagebox {
      position: relative;
      display: block;
      width: 100%;
      padding: 20px;  
      text-align: left;   
      width: 100%;
      min-height: 100px;
      margin-left: auto;
      margin-right: auto;
      border: 1px solid #1c363f;
	  background-color:#00070d;  
	  overflow: hidden;
      
  } 
  
     .pageW {
	  font-size: 1.1em;
	  color: #e3e2e2;
	  line-height:1.3em;
      
     }
  
  .newsbox > .itemN:last-of-type {
      /* margin-bottom: 15px; */
  }
  /*公告小按鈕*/
  
  .topsize {
      position: relative;
      display: block;
      top: 32px;
	  margin-bottom: 12px;
  }
  
  #new {
      position: relative;
      display: inline-block;
      background-image: url("../imgg/news_btn.png");
      background-position: 0 0;
      width: 112px;
      height: 46px;
      background-repeat: no-repeat;
  }
  
  #new:hover,
  #pnews a.nowon {
      background-image: url("../imgg/news_btn.png");
      background-position: 0 -46px;
  }
  
  #act {
      position: relative;
      display: inline-block;
      background-image: url("../imgg/news_btn.png");
      background-position: -112px 0;
      width: 112px;
      height: 46px;
      background-repeat: no-repeat;
  }
  
  #act:hover,
  #pnews a.nowon2 {
      background-image: url("../imgg/news_btn.png");
      background-position: -112px -46px;
  }
  
  #refresh {
      position: relative;
      display: inline-block;
      background-image: url("../imgg/news_btn.png");
      background-position: -224px 0;
      width: 112px;
      height: 46px;
      background-repeat: no-repeat;
  }
  
  #refresh:hover,
  #pnews a.nowon3 {
      background-image: url("../imgg/news_btn.png");
      background-position: -224px -46px;
  }
  
  #system {
      position: relative;
      display: inline-block;
      background-image: url("../imgg/news_btn.png");
      background-position: -336px 0;
      width: 112px;
      height: 46px;
      background-repeat: no-repeat;
  }
  
  #system:hover,
  #pnews a.nowon4 {
      background-image: url("../imgg/news_btn.png");
      background-position: -336px -46px;
  }
  
  .iosbs {
      position: absolute;
      display: block;
      width: 100%;
      height: 42px;
      top: 215px;
      z-index: 10003;
      /*background-color:#F00;*/
  }
  
  .andbs {
      position: absolute;
      display: block;
      width: 100%;
      height: 42px;
      top: 257px;
      z-index: 10003;
      /*background-color:#fff;*/
  }
  
    .apkbs {
      position: absolute;
      display: block;
      width: 100%;
      height: 42px;
      top: 299px;
      z-index: 10003;
      /*background-color:#777;*/
  }
  
  .newsbox2 {
      position: relative;
      display: block;
      width: 100%;
      height: 50px;
      -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
      border-radius: 10px;
      /*border-width:2px;
border-color:#fad56a;
text-align:center;
border-style:solid;*/
      
      color: #fff;
      margin-top: 10px;
      background: #627d4d;
      /* Old browsers */
      /* IE9 SVG, needs conditional override of 'filter' to 'none' */
      
      background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzYyN2Q0ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxZjNiMDgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
      background: -moz-linear-gradient(top, #627d4d 0%, #1f3b08 100%);
      /* FF3.6+ */
      
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #627d4d), color-stop(100%, #1f3b08));
      /* Chrome,Safari4+ */
      
      background: -webkit-linear-gradient(top, #627d4d 0%, #1f3b08 100%);
      /* Chrome10+,Safari5.1+ */
      
      background: -o-linear-gradient(top, #627d4d 0%, #1f3b08 100%);
      /* Opera 11.10+ */
      
      background: -ms-linear-gradient(top, #627d4d 0%, #1f3b08 100%);
      /* IE10+ */
      
      background: linear-gradient(to bottom, #627d4d 0%, #1f3b08 100%);
      /* W3C */
      
      filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#627d4d', endColorstr='#1f3b08', GradientType=0);
      /* IE6-8 */
  }
  .itemNbb {
      position: relative;
      width: 100%;
      height: 49px;
      position: relative;
      display: block;
	  /* background: url("../imgg/dobar_02.jpg") repeat-x top center; */
	  border-image: url("../imgg/upbar.png") 10 100/10px 100px repeat stretch;
  }
  
   .itemNbb_left {
      position: relative;
      width:40%;
      height: 49px;  
      display: inline-block;
	  background: url("../imgg/dobar_01.jpg") top left;
	  background-repeat:no-repeat;
	  left:0px;
	   float:left;
	 
  }
  

   .itemNbb_right {
      position: relative;
	  width:40%;
      height: 49px;   
      display: inline-block;
	  background: url("../imgg/dobar_03.jpg")  top right;
	  background-repeat:no-repeat;	  
	 float:right;
  }
 
.p_itemNbb {
      position: relative;
      width: 100%;
      height: 49px;
      position: relative;
      display: block;
	  background: url("../imgg/dobar_02.jpg") repeat-x top center;
  }
  
   .p_itemNbb_left {
      position: relative;
      width:40%;
      height: 49px;  
      display: inline-block;
	  background: url("../imgg/dobar_01.jpg") top left;
	  background-repeat:no-repeat;
	  left:0px;
	   float:left;
	 
  }
  

   .p_itemNbb_right {
      position: relative;
	  width:40%;
      height: 49px;   
      display: inline-block;
	  background: url("../imgg/dobar_03.jpg")  top right;
	  background-repeat:no-repeat;	  
	 float:right;
  }
 
 
 
  .itemNbbM {
      position: relative;
      width: 100%;
      height: 35px;

      display: block;
      /*background-color:#ffba00;*/
      
      background: #fff5d5;
      /* Old browsers */
      /* IE9 SVG, needs conditional override of 'filter' to 'none' */
      
      background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZjVkNSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzkyN2U1ZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iIzg2NzE1MSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkM2JlOWMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
      background: -moz-linear-gradient(top, #fff5d5 0%, #927e5e 50%, #867151 51%, #d3be9c 100%);
      /* FF3.6+ */
      
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff5d5), color-stop(50%, #927e5e), color-stop(51%, #867151), color-stop(100%, #d3be9c));
      /* Chrome,Safari4+ */
      
      background: -webkit-linear-gradient(top, #fff5d5 0%, #927e5e 50%, #867151 51%, #d3be9c 100%);
      /* Chrome10+,Safari5.1+ */
      
      background: -o-linear-gradient(top, #fff5d5 0%, #927e5e 50%, #867151 51%, #d3be9c 100%);
      /* Opera 11.10+ */
      
      background: -ms-linear-gradient(top, #fff5d5 0%, #927e5e 50%, #867151 51%, #d3be9c 100%);
      /* IE10+ */
      
      background: linear-gradient(to bottom, #fff5d5 0%, #927e5e 50%, #867151 51%, #d3be9c 100%);
      /* W3C */
      
      filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#fff5d5', endColorstr='#d3be9c', GradientType=0);
      /* IE6-8 */
      
      -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
      border-radius: 10px;
      border-width: 2px;
      border-color: #fad56a;
      border-style: solid;
      -moz-box-shadow: 1px 1px 1px #816d4d;
      -webkit-box-shadow: 1px 1px 1px #816d4d;
      box-shadow: 1px 1px 1px #816d4d;
      margin-bottom: 20px;
  }
  
  .offb {
      opacity: 0.4;
      cursor: initial;
  }
  /*.downb{ margin-top:15px;}*/
  
  .boxA4 {
      position: relative;
      display: block;
      width: 100%;
      min-width: 320px;
      padding: 20px;
      padding-top: 30px;
      padding-bottom: 30px;
      margin-bottom: 22px;
      min-height: 100px;
      background-image: url("../imgg/boxbg.jpg");
      -moz-border-radius: 20px;
      -webkit-border-radius: 20px;
      border-radius: 20px;
      color: #331800;
      border-style: solid;
      border-color: #fff;
      border-width: 1px;
      -moz-box-shadow: 1px 1px 8px #414141;
      -webkit-box-shadow: 1px 1px 8px #414141;
      box-shadow: 1px 1px 8px #414141;
  }
  
  .footerA {
      display: block;
      width: 100%;
      min-height: 120px;
  /*     border-top-width: medium;
      border-top-style: double;
      border-top-color: #c1a900; */
      padding-top: 20px;
  }
  
  .boxA3 {
      position: relative;
      display: block;
      width: 100%;
      padding-top: 0px;
      padding-bottom: 0px;
      margin-bottom: 0px;
      min-height: 100px;
  }
  
  .boxA3s {
      position: relative;
      display: block;
      width: 100%;
      padding-top: 0px;
      padding: 15px;
      padding-bottom: 0px;
      margin-bottom: 0px;
      min-height: 100px;
      /*background-color:#fbc929;*/
      
      top: 0px;
      color: #fff;
  }
  
  .box500 {
      position: relative;
      display: block;
      width: 500px;
      height: 500px;
      background-color: #999;
      color: #fff;
      text-align: center;
  }
  
  .itemLeft {
      position: relative;
      display: inline-block;
      height: 30px;
      width: 68%;
      overflow: hidden;
      line-height: 1.5em;
  }
  
  .itemRight {
      position: absolute;
      display: inline-block;
      height: 30px;
      width: 30%;
      float: right;
      overflow: hidden;
      text-align: right;
      line-height: 1.5em;
  }
  
  .itemN a {
      color: #e3e2e2;
      font-weight: bold;
  }
  
  .newN a {
      color: #874D2E;
  }
  
  .itemN a:hover {
      color: #5484a7;
      text-decoration: none;
  }
  
  .itemN {
      position: relative;
      display: inline-block;
      width: 100%;
      height: 33px;
	  border:1px;
      border-bottom-style: dotted;
      border-bottom-color: #5484a7;
      margin-bottom: 8px;
	  
	  
	  
  }
  
  #newA {
      display: none;
  }
  
  #actA {
      display: none;
  }
  
  #refreshA {
      display: none;
  }
  
  #systemA {
      display: none;
  }
  
  .cit {
      position: relative;
      display: block;
      width: 1px;
      height: 1px;
      margin-left: auto;
      margin-right: auto;
      margin-top: -9%;
  }
  
  .cit2 {
      position: relative;
      display: none;
      width: 100%;
      padding: 0;
      margin: 0;
      min-height: 100px;
	  height:250px;
	  
  }
  
    .cit_S {
      position: relative;
      display: none;
      width: 100%;
      padding: 0;
      margin: 0;
	  margin-top:-40px;
	  height:0;
	  padding-bottom:11.06%;
	  
      
	  
  }
  
  .p_in{
  width: 100%;
  max-width: 127px;
 min-width: 127px;
  position: relative;
  display: block;
  margin: auto;
  }
  
 .slong_in{
  width: 100%;
  max-width: 571px;
  position: relative;
  display: block;
  margin: auto;
  }
  
 .pagebt_bg01{
     min-width: 90px;
      position: relative;
      display: block;
      margin-bottom: 10px;
      min-height: 51px;
      width: 100%;	
      border-image: url("../imgg/pagebtn_b.png")  16 16 16 16 stretch repeat;
	  border-style: solid;
	  border-width: 16px;
	  background-color: #163a54;
	  background-clip: content-box;
 
 } 
 
 .pagebt_bg01:hover{
 opacity:0.6;
/*      border-image: url("../imgg/pagebtn_ho.png")  16 16 16 16 stretch repeat;
	  border-style: solid;
	  border-width: 16px;
	  background-color: #ca8918; */
 }
 
  .pagebt_bg02{
     min-width: 90px;
      position: relative;
      display: block;
      margin-bottom: 10px;
      min-height: 51px;
      width: 100%;	
      border-image: url("../imgg/pagebtn_c.png")  16 16 16 16 stretch repeat;
	  border-style: solid;
	  border-width: 16px;
	  background-color: #226d81;
	  background-clip: content-box;
 
 } 
 
 .pagebt_bg02:hover{
 
  opacity:0.6;
/*      border-image: url("../imgg/pagebtn_ho.png")  16 16 16 16 stretch repeat;
	  border-style: solid;
	  border-width: 16px;
	  background-color: #ca8918; */
 }
  
  .cits2 {
      position: relative;
      display: block;
      width: 100%;
      margin-top: 10px;
  }
  
  .cits3 {
      position: relative;
      display: block;
      width: 100%;
      margin-top: 10px;
      top: 240px;
  }
  
  .cits3in {
      position: relative;
      display: block;
      width: 317px;
      height: 96px;
      margin-left: auto;
      margin-right: auto;
  }
  
  .cits2in {
      position: relative;
      display: block;
      width: 236px;
      height: 70px;
      margin-left: auto;
      margin-right: auto;
  }
  
  .cits2in:hover {
      opacity: 0.9;
  }
  
  .colorTd {
      font-size: 1.3em;
      color: #fff;
      margin-top: 10px;
      margin-bottom: 5px;
      text-shadow: 2px 2px 2px #000;
  }
  
  .colorTd2 {
      font-size: 1em;
      color: #00fffc;
      margin-top: 10px;
      margin-bottom: 5px;
      text-shadow: 2px 2px 2px #000;
  }
  
  .colorGd {
      font-size: 1.3em;
      color: #00fffc;
      margin-top: 10px;
      margin-bottom: 5px;
      text-shadow: 2px 2px 2px #000;
  }
  
  .w100m {
      position: relative;
      width: 100%;
      min-width: 320px;
      /*display:none;
z-index:9003;*/
  }
  
  .city {
      position: relative;
      display: block;
      margin-top: 10px;
      width: 240px;
      margin-left: auto;
      margin-right: auto;
      height: 40px;
  }
  
  .topbars {
      position: relative;
      display: block;
      width: 1920px;
      height: 208px;
      background-repeat: no-repeat;
      background-position: center;
      background-image: url("../imgg/bar.png");
      left: 50%;
      margin-left: -960px;
      margin-top: 20px;
     
      /*overflow:hidden;*/
      /*z-index:20;*/
  }
  
  .topbarcent{
	  position: relative;
      display: block;
      width: 900px;
      height: 84px;
      background-repeat: no-repeat;
      background-position: center;
      left: 50%;
      margin-left: -450px;
     
  }
  
  .topbars_2 {
      width: 100%;
      height: auto;
      position: absolute;
      /*right:0px; left:0;top:85%bottom:4.7%;*/
  }
  
  .topbars_2 ul {
      width: 100%;
      max-width: 1100px;
      text-align: center;
      margin-top: 6%;
      margin-left: -2%;
  }
  
  .topbars_2 ul li {
      width: 100%;
      height: auto;
      margin: 0 0.05% 0 0;
      padding: 0;
      display: inline;
      text-align: center;
  }
  
  .topbars_2 ul li img {
      width: 22%;
      max-width: 199px;
      height: auto;
  }
  
  .topbars_2 ul li a img {
      border: 0;
      outline: none
  }
  
  .topbars_2 ul li a:hover {
      margin: 0px;
      position: relative;
      top: -1px;
  }
  
  .fbbox {
      position: relative;
      display: block;
      height: 130px;
      width: 290px;
      margin-left: auto;
      margin-right: auto;
      background-color: #564454;
  }
  
  .ppm {
      position: absolute;
      display: block;
      width: 100%;
      min-width: 320px;
  }
  
  .pp {
      position: relative;
      display: block;
      width: 100%;
  }
  
  .txt {
      display: none;
  }
  
  .wordW {
      color: #fff;
  }
  
  .height50 {
      height: 30px;
  }
  
  .lines {
      position: relative;
      display: block;
      width: 100%;
      height: 1px;
      text-shadow: 3px 3px 8px #000;
      background-color: #fff;
  }
  
  .height480 {
      position: relative;
      display: block;
      height: 480px;
      width: 1px;
  }
  
  .logopos {
      position: relative;
      display: block;
      top: -35px;
  }
  
  .alignR {
      text-align: right;
  }
  
  .alignL {
      text-align: left;
  }
  
  .alignC {
      text-align: center;
  }
  
  .paddT {
      padding-top: 20px;
      position: absolute;
      display: block;
      height: 100px;
      width: 100%;
  }
  
  .topa {
      position: relative;
      display: none;
      width: 100%;
  }
  
  .paddT2 {
      padding-top: 0px;
      position: relative;
      display: block;
      top: 0px;
  }
  
  #div1 {
      text-align: right;
  }
  
  #div3 {
      text-align: left;
  }
  
  .overfh {
      overflow: hidden;
  }
  
  .centerit {
      text-align: center;
      margin-left: auto;
      margin-right: auto;
      display: block;
      max-width: 574px;
      width: 30%;
      min-width: 130px;
  }
  
  .widpic {
      position: absolute;
      display: block;
      width: 100%;
  }
  
  .coverM {
      position: relative;
      display: block;
      top: 230px;
      width: 307px;
      height: 217px;
      margin-left: auto;
      margin-right: auto;
  }
  
  .coverMon {
      position: relative;
      display: block;
      width: 307px;
      height: 217px;
      background-image: url("../imgg/coverM.png");
  }
  
  .left1barA {
      position: absolute;
      display: block;
      overflow: hidden;
      width: 92px;
      height: 193px;
      left: 10px;
      top: 10px;
      background-color: #324236;
  }
  
  .left2barA {
      position: absolute;
      display: block;
      width: 92px;
      height: 193px;
      overflow: hidden;
      left: 106px;
      top: 10px;
      background-color: #324236;
  }
  
  .left3barA {
      position: absolute;
      display: block;
      overflow: hidden;
      width: 92px;
      height: 193px;
      left: 204px;
      top: 10px;
      background-color: #324236;
  }
  
  .left1bar {
      position: absolute;
      display: block;
      background-image: url("../imgg/line1.jpg");
      width: 92px;
      height: 1143px;
      left: 0px;
      top: -925px;
  }
  
  .left2bar {
      position: absolute;
      display: block;
      background-image: url("../imgg/line2.jpg");
      width: 92px;
      height: 1143px;
      left: 0px;
      top: -906px;
  }
  
  .left3bar {
      position: absolute;
      display: block;
      background-image: url("../imgg/line3.jpg");
      width: 92px;
      height: 1143px;
      left: 0px;
      top: -902px;
  }
  
  .off {
      display: none;
  }
  
  .centerit2 {
      position: relative;
      text-align: center;
      margin-left: auto;
      margin-right: auto;
      display: block;
      max-width: 374px;
      width: 30%;
      min-width: 130px;
  }
  
  .flo {
      position: relative;
      display: block;
      top: 0px;
  }
  
  #picmenu1 {
      width: 100%;
      max-height: 132px;
  }
  
  #picmenu2 {
      width: 100%;
      max-height: 152px;
  }
  
  #picmenu3 {
      width: 100%;
      max-height: 132px;
  }
  /* in 1920 */
  
  @media (max-width: 1920px) {
      .marketing {
          position: relative;
          display: block;
      }
      .toparea {
          position: relative;
          display: block;
          height: 165px;
      }
      .centerit {
          text-align: center;
          margin-left: auto;
          margin-right: auto;
          display: block;
          max-width: 574px;
          width: 50%;
          min-width: 130px;
      }
      .centerit2 {
          text-align: center;
          margin-left: auto;
          margin-right: auto;
          display: block;
          max-width: 374px;
          width: 50%;
          min-width: 130px;
      }
      .boxA4 {
          position: relative;
          display: block;
      }
  }
  /* in 1680 */
  
  @media (max-width: 1680px) {
      .marketing {
          position: relative;
          display: block;
      }
      .cit {
          margin-top: -6.5%;
      }
      .boxA4 {
          position: relative;
          display: block;
      }
      .widpic {
          width: 100%;
          margin-left: auto;
          margin-right: auto;
      }
      .centerit {
          text-align: center;
          margin-left: auto;
          margin-right: auto;
          display: block;
          max-width: 574px;
          width: 40%;
          min-width: 220px;
      }
      .centerit2 {
          text-align: center;
          margin-left: auto;
          margin-right: auto;
          display: block;
          max-width: 374px;
          width: 40%;
          min-width: 220px;
      }
  }
  /* in 1400 */
  
  @media (max-width: 1400px) {
      .marketing {
          position: relative;
          display: block;
      }
      /*	.toparea{
	position:relative;
	display:block;
	height: 100px;
	}*/
      
      .boxA4 {
          position: relative;
          display: block;
      }
  }
  /* in 1200 (default size)*/
  
  @media (max-width: 1200px) {
      #div1 {
          text-align: center;
      }
      #div3 {
          text-align: center;
      }
      .marketing {
          position: relative;
          display: block;
      }
      .topbars_2 {
          display: block;
      }
      .boxA4 {
          position: relative;
          display: block;
      }
	  
	 .qr{
	
	  left:0px;
	  
	  }
  }
  /* in 992 (default size)*/
  
  @media (max-width: 1023px) {
      .topbars,
      .qr {
          display: none;
      }
      .navbar-inverse,
      .cit2,
      .topbars_2,
      .cit_S    
	  {
          display: block !important;
		 
		 
      }
	      
      .toparea {
          height: 5em;
		  display:none;
      }
      #ab {
          min-height: 730px;
      }
      .ppm {
          position: absolute;
          display: block;
          width: 100%;
      }
      .mobilehide {
          display: none;
      }
      .mobileshow {
          display: block;
      }
      .marketing {
          position: relative;
          display: block;
      }
	     .headPic {
	     display:none;
      }
	  .headPic_M {
         display: block;
      
     } 
	  
	  .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
		  min-height: 1px;
		  padding-left: 3px; 
		  padding-right: 3px; 
		  position: relative;
        } 
  .logo_centerit {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		display: block;
		width: 50%;
		position:absolute;
		top:30px;
		left:50%;
		margin-left:-25%;
		z-index: 9999999;
	  
	  }
		
  }
  /* in 790 (default size)*/
  
  @media (max-width: 790px) {
      .pp,
      .cit,
      .topa,
      .apkbs,
      .iosbs,
      .andbs
	   {
          display: none;
      }
      .headPic {
	     display:none;
      }
	  
	 .headPic_M {
         display: block;
      
     } 
      .top_s,
      .navbar-inverse,
      .cit2,
      .topbars_2 {
          display: block !important;
		 
      }
      .col-sm-12,
      .top_s {
          padding: 0;
      }
      .txt {
          display: block;
          margin: 15px 10px;
      }
      .mobilehide {
          display: none;
      }
      .mobileshow {
          display: block;
      }
      .boxA3s {
          text-align: center;
      }
      .marketing {
          position: relative;
          display: block;
          margin-top: 5%;
      }
      .toparea {
          height: 0;
		   display:none;
      }
   
  }
  
  @media (max-width: 640px) {
      .marketing {
          margin-top: 3%;
      }
	 .cit2 {
      
      } 
	  
	  	.logo_centerit {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		display: block;
		width: 70%;
		position:absolute;
		top:10px;
		left:50%;
		margin-left:-35%;
		z-index: 9999999;
	  
	  }
	 
  }
  /* in 900 (default size)*/
  
  @media (max-width: 520px) {
      /* Just for adjust top background */
      
      .itemN a .itemRight {
          color: #6a3e00;
          font-weight: 700;
      }
      #pnews {
          position: relative;
          /* display: inline; */
          overflow: hidden;
          background-repeat: no-repeat;
      }
   
      .itemLeft {
          position: relative;
          display: inline-block;
          height: 30px;
          font-size: 0.8em;
          width: 70%;
          overflow: hidden;
          line-height: 2em;
      }
      .itemRight {
          position: relative;
          display: inline-block;
          height: 30px;
          width: 28%;
          float: right;
          overflow: hidden;
          font-size: 0.8em;
          text-align: right;
          line-height: 2em;
      }
      .itemN {
          position: relative;
          display: inline-block;
          width: 100%;
          height: 30px;
          border-bottom-style: dotted;
          border-bottom-color: #331800;
		  
      }
      .newsbox {
          padding: 10px;
          padding-top: 20px;
         
      }
      .toparea {
          height: 0;
		   display:none;
      }
      .cit2 {
        
      }
      .marketing {
          margin-top: 0.25%;
      }
      .itemNbb {
          margin-bottom: 10px;
          margin-top: -10px;
      }
	  
	  .logo_centerit {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
		display: block;
		width: 70%;
		position:absolute;
		top:10px;
		left:50%;
		margin-left:-35%;
		z-index: 9999999;
	  
	  }
  }
  /* Overlap */
  
  .navbar-inverse {
      background-color: #000;
      background-repeat: no-repeat;
      background-position: center top;
      border-color: #000;
      display: none;
  }
  
  .navbar {
      margin: 0;
  }
  /*.dropdown-menu{background-color:#000;}*/
  
  .navbar-inverse .navbar-nav > li > a {
      color: #ddd;
      font-size: 1.1em;
      font-weight: 700;
  }
  
  .navbar-inverse .navbar-nav > .active > a,
  .navbar-inverse .navbar-nav > .active > a:hover,
  .navbar-inverse .navbar-nav > .active > a:focus {
      background-image: url("../imgg/bar.png");
      background-position: top center;
      color: #ff8e00;
      font-size: 1em;
      font-weight: 700;
      font-family: "Arial", "微軟正黑體", "新細明體";
  }
  
  .navbar-inverse .navbar-toggle {
      border-color: #000;
  }
  
  .navbar-toggle {
      background-color: transparent;
      background-image: none;
      border: 0px solid transparent;
      border-radius: 0px;
      float: right;
      margin-bottom: 0px;
      margin-right: 0px;
      margin-top: 8px;
      padding: 0px 0px;
      position: relative;
  }
  
  .navbar-toggle:hover {
      background-color: #000;
  }
  
  .navbar-inverse .navbar-toggle:hover,
  .navbar-inverse .navbar-toggle:focus {
      background-color: #000;
  }
  
  .container {
      margin-left: auto;
      margin-right: auto;
      padding-left: 0px;
      padding-right: 0px;
  }
  /* Overlap End */
  
  .citf {
      position: relative;
      display: block;
      margin-left: auto;
      margin-right: auto;
  }
  
  .linkfb {
      position: absolute;
      display: block;
      left: 285px;
      top: 0px;
      width: 40px;
      height: 40px;
  }
  
  .garena {
      display: block;
      height: 50px;
      left: 115px;
      position: absolute;
      top: 5px;
      width: 130px;
  }
  
 
  
  #eye1 {
      opacity: 0;
  }
  
  #eyem {
      opacity: 0;
  }
  
  .w100 {
      width: 100%;
      min-width: 320px;
      z-index: 9003;
  }
  /* menu desktop*/
  
  #bindex {
      position: absolute;
      display: block;
      width: 270px;
      height: 130px;
      top: 0px;
      left: 509px;
      z-index: 5000;
  }
  
  #bspec {
      position: absolute;
      display: block;
      top: 38px;
      z-index: 5000;
      background-image: url("../imgg/pcmenu.png");
      background-position: 0 0;
      width: 150px;
      height: 84px;
      background-repeat: no-repeat;
  }
  
  #bspec:hover {
      background-position: 0 -84px;
  }
  
  #bmovie {
      position: absolute;
      display: block;
      top: 38px;
      left: 150px;
      background-image: url("../imgg/pcmenu.png");
      background-position: -150px 0;
      width: 150px;
      height: 84px;
      background-repeat: no-repeat;
      z-index: 5000;
  }
  
  #bmovie:hover {
      background-position: -150px -84px;
  }
  
  #bshop {
      position: absolute;
      display: block;
      z-index: 5000;
      top: 38px;
      left: 300px;
     background-image: url("../imgg/pcmenu.png");
      background-position: -300px 0;
      width: 150px;
      height: 84px;
      background-repeat: no-repeat;
  }
  
  #bshop:hover {
      background-position: -300px -84px;
  }
  
  #bcust {
      position: absolute;
      display: block;
      top: 38px;
      left: 450px;
      z-index: 5000;
     background-image: url("../imgg/pcmenu.png");
      background-position: -450px 0;
      width: 150px;
      height: 84px;
      background-repeat: no-repeat;
  }
  
  #bcust:hover {
      background-position: -450px -84px;
  }
  
  #bdownload {
      position: absolute;
      display: block;
      top: 38px;
      left: 600px;
      z-index: 5000;
     background-image: url("../imgg/pcmenu.png");
      background-position: -600px 0;
      width: 150px;
      height: 84px;
      background-repeat: no-repeat;
  }
  
  #bdownload:hover {
      background-position: -600px -84px;
  }
  
    #sev{
      position: absolute;
      display: block;
      top: 38px;
      left: 750px;
      z-index: 5000;
     background-image: url("../imgg/pcmenu.png");
      background-position: -750px 0;
      width: 150px;
      height: 84px;
      background-repeat: no-repeat;
  }
  
  #sev:hover {
      background-position: -750px -84px;
  }
  
  #mshop2 {
      position: relative;
      display: none;
      width: 136px;
      height:90px;
      top: 110px;
      left: 305px;
      z-index: 5000;
     /*  background-image: url("../imgg/mbg.png"); */
      -moz-transition: opacity 0.3s ease-in-out;
      -o-transition: opacity 0.3s ease-in-out;
      -webkit-transition: opacity 0.3s ease-in-out;
      -ms-transition: opacity 0.3s ease-in-out;
      transition: opacity 0.3s ease-in-out;
  }
  
  #mshop2item1 {
      position: relative;
      display: block;
      width: 136px;
      height: 45px;
      background-repeat: no-repeat;  
      background-image: url("../imgg/shop_btn.png");
  }
  
  #mshop2item1:hover {
   background-image: url("../imgg/shop_btn_ho.png");
  }
  
    #mshop2item2 {
      position: relative;
      display: block;
      width: 136px;
      height: 45px;
      background-repeat: no-repeat;  
      background-image: url("../imgg/teacher_btn.png");
  }
  
  #mshop2item2:hover {
   background-image: url("../imgg/teacher_btn_ho.png");
  }
  
  
  
  .footerA >.col-md-1,
  .footerA >.col-md-2,
  .footerA >.col-md-3,
  .footerA >.col-md-4,
  .footerA >.col-md-5,
  .footerA >.col-md-6,
  .footerA >.col-md-7,
  .footerA >.col-md-8,
  .footerA >.col-md-9,
  .footerA >.col-md-10,
  .footerA >.col-md-11,
  .footerA >.col-md-12 {
      min-height: 1px;
      padding-left: 0px;
      padding-right: 0px;
      position: relative;
  }
  
  .w100left {
      position: relative;
      width: 100%;
      left: 0px;
      padding: 0px;
      padding-left: 0px;
      text-align: center;
      display: inline-block;
  }
  
  .w100leftb {
      position: relative;
      width: 100%;
      left: 0px;
      padding: 0px;
      padding-left: 0px;
      /* margin-top: 5px; */
     /*  margin-bottom: 0px; */
      text-align: right;
      display: inline-block;
  }
  
  .w33left {
      position: relative;
      width: 33%;
      left: 0px;
      padding-top: 0px;
      padding-left: 0px;
      padding-bottom: 0px;
      padding-right: 2px;
      text-align: right;
      display: inline-block;
  }
  
  .w34mid {
      position: relative;
      width: 33%;
      left: 0px;
      padding-top: 0px;
      padding-left: 0px;
      padding-bottom: 0px;
      padding-right: 2px;
      text-align: right;
      display: inline-block;
  }
  
  .w33right {
      position: relative;
      width: 32%;
      left: 0px;
      float: right;
      padding-top: 0px;
      padding-left: 0px;
      padding-bottom: 0px;
      padding-right: 2px;
      text-align: right;
      display: inline-block;
  }
  
  .fullwidth {
      position: relative;
      width: 100%;
      height: 59px;
  }
  
  .w50left {
      position: relative;
      width: 50%;
      left: 0px;
      padding-top: 0px;
      padding-left: 0px;
      padding-bottom: 0px;
      padding-right: 2px;
      text-align: right;
      display: inline-block;
  }
  
  .w50right {
      position: relative;
      float: right;
      width: 48%;
      right: 0px;
      padding-top: 0px;
      padding-bottom: 0px;
      padding-right: 0px;
      padding-left: 2px;
      text-align: left;
      display: inline-block;
  }
  
  .buttonN {
      position: relative;
      display: block;
      width: 100%;
      height: 54px;
      background-image: url("../imgg/barbg.png");
      -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
      border-radius: 10px;
      border-width: 3px;
      border-color: #fbc929;
      border-style: solid;
      -moz-box-shadow: 1px 1px 8px #414141;
      -webkit-box-shadow: 1px 1px 8px #414141;
      box-shadow: 1px 1px 8px #414141;
  }
  
  .buttonN:hover {
      border-color: #fff;
  }
  
  .buttonN3 {
      position: relative;
      display: block;
      width: 100%;
      height: 54px;
      background-image: url("../imgg/barbg3.png");
      -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
      border-radius: 10px;
      border-width: 3px;
      border-color: #fbc929;
      border-style: solid;
      -moz-box-shadow: 1px 1px 8px #414141;
      -webkit-box-shadow: 1px 1px 8px #414141;
      box-shadow: 1px 1px 8px #414141;
  }
  
  .buttonN3:hover {
      border-color: #fff;
  }
  
  .buttonN2 {
      position: relative;
      display: block;
      width: 100%;
      height: 54px;
      background-image: url("../imgg/barbg2.png");
      -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
      border-radius: 10px;
      border-width: 3px;
      border-color: #fbc929;
      border-style: solid;
      -moz-box-shadow: 1px 1px 8px #414141;
      -webkit-box-shadow: 1px 1px 8px #414141;
      box-shadow: 1px 1px 8px #414141;
  }
  
  .buttonN2:hover {
      border-color: #fff;
  }
  
  #mspec {
      position: relative;
      display: block;
      background-image: url("../imgg/mspec.png");
      width: 96px;
      height: 28px;
      margin-left: auto;
      margin-right: auto;
      top: 9px;
  }
  
  #mfb {
      position: relative;
      display: block;
      background-image: url("../imgg/fbpage.png");
      width: 164px;
      height: 32px;
      margin-left: auto;
      margin-right: auto;
      top: 7px;
  }
  
  #mnew {
      position: relative;
      display: block;
      background-image: url("../imgg/mnew.png");
      width: 100px;
      height: 32px;
      margin-left: auto;
      margin-right: auto;
      top: 7px;
  }
  
  #pdownload5 {
      position: relative;
      display: block;
      background-image: url("../imgg/mdownload2.png");
      width: 107px;
      height: 32px;
      margin-left: auto;
      margin-right: auto;
      top: 7px;
  }
  
  #mshoptech {
      position: relative;
      display: block;
      background-image: url("../imgg/mshoptech.png");
      width: 100px;
      height: 32px;
      margin-left: auto;
      margin-right: auto;
      top: 7px;
  }
  
  #mshop {
      position: relative;
      display: block;
      background-image: url("../imgg/mshop.png");
      width: 100px;
      height: 32px;
      margin-left: auto;
      margin-right: auto;
      top: 7px;
  }
  
  #mcust {
      position: relative;
      display: block;
      background-image: url("../imgg/mcust.png");
      width: 100px;
      height: 32px;
      margin-left: auto;
      margin-right: auto;
      top: 7px;
  }
  
  #mdownload {
      position: relative;
      display: block;
      background-image: url("../imgg/mdownload.png");
      width: 179px;
      height: 92px;
      margin-left: auto;
      margin-right: auto;
      top: -20px;
  }
  
  #pdownload {
      position: relative;
      display: block;
      background-image: url("../imgg/pdownload.png");
      width: 219px;
      height: 97px;
      margin-left: auto;
      margin-right: auto;
      top: -24px;
  }
  
  #ptalk {
      position: relative;
      display: block;
      background-image: url("../imgg/mtalk.png");
      width: 252px;
      height: 89px;
      margin-left: auto;
      margin-right: auto;
      top: -28px;
  }
  
  .container-fluid {
      margin-left: auto;
      margin-right: auto;
      padding-left: 0px;
      padding-right: 0px;
      background-image: url(../imgg/footer_bg.jpg);
      background-repeat: no-repeat;
      background-position: center top;
      background-color: #000;
  }
  
  .buttonNno {
      position: relative;
      display: block;
      width: 100%;
      max-width: 401px;
      margin-bottom: 10px;
	 margin-left: auto;
      margin-right: auto;
  }
  
  .buttonNno img {
      width: 100%;
    
  }
  
  .buttonNno:hover {
      
      
  }
  
  .buttonNn {
      position: relative;
      display: block;
      background-image: url("../imgg/service.png");
      background-position: 0 0;
      width: 397px;
      height: 58px;
      background-repeat: no-repeat;
	  margin-left:-20px;
  }
  
  .buttonBh:hover {  
	  opacity:0.6;
  }
  
    .buttonBh {
      position: relative;
      display: block;
      background-image: url("../imgg/baha.png");
      background-position: 0 0;
      width: 397px;
      height: 58px;
      background-repeat: no-repeat;
	  margin-left:-20px;
  }
  
  .buttonNn:hover {  
	  opacity:0.6;
  }
  
  #iosb {
      position: relative;
      display: block;
      width: 150px;
      height: 45px;
      margin-left: auto;
      margin-right: auto;
      background-image: url("../imgg/iosb.png");
  }
  
  #andb {
      position: relative;
      display: block;
      width: 152px;
      height: 53px;
      margin-left: auto;
      top: -1px;
      margin-right: auto;
      background-image: url("../imgg/andb.png");
  }
  
  #apkb {
      position: relative;
      display: block;
      width: 149px;
      height: 53px;
      margin-left: auto;
      margin-right: auto;
      background-image: url("../imgg/apkb.png");
  }
  
  #upb {
      position: relative;
      display: inline-block;
      width:100%;
      height: 30px;
      margin-left: auto;
      top: 7px;
      margin-right: auto;
      background-image: url("../imgg/upb.png");
	  background-repeat:repeat-y;
	  background-position:center;
	
  }
  
 
  
  #nextb {
       position: relative;
      display: inline-block;
      width:100%;
      height: 30px;
      margin-left: auto;
      top: 7px;
      margin-right: auto;
      background-image: url("../imgg/downb.png");
	  background-repeat:repeat-y;
	  background-position:center;
  }
  
  .citin {
      position: relative;
      display: block;
      width: 100%;
      margin: 0px;
      text-align: center;
  }
  
  .bannerN {
      position: relative;
      display: block;
      width: 380px;   
      margin-right: auto;
	  margin-top: -15px;
      border-width:1px;
	border-style:solid;
	border-color:#587996;
  }
  
  .bannerB {
      position: relative;
      display: block;
      width: 380px;
      height: 224px;
      background-color: #fff
  }
  
  .specpadd {
      padding-left: 0px;
  }
  
  .slick-dots li button:before {
      color: black;
      content: "●";
      font-size: 20px;
      color: #fff;
  }
  
  .width96 {
      width: 397px; 
      margin-right: auto;
	  margin-left:-9px;
  }
  
  #fbarea {
      position: relative;
      display: block;
      width: 360px;
      height: 220px;
      margin-left: auto;
      margin-right: auto;
      background-color: #fff;
  }
