/*【客製化 customize CSS】
______________________________________________________________  */


/* 共同設定（含顏色設定）  
=============================================================== */
.blue{
  color:rgb(0,0,255);
}

.red{
  color:rgb(255,0,0);
}

.color-mute{
  color:#999;
}

.text-red-bold{   /* 文宣內的文本變為紅色、粗體 */
  color:red;
  font-weight:bold;
}

.bg-blue{
  background-color:rgba(0,0,255,.1);
}

.bg-red{
  background-color:rgba(0,255,0,.1);
}

.bg-yellow{
  background-color:rgba(255,255,0,.1);
}


.w-100.w-100{
  width:100%; 
}

.mt20.mt20{
  margin-top:20px;
}

.mt40.mt40{
  margin-top:40px;
}


figcaption, .middle-bold{
  font-weight:bold;
  text-align: center;
}



@media only screen and (max-width:641px) {
  /* 頁首 layout header的部分 */
  .hd-company.hd-company{
    margin-left: 0px;
  }
  
  /* 主要內容版面 layout content的部分 */
  .am-u-sm-9 {
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
  }
  
  .am-u-sm-3 {
    width:130px;
  }
  
  
  .cm-content{
    border:none;
    padding: 2rem 0rem;
  }
  
  /* 頁尾 layout footer的部分 */
  footer span{
    display:block;
  }
  footer > .cml-g .telephone{
    margin-right:0;
  }
  
  
  /* 頁面 - 公司簡介 about.html  */
  .cm-title, .index-new-about{
    border:none;
  }
  
  
  /* 頁面 - 聯繫我們 contact.html  */
  .contact span{
    display:block;
  }
  
}


/* 一般版面設定 => 版面顏色部分，已將原本的hsl值之h值部分由218改成122
=============================================================== */

ul.video-block{
  margin:0 auto;
}

ul.video-block

.hd-logo{
  position: relative;
}

.hd-logo img{
  height:65px;
}



header{
  margin-top:15px;
  margin-left:60px;
} 

.hd-nav, .footer {  /* .hd-nav為導覽列 */
  background: hsl(122, 72.5%, 35.7%);
}

.hd-nav nav li a {
    color: #fff;
    font-size: 2.2rem;
}

.hd-nav nav li.on {
    background: hsl(122, 72.5%, 85%);
}

.hd-nav nav li:hover a {    /* 導覽列 */
  color: #333;
  transform: scale(1.35);
  display: inline-block;
  transition: .6s;
  text-shadow: 0px 0px 10px #00f !important;
}



.am-u-sm-3.am-u-md-3.am-u-lg-3,
.am-u-sm-9.am-u-md-9.am-u-lg-9{
  margin-top:25px;
}

.cm-title:nth-child(n+2){
  margin-top:25px;
}

.cm-title{
  background-color:hsl(122, 72.5%, 35.7%);
  /*
  background-image:linear-gradient(to right, hsl(122, 72.5%, 35.7%), hsl(122, 72.5%, 90%), hsl(122, 72.5%, 35.7%))
  */
}

.cm-title-nav{
  color:#fff;
}

footer.footer{
  margin-top: 20px;
}

footer .telephone{
  margin-right: 20px;
}


.cm-type li:first-child {
    background: hsl(122, 72.5%, 35.7%);
}

.cm-type li.active > a{
  color:red;
}


.cm-type li:first-child > a,    /* 標題的字體修改 */
.cm-title{
  font-size:2rem;
}






/* 商品縮圖之稀土類 & 特殊類 -- 版面修整 layout trim  
=============================================================== */
.prodoct-list#rare_earth img{
  height:158px;
}

.prodoct-list#special img{
  height:250px;
}

.cm-content.layout_trim{
  padding-bottom:0px;
}


.prodoct-list img:hover{
  border: 2px solid hsl(218, 72.5%, 35.7%);
}



/* product-info 內文
=============================================================== */

.product-info li > span{
  font-weight:bold;
}


.product-info{
  color: #000;
}

.product-info table{
  width:100%;
  cursor:pointer;
}

.product-info caption{
  font-size: 2.5rem;
  font-weight: bold;
}

.product-info thead{
  background-color:hsl(218, 72.5%, 35.7%);
  color:#fff;
}


.product-info figure{
  margin-top: 40px;
}



/* product-info 內文中，其顏色板塊的版面調整 */
.product-info ul.color-block > li{
    height: 250px;
    padding-left: 6px;
    padding-right: 6px;
    text-align:justify;
}


/* contact.html  [頁面]聯絡我們
============================================================ */

.contact > h1{
  font-size:2.4rem;
}

.contact span{
  font-weight:bold;
}


/* ============================================================ */