/* CSS reset */
@import url(//fonts.googleapis.com/earlyaccess/notosanstc.css);
* {
  margin: 0;
  padding: 0;
 /* border: 0;*/
  outline: 0;
  word-wrap: break-word;
}
div{ width:100%;}
/* ol, ul {list-style: none;} */
a{text-decoration:none;}
hr,.br{clear:both;}
img {
  border: 0;
}
select { border: 1px solid #E3E3E3; }

a {color: #000000; text-decoration: none;}
a:hover {color:#636363;}

/* MAIN */
#wrapper {
  font: normal 16px Arial,Noto Sans TC;
  -webkit-text-size-adjust: none;
  font-family: 'Noto Sans TC', sans-serif;
}

.wrap {
  margin: 0 auto;
  width: 960px;
}

#header {
  height: 120px;
}

#left_container {
}

#main {
  background-color: #FFF;
  padding: 0 0 22px;
}

#footer {
  background: url(./img/bg_tail.gif) repeat-x #071f4e;
}

/* header */
#logo {
  background: url(./img/hwacomlogo.jpg) no-repeat #FFF;
  display: inline-block;
  float: left;
  height: 70px;
  text-indent: -9999em;
  width: 300px;
}

.top-line {
  background: url(./img/line.gif) 50% 0 no-repeat;
  border: 0 none;
  height: 1px;
  position: relative;
}

#slides {
  margin-bottom: 48px;
}

/* menu */
#nav {
  font:  16px 'Noto Sans TC';
  list-style: none;
}
#nav > li {
  float: left;
  height: 44px;
  line-height: 44px;
  position: relative;
}
#nav > li > a {
  color: #000;
  display: inline-block;
  padding: 0 12px;
}
#nav > li.active > a,
#nav > li > a:hover {
  background: url(./img/bg_nav.gif) repeat-x #AA1D62;
  box-shadow: 5px 0 5px -5px #333;
  color: #FFF;
}

.sub {
  background: url(./img/bg_sub_nav.png) repeat-x;
  border-top: 6px solid #AA1D63;
  border-radius: 0 0 7px 7px;
  box-shadow: 3px 3px 3px 0 #999;
  display: none;
  height: 59px;
  position: absolute;
  top: 44px;
  z-index: 10;
}
.sub > li {
  background: url(./img/bg_sub_border.png) right 0 no-repeat;
  float: left;
  display: table-cell;
  width: 130px;
}
.sub > li.last {
  background: none;
}
.sub > li > a {
  color: #595757;
  display: table-cell;
  font-size: 14px;
  height: 59px;
  line-height: 14px;
  text-align: center;
  vertical-align: middle;
  width: 130px;
}
.sub > li > a:hover {
  background: url(./img/bg_sub_arrow.png) 50% 0 no-repeat;
  color: #931852;
}

#second-nav {
  float: right;
  list-style: none;
  margin-top: 32px;
}
#second-nav > li {
  float: left;
}
#second-nav > li, #second-nav > li > a {
  color: #666;
  font-size:14px;
}
#second-nav > li > a:hover {
  color: #AA1D63;
}

#site-search {
  float: right;
  margin-top: 30px;
  margin-left: 20px;
}
#site-search > input {
  border: 0 none;
}
#site-search > #stx {
  background: url(./img/bg_search.gif) no-repeat;
  height: 27px;
  padding: 0 5px 0 25px;
  width: 146px;
}

ul.list {
  margin-top: 25px;
  list-style: none;
}
ul.list > li {
  /*height: 30px;
    line-height: 20px;*/
    display: block;
    padding-top: 8px;
}
ul.list > li > strong {
  font: bold 14px 'Noto Sans TC';
  color: #4f87ad;
}
ul.list > li > a {
  font: normal 14px 'Noto Sans TC';
  color: #777;
}
ul.list > li > a:hover {
  color: #ccc;
}

/* footer */
#footer > #line {
  background-color: #FFF;
  border-color: #C2C2C2;
  border-style: solid;
  border-width: 1px 0 0;
  height: 1px;
  margin: 20px auto 0;
  width: 990px;
}

#cr {
  color: #666;
  font: lighter 13px/47px Arial;
  height: 47px;
}

#thrid-nav, #thrid-nav a {
  color: #666;
  font: normal 13px 'Noto Sans TC';
  height: 47px;
  line-height: 47px;
}

/* page */
.banner {
  padding: 9px 0;
}

.breadcrumb {
  border-bottom: 1px solid #565A91;
  color: #727171;
  min-height: 32px;
  line-height: 32px;
  padding: 0 10px 9px;
  width: 940px;
}
.breadcrumb > a {
  color: #24246D;
  font: normal 15px 'Noto Sans TC';
  margin: 0 10px;
}
.breadcrumb > a:first-child,
.breadcrumb > a.active:first-child {
  margin-left: 0;
}
.breadcrumb > a:hover {
  color: #931852;
}
/*div.content p,div.content span,div.content div{
  font: normal 15px 'Noto Sans TC' !important;
}*/
.breadcrumb > a.active {
  color: #931852;
  font: bold 15px 'Noto Sans TC';
  margin: 0 10px;
}

.content {
  line-height: 1.7;
}

.content td {
  padding: 6px;
}

.content p {
  margin: 13px 0;
}

.content ol,
.content ul,
.content dl {
  list-style-position: inside;
  margin: 13px 0;
  padding: 0 40px;
}

/* */
#cart {
  background: #FFF;
  color: #676767;
  float: left;
  margin: 5px 10px;
  width: 680px;
}
.cart_warn {
  color: #FF0000;
  float: left;
  margin: 5px 10px;
}

#cart_function{}
.display_cart{}

#contactus{margin:10px 20px;}
.input_text_01 { font:normal 13px dotum; color:#999; height:23px; border:1px solid #cac6c2; }
.input_textarea { font:normal 13px dotum; color:#999; line-height:22px; border:1px solid #cac6c2; margin:5px 0; }
.contact_select{ padding:5px 20px; background-color: #f7f5f7;}
.contactus{font:normal 13px dotum; color:#444; line-height:23px; }
.contact_td {background-color: #F4F4F4; padding-left:90px; height:30px; line-height:23px;}
.contact_td2 {background-color: #FFF;}
.contact_td3{background-color:#F7F7F7;padding:5px 5px;}