@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Montserrat');
/* CSS Document */

body{
	margin: 0 auto;
	font-size: 15pt;
	font-family: "Montserrat", "Arial", "Helvetica", "sans-serif", "微軟正黑體";
	line-height: 1.75em;
	letter-spacing: 0.025em;
	color: #333;
}
a{
	-moz-transition: color 0.2s ease-in-out;
	-webkit-transition: color 0.2s ease-in-out;
	-ms-transition: color 0.2s ease-in-out;
	transition: color 0.2s ease-in-out;
	color:#960;
	text-decoration:none;
}
a:hover{
	color:#900;
	text-decoration:underline;
}
h1{
	font-size: 1.6em;
}
h2{
	font-size: 1.2em;
}
h6{
	font-size: smaller;
}
.t-bgw, .copyright{
	position: relative;
}
.copyright a, .cb a{
	font-size: 2px;
	color: rgba(239, 239, 239, 0.3);
	position: absolute;
    bottom: 0;
    right: 0;
    padding-right: 5px;
}
.cb a{
	color: rgba(0, 0, 0, 0.3);
}

/* 天區塊 */
aside{
	margin: 10px 13px 3px 0;
	overflow: auto;
}
aside li{
	margin-top: 16px;
	float: right;
}
.alist-1 a, .alist-2 a, .alist-3 a, .alist-4 a{
	width: 45px;
	height: 40px;
	display: block;
	text-indent:-9999px;
	background: url('../images/header-menu.png') no-repeat;
}
.alist-4 a:hover{
	background-position:0px -47px;
}
.alist-3 a{
	background-position:-44px 0px;
}
.alist-3 a:hover{
	background-position:-44px -47px;
}
.alist-2 a{
	width: 60px;
	background-position:-237px 0px;
}
.alist-2 a:hover{
	background-position:-237px -47px;
}
.alist-1 a{
	width: 60px;
	background-position:-292px 0px;
}
.alist-1 a:hover{
	background-position:-292px -47px;
}
#l-header nav{
	background: url('../images/header-menu-bg.png') repeat;
	font-size: 13pt;
	height: 46px;
    line-height: 2.2;
}
.top-logo{
	position: absolute;
	z-index: 999;
	margin-left: 20px;
	top: 0;
}
.top-logo-s{
	display: none;
}

/* 下拉選單 */
#main-menu {
  clear: both;
  border-bottom: 0;
}
@media (min-width: 1024px) {
  #main-menu {
    float: right;
    clear: none;
  }
}

/* Mobile menu toggle button */
.main-menu-btn {
  float: right;
  top: 0;
  margin: 6px 10px;
  position: relative;
  display: inline-block;
  width: 29px;
  height: 29px;
  text-indent: 29px;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  right: 0;
}


/* hamburger icon */
.main-menu-btn-icon,
.main-menu-btn-icon:before,
.main-menu-btn-icon:after {
  position: absolute;
  top: 50%;
  left: 2px;
  height: 2px;
  width: 24px;
  background: #333;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
}

.main-menu-btn-icon:before {
  content: '';
  top: -7px;
  left: 0;
}

.main-menu-btn-icon:after {
  content: '';
  top: 7px;
  left: 0;
}

/* x icon */
#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon {
  height: 0;
  background: transparent;
}

#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:before {
  top: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:after {
  top: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* hide menu state checkbox (keep it visible to screen readers) */
#main-menu-state {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}

/* hide the menu in mobile view */
#main-menu-state:not(:checked) ~ #main-menu {
  display: none;
}

#main-menu-state:checked ~ #main-menu {
  display: block;
}

@media (min-width: 1024px) {
  /* hide the button in desktop view */
  .main-menu-btn {
    position: absolute;
    top: -99999px;
  }
  /* always show the menu in desktop view */
  #main-menu-state:not(:checked) ~ #main-menu {
    display: block;
  }
}

/* IGNORE: Unrelated generic demo styles */
.demo-text {
  display: none;
}

/* slider */
.slider div{
	width: 100%;
	height: auto;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	position: relative;
}
.slider a{
	display:block;
	height:100%;
}
section.responsive, div.responsive{
	height: auto; /* 原section 200px、div 300px */
	overflow: hidden;
}
.responsive div{
	margin-bottom: 10px;
}
.responsive img{
	/* height:150px; */
	padding: 0 10px;
}
.single-item img{
	margin: 0 auto 30px;
}
.single-item{
	height: 100%;
}
.r-block-i img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  margin: 0 auto;
  display: block;
  padding-bottom: 15px;
}
.r-block {
  padding: 20px 20px 5px;
  text-align: center;
  position: relative;
  /* margin: 0 0 30px 0; */
  overflow: hidden;
}
.r-block-w h4 {
  font-weight: bold;
  font-size: 24px;
  margin: 0 0 15px 0;
}
.r-block .r-block-w {
  opacity: 0;
  background: rgba(209,192,165,1);
  color: #FEFEFE;
  text-shadow: 0px 0px 10px #CCC;
  padding: 15px;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
}
.r-block:hover .r-block-w {
  opacity: 1;
}

/* 漢堡選單 */
#h-header{
	display: none;
}
#h-header img{
	margin: 1em 5px;
}
header input + label { /* 選單icon */
  position: fixed;
  top: 35px;
  right: 40px;
  height: 20px;
  width: 15px;
  z-index: 5;
}
header input + label span {
  position: absolute;
  width: 100%;
  height: 2px;
  top: 50%;
  margin-top: -1px;
  left: 0;
  display: block;
  background: #020304;
  transition: .5s;
}
header input + label span:first-child {
  top: 3px;
}
header input + label span:last-child {
  top: 16px;
}
header label:hover {
  cursor: pointer;
}
header input:checked + label span {
  opacity: 0;
  top: 50%;
}
header input:checked + label span:first-child {
  opacity: 1;
  transform: rotate(405deg);
}
header input:checked + label span:last-child {
  opacity: 1;
  transform: rotate(-405deg);
}
header input ~ nav { /* 漢堡選單header設定處 */
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px;
  z-index: 3;
  transition: .5s;
  transition-delay: .5s;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 0 0.15em 0 rgba(0, 0, 0, 0.1);
}
header input ~ nav > ul {
  text-align: center;
  position: absolute;
  left: 20%;
  right: 20%;
}
header input ~ nav > ul > li {
  opacity: 0;
  transition: .5s;
  transition-delay: 0s;
}
header input ~ nav > ul > li > a {
  text-transform: uppercase;
}
header input:checked ~ nav {
  height: 100%;
  transition-delay: 0s;
}
header input:checked ~ nav > ul > li {
  opacity: 1;
  transition-delay: .5s;
}

/* 品牌Menu */
.pagemenu{
    top: 50%;
    right: 0;
    left: 0;
    width: 420px;
    display: table;
    margin: 0 auto;
    transform: translateY(-30%);
}
.pagemenu a{
    position: relative;
    width: 33.333%;
    display: table-cell;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    padding: 10px 20px;
    transition: 0.2s ease color;
	background: peachpuff;
}
.pagemenu a:before, .pagemenu a:after{
    content: "";
    position: absolute;
    border-radius: 50%;
    transform: scale(0);
    transition: 0.2s ease transform;
}
.pagemenu a:before{
    top: 0;
    left: 10px;
    width: 6px;
    height: 6px;
}
.pagemenu a:after{
    top: 5px;
    left: 18px;
    width: 4px;
    height: 4px
}
.pagemenu a:nth-child(1):before{
    background-color: yellow;
}
.pagemenu a:nth-child(1):after{
    background-color: red;
}
.pagemenu a:nth-child(2):before{
    background-color: #00e2ff;
}
.pagemenu a:nth-child(2):after{
    background-color: #89ff00;
}
.pagemenu a:nth-child(3):before{
    background-color: purple;
}
.pagemenu a:nth-child(3):after{
    background-color: palevioletred;
}
#indicator{
    position: absolute;
    left: 5%;
    bottom: 0;
    width: 30px;
    height: 3px;
    background-color: #fff;
    border-radius: 5px;
    transition: 0.2s ease left;
}
.pagemenu a:hover:before, .pagemenu a:hover:after{
    transform: scale(1);
}
.pagemenu a:nth-child(1):hover ~ #indicator{
    background: linear-gradient(130deg, yellow, red);
}
.pagemenu a:nth-child(2):hover ~ #indicator{
    left: 34%;
    background: linear-gradient(130deg, #00e2ff, #89ff00);
}
.pagemenu a:nth-child(3):hover ~ #indicator{
    left: 70%;
    background: linear-gradient(130deg, purple, palevioletred);
}

/* tooltip */
.tooltip {
    position: relative;
    display: inline-block;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 100%;
    background-color: black;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 15px;
    position: absolute;
    z-index: 1;
    bottom: 100%;
    /* left: 50%;
    margin-left: -60px; */
}

.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: black transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

/* main區塊 */
.wrapper, .box{
	width: 1200px;
	position: relative;
	margin: 0 auto;
	padding: 30px 10px 0;
}
.wrapcenter{
	width: 1200px;
	margin: 0 auto;
}
.rightdiv{
	width: 390px;
	float: left;
	margin-right: 50px;
}
.bg-tshade{
	background: url(../images/bg-shade.jpg) left top repeat-x;
}
.bg-lg-wg{
    padding: 30px 0;
	margin: 30px 0;
    background: rgb(243,245,244);
    background: -moz-linear-gradient(left, rgba(243,245,244,1) 65%, rgba(199,200,202,1) 100%);
    background: -webkit-linear-gradient(left, rgba(243,245,244,1) 65%,rgba(199,200,202,1) 100%);
	background: -o-linear-gradient(left, rgba(243,245,244,1) 65%,rgba(199,200,202,1) 100%);
    background: linear-gradient(to right, rgba(243,245,244,1) 65%,rgba(199,200,202,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3f5f4', endColorstr='#c7c8ca',GradientType=1 );
}
.bg-lg-flb{
	background: url('../images/bg-dfd.png') center top no-repeat, url('../images/bg-glb.gif') repeat-x, #f2f0ec;
    text-align: center;
	padding: 50px 0 20px 0;
	margin-top: 30px;
}
.bg-dblf{
	background: #000;
	color: #FFF;
}
.bg-fc, .bg-dblf{
	padding: 50px 0 0;
	margin: 30px 0;
	text-align: center;	
	font-size: 18pt;
}
.box{
	overflow: hidden;
}
.box li, .tone{
	float: left;
}
#home-news{
	color: #707070;
	width: 36%;
	/* 配合左列長度伸縮 */
	padding-bottom: 300em;
    margin-bottom: -500em;
}
.tabbox, #home-product{
	margin-right:30px;
	width: 60%;
}
#home-product li, .product-related li{	
	text-align: center;
	font-size: 13px;
	font-weight: bold;
	padding: 8px 20px 10px;
	float: left;
	border: 0;
	margin: 0 auto;
}
#home-product li{
	width: 32%;
	border: 1px solid #ccc;
	margin: 0 3px;
}
.product-related li{
	width: 20%;
}
.link-list li{
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;    /* Opera */
	width: 100%;
	font-family: "sans-serif","微軟中黑體";
    font-size: 0.8em;
}
.link-list li:nth-of-type(even){
	background:#e5e5e5;
}
.link-list li a{
	line-height: 34px;
	margin: 0 5px;
}
.divimg{
	background-size: cover;
	text-align: center;
    height: 150px;
}
.page{
	background-repeat: no-repeat;
	background-size: cover;
    color: #FFF;
    font-size: 5em;
    text-shadow: 5px 3px 20px #000;
    text-align: center;
	height: 25vw;
}
.page:before, .divimg:before{
	content: '';
	height: 100%;
	display: inline-block;
	vertical-align: middle;
}
.page-about{
	background-image: url(../images/page-about.jpg);
}
.page-product{
	background-image: url(../images/page-product.jpg);
}
.page-lease{
	background-image: url(../images/page-lease.jpg);
}
.page-news{
	background-image: url(../images/bg-1.jpg);
}
.page-exhibition{
	background-image: url(../images/page-exhibition.jpg);
}
.page-contact{
	background-image: url(../images/page-contact.jpg);
}
.page-intro{
	margin: 20px;
    /* padding: 10px;
       border: 1px solid;
	   background: #f3f3f3; */
}
.page div{
	font-size: 0.3em;
	width: 50%;
	padding: 30px 10px;
	display: inline-block;
	vertical-align: middle;
	text-shadow: 2px 2px 5px #000;
}
/* .page-brand-af div{
	color: #d5251c;
	background: rgba(255,255,255,0.8);
	border: 1px #fff solid;
	border-radius: 10px;
	box-shadow: 3px 3px 16px darkgrey;
} */
.product-type ul{
    padding: 0 15px;
	min-height: 2300px;
}
.type-machine, .type-material, .type-fitting{
	width: 360px;
	float: left;
	text-align: center;
}
.type-machine{
	background: #323232;
}
.type-material{
	background: #eeaea8;
	margin: 0 50px;	
}
.type-fitting{
	background: #a2b0c1;
}
.type-title{
	background: rgba(255,255,255,0.8);
    font-size: 20pt;
	text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;
    font-weight: bold;
	padding: 5px 0;
	margin-bottom: 10px;
}
.type-title a{
	color: #333;
	text-decoration: none;
}
.type-content, .page img, .table img{
	margin-bottom: 10px;
}
.type-content a{
	color: #fff;
}
.product-list-f{
	margin: 25px 0;
}
.product-list-f img, .product-related img{
	padding-bottom: 5px;
	padding-top: 15px;
}
.product-list-a ul{
    text-align: center;
    margin: 0 auto;
    font-size: 16px;
    line-height: 1.5em;
}
.product-list-a p{
	margin: 20px 0 0;
}
.product-list-a img{
	width: 60%;
	margin: 0 auto;
}
.product-listicon{
	position: absolute;
}
.hr-title{
	background: url(../images/hr-title.png) center no-repeat;
    height: 195px;
    text-align: center;
    border-top: 1px solid #ccc;
	margin-top: 30px;
	font-size: 2em;
    padding-top: 15px;
}
.hr-title span, .title-chre span{
	font-size: 12pt;
}
.product-intro, .r-block p{
	font-size: 16px;
	text-align: center;
}
.topic{
	margin: 50px 0 30px 0;
	text-align: center;
}
.topic .title, .wi .title{
	color: #d94714;
    font-size: 2em;
	font-weight: 800;
	padding-bottom: 30px;
	line-height: 1.2em;
}
.topic .content{
	text-align: left;
}
.product-intro p{
	color: #d94714;
    font-size: 1.5em;
	padding-top: 30px;
}
.topic img, .product-intro img, .slider .table img, .slider .wis-main img{
	margin: 0 auto;
}
.video-wide{
	width: 100%;
	height: 100%;
}
.video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  margin: 30px 0 10px;
  height: 0;
  overflow: hidden;
  clear: both;
}
.v-c-bg {
	padding-bottom: 20%;
}
.video-container iframe,
.video-container object,
.video-container embed{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.position-a{
	position: absolute;
	z-index: 999;
	color: #FFF;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.b-w{
	width: 80vw;
    margin: 420px auto 50px;
    background: #FFF;
    padding: 100px 60px;
    box-shadow: 0px 5px 15px #aaa;
    line-height: 2em;
}				

/* 標題樣式 */
#quickline{
	margin: 0px 0 35px 0;
	font-size: 15px;
	/* margin: 100px 0 35px 0; TOP無圖 */
}
fieldset{
	background: #ffecdc;
	background: linear-gradient(top,#ffecdc,#ffefcf);
	background: -webkit-linear-gradient(top,#ffecdc,#ffefcf);
	background: -moz-linear-gradient(top,#ffecdc,#ffefcf);
	background: -o-linear-gradient(top, #ffecdc, #ffefcf);
	background: -ms-linear-gradient(top, #ffecdc, #ffefcf);
	border: 2px #e0d0af dashed;
	border-radius:25px;
	-moz-border-radius:25px; /* Old Firefox */
	padding: 5px 30px 20px;
    margin: 0 auto 1em;
    width: 90%;
    font-size: 18px;
    line-height: 1.8em;
    color: #8a3800;
}
legend{
	margin-bottom: 10px;
}
.t-icon{
	padding: 5px;
	float: left;
}
.t-icon-w{
	font-weight: bold;
	font-size: 25px;
}
.titled{
    color: #000;
    text-decoration: underline;
	padding: 50px 0 20px 0;
}
.titled, .t-bwsl{
	font-size: 35px;
    font-weight: bolder;
}
.t-bwsl{
	text-align: center;
    padding-bottom: 20px;
}
.t-bwsl hr{
	width: 5vw;
	margin: 0 auto;
    height: 25px;
	border-top: 3px solid;
	margin-top: 25px;
}
.article-title{
	border-style: solid;
	border-color: #CCC;
	border-width: 1px 0;
	padding: 5px 0;
	margin-bottom: 1em;
}
.title-vdouble{
    font-size: 1.5em;
    color: purple;
    font-weight: bold;
	margin-bottom: 0.5em;
}
.title-vdouble span{
	border-style: double;
    border-color: purple;
    border-width: 0 5px;
}
.title-vsolid{
	color: #960;
	font-size: 1.3em;
	font-weight: bold;
	margin-bottom: 10px; /* 原30px 0 10px */
}
.title-vsolid span{
	border-style: solid;
    border-color: #960;
    border-width: 0 2px;
	margin: 0 1px;
}
.title-vsolid p{
	padding: 10px 0 30px 15px;
}
.title-chre{
	text-align: center;
    max-width: 50%;
    margin: 50px auto; /* 原50px auto 0px; */
    padding-top: 30px;
    font-size: 25pt;
    color: #d94714;
}
.title-chre hr{
	margin: 10px 0 -10px;
	border-color: #d94714;
}
.title-slash{
    font-size: 5em;
    color: #f44336;
    font-weight: bold;
    margin: 1em 0 3em;
    text-align: center;
	line-height: 0.5em;
}
.title-slash li{
	float: left;
	width: 10%;
}
.title-slash span{
	font-size: 20px;
	color: #333;
}
.buc h1{
	position: relative;
    text-align: center;
    margin-top: 50px;
    padding-bottom: 5px;
	font-weight: bold;
	z-index: 99;
}
.buc h1:before {
    width: 28px;
    height: 5px;
    display: block;
    content: "";
    position: absolute;
    bottom: 3px;
    left: 50%;
    margin-left: -14px;
    background-color: #0675c4;
}
.buc h1:after {
    width: 100px;
    height: 1px;
    display: block;
    content: "";
    position: relative;
    margin-top: 25px;
    left: 50%;
    margin-left: -50px;
    background-color: #0675c4;
}
/* 中文標+箭頭+英文標，底水平線 */
.title-tahr h3{
	color: #000;
	font-family: "Times New Roman", "微軟正黑體";
	font-weight: initial;
}
.title-tahr span{
	color: #ccc;
	font-size: initial;
}
.title-tahr hr{
    border-top: 1px solid #000;
    margin: 0 0 0.5em 0;
}
.titlebg{
	width: 212px;
	height: 65px;
	text-align: center;
    font-size: 30px;
	margin: 30px 0;
	background: url('../images/icon-titlebg-f.png') center bottom no-repeat;
}
.titler{
	font-size: 18pt;
    font-weight: bold;
}
.titler span{
	background: url('../images/icon-square-gb.png') no-repeat;
    width: 19px;
    height: 19px;
    float: left;
	margin: 6px 5px;
}
.hr-lg{
	background: url('../images/hr-lg.png') center center no-repeat;
	margin: 30px 0;
	clear: both;
}
.hr-lg h2{
	background: #FFF;
    text-align: center;
    width: 150px;
    margin: 0 auto;
	padding: 5px;
	white-space: nowrap;
    display: table;
}
dt{
	font-size: 18pt;
    font-weight: bold;
	text-decoration: overline;
}
dt span{
	text-decoration: underline;
}

/* 各種icon */
#model a{
	border: 1px solid;
    background: #960;
    color: #FFF;
    font-family: "微軟正黑體";
	font-weight: initial;
    padding: 3px;
}
#model a:hover{
	text-decoration: none;
	background: #FFF;
	border: 1px solid #ff0c00;
	color: #ff0c00;
}
.icon-brick{
	background: #de140a;
    color: #FFF;
    font-weight: initial;
    padding: 3px 5px;
    border-radius: 5px;
    box-shadow: 2px 3px 1px #8c0000;
    font-size: xx-small;
}
.icon-brick:hover{
	text-decoration: none;
    color: #FF0;
}
.divimg a{
	border: 1px solid #ff0c00;
	border-radius: 100px;
    background: rgba(255,12,0,0.7);
    color: #FFF;
    padding: 20px;	
}
.icon-rrectangle{
	line-height: 2.5em;
	text-decoration: none;
	border-radius: 100px;
    background: #e17986;
    padding: 8px 20px;
	color: #FFF;
}
.icon-rrectangle:hover{
	text-decoration: none;
    background: #e6909b;
    color: #FFF;
}

/* 特色icon */
.icon-wrapper .icon{
	color:#000;
	font-size:40px;
	left:50%;
	margin-left:-20px;
	margin-top:-20px;
	position:absolute;
	top:50%;
	transition:all .5s ease 0s;
}
.icon-wrapper{
	background:#ccc3b5;
	border-radius:50%;
	height:92px;
	margin:0 auto 30px;
	position:relative;
	transition:all .3s ease 0s;
	width:92px;
}
.box-wrapper:hover .icon-wrapper{
	background-color:#000;
}
.box-wrapper h3{
	font-size:18px;
	font-weight:600!important;
	padding-bottom:0!important;
	margin-bottom:25px;
	color: #d5251c;
}
.box-wrapper:hover .icon-wrapper .icon{
	color:#ccc3b5;
	transform:rotate(360deg);
}

/* 產品規格 */
.mytable{
	clear: both;
	border: #ccc solid 1px;
	display: flex;
	padding: 8px 0;
	margin-top: 30px;
}
.mytable>ul>li, .mytable>li{
	float: left;
	margin: 1px 0;
	/* padding: 0 5px; */
}
.mytable>ul{
	flex: 1;
	float: left;
}
.multi{
	background: gray;
    text-align: center;
    color: #fff;
}
#twv-list .video-container, .mt{
	margin-top: 0;
}
.table-side{
	display: table;
	margin-top: 20px;
}
.table-side>li{
	float: left;
	margin: 1px 0;
	/* padding: 0 5px; */
	border-bottom: 1px solid #CCC;
}
.ttitle{
	width: 35%;
}
.tdec{
	width: 65%;
	padding-left: 8px;
}
.column-two{
	padding-bottom: 35px;
}
.column-three{
	padding-bottom: 70px;
}
.column-four{
	padding-bottom: 105px;
}
.column-six{
	padding-bottom: 175px; /* 原185 */
}
.column-nine{
	padding-bottom: 280px;
}
.product-related{
	margin-top: 30px;
	border: #CCC solid;
    border-width: 0 0 1px 0;
	overflow: auto;
}
.product-related p{
	line-height: 1.5;
}
.product-related .title{
	border: #CCC solid;
    border-width: 1px 0;
    background: #f3f3f3;
    text-align: center;
    margin-bottom: 20px;
}
.product-name{
	line-height: 1.5em;
}
.product-name img{
	width: 90px;
	margin: 0 5px 5px 0;
}
#product-img{
	float: left;
	margin: 0 50px 30px 0;
	min-width: 360px;
    text-align: center;
}
#product-i{
	text-align: center;
	margin: 0 50px 30px 0;
}
.product-serie{
	width: 110px;
}
#model{
	font-size: 15px;
    font-weight: bold;
    font-family: monospace;
}
.features{
	color: #a71f24;
}
.features img{
	vertical-align: text-top;
}
#product-w, #product-img ul{
	text-align: center;
}
#product-img li, #product-i li, .img-border img{
	border: 1px solid #cccccc;
}
#product-img li, #product-i li{
    width: 100px;
    padding: 5px;
    margin-top: 10px;
	cursor: pointer;
	display: inline-block;
}
#product-img .color li, #product-i .color li{
	border: 0;
}
#product-img .nop li{
	cursor: unset;
}
.lim{
	margin-left: calc(1.5rem);
	margin-right: calc(1.5rem);
}
.img-list {
	overflow-x: auto;
	overflow-y: hidden;
	white-space:nowrap;
}
.img-list>li {
	margin: 0 0 10px 20px;
	display: inline-block;
}
.img-list::-webkit-scrollbar {
	height: 8px;
	background-color: transparent;
	margin-top:20px;
}
.img-list::-webkit-scrollbar-track {
	background-color: white;
	-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
	-webkit-border-radius: 10px;
	border-radius: 10px;
	margin:80px 0 5px 0;
}
.img-list::-webkit-scrollbar-thumb {
	-webkit-border-radius: 4px;
	border-radius: 4px;
	background-color: #ff9900;
    background-image: -webkit-linear-gradient(45deg, #f3c5bd 0%, #e86c57 23%, #ea2803 24%, #ff6600 75%, #c72200 100%);
    background-image: -moz-linear-gradient(45deg, #f3c5bd 0%, #e86c57 23%, #ea2803 24%, #ff6600 75%, #c72200 100%);
    background-image: -o-linear-gradient(45deg, #f3c5bd 0%, #e86c57 23%, #ea2803 24%, #ff6600 75%, #c72200 100%);
    background-image: linear-gradient(45deg, #f3c5bd 0%, #e86c57 23%, #ea2803 24%, #ff6600 75%, #c72200 100%);
}

/* 表格 */
table, .tablelist{
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	margin: 0 auto 30px;
}
th, td{
	border: 1px solid #CCC;
	text-align: center;
}
th, .th, .ttitle{
	background: #ECECEC;
	font-weight: bold;
	text-align: center;
}
.table li{
	float: left;
	padding: 5px;
	text-align: center;
}
.table{
    padding: 20px 0 10px;
}
.topic img{
    padding: 30px 0;
}
ul.t-bwl{
	margin: 0 15%;
}
.t-bwl li{
	width: 48%;
    padding: 50px;
    line-height: 2em;
    background: #FFF;
    margin: 0 0 10px 10px;
    color: #AFB44E;
    text-align: left;
}
.t-bwl h3{
	border: 1px dashed;
    font-size: 28pt;
    text-align: center;
    margin-bottom: 30px;
}
.t-cw li{
	font-size: 16px;
	font-weight: bold;
	padding: 0 20px 25px 20px;
	line-height: 1.5em;
	/* margin-bottom: 20px; */
}
.t-cw span{
	font-size: 1.5em;
    font-weight: bold;
	color: #d5251c;
}
.fc{
	display: flex;
	align-items: center;
}
.t-bgw p{
    color: #FFF;
	position: absolute;
	top: 50%;
}
.t-bgw .wc{
	left: 50%;
	transform: translate(-50%, -50%);
}
.img-shadow img{
	box-shadow: 3px 3px 5px #CCC;
}
.img-radius img{
	border-radius: 15%;
}
.img-circle img{
	border-radius: 100%;
}
.td-two li{
	width: 50%;
	position: relative;
}
.td-three li{
	width: 33.3%;
}
.td-four li{
	width: 25%;
}
.td-five li{
	width: 20%;
}
.table:before,
.table:after {
     content: ".";
     display: block;
     height: 0;
     visibility: hidden;
}
.table:after {clear: both;}
.table {zoom: 1;} /* IE < 8 */
/* 左右二欄，欄位寬度變動對齊，1024以下欄位呈單列單欄（上下列）形式－銷售據點 */
/* table */
.data-table {  
	display: table; 
	border-collapse: collapse;
	width: 100%;
}  
/* tr */
.row{
	display: table-row;
	border-bottom:dotted 1px #CCC;
}
/* td , th */
.cell1 {  
	color: tomato;
	display: table-cell; 
	padding: 10px;
	text-align: left;
}  
.cell2 {  
	display: table-cell; 
	padding: 10px 0;
	vertical-align: top;
}



/* NEWS、文字列表，右側白線、下虛線 */
#table>li{
	border-right: 1px solid #FFF;
	border-bottom: 1px dotted #CCC;
	padding: 5px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;    /* Opera */
}
.tone{
	width: 20%;
	text-align: center;
}

/* NEWS、ACTIVE，上圖下文區塊 */
#twv-list li{
	float:left;
	width: 32%;
	margin: 20px 7px;
	background: #fbf5e4;
	line-height: 1.5;
}
#twv-list p{
	padding: 0 8px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;    /* Opera */
}
#twv-list h2{
	font-weight: bold;
	color: #673b17;
	padding: 8px;
	font-size: 1em;
}
.photoimg{
	width: 130px;
	padding: 1px;
	border: 1px solid #CCC;
	margin: 0 2px 5px 0;
}
/* 左右圖文區塊 */
.bg-mlgray{
	width: 100%;
	background-color: #fbfbfb;
}
.bg-lgray{
	width: 100%;
	background-color: #ededed;
}
.wis-main{
	width: 1200px;
	margin: 0 auto;
	padding: 25px 0;
	overflow: auto;
}
.wis-main dt{
	float:right;
	width:250px;
	margin:0;
}
.wis-main dd{
	float:left;
	width: 70%;
	margin:0;
}
.wis-main .icon{
	width: 50px;
	padding:5px 0;
}
.iws dt{
	float:left;
	width:250px;
	margin:0;
}
.iws dd{
	float:right;
	width: 70%;
	margin:0;
}
.biw{
	width: 80%;
	margin: 0 auto;
	padding: 50px 0 0;
	display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.wi{
	display: flex;
	align-items: center;
}
.wi .w{
	width: 65%;
	padding-right: 50px;
}
.slider .wis-main{
	padding: 0;
}
.slider dl{
	padding: 0 25px;
}
.slider .wis-main dt{
	width: 30%;
	padding: 0 15px;
}
.slider .wis-main dd{
	padding: 0 10px;
}
@media (min-width: 992px) {
.bi{
	-ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
}
.bw{
	-ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
}
}
/* List區塊特效 */
.mmf {
	position: absolute;
    border: 2px dashed;
    padding: 10px;
    left: 25%;
    right: 25%;
    top: 40%;
    font-size: x-large;
    font-weight: bold;
	background: #e9967ab8;
}
.view {
   border: 10px solid #9e9e9e26;
   overflow: hidden;
   position: relative;
   text-align: center;
   -webkit-box-shadow: 1px 1px 2px #e6e6e6;
   -moz-box-shadow: 1px 1px 2px #e6e6e6;
   box-shadow: 1px 1px 2px #e6e6e6;
   color: #FFF;
   font-size: medium;
}
.view .mask,.view .content {
   width: 100%;
   height: 100%;
   position: absolute;
   overflow: hidden;
   top: 0;
   left: 0;
}
.view h3 {
   text-transform: uppercase;
   color: #ffeb3b;
   text-align: center;
   position: relative;
   font-size: 22px;
   padding: 10px;
   background: rgba(0, 0, 0, 0.8);
   margin: 30px 0;
}
.view a.info {
   display: inline-block;
   text-decoration: none;
   padding: 7px 14px;
   background: #000;
   color: #fff;
   text-transform: uppercase;
   -webkit-box-shadow: 0 0 1px #000;
   -moz-box-shadow: 0 0 1px #000;
   box-shadow: 0 0 1px #000;
}
.view a.info:hover {
   -webkit-box-shadow: 0 0 5px #000;
   -moz-box-shadow: 0 0 5px #000;
   box-shadow: 0 0 5px #000;
}
.view-first img {
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.view-first .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   background-color: rgba(219,127,8, 0.7);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}
.view-first h3 {
   -webkit-transform: translateY(-100px);
   -moz-transform: translateY(-100px);
   -o-transform: translateY(-100px);
   -ms-transform: translateY(-100px);
   transform: translateY(-100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.view-first:hover img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}
.view-first a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
   font-size: small;
}
.view-first:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.view-first:hover h3,
.view-first:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
}
.view-first:hover a.info {
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}

/* 商品頁下方客戶推薦 */
.customer-opinion {
    position: sticky; /* 原relative，但捲軸會出現，故改之 */
    left: 50%;
    width: 100vw;
    margin: 125px 0 0 -50vw;
    background: #303030;
	text-align: center;
}
.customer-opinion .text-wrapper {
    position: relative;
    width: 100%;
    max-width: 980px;
    height: 100%;
    margin: 0 auto;
    padding: 40px 35px 45px;
    color: #fff;
}
.customer-opinion .text-wrapper .image {
    position: absolute;
    top: -60px;
    left: 50%;
    width: 270px;
    height: 270px;
    margin-left: -135px;
    border: 1px solid hsla(204,2%,59%,.5);
    background-size: cover!important;
    border-radius: 50%;
}
.customer-opinion .text-wrapper h3 {
    width: calc(50% - 150px);
    min-height: 156px;
    margin-bottom: 50px;
    font-size: 26px;
	font-weight: unset;
    line-height: 34px;
    text-transform: none;
	text-align: left;
}
.customer-opinion .text-wrapper q {
    font-style: italic;
    font-size: 13.5px;
    line-height: 16px;
    letter-spacing: .25px;
}


/* Gallery預覽縮圖 */
.blueimp-gallery > .indicator > li {
  display: inline-block;
  width: 50px;
  height: 50px;
  margin: 6px 3px 0 3px;
  -webkit-box-sizing: content-box;
     -moz-box-sizing: content-box;
          box-sizing: content-box;
  border: 1px solid transparent;
  background: #ccc;
  background: rgba(255, 255, 255, 0.25) center no-repeat;
  border-radius: 2px;
  box-shadow: 0 0 2px #000;
  opacity: 0.5;
  cursor: pointer;
}
.blueimp-gallery>.indicator{
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}
#links img{
	max-width: 100px;
	padding: 10px 0;
}

/* 頁籤
.tabbox {
 margin: 0 auto;
 min-width: 320px;
 max-width: 800px;
}
 */

.tabbox input {
	display: none;
}

.tabbox > p {
	display: inline-block;
	text-align: center;
	background: #c2b38f;
	padding-bottom: 4px;
	margin-top: 5px;
}

.tabbox > p:hover {
	background: #422e2c;
}

.tp {
	padding: 5px 10px;
	background: #e6e0c8;
}

.tp:hover {
 color: #fff;
 cursor: pointer;
 background: #fc9835;
}

input:checked + p {
 background: #422e2c;
}

input:checked + p > .tp {
 background: #ffab57;
 color: #fff;
}

.content > div {
	display: none;
	padding: 20px 0 5px;
}

.siw{
	width: 250px;
    float: left;
    margin-right: 10px;
}

#tab1:checked ~ .content #content1,
#tab2:checked ~ .content #content2,
#tab3:checked ~ .content #content3,
#tab4:checked ~ .content #content4,
#tab5:checked ~ .content #content5 {
 display: block;
 text-align: left;
}

@media screen and (max-width: 400px) { label {padding: 15px 10px;} }

/* 社群分享 */
.icon, #share, .keytag{
	margin: 10px 0;
	font-size: 13px;
}
.icon img{
	margin: 0 5px 0 15px;
}
.share{
	position: absolute;
    padding-top: 7px;
}
.st-left{
	margin-left: 42px;
}
#share{
	clear: both;
	margin-top: 50px;
}
/* #share img{
  width: 32px;
  margin: 0 5px;
} */
.keytag{
	line-height: 1.5;
	clear: both;
}

/* questions */
.UI-bubble{
	display:inline-block;
	width:23px;
	height:23px;
	overflow:hidden;
	background:url(../images/icon-faq-green.png) -25px 0px no-repeat;
}
.UI-ask{
	display:inline-block;
	width:23px;
	height:23px;
	overflow:hidden;
	background:url(../images/icon-faq-green.png) 0px 0px no-repeat;
}
#questions{
	margin:20px auto;
	border:1px solid #e7e7e7;
	padding-top:14px;
}
#questions li h5 .UI-ask,#questions li h5 .UI-bubble{
	position:absolute;
	left:0px;
	top:16px;
}
#questions li{
	border-bottom:1px solid #e7e7e7;
	padding:0 14px 5px 14px;
	vertical-align:bottom;
}
#questions li h5{
	position:relative;
	color:#666;
	cursor:pointer;
	line-height:40px;
	height:50px;
	overflow:hidden;
	padding:8px 0 0 26px;
}
#questions li .foldContent{
	border-left:3px solid #98c593;
	padding:10px 26px;
	border-top:1px dashed #e2e2e2;
	background:#f3f3f3;
	color:#888;
}

/* 地區塊 */
footer{
    padding: 30px 10px 25px 10px;
    line-height: 1.5em;
	font-size: 13pt;
	color: #333;
	text-align: center;
	clear: both;
	background: rgb(243,245,244);
    background: -moz-linear-gradient(rgba(243,245,244,1) 45%, rgba(199,200,202,1));
    background: -webkit-linear-gradient(rgba(243,245,244,1) 45%,rgba(199,200,202,1));
	background: -o-linear-gradient(rgba(243,245,244,1) 45%,rgba(199,200,202,1));
    background: linear-gradient(rgba(243,245,244,1) 45%,rgba(199,200,202,1));
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3f5f4', endColorstr='#c7c8ca',GradientType=1 );
}
.footer{
	width: 1200px;
	margin: 0 auto;
}
.footer li{
	float: left;
}
.footer-icon-l{
	position: absolute;
	padding-left: 30px;
}
.footer-tel{
	line-height: 1.2em;
    margin-top: 8px;
	padding: 0 80px 0 115px;
}
.footer-copyright{
	line-height: 1.5em;
    padding-top: 20px;
}
.scrollup {
	display:none;
	position: fixed;
	bottom: 10px;
	right: 6px;
	z-index: 999;
	width: 60px;
	height: 60px;
	text-indent: -9999px;
	opacity: 0.7;
	background: url(../images/icon-top.png) no-repeat;
}

/* 課程頁面 */
#academy-g{
	width: 250px;
    height: 120px;
    border-width: 0 1px 1px;
    border-color: #333;
    border-style: solid;
    text-align: center;
    margin: 0 auto 50px;
    padding: 10px;
}
.bglayout-subject{
	padding-top: 100px;
	text-align: center;
	line-height: 2em;
	font-size: 40px;
	color: #fff;
	text-shadow: 0px 0px 10px #000;
}
.bglayout-subject span{
	font-size: 30px;
	color: #BE371F;
	text-shadow: 0px 0px 10px #fff;
}
.bglayout-subject img{
	padding-top:150px;
}
.class-subject-bg, .class-subject{
	border-width: 0 0 2px 0;
    border-color: #1067A7;
    border-style: solid;
	text-align: center;
}
.class-subject-bg img{
	padding-top: 8px;
}
.class-subject{
    padding: 0 0 15px 0;
    font-size: 40px;
    color: #12629D;
	line-height: 1.2;
}
.class-subject img{
	margin: 20px 20px 0 10px;
	float: left;
}
.class-subject span{
	font-size: 15pt;
	color: #C39C61;
}
.classde p{
	text-indent: -5.2em;
	padding-left: 5.2em;
	margin-bottom: 0;
}
.imgword li{
    padding: 30px 0;
	float: left;
}
.imgword-i{
	width: 25%;
    text-align: center;
	clear: left;
}
.imgword-w{
	width: 75%;
}

/* 租賃頁面 */
#lease-d{
	background: #333;
	color: #fff;
	display: flex;
}
#lease-d section{
	float: left;
}
#lease-d .l, #lease-d .r{
	width: 35%;
	padding: 25px;
}
#lease-d .m{
	width: 30%;
}
#lease-d  h2{
	color: #FFC800;
	text-align: center;
    margin-bottom: 2em;
}

/* 訊息頁面 */
.error404{
	background-color: #efeff1;
	color: #b3b3b3;
}

/* 縮排設定 */
.listi>li{
	list-style: disc;
    margin-left: 1.5em;
}
.texti-one, .imgword-w p{
	text-indent: -0.85em;
	padding-left: 0.85em;
}
.texti-two{
	text-indent: -2em;
	padding-left: 2em;
}
.ofr{
	max-width: 575px;
    min-width: 75%;
    margin: 0 auto 85px;
    padding: 25px 45px;
    border: 2px solid #dd0b2f;
}

/* 文字設定 */
.fire {
    position: absolute;
}
.fire em {
  position: relative;
  display: inline-block;
  color: #fff;
  animation: burn 2s linear infinite alternate;
  animation-delay: calc(.2s * var(--i))
}
@keyframes burn {
  from { text-shadow: -.1em 0 .3em #fefcc9, .1em -.1em .3em #feec85, -.2em -.2em .4em #ffae34, .2em -.3em .3em #ec760c, -.2em -.4em .4em #cd4606, .1em -.5em .7em #973716, .1em -.7em .7em #451b0e; }
  45%  { text-shadow: .1em -.2em .5em #fefcc9, .15em 0 .4em #feec85, -.1em -.25em .5em #ffae34, .15em -.45em .5em #ec760c, -.1em -.5em .6em #cd4606, 0 -.8em .6em #973716, .2em -1em .8em #451b0e; }
  70%  { text-shadow: -.1em 0 .3em #fefcc9, .1em -.1em .3em #feec85, -.2em -.2em .6em #ffae34, .2em -.3em .4em #ec760c, -.2em -.4em .7em #cd4606, .1em -.5em .7em #973716, .1em -.7em .9em #451b0e; }
  to   { text-shadow: -.1em -.2em .6em #fefcc9, -.15em 0 .6em #feec85, .1em -.25em .6em #ffae34, -.15em -.45em .5em #ec760c, .1em -.5em .6em #cd4606, 0 -.8em .6em #973716, -.2em -1em .8em #451b0e; }
}
.w{
	color: #333;
}
.b{
	color: #D0D2D1;
}
.fwhite{
	color: #fff;
}
.fred{
	color:#F00;
}
.fblue{
	color:#000fff;
}
.fbrown{
	color:#8c5e05;
}
.fyellow{
	color:#ffff00;
}
.forange{
	color: #ffc000;
}
.ored{
	color: #d94714;
}
.dtitle{
	font-size: 25px;
    color: #C39C61;
    line-height: 2em;
    font-weight: bold;
}
.f-notice{
	color: lightsalmon;
}
.f-merit{
	color: orchid;
}
.spfont{
	color: #0b66ba;
	font-weight: bold;
}
.spbig{
	font-size: 36pt;
}
.f-bb{
	font-size: 62pt;
    font-weight: bolder;
    margin: 30px 0;
}
.spsbig{
	font-size: xx-large;
}
.more{
	color: #F00;
	float: right;
    margin-top: 6px;
	font-size: 0.8em;
}

/* 線上表單 */
.contact{
	width: 280px;
	font-size: 16px;
    background: #EEE;
    float: right;
}
.contact p{
	margin-bottom: 0;
}
.contact-note, .contact-info{
	padding: 10px;
}
.contact-info{
	background: #707070;
	color: #ffff00;
}
#ss-form {
    width: 1200px;
	margin: 0 auto;
	float: unset;
}
#ss-submit {
    margin-left: 5px;
    margin-top: -35px;
}
input[type='text'], input[type='password'], input[type='email'], input[type='tel'], input[type='submit'], select, textarea{
	border: 1px solid #dbc7de;
	border-radius: 6px;
	background: ghostwhite;
	font-size: inherit;
}
input[type='text'], select, textarea{
	width:100%;
	padding: 8px;
}
.errorbox-good{
	margin: 30px 5px;
}
.mshow, .hidefield, #showhide{
	display: none;
}
#inp{
	cursor: pointer;
	width: 100%;
}

/* 補強設定 */
.mgt{
	margin-top: 30px;
}

/* Screen */
@media screen and (max-width: 1920px) {
}

@media screen and (max-width: 1680px) {

}

@media screen and (max-width: 1500px) {
	.bw{
		padding-left: 5%;
	}
	ul.t-bwl{
	margin: 0 5%;
	}
}

@media screen and (max-width: 1280px) {
	#header img{
		margin: 0.3em 5px;
	}
	.v-c-bg{
    padding-bottom: 30%;
	}
}

@media screen and (max-width: 1200px) {
	.wrapper, .box, .wrapcenter, .wis-main{
		width: 1000px;
	}
}

@media screen and (max-width: 1024px) {
	.footer{
		width: 100%;
	}
	.td-five li{
		width: 25%;
	}
	.type-machine, .type-material, .type-fitting{
		width: 295px;
	}
	.type-material{
		margin: 0 47px;	
	}
	#twv-list li{
		width: 46%;
		margin: 20px 18px;
	}
	.wrapper, .box, .wrapcenter, .wis-main{
	width: 98%;
	}
	.t-ciw li{
		float: none;
		display: inline-block;
		vertical-align: top;
	}
	ul.t-bwl{
	margin: 0;
}
}

@media screen and (max-width: 1020px) {
	.rightdiv{
		width: 100%;
		float: none;
		margin: 0;
	}
	.mhide{
		display: none;
	}
	.mshow{
		display: block;
	}
	/* .t-cw li{
	padding: 0 0 25px 0;
	} */
	.footer li{
	float: none;
	text-align: center;
	padding-bottom: 30px;
	}
	.footer-tel, .slider .wis-main{
	padding: 0;
	}
	.page div{
	width: 80%;
	}
	.mytable{
	display: block;
	padding: 1px;
	}
	.mytable>ul{
	float: none;
	}
	.mytable>ul>li, .mytable>li{
	border-bottom: 1px solid #ccc;
	}
	.tdec{
	text-align: right;
	}
	.wis-main{
	overflow: hidden;
	padding: 0 20px;
	}
	.wis-main dt, .wis-main dd{
	float:none;
	width:100%;
	}
	.slider .wis-main dt{
		width: auto;
	}
	.cell1{
		text-align: center;
		margin-top: 30px;
	}
	.customer-opinion {
    margin-bottom: 0;
	}
	.customer-opinion .text-wrapper .image {
    position: relative;
    top: auto;
    margin-top: -75px;
    margin-bottom: 15px;
	}
	.customer-opinion .text-wrapper h3 {
    width: 100%;
    min-height: 0;
    margin-bottom: 20px;
    text-align: center;
    font-size: 22px;
    line-height: 26px;
	}
	.t-bwl li{
	width: 95%;
	}
}

@media screen and (max-width: 1000px) {
aside{
	margin: 10px 6px 3px 0;
}
#twv-list li{
	width: 100%;
	margin: 20px 0;
}
.td-two li{
	width: 100%;
}
.td-four li{
	width: 50%;
}
.td-five li{
	width: 33%;
}
.product-type ul{
	min-height: 1%;
}
.type-machine, .type-material, .type-fitting{
	width: 100%;
	float: none;
}
.type-material{
	margin: 0;	
}
.imgword li{
    padding: 10px 0;
	float: none;
	width: 100%;
}
.bglayout-subject{
	padding-top: 0;
	font-size: 32px;
}
.bglayout-subject span{
	font-size: 20px;
}
.bglayout-subject img{
	padding-top: 0;
	width: 30vw;
}
.page{
		height: 60vw;
}
#product-img, #model{
	float: none;
	text-align: center;
	margin: 0;
}
.product-name, .icon{
	text-align: center;
}
/* .slider div{
	height: 60vw;
} */
.tdec{
	padding: 0;
}
.v-c-bg{
    padding-bottom: 56.25%;
}
.box{
	overflow: initial;
}
#home-product, #home-news{
	width: 100%;
}
#home-news{
	height: 330px;
    overflow: hidden;
	padding-bottom: 0;
    margin: 30px 0 0;
}
.tabbox {
	text-align: center;
	width: 100%;
}
.row, .cell1{
		display: block;
}
.wi{
	display: block;
	text-align: center;
}
.wi .w{
	width: auto;
	padding: 0;
}
.t-bgw p{
	font-size: larger;
}
#ss-form {
    width: 100%;
}
#lease-d section{
	float: none;
}
#lease-d .l, #lease-d .m, #lease-d .r{
	width: 100%;
}
#lease-d{
	display: block;
}
}
		
@media screen and (max-width: 755px) {
.page{
	font-size: 2.8em;
}
}
		
@media screen and (max-width: 736px) {	
#h-header{
  display: block;
}
#s-header {
	display:none;
}
}
@media screen and (max-width: 650px) {	
.td-five li{
	width: 50%;
}
.td-three li{
	width: 100%;
}
.bglayout-subject{
	line-height: 1.2em;
	font-size: 52px;
}
.product-related li{
	width: 33.3%;
}
.tone{
	width: 35%;
}
}
@media screen and (max-width: 500px) {
.bglayout-subject{
	line-height: 1.5em;
	font-size: 40px;
}
.bglayout-subject img{
	width: 100%;
}
.mytable>ul>li, .table-side>li{
	width: 100%;
	text-align: center;
	border-bottom: 0;
}
.column-two, .column-six{
	padding: 0;
}
.product-related li{
	width: 50%;
}
.hr-lg h2{
	white-space: normal;
	width: auto;
}
}

@media screen and (max-width: 450px) {
.footer-icon-l{
	position: relative;
	padding-left: 0;
}
.class-subject img{
	margin: 10px 25%;
	float: none;
}
.class-subject span{
	font-size:10pt;
}
.class-subject, .bglayout-subject{
    font-size: 30px;
}
}
@media screen and (max-width: 375px) {
.page{
	font-size: 2em;
}
}
.nittop{font-size: 36px;text-align: center;}
@media screen and (max-width: 600px) {
	.nittop{font-size: 20px;text-align: center;}
	}