* {
  box-sizing: border-box;
}

.row::after {
  content: "";
  clear: both;
  display: block;
}

[class*="col-"] {float:left; padding:0px;}

/* For desktop: */
.col-1 {width:8.33%;}
.col-2 {width:16.66%;}
.col-3 {width:25%; background-color:#ffe0e0;}
.col-4 {width:33.33%;}
.col-5 {width:41.66%;}
.col-6 {width:50%; background-color:#e0e0ff;}
.col-7 {width:58.33%;}
.col-8 {width:66.66%;}
.col-9 {width:75%;}
.col-10 {width:83.33%;}
.col-11 {width:91.66%;}
.col-12 {width:100%;}
col-logo {width:25%; background-color:#ffe0e0;}
.col-date {width:50%; background-color:#e0ffe0; display:flex; justify-content:center;}
.col-option {width:25%; background-color:#e0e0ff;}

input,select,option{
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  font-size:16px;
}

html{
  --rem:24;
  font-size: calc(var(--rem) * 1px);
  background-color:#fff0e0;
}

body {
  font-family: Microsoft Sans Serif, 微軟正黑體, 新細明體;
}

.center {margin-left: auto; margin-right: auto;}

.col-3word {width:calc(((3 * var(--rem)) + 8) * 1px); background-color:#e0e0ff;}

.col-title {
  background-color:#ffc080;
  text-align:center;
}

.col-menu {
  width:100%;
  background-color:#c0c0ff;
  padding:2px 2px 2px 2px;
}

span.button {
  background-color:#e0e0e0;
  border:2px outset;
  cursor:pointer;
  font-weight:bold;
//  white-space:nowrap;
}

.prod-button {
  background-color:#a0a0a0; color:#000000; border:2px outset; cursor:pointer; font-weight:bold; white-space:nowrap
}

.prod-content {display:none;}

#iconimg {display:none;}

.menubutton {
  color:#0000c0;
  text-decoration: none;
  white-space: nowrap;
  font-family: Microsoft Sans Serif, 微軟正黑體, 新細明體;
}

#larrow {position:absolute; top:-9999px; left:0px; }
#rarrow {position:absolute; top:-9999px; right:0px;}

@media (min-width: 800px) {
  .col-title {
    font-size: 2rem;
    width:100%;
    height: 2.5rem;
  }
  .col-menu {width:100%;}
  .col-menuitem {width:20%; padding:4px;}
  .col-content {width:100%; padding:12px;}
  #companyname::after {content:"東聯光訊玻璃股份有限公司";}
}

@media (max-width: 800px) {
  .col-title {
    font-size: calc(1.2rem + 0.8 * var(--rem) * 100vw / 800);
    width:100%;
    height: calc(1.25 * (1.2rem + 0.8 * var(--rem) * 100vw / 800));
  }
  .col-menu {width:120px;}
  .col-menuitem {width:100%; padding:4px;}
  .col-content {width:calc(100% - 120px); padding:12px;}
  #companyname::after {content:"東聯光訊玻璃(股)";}
}

@media (max-width: 400px) {
  #companyname::after {content:"東聯光訊";}
  .col-title {text-align:left;}
  .col-menu {width:120px; position:absolute; left:0px; top:0px;}
  .col-menuitem {width:100%; padding:4px;}
  .col-content {width:100%; padding:12px;}
  #iconimg {display:inline;}
}