#gotop {
    display: none;
    position: fixed;
    right: 20px;
    bottom: 20px;    
    padding: 5px 10px;    
    font-size: 16px;
    border-radius: 10px;
    background-color: hsla(240, 0%, 50%, 0.5) ;
    color: white;
    cursor: pointer;
}

#phone {
    width: 65px;
    right: 10px;
    z-index: 999;
    bottom: 185px;
    position: fixed;
}
#email {
    width: 65px;
    right: 10px;
    z-index: 999;
    bottom: 125px;
    position: fixed;
}

@media only screen and (min-width: 768px){
.topnavbar {
  height: 100px;
  background-color: Transparent;/*底色*/
  padding: 0;/*頁籤間距*/
}}

@media only screen and (max-width: 768px){
.topnavbar .container {
  text-align: center;
  background-color: rgba(255,255,255,1);/*底色*/
}} 

.topnavbar .container {
  text-align: justify;
  font-size: 0;
}

.topnavbar .container::after {
  content: "";
  display: inline-block;
  width: 100%;
}

#nav ul li a {
    text-align: justify;
    font-family: 'Noto Sans TC', sans-serif;
    color: #fff;/*頁籤文字顏色*/
    font-size:17px;/*頁籤文字大小*/
    padding: 10px 20px;/*頁籤文字間隔;padding:2px 16px 2px 16px;*/
    line-height: 1.5;
    transition: .3s;
    letter-spacing: 1px;
    text-shadow: 1px 1px 3px black;
}
#nav ul li a:hover {
    color: #eeeeee;/*頁籤滑過文字顏色*/
}
#nav ul li.current a {
    color: #eeeeee;/*頁籤按下後文字顏色*/
    font-weight: bold;
    font-weight: 600;
}

body {
    background-color: #fff;/*背景底色*/
}

/*iphone手機顯示調整*/
@media only screen and (max-width: 576px) {
.rwd-wrapper .col-2 {
-webkit-flex:0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%}
}

/*手機板banner縮放*/
.swiper-container {
  height: auto !important;
}

.swiper-wrapper, .swiper-slide {
  height: 0 !important;
  padding-bottom: calc(800 / 1920 * 100%); /* 注意圖片高度與寬度要去掉單位 */
}

.swiper-slide {
  width: 100% !important;
}

/*圖片放大透明*/
.picc { 
    opacity: 1; /* 透明度100% FireFox 的寫法 */ 
    filter: Alpha(Opacity=100); /* 透明度100% IE 的寫法 */ 
    margin:0 auto;
    overflow: hidden;
} 
.picc img {   
    opacity: 1; 
    filter: Alpha(Opacity=100); 
    margin:0 auto;
    -webkit-transform: scale(1);
    -webkit-transition: 1s;
} 
.picc img:hover { 
    opacity: .5; /* 透明度50% FireFox 的寫法 */ 
    filter: Alpha(Opacity=50); /* 透明度50% IE 的寫法 */ 
    -webkit-transform: scale(1.05);
}

/*表格效果*/
.a .table{
 width: 100%;
 padding: 5px;
 border-style: hidden;
 border-radius: 50px;
 box-shadow: 0 0 0 2px #1b1b1b;
}

/*產品項目特效*/
@import url(https://fonts.googleapis.com/css?family=Roboto:100,700;);
.snip1576 {
  background-color: #fff;
  color: #1b1b1b;
  display: inline-block;
  font-family: 'Noto Sans TC', sans-serif;
  font-size: 22px;
  max-width: 300px;
  min-width: 200px;
  overflow: hidden;
  position: relative;
  text-align: center;
  margin: 8px;
  width: 100%;
  border: 2px solid #c9c9c9;
}

.snip1576 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.45s ease;
  transition: all 0.45s ease;
}

.snip1576:after {
  background-color: #c9c9c9;
  height: 150%;
  bottom: -145%;
  content: '';
  left: 0;
  right: 0;
  position: absolute;
  -webkit-transition: all 0.5s linear;
  transition: all 0.5s linear;
}

.snip1576 img {
  vertical-align: top;
  max-width: 100%;
  backface-visibility: hidden;
}

.snip1576 figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  align-items: center;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  line-height: 1.1em;
  opacity: 0;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}

.snip1576 h3 {
  font-size: 1em;
  font-weight: 400;
  letter-spacing: 1px;
  margin: 0;
  text-transform: uppercase;
}

.snip1576 h3 span {
  display: block;
  font-weight: 700;
}

.snip1576 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}

.snip1576:hover > img,
.snip1576.hover > img {
  opacity: 0.1;
}

.snip1576:hover:after,
.snip1576.hover:after {
  bottom: 95%;
}

.snip1576:hover figcaption,
.snip1576.hover figcaption {
  opacity: 1;
  -webkit-transition-delay: 0.4s;
  transition-delay: 0.4s;
}

/*title文字顏色*/
.h1title h1{
    display:none;}

/*內文字型大小顏色*/
.fcol.fcol-1, .fcol.fcol-2, .fcol.fcol-3,  .fcol.fcol-4, .fcol.fcol-5, .fcol.fcol-6 {
  color: #1b1b1b;
  line-height: 27px;
  letter-spacing: 1px;
}

/*公司介紹-公司簡介表格*/
body.about-us .fcol.fcol-1 .container  {
  background-color: rgb(255, 255, 255, 0.8);
  padding: 50px 20px;
  margin-top: -100px;
}
body.about-us .fcol.fcol-1 {
   background-repeat: no-repeat;
   background-position:top;
   background-size: cover;/*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
   background-image: -webkit-linear-gradient(top, rgb(255 255 255/ 100%) 60%, rgb(255 255 255 / 0%) 90%), url(https://static.iyp.tw/409743/files/038599f5-42cc-4e96-a5c3-471be317c079.png);}

body.about-us .fcol.fcol-2 {
   background-color: #0043bd;
}
body.about-us .fcol.fcol-2 .container  {
  padding: 10px 10px;
}

body.about-us .fcol.fcol-3 .container  {
  padding: 50px 20px;
}
body.about-us .fcol.fcol-3 {
  display:none;
  box-shadow: inset 0 0 6px #ababab;
}

body.about-us .fcol.fcol-4 .container  {
  padding: 50px 20px;
}
body.about-us .fcol.fcol-4 {
   display:none;
   background:url(https://static.iyp.tw/409743/files/d36be94c-085a-4f42-bc91-648189c2fd24.png) bottom fixed;}

body.about-us .fcol.fcol-5 .container  {
  padding: 50px 20px;
}
body.about-us .fcol.fcol-5 {
   display:none;
   background-repeat: no-repeat;
   background-position:top;
   background-size: cover;/*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
   background-image: -webkit-linear-gradient(top, rgb(255 255 255/ 100%) 60%, rgb(255 255 255 / 0%) 90%), url(https://static.iyp.tw/409743/files/072945f2-9c97-4ffb-a6a2-ecdd5f840dbc.png);}

body.about-us .fcol.fcol-6 {display:none;}

body.about-us #footer {
  margin-top: -40px;}

/*產品頁面*/
ul.product-list li a{
    color: #1b1b1b;
    background-color: #fff;
    text-align: center;}
ul.product-list li a.focus, ul.product-list li a:hover {color: #0043bd;}

a {color: #1b1b1b;}
.news .fcol .news-list li a:hover, .news .news.main-content li a:hover {color: #1b1b1b;}

/*製程示意圖頁面*/
body.news .fcol.fcol-2 {
  display: none;}

body.news .fcol.fcol-1 {
   margin-top: -100px;
   background-repeat: no-repeat;
   background-attachment: fixed;
   background-size: cover;/*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
   background-image: -webkit-linear-gradient(top, rgb(255 255 255/ 100%) 60%, rgb(255 255 255 / 80%) 90%), url(https://static.iyp.tw/409743/files/599ee4cc-0e56-44cb-8f34-84c2f1dbd902.png);
}

body.news .fcol.fcol-1 .container  {
  background-color: rgb(255, 255, 255, 0.8);
  border: 2px solid #fff;
  padding: 15px;
}

body.news #footer {
  margin-top: -40px;}

/*表單送出按鈕*/
.back>a, .btn-search, .btn-style, input[type="submit"] {
    -webkit-transition: background 0.15s ease-out;
    -moz-transition: background 0.15s ease-out;
    transition: background 0.15s ease-out;
    width: 200px;
    color: #0043bd;
    border: 2px solid #0043bd;
    background-color: #fff;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
}

.back>a, .btn-search, .btn-style, input[type="submit"]:hover {
    background-color: #0043bd;
    color: #fff;
}

body.contact-us {
   background:url(https://static.iyp.tw/409743/files/d36be94c-085a-4f42-bc91-648189c2fd24.png) bottom fixed;}

.contact-row {
    padding: 2em 0 4em;
    line-height: 1.6;
    display: none;}

/*圖片點擊放大*/
.image-cover-modal {
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    position: fixed;
    z-index: 30;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.9);
    transition: opacity ease 0.3s;
    pointer-events: none;
}

.model-shown {
    pointer-events: all;
    opacity: 1;
}

.image-cover-modal-content {
    display: block;
    max-width: 80%;
    max-height: 80%;
}

#image-cover-caption {
    display: block;
    position: absolute;
    width: 100%;
    height: 3rem;
    bottom: 0;
    line-height: 3rem;
    text-align: center;
    color: #fff;
    background: rgba(255, 255, 255, 0.33);
}

@media only screen and (max-width: 45rem){
    .image-cover-modal-content {
        max-width: 100%;
        max-height: 100%;
    }
}