.twitter{position:fixed;right:1%;top:20%;z-index:1000;}
.ig{position:fixed;right:1%;top:30%;z-index:1000;}
.fb{position:fixed;right:1%;top:40%;z-index:1000;}
.militaryblog{position:fixed;right:1%;top:50%;z-index:1000;}
.ameba{position:fixed;right:1%;top:60%;z-index:1000;}
.shop-1{position:fixed;right:1%;top:70%;z-index:1000;}
.line-1{position:fixed;right:1%;top:80%;z-index:1000;}

/*手機版-側欄浮動按鈕-縮小*/
@media (max-width: 414px){ 
  .phone, .fb, .line-1, .ig, .map, .twitter, .militaryblog, .ameba, .shop-1 { 
    transform: scale(0.8);
    right:0;
  }
}


.bg02{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4c4c4c+0,595959+12,666666+25,474747+39,2c2c2c+50,000000+51,111111+60,2b2b2b+76,1c1c1c+91,131313+100;Black+Gloss+%231 */
background: rgb(76,76,76); /* Old browsers */
background: -moz-linear-gradient(45deg,  rgba(76,76,76,1) 0%, rgba(89,89,89,1) 12%, rgba(102,102,102,1) 25%, rgba(71,71,71,1) 39%, rgba(44,44,44,1) 50%, rgba(0,0,0,1) 51%, rgba(17,17,17,1) 60%, rgba(43,43,43,1) 76%, rgba(28,28,28,1) 91%, rgba(19,19,19,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg,  rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg,  rgba(76,76,76,1) 0%,rgba(89,89,89,1) 12%,rgba(102,102,102,1) 25%,rgba(71,71,71,1) 39%,rgba(44,44,44,1) 50%,rgba(0,0,0,1) 51%,rgba(17,17,17,1) 60%,rgba(43,43,43,1) 76%,rgba(28,28,28,1) 91%,rgba(19,19,19,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}
hr{
  border: 1px solid #eee;
}

ul.product-list li a .img {
  background-color:#eee;
}

#frame-1 {
  width:100%;
  padding:15px;
  background-color: #fff;
  border-radius: 15px; box-shadow: 3px 3px 18px 0px rgba(180, 180, 180, 0.30); 
}


.topnavbar .container {
  text-align: justify;
  font-size: 0;
  /*background-color:#39b3b3;*/
  background-color:#000;
 /* padding-top: 0px;*/
}

.topnavbar .container::after {
  content: "";
  display: inline-block;
  width: 100%;
}
@media only screen and (min-width: 768px){
.topnavbar {
  padding: 0rem 0;
    position: relative;/*頁籤&banner分開不重疊*/
  background-color:#000;
  height:100px;
}}

#nav ul li a {
    color: #fff;
    font-size:16px;
    padding: 8px;
    line-height: 1.3;
    transition: .3s;
    font-family:"微軟正黑體";
  letter-spacing:0.8px;
}
#nav ul li a:hover {
    color: #fff;/*頁籤滑過文字顏色*/
}
#nav ul li.current a {
    color: #fff;/*頁籤按下後文字顏色*/
    font-weight: bold;
    font-weight: 600;
}
/*套用google font字型Noto Serif TC明體*/
#t-700{
  font-family: 'Noto Serif TC', serif;
  font-weight: 700;
  color: #0b3c5d;
  font-size: 40px;
}
@media only screen and (max-width: 768px){
#t-700{ font-size: 32px; }}

#t-400{
  font-family: 'Noto Serif TC', serif;
  font-weight: 400;
  line-height: 2;
}

.line {
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: #acc6e3;
}



body {
    background-color: #fff;/*背景底色*/
}

#logo h1 { text-align: center; }

table {
table-layout: fixed;
word-wrap:break-word;
} /*動到表格手機不會破版*/

body[data-type="fullpage"] #product-header.main {
      min-height: auto;/*產品-編輯框不設定高*/
}



/*頁籤按鈕上底線滑入特效-底線短*/
#nav ul li a::before {
  content:"";
  border-top:3px solid #328cc1;
  width:0;
  position:absolute;
  left:0;
  right:0;
  top:0px;
  margin:0 auto;
  transition:.3s all ease;
}
#nav ul li a:hover::before {
    width: 50%;
}

#nav .subnav {
    background-color: #333;/*次頁籤底色  #39b3b3*/
    max-width: 400px;/*次頁籤背景最大寬度*/
}
#nav .subnav .has-subnav span{
    max-width: 400px;/*次頁籤文字背景最大寬度*/
}

#nav li.has-subnav ul li.has-subnav>div a::after, #nav>ul>li.has-subnav>a::after {
    padding-left: 2px;/*下拉選單箭頭距離*/
}

ul.product-list li a {
    color: #328cc1;/*產品格文字顏色*/
    background-color: #eee;/*產品格底色*/
}
ul.product-list li a:hover {
    color: #328cc1;/*產品格滑過文字顏色*/
}


/*title文字顏色*/
.h1title h1{
  text-align: center;
  color: #328cc1;
  font-weight: 700;
}
.h1title h1 span::after {
    content: "";
    display: inline-block;
    font-family: monospace;
    background: #d9b310;
    width: 25px;
    height: 5px;
    display: block;
    margin: 0.5em auto 0.5em;
}

a {
    color: #328cc1;/*連結顏色*/
    text-decoration: none;
}

.swiper-container {
  height: auto !important; /* 將容器預設的高拿掉 */
}

.swiper-wrapper, .swiper-slide {
  height: 0 !important;
  padding-bottom: calc(700/ 1920 * 100%); /* 自定響應式圖片高度 */
}

.swiper-slide {
  width: 100% !important; /* 強制圖片寬度隨容器變更 */
}

/* 首頁各層編輯欄背景*/
#bodyinhome .fcol.fcol-1 .container {

}/*拉寬編輯欄設定*/

#bodyinhome .fcol.fcol-2 {

}
#bodyinhome .fcol.fcol-3,
#bodyinhome .fcol.fcol-4,#bodyinhome .fcol.fcol-5 {

}/*拉寬編輯欄設定*/
#bodyinhome .fcol.fcol-3 {

}
body[data-type="fullpage"]:not(#managehome) #wrap>*:not(:last-child) {
    margin-bottom: 0px;
}

/*首頁圖文斜切滿版*/
#bodyinhome .fcol.fcol-1 .container div#nicedit_0 {
    padding: 0;
}
article {
  overflow: hidden;
  width: 100%;
  position: relative;
  margin-bottom: -20px;
}
.text-1 { padding: 50px 50px 50px 80px; }

.photo img{
   object-fit: cover;
   width: 100%;
   height: 550px;
   display:block;
   position: relative;
}
@media only screen and (max-width: 1400px){.photo img{ height: 700px;}}
@media only screen and (max-width: 1200px){
  .photo img{ height: 900px; }
  .text-1 { padding: 30px; }
}

.photo::after {
    content: " ";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 1000px 150px 0px 0px;
    border-color: #fff transparent transparent transparent;
    position: relative;
    bottom: 0;
    left: 0;
}
@media only screen and (max-width: 760px){
.photo img{height: 250px;}
.photo::after {border: none;}
}

/*表格按鈕-文字底色變化特效*/
button1 {
    width: 250px;
    margin: 0 auto 0;
    text-align: center;
}
.btn-1 {
    /*border-radius: 10px;/*表格按鈕框線圓角*/
    border: 2px solid #20638f;/*表格按鈕框線樣式*/
    color: #000;
    font-size: 20px;
}
.btn-1:hover{
    background-color: #20638f; /* 當滑鼠經過時按鈕表格底色變化 */
    color: #fff;/* 當滑鼠經過時按鈕表格文字變化 */
}
.custom-btn {
    padding: 5px 25px;
    font-family: Arial,微軟正黑體; 
    font-weight: 700;
    background: transparent;
    outline: none !important;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    display: inline-block;
}/*表格按鈕-文字底色變化特效*/  


/*產品介紹圖文特效*/
figure.snip1249 {
  position: relative;
  overflow: hidden;
  margin: 0 auto 0;
  min-width: 160px;
  max-width: 350px;
  width: 100%;
  background: #ffffff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}
figure.snip1249 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}
figure.snip1249 img{
  position: relative;
  width: 100%; /*寬度*/
  height: 300px; /*高度*/
  vertical-align: top;
  padding: 10px;
  object-fit: cover;  /*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
 /* object-position: 80% 100%; /*指定位置*/
}
figure.snip1249:hover img{
  opacity: 0.8;
}
figure.snip1249 h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
}
figure.snip1249 p {
  margin: 0;
  font-weight: 400;
  text-transform: uppercase;
}
figure.snip1249 figcaption {
  padding: 5px 20px 20px 20px;
  color: #000000;
  position: relative;
  font-size: 0.9em;
  text-align: left;
}

figure.snip1249 figcaption .btn-more {
  display: inline-block;
  width: auto;
  border: 2px solid #20638f;
  padding: 0.4em 0.6em;
  color: #20638f;
  text-decoration: none;
  font-weight: 800;
  font-size: 0.9em;
  text-transform: uppercase;
  margin: 20px 0px 0px 0px;
}
figure.snip1249:hover .btn-more {
  background-color: #20638f;
  color: #ffffff;
}
figure.snip1249 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 2;
}

/*表格效果陰影*/
#frame_c{
     border:1px #eee solid;
box-shadow: inset 10px -1px 50px 4px #DEDEDE,-1px 34px 26px -23px #A6A6A6;-webkit-box-shadow: inset 10px -1px 50px 4px #DEDEDE,-1px 34px 26px -23px #A6A6A6;
-moz-box-shadow: inset 10px -1px 50px 4px #DEDEDE,-1px 34px 26px -23px #A6A6A6;
-o-box-shadow: inset 10px -1px 50px 4px #DEDEDE,-1px 34px 26px -23px #A6A6A6;
}

#frame_c img{
   object-fit: cover;
   width: 100%;
   height: 200px;
}

/*owl 輪播圖語法*/
.owl-carousel.owl-theme {
  padding: 0 20px 35px;/*內距:上 左右 下;*/
}
.owl-carousel.owl-theme .owl-nav {
  top: 50%;
  margin: 0;
  transform: translateY(-50%);
}
.owl-carousel.owl-theme .owl-dots {
  bottom: 0;
}
.owl-carousel.owl-theme button:focus {
  outline: none;
}
.owl-carousel.owl-theme .owl-nav,
.owl-carousel.owl-theme .owl-dots {
  position: absolute;
  left: 0;
  right: 0;
}
.owl-carousel.owl-theme .owl-nav .owl-prev {
  float: left;
  transform: translateX(-100%);
}
.owl-carousel.owl-theme .owl-nav .owl-next {
  float: right;
  transform: translateX(100%);
}
.owl-carousel.owl-theme .owl-nav .owl-prev:hover,
.owl-carousel.owl-theme .owl-nav .owl-next:hover{
  background: none;
  color: inherit;
}
.owl-carousel.owl-theme .owl-nav .fa{
  font-size: 3em; /*箭頭大小*/
}

.editmode .owl-carousel.owl-loaded {
  display: flex;
  flex-wrap: wrap;
}
.editmode .owl-carousel > div {
  flex: 0 0 25%;
  max-width: 25%;
}

.owl-carousel .owl-item img {
  object-fit: cover;  /*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
  display: block;
  width: 100%;
  height: 250px; /*高度*/
  border: 2px solid #fff;
  box-shadow: 0 6px 5px rgba(44,44,44,0.25);
}
.owl-carousel .row-no-gutters {
    margin-right: 5px;
    margin-left: 2px;
}

#contact-info ul li span {
    color: #fff;
}/*聯絡我們資訊文字顏色*/

/*圖文特效按鈕-圖縮放大標題在上*/
.snip1374 {
  position: relative;
  overflow: hidden;
  margin: 0 auto 0;
  min-width: 140px;
  max-width: 100%;
  min-height: 150px;
  max-height: 300px;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  text-align: center;
  background-color: #000;
  text-shadow: 2px 2px 5px #000000;/*文字陰影*/
}
.snip1374 figcaption {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
 -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.snip1374 h2{
  font-family: 'Noto Sans TC', sans-serif;
  text-transform: uppercase;/*文字大寫*/
  color:#ffffff;/*文字顏色*/
  font-size: 1.6rem;/*文字大小*/
  font-weight: 700;/*文字粗細*/
  line-height: 1.5;/*文字行距*/
  letter-spacing: 2px;　/* 設定文字間距 */
}
.snip1374 img {
  object-fit: cover;  /*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
  width: 100%;
  height: 320px;
  vertical-align: top;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  -webkit-transform: scale(1);
  transform: scale(1);
}
@media only screen and (max-width: 768px){ 
  .snip1374 img {
    width: 100%;
    height: 180px;
}}
.snip1374:hover img,
.snip1374.hover img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  opacity: 0.5;
}
.snip1374 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
  
  /*圖文特效按鈕-標題在上+內文滑入PART2*/
.snip1375 {
  position: relative;
  overflow: hidden;
  margin: 0 auto 0;
  min-width: 160px;
  max-width: 100%;
  width: 100%;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  text-align: left;
  background-color: #000000;
  text-shadow: 2px 2px 5px #000000;/*文字陰影*/
}
.snip1375 figcaption {
  position: absolute;
  top: 55%;
  left: 0;
  right: 0;
  padding: 20px;
 -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.snip1375 h2{
  font-family: 'Noto Sans TC', sans-serif;
  text-transform: uppercase;/*文字大寫*/
  color:#ffffff;/*文字顏色*/
  font-size: 1.5rem;/*文字大小*/
  font-weight: 700;/*文字粗細*/
  line-height: 1.3;/*文字行距*/
  letter-spacing: 1;　/* 設定文字間距 */
  border-bottom: 2px solid #fff;
}
.snip1375 h2::after {
    content: '';
    margin-top: 10px;
    display: block;
    width: 20%;
    height: 2px;
    background: #fff;
}
.snip1375 img {
  object-fit: cover;  /*cover圖片剪裁不拉伸壓縮 ; contain不拉伸壓縮.等比縮放)*/
  width: 100%;
  height: 350px;
  vertical-align: top;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  -webkit-transform: scale(1);
  transform: scale(1);
}
.snip1375:hover img,
.snip1375.hover img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  opacity: 0.2;
}
.snip1375 a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
.snip1375 p {
  position: relative;
  color: #fff;
  font-size: 1em;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
  opacity: 0;
}
.snip1375:hover p,
.snip1375.hover p {
  -webkit-transform: translateY(30%);
  transform: translateY(30%);
  opacity: 1;
}
.snip1375 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.45s ease;
  transition: all 0.45s ease;
}