.fb{position:fixed;right:1%;top:32%;z-index:1000;}
.ruten{position:fixed;right:1%;top:44%;z-index:1000;}
.ig{position:fixed;right:1%;top:56%;z-index:1000;}
.map{position:fixed;right:1%;top:68%;z-index:1000;}

/*手機版-側欄浮動按鈕-縮小*/
@media (max-width: 414px){ 
  .phone, .fb, .ruten, .line-1, .ig, .map, .wechat, .shop-1, .x-twitter, .pixnet { 
    transform: scale(0.8);
    right:0;
  }
}


/*banner*/
.swiper-container {
  height: auto !important; /* 將容器預設的高拿掉 */
}

.swiper-wrapper, .swiper-slide {
  height: 0 !important;
  padding-bottom: calc(750 / 1920 * 100%); /* 自定響應式圖片高度 */
}

.swiper-slide {
  width: 100% !important; /* 強制圖片寬度隨容器變更 */
}

/*按鈕背影*/
.topnavbar .container {
  text-align: center;
  font-size: 0;
    padding-top: 0px;
    padding-bottom: 0px;
}

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


.topnavbar {
    background-color: #000000;
  position: relative;/*頁籤&banner分開不重疊*/
  top:0px;
   z-index:100;
 width:100%;
  padding: 0;
}


#nav .subnav {
   background-color: #595757; /* 填入想要的顏色 */
}



#nav ul li.current a {color: #f4a045; font-family:"微軟正黑體";font-weight:bold;}
#nav ul li a{color: #fff;  padding: 12px 10px;/*頁籤文字間隔*/}
#nav ul li a:hover {color: #f4a045;}


/*次頁籤按鈕下底線滑入特效-底線短--隱藏*/
#nav .subnav a::before {
 display: none;
}

/* 首頁與內頁共用 */
.swiper-container {
  height: auto !important;
}

.swiper-wrapper, .swiper-slide {
  height: 0 !important;
}

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

/* 背景*/
body {
   background-color: #000000;
   font-family: 'Noto Sans TC', sans-serif;
    color: #f3f0f0;
    font-size: 14px;
    margin: 0
}




body.index .fcol-1 { 
    background-repeat: no-repeat;
   background-position: 50% 10%;
   background-size: cover;/*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
   background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.5) 0% ,rgba(0, 0, 0, 0.5) 100%) , url(https://static.iyp.tw/409888/files/9cc2b0f7-bcee-4fb5-a53a-e39aeb17ee60.jpg);
 }



@media only screen and (min-width: 768px){ 
body.index .fcol.fcol-2 {  
  width: 100%;
   background-attachment: fixed; /*fixed固定背景; scroll捲動背景*/
   background-repeat: no-repeat;
   background-position:center;
   background-size: cover;/*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
     background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.6) 0% ,rgba(0, 0, 0, 0.6) 100%) , url(https://static.iyp.tw/409888/files/81213246-a124-430d-b868-0f4099fde1b2.jpg) ;
   background-color: #333;
  border-top: 1px solid #666;
  border-bottom: 1px solid #666;
  padding: 5rem 0;
}}

 
body.index .fcol-3 { 
    background-repeat: no-repeat;
   background-position: 50% 10%;
   background-size: cover;/*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
   background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.5) 0% ,rgba(0, 0, 0, 0.5) 100%) , url(https://static.iyp.tw/409888/files/96f49073-340a-49d8-a727-579e7ced5785.png);
 }




@media only screen and (min-width: 768px){ 
body.index .fcol.fcol-4 {  
  width: 100%;
   background-attachment: fixed; /*fixed固定背景; scroll捲動背景*/
   background-repeat: no-repeat;
   background-position:center;
   background-size: cover;/*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
     background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.6) 0% ,rgba(0, 0, 0, 0.6) 100%) , url(https://static.iyp.tw/409888/files/81213246-a124-430d-b868-0f4099fde1b2.jpg) ;
   background-color: #333;
  border-top: 1px solid #666;
  border-bottom: 1px solid #666;
  padding: 5rem 0;
}}

body.index .fcol.fcol-5,.fcol.fcol-6 {background-color: #000000;}

body.index #footer { margin-top: -10px;}

body.about-us .fcol.fcol-1 {
background-repeat: no-repeat;
   background-position: 50% 10%;
   background-size: cover;/*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
   background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.5) 0% ,rgba(0, 0, 0, 0.5) 100%) , url(https://static.iyp.tw/409888/files/9cc2b0f7-bcee-4fb5-a53a-e39aeb17ee60.jpg);
 }

@media only screen and (min-width: 768px){ 
body.about-us .fcol.fcol-2 {  
  width: 100%;
   background-repeat: no-repeat;
   background-position:center;
   background-size: cover;/*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
     background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.6) 0% ,rgba(0, 0, 0, 0.6) 100%) , url(https://static.iyp.tw/409888/files/96f49073-340a-49d8-a727-579e7ced5785.png) ;
   background-color: #333;
  border-top: 1px solid #666;
  border-bottom: 1px solid #666;
  padding: 5rem 0;
}}

body.about-us .fcol.fcol-3 {
background-repeat: no-repeat;
   background-position: 50% 10%;
   background-size: cover;/*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
   background-image: -webkit-linear-gradient(top, rgba(0,0,0,0.5) 0% ,rgba(0, 0, 0, 0.5) 100%) , url(https://static.iyp.tw/409888/files/37d7a004-38a5-4984-84ca-ed6c62b41fbb.png);
 }

body.about-us .fcol.fcol-6 {background-color: #2c2b2b;}
/*大標下底線*/
.title-bar {
    margin-bottom: 1.417em;

}

.title-bar::after {
    content: "";
    display: block;
    width: 2em;
    margin: 0.25em auto 0;
    border-top: solid 1px #FCD25D;
}


/*改內文標題顏色*/
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: inherit;
    color: #d8ba9e;
    text-align: center;
}
   


/*改產品大標的陰影*/
.product-list-div h2 {
    text-shadow: 0 0px 0 #333;
}



/*改產品標題顏色*/
ul.product-list li a.focus h3, ul.product-list li a:hover h3 {
    color: #f8f8f8;
}
ul.product-list li h3 {
    flex: 1 0 auto;
    max-height: 3.15rem;
    margin: 0.7rem 0;
    font-size: 1.05rem;
    line-height: 1.5;
    color: #f8f6f6;
    overflow: hidden;
    padding: 0 16px;
}


/*側邊文字顏色*/
#side ul li a {
    color: #e6e3e3;

}





/*icon*/
.s-item  {
  background-color: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  padding:15px;
  height: 100%;
  box-shadow: -1px 34px 26px -23px #999999;
}
.s-item img {
  width: 150px;
    background-color: #eee;
    border-radius: 100%;
    margin: -80px 0 0;
}
.s-item h3 {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 2px;
  color: #0a5916;
}
.s-item h4 {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 2px;
  color: #080808;
}
.s-item p {
  font-size: 14px;
  line-height: 1.5;
  text-align: justify;
}


/*首頁圖文連結特效*/
@import url(https://fonts.googleapis.com/css?family=Open+Sans:600;);
.snip1573 {
  background-color: #000;
  display: inline-block;
  font-family: 'Open Sans', sans-serif;
  font-size: 16px;
  margin: 10px;
  max-width: 335px;
  min-width: 230px;
  overflow: hidden;
  position: relative;
  text-align: center;
  width: 100%;
}

.snip1573 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}

.snip1573:before,
.snip1573:after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  background-color: #000000;
  border-left: 3px solid #fff;
  border-right: 3px solid #fff;
  content: '';
  opacity: 0.9;
  z-index: 1;
}

.snip1573:before {
  -webkit-transform: skew(45deg) translateX(-155%);
  transform: skew(45deg) translateX(-155%);
}

.snip1573:after {
  -webkit-transform: skew(45deg) translateX(155%);
  transform: skew(45deg) translateX(155%);
}

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

.snip1573 figcaption {
  top: 50%;
  left: 50%;
  position: absolute;
  z-index: 2;
  -webkit-transform: translate(-50%, -50%) scale(0.5);
  transform: translate(-50%, -50%) scale(0.5);
  opacity: 0;
  -webkit-box-shadow: 0 0 10px #000000;
  box-shadow: 0 0 10px #000000;
}

.snip1573 h3 {
  background-color: #000000;
  border: 2px solid #fff;
  color: #fff;
  font-size: 1em;
  font-weight: 600;
  letter-spacing: 1px;
  margin: 0;
  padding: 20px 25px;
  text-transform: uppercase;
}

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

.snip1573:hover > img,
.snip1573.hover > img {
  opacity: 0.5;
}

.snip1573:hover:before,
.snip1573.hover:before {
  -webkit-transform: skew(45deg) translateX(-55%);
  transform: skew(45deg) translateX(-55%);
}

.snip1573:hover:after,
.snip1573.hover:after {
  -webkit-transform: skew(45deg) translateX(55%);
  transform: skew(45deg) translateX(55%);
}

.snip1573:hover figcaption,
.snip1573.hover figcaption {
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}

/* 消除空白*/
body[data-type="fullpage"]:not(#managehome) #wrap>*:not(:last-child) {
    margin-bottom: 0px;
}


/*首頁服務項目-區塊項目li效果—4格*/
.pro_item-1 {text-align: center;}
.pro_item-1 ul li {
    padding: 10px;
    margin: 5px;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    flex-direction: column;
    width: calc(25% - 10px);
    border-radius: 5px;
    line-height: 1.5;
    border: 1px solid #dddddd;
    /*background-color: #fff;*/
  font-size: 1.2rem;
  font-family: 'Noto Sans TC', sans-serif;
  font-weight: 500;
  text-align: center;
  color: #fff;
}
/*footer-聯絡我們區塊項目li效果*/
.f_contact ol li {
    padding: 20px 12px 12px;
    margin: 8px;
    display: inline-block;
    min-height: 66px;
    width: calc(25% - 19px);
    border-radius: 5px;
    line-height: 32px;
    border: 1px solid rgba(238,238,238,.25);
    box-shadow: 0px 0px 5px -2px rgba(0,0,0,.5) inset;
  color:#fff;
}
.f_contact i { font-size:2rem; color:#ffbd00; }

@media only screen and (max-width: 1080px){
.f_contact ol li { width: calc(50% - 19px);}
}
@media only screen and (max-width: 768px){
.f_contact ol li { width: calc(100% - 19px);}
}