html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
 /* font: inherit;*/
  vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

html
body {
    height: 100%;
}
body {
  line-height: 1; 
  font-size: 1.125em;
  letter-spacing: 2px;
  overflow-x: hidden;
}


ol, ul {
  list-style: none; }

b{
  font-weight:bold; }

blockquote {
  quotes: none; }

blockquote:before, blockquote:after {
  content: '';
  content: none; }

del {
  text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0; }

a img {
  border: none; }

img{max-width:100%;}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

a {
  cursor: pointer;
}

* {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


/* =Scss Variables
-------------------------------------------------------------- */
/* =Global
-------------------------------------------------------------- */
*,
*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

@font-face {
  font-family: opensans;
  src: url(OpenSans-Regular.ttf);
}
@font-face {
  font-family: opensansbold;
  src: url(OpenSans-Bold.ttf);
}

html,body {
    height: 100%;
}
body {
  font-family:opensans,Microsoft JhengHei,STHeiti;/*"Ubuntu"sans-serif*/

 }
*{ font-family:opensans,Microsoft JhengHei,STHeiti;/*"Ubuntu"sans-serif*/}
/* Headings */
h1, h2, h3, h4, h5, h6 {
  /*font-family: inherit;*/
  line-height: 1.7em; 
}

a {
  text-decoration: none;
  color: #3cb5f9;
  outline: none!important;
  -o-transition:color .15s linear,background .15s linear;
  -webkit-transition:color .15s linear,background .15s linear;
  -moz-transition:color .15s linear,background .15s linear;
  transition:color .15s linear,background .15s linear
}

a:focus,a:active {
  text-decoration: none;
  color: #3cb5f9;
  outline: none!important;
  outline-width: 0px!important;
  -o-transition:color .3s linear,background .3s linear;
  -webkit-transition:color .3s linear,background .3s linear;
  -moz-transition:color .3s linear,background .3s linear;
  transition:color .3s linear,background .3s linear
}

a:hover {
  color: #0793e2; 
}

  h1,.h1{ font-size: 2.8em; }
  h2,.h2{ font-size: 2.2em; }
  h3,.h3{ font-size: 1.7em; } 
  h4,.h4{ font-size: 1.4em; } 
  h5,.h5{ font-size: 1.2em; } 
  h6,.h6{ font-size: 1.1em; }  

  p{line-height: 2em;letter-spacing: 2px;}

/* 首頁內文 框架
---------------------------------------------------------------*/
  .contentword{
    width:100%;
    margin: 0% auto;
    padding: 0 5%;
  }

  .formobedge{
    padding: 0 0;
  }

  .contentarea{
    /*padding-left:6%;
    padding-right:6%;*/
  }

  .col-1x,.col-2x,.col-3x,.col-4x,.col-5x,.col-6x,.col-7x,.col-8x,.col-9x,.col-10x,.col-11x,.col-12x,
  .po-1x,.po-2x,.po-3x,.po-4x,.po-5x,.po-6x,
  .co-1x,.co-2x,.co-3x,.co-4x,
  .com-1s,.com-2s,.com-3s,.com-4s,.com-5s,.com-6s,.com-7s,.com-8s,.com-9s,.com-10s,
  .dom-1s,.dom-2s,.dom-3s,.dom-4s,.dom-5s,.dom-6s,.dom-7s,.dom-8s,.dom-9s,.dom-10s,
  .pos-1x,.pos-2x,.pos-3x,.pos-4x,.pos-5x,
  .cul-1x,.cul-2x,.cul-3x,.cul-4x,.cul-5x,.cul-6x,.cul-7x,.cul-8x,
  .dom-10x,.dom-10f,.dov-5s,.dov-3s,.dov-2s
  .dom-3s-onpad{
    float: left;
    position: relative;
    width:100%;
    -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
          overflow: hidden;
  }

  

  .floatleft{ float: left;}
  .floatright{float:right;}


  .mobonly { display:block; }
  .webonly { display:none; }
  
  .mobpiconly { display:block; }
  .webpiconly { display:none; }
  
  .mob-textleft{text-align: left;}
  .mob-textright{ text-align: right;}
  .mob-text-tight{padding:0 0 10px 0;}

  .text-center{ text-align: center; }
  .text-right{text-align:right;}
  .text-justify{text-align: justify;}
  .font-bold{font-weight: bold;}
  
  .dom-1s { width: calc(100%/1); }
  .dom-2s { width: calc(100%/2); }
  .dom-3s { width: calc(100%/3); }
  .dom-4s { width: calc(100%/4); }
  .dom-5s { width: calc(100%/5); }
  .dom-6s { width: calc(100%/6); }
  .dom-7s { width: calc(100%/7); }
  .dom-8s { width: calc(100%/8); }
  .dom-9s { width: calc(100%/9); }
  .dom-10s{ width: calc(100%/1); }
  .dov-2s { width: calc(100%/2); }

@media (min-width: 600px) {
  
  .dov-3s { width: calc(100%/3); }
  .dov-2s { width: auto; }
}

@media (min-width: 1000px) {

  .contentword{ 
    width:84%;
    padding: 0 0;
  }

  .contentarea{
    padding-left:6%;
    padding-right:6%;
  }
  
  .mobpiconly { display:none; }
  .webpiconly { display:block; }
  
}
@media (min-width: 1200px) {

  .allheight{height:100%;}
  .contentword{ 
    width:88%;
    max-width: 1280px;
    padding: 0 0;
  }

  .realsewidth{
    width:100%;
  }

  .com-1s,.com-2s,.com-3s,.com-4s,.com-5s,.com-6s,.com-7s,.com-8s,.com-9s,.com-10s,
  .dom-1s,.dom-2s,.dom-3s,.dom-4s,.dom-5s,.dom-6s,.dom-7s,.dom-8s,.dom-9s,.dom-10s,
  .dom-10x,.dov-5s,.dov-3s{
    width: auto;
  }
  
  .co-1x{ width:calc(100%/10%); } 
  .co-2x{ width:50%; }
  .co-3x{ width:calc(100%/3); } 
  .co-4x{ width:100%;}

  .col-1x { width:calc(100%/12*1); }
  .col-2x { width:calc(100%/12*2); }
  .col-3x { width:calc(100%/12*3); }
  .col-4x { width:calc(100%/12*4); }
  .col-5x { width:calc(100%/12*5); }
  .col-6x { width:calc(100%/12*6); }
  .col-7x { width:calc(100%/12*7); }
  .col-8x { width:calc(100%/12*8); }
  .col-9x { width:calc(100%/12*9); }
  .col-10x{ width:calc(100%/12*10); }
  .col-11x{ width:calc(100%/12*11); }
  .col-12x{ width:calc(100%); }

  .mobonly{ display: none; }
  .webonly{ display: block; }



}
@media (min-width: 1200px) {

  .contentarea{
    padding-left:0%;
    padding-right:0%;
  }
}

@media (min-width: 1500px) {
 h3,.h3{ font-size: 1.9em; } 
}