html,body{margin: 0;;top: 0;left: 0;overflow-x: hidden;}
body {width: 100%;text-align: center;background-color: #F5F1E9;}
a {color: #FFF;text-decoration: none;outline: none;}
a:hover {color: #BFBFBF;}
a:focus {outline: none;}
.clearfix {min-height: 1px;}
.clearfix:after {content: ".";display: block; clear: both;height: 0;visibility: hidden;}
* html .clearfix {height: 1px;}
#mainSlide img{width: 100%;box-sizing: border-box;}
.wrap {width: 1160px;margin: 0 auto;position: relative;}
.tagBtn1,.tagBtn2,.tagBtn3,.tagBtn4,.tagBtn5{display: block;height: 38px;width: 115px;margin-right: 1px;background-position: 20px 50%;padding-left: 25px;}
.tagBtn1 {background-color: #A18E5C;background-image: url(../images/ic_tag1.png);background-repeat: no-repeat;}
.tagBtn2 {background-color: #F58E7E;background-image: url(../images/ic_tag2.png);background-repeat: no-repeat;}
.tagBtn3 {background-color: #16A6B6;background-image: url(../images/ic_tag4.png);background-repeat: no-repeat;}
.tagBtn4 {background-color: #2C5379;background-image: url(../images/ic_tag5.png);background-repeat: no-repeat;}
.tagBtn5 {background-color: #a93f34;background-image: url(../images/ic_tag5.png);background-repeat: no-repeat;}
.title {width: 1085px;height: 60px;margin: 32px auto;background-image: url(../images/line_title.png);background-repeat: repeat-x;background-position: 50%;text-align: center;position: relative;}
.title h2 {margin: 0 auto;width: 397px;height: 60px;line-height: 60px;font-size: 110%;background-image: url(../images/bg_h2.png);background-repeat: repeat-x;background-position: 50%;color: #E67F21;}
span.h21 {display: inline-block;width: 168px;height: 60px;text-align: center;font-weight: bold;background-image: url(../images/ic_h21.png);background-repeat: no-repeat;background-position: 30px 50%;padding-left: 30px;}
span.h22 {display: inline-block;width: 195px;height: 60px;text-align: center;letter-spacing: 2px;font-size: 77%;padding-right: 4px;}
#menu {width: 100%;height: 200px;background-color: #FFF;position: relative;}
#logoFoot {display: block;width: 163px;height: 89px;background-image: url(../images/z1_trackdevice.png);background-repeat: no-repeat;background-position: 0 0;position: absolute;top: 52px;left: 80px;}
#logoFoot span {display: none;}
#logoFoot:hover {background-position: 0 -89px;}
.tFoot {position: absolute;top: 85px;left: 290px;}
.tFoot li {height: 38px;float: left;line-height: 38px;text-align: center;font-weight: bold;font-size: 93%;letter-spacing: 1px;}
.tFoot li a:hover {color: #FFF;background-color: #DE4830;}
.tFoot li a:focus {color: #FFF;background-color: #DE4830;}
.tagBtn70 {display: block;height: 38px;width: 148px;line-height: 38px;font-weight: bold;font-size: 93%;margin-right: 1px;color: #332862;position: absolute;top: 38px;left: 266px;}
.tagBtn70:hover {color: #DE4830;}
.footNavi {position: absolute;top: 48px;left: 400px;text-align: left;}
.footNavi li {float: left;margin-right:15px;}
.footNavi li a {font-size: 85%;font-weight: bold;color: #666;}
.footNavi li a span {color: #DE4830;}
.footNavi li a:hover {color: #DE4830;}
.parameter,.price{margin: 60px 10%;}
#mainSlide .parameter img {margin-top: -4px;width: 60%;}
.bgc{background: #fff;}
.parameter p,.price p{line-height: 2.6;padding: 20px;text-align: justify;font-size: 16px;}
.parameter h1{font-size: 2em;}
.sp-css{color: #16a6b6;font-weight:bold;font-size: 2em;text-align: center;background: linear-gradient(transparent 70%, #FFFF00 0%);}
.parameter h3,.price h3 {background: #688db3;color: #fff;font-size: 1.0rem;line-height: 3.3;font-weight: bold;}
.shop{margin: 0px auto;background: #fff;}
.shop h2 {line-height: 3.3;font-weight: bold;}
#mainSlide table {width: 100%;border-collapse: collapse;border: 1px solid #ccc;margin-bottom: 20px;}
#mainSlide table th,#mainSlide table td {padding: 10px;border: 1px solid #ccc;}
#mainSlide tbody{text-align: justify;}
footer{background: black;color: #fff;font-size: 12px;padding: 20px;}
.phonecall,.line{position: fixed;font-size: 16px;line-height: 40px;padding: 25px 0;left: 0;writing-mode: vertical-lr;}
.phonecall{background: #de4830;top: 300px;border-radius: 0 50px 0px 0px;}
.line{background: #1ed053;top: 414px;border-radius: 0 0 50px 0px;}
.phonecall:hover,.line:hover{background: #e67f21;width: 55px;padding: 25px 10px;}
.prb{background: #000;padding: 20px;margin: 0 20px 50px;display: inline-block;width: 100px;border-right: 1px solid;border-radius: 30px;}
.price a:first-child{background:#dc143c;}
#text-align{text-align:center;}
#mainSlide .parameter .introduction img{width: 45%;margin: 0px 15px 50px;}
/* 購物用CSS*/
.buy button{color: #1a3861;padding: 16px 32px;text-align: center;text-decoration: none;display: inline-block;font-size: 20px;margin: 4px 2px;transition-duration: 0.4s;}
.shopping-cart {margin: 80px auto;background: #FFFFFF;box-shadow: 1px 2px 3px 0px rgba(0,0,0,0.10);border-radius: 6px;width: 60%;display: flex;flex-direction: column;}
.title2 {border-bottom: 1px solid #E1E8EE;padding: 20px 30px;color: #5E6977;font-size: 18px;font-weight: 400;}
.item {padding: 20px 30px;display: flex;}
.item:nth-child(3) {border-top:  1px solid #E1E8EE;border-bottom:  1px solid #E1E8EE;}
.buttons {position: relative;padding-top: 30px;margin-right: 60px;}
.is-active {animation-name: animate;animation-duration: .8s;animation-iteration-count: 1;animation-timing-function: steps(28);animation-fill-mode: forwards;}
@keyframes animate {0%   { background-position: left;  }50%  { background-position: right; }100% { background-position: right; }}
.shoppimage {margin-right: 50px;}
.shoppimage img{width: 100%;}
.description span {display: block;font-size: 18px;color: #43484D;font-weight: 400;margin-right: 50px;}
.quantity {margin-right: 60px;}
.quantity input {-webkit-appearance: none;border: none;text-align: center;width: 32px;font-size: 16px;color: #43484D;font-weight: 300;}
button[class*=btn] {width: 30px;height: 30px;background-color: #E1E8EE;border-radius: 6px;border: none;cursor: pointer;}
.minus-btn img {margin-bottom: 3px;}
.plus-btn img {margin-top: 2px;}
button:focus,
input:focus {outline:0;}
.total-price {text-align: center;font-size: 16px;color: #43484D;font-weight: 300;}

.shop {
background-color: #f9f9f9;
border: 1px solid #ddd;
border-radius: 8px;
padding: 30px;
/* max-width: 700px; */
margin: 40px auto;
font-family: "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
line-height: 1.8;
color: #333;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.shop h2 {
font-size: 26px;
margin-bottom: 20px;
color: #2c3e50;
text-align: center;
border-bottom: 2px solid #ccc;
padding-bottom: 10px;
}

.shop p {
font-size: 16px;
}

.shop br {
display: block;
margin-top: 6px;
content: "";
}

.shop span{font-weight: bold;color: #427da5;}

.shop .notic {
display: block;
margin-top: 20px;
font-weight: bold;
font-size: 15px;
background-color: #ffecec;
border: 1px solid #f5c2c2;
padding: 12px 16px;
border-radius: 6px;
color: #af4242;
}