.customized-wrap{width:100%; float:left; }
.customized-content{width:1400px; margin: 60px auto 100px;}
.cpTt{width:100%;float:left;font-size:26px; padding-bottom: 50px; margin-bottom: 40px; text-align: center; border-bottom: 1px solid #ccc;}
.cpTt h1{font-family: 'Noto Sans TC', sans-serif; font-weight: 500;font-size:30px; margin-bottom: 30px;}
.cpTt p{ width: 60%; margin: 0 20%; font-size:17px; line-height: 2em;}
.cutter-title{width:100%;font-size:26px;font-weight: 500; margin-bottom: 40px; text-align: center;color: #0a3962;}
.cutter-subtitle{width:100%;max-width: 450px;line-height:1.6em; padding:15px 15px 25px 15px; margin: 0 auto 60px; font-size:19px; text-align: center;border-radius: 99em;background-color: #68777c;color: #fff}
.cutter-subtitle span{font-size:36px;font-style:italic;}
.corrow{width:100%;float: left;position:relative}
.corbox{width:33.333333%;padding-bottom: 120px; float: left;text-align: center;position:relative;}
.cor{width:160px;height: 160px;padding:38px 10px 10px 10px; font-size: 20px;font-weight: 500; margin: 0 auto;border-radius: 99em; background-color: #fff;border:10px solid #007bb4;
box-shadow:rgba(0,0,0,0.4)3px 3px 15px 0px inset; }
.corg{width:160px;height: 160px;padding:38px 10px 10px 10px; font-size: 20px;font-weight: 500; margin: 0 auto;border-radius: 99em; background-color: #fff;border:10px solid #fa4800;
box-shadow:rgba(0,0,0,0.4)3px 3px 15px 0px inset; line-height: 1.2em}
.corg span{font-size: 16px;}
.corb{width:160px;height: 160px;padding:38px 10px 10px 10px; font-size: 20px;font-weight: 500; margin: 0 auto;border-radius: 99em; background-color: #fff;border:10px solid #881d85;
box-shadow:rgba(0,0,0,0.4)3px 3px 15px 0px inset; }
.cutter-line{width: 3px; height: 120px;position:absolute; left:49.5%; top:160px;background-color: #666;z-index: -1}
.smallline{width: 3px; height: 60px;position:absolute; left:49.5%; top:160px;background-color: #666;z-index: -1}
.horizontal-line{width:66.8%; height:3px;position:absolute; left:16.5%; bottom:60px;background-color: #666;}
.framewarp{width:100%;float: left;position:relative;padding-bottom: 50px;}
.framewarp2{width:100%;float: left;position:relative;padding-bottom: 132px}
.framebottom{width:100%;float: left}
.framebox{width:34%;line-height: 50px;padding:15px 10px 20px; float: left; margin:0 33%;background-color: #3ab3bb;border-radius:10px;color: #fff; text-align: center}
.framebox span{font-size:36px;font-style:italic;}
.framebox h2{font-size:19px;line-height:1.6em}
.framebox p{font-size:16px;line-height:1.7em}
.framebox3{width:34%;line-height: 50px;padding:15px 10px 20px; float: left; margin:0 33%;background-color: #fa6700;color: #fff; border-radius:10px;text-align: center}
.framebox3 span{font-size:36px;font-style:italic;}
.framebox3 h2{font-size:19px;line-height:1.6em}
.framebox3 p{font-size:17px;line-height:2em}
.framebox4{width:34%;line-height: 50px;padding:15px 10px 20px; float: left; margin:0 33%;background-color: #1596cf;color: #fff; border-radius:10px;text-align: center}
.framebox4 span{font-size:36px;font-style:italic;}
.framebox4 h2{font-size:19px;line-height:1.6em}
.framebox4 p{font-size:17px;line-height:2em}
.framebox5{width:34%;line-height: 50px;padding:15px 10px 20px; float: left; margin:0 33%;background-color: #4a5ea7;color: #fff; border-radius:10px;text-align: center}
.framebox5 span{font-size:36px;font-style:italic;}
.framebox5 h2{font-size:19px;line-height:1.6em}
.framebox5 p{font-size:17px;line-height:2em}
.framebox6{width:34%;line-height: 50px;padding:15px 10px 20px; float: left; margin:0 33%;background-color: #5e4390;color: #fff; border-radius:10px;text-align: center}
.framebox6 span{font-size:36px;font-style:italic;}
.framebox6 h2{font-size:19px;line-height:1.6em}
.framebox7{width:34%;line-height: 50px;padding:15px 10px 20px; float: left; margin:0 33%;background-color: #3e9a4c;color: #fff; border-radius:10px;text-align: center}
.framebox7 span{font-size:36px;font-style:italic;}
.framebox7 h2{font-size:19px;line-height:1.6em}
.framebox8{width:34%;line-height: 50px;padding:15px 10px 20px; float: left; margin:0 33%;background-color: #667801;color: #fff; border-radius:10px;text-align: center}
.framebox8 span{font-size:36px;font-style:italic;}
.framebox8 h2{font-size:19px;line-height:1.6em}
.frameline{width: 3px; height:50px;position:absolute; left:49.8%;bottom:0;background-color: #666;z-index: -1}
.frame-leftline{width: 3px; height:100px;position:absolute; left:42%;bottom:0;background-color: #666;z-index: -1}
.frame-rightline{width: 3px; height:100px;position:absolute; right:42%;bottom:0;background-color: #666;z-index: -1}
.frameline-c{width:20%;height: 100px; position:absolute; left:40%;top:55px;border: 3px solid #666;z-index: -1}
.frameline-2d{width: 30px;height: 32px;background-color: #fff; position:absolute; left:39.3%;top:100px;font-size:20px;font-weight: 500;}
.frameline-3d{width: 30px;height: 32px;background-color: #fff; position:absolute; left:59%;top:100px;font-size:20px;font-weight: 500;}
.frameline4{width: 3px; height:50px;position:absolute; left:49.8%;bottom:0;background-color: #666;z-index: -1}

@media only screen and (max-width: 1600px) {
.customized-content{width:90%; margin: 50px auto 80px}	
.cpTt{padding-bottom: 40px; margin-bottom: 30px;}
.framebox,.framebox3,.framebox4,.framebox5,.framebox6,.framebox7,.framebox8{width:38%;lmargin:0 31%}
}

@media only screen and (max-width: 1200px) {
.customized-content{width:94%; margin: 50px auto 75px;}
.cpTt{padding-bottom: 40px; margin-bottom: 30px;}
.cpTt p{width: 80%; margin: 0 10%;}
.framebox,.framebox3,.framebox4,.framebox5,.framebox6,.framebox7,.framebox8{width:48%;margin:0 26%}
}
@media only screen and (max-width: 980px) {	
.customized-content{margin: 40px auto 65px}
.cpTt{padding-bottom: 30px; margin-bottom: 20px;}
.cpTt h1{font-size:28px;margin-bottom: 20px;}
.cpTt p{width: 90%; margin: 0 5%;}
.framebox,.framebox3,.framebox4,.framebox5,.framebox6,.framebox7,.framebox8{width:58%;margin:0 21%}
}

@media only screen and (max-width: 550px) {
.customized-content{width:90%; margin: 25px auto 40px;}
.cpTt{padding-bottom: 20px; margin-bottom: 20px;}
.cpTt h1{font-size:24px;margin-bottom: 15px;}	
.cpTt p{width: 100%; margin: 0; line-height: 1.8em;}
.cutter-title{font-size:22px;margin-bottom:20px}
.cutter-subtitle{width:82%;max-width:82%;line-height:1.6em;padding:8px; margin: 0 auto 30px; font-size:18px}
.cutter-subtitle span{font-size:26px}
.corbox{width:33.333333%;padding-bottom:60px}
.cor{width:108px;height: 108px;padding:28px 5px 5px 5px; font-size: 16px;border:4px solid #007bb4;line-height: 1.2em}
.corg{width:108px;height: 108px;padding:26px 5px 5px 5px; font-size: 16px;border:4px solid #fa4800}
.corg span{font-size: 15px;}
.corb{width:108px;height: 108px;padding:20px 5px 5px 5px; font-size: 16px;border:4px solid #881d85;line-height: 1.2em}
.cor,.corg,.corb{box-shadow:rgba(0,0,0,0.3)2px 2px 10px 0px inset; }
.cutter-line{width: 3px; height:70px;position:absolute; left:49.5%; top:106px}
.smallline{width: 3px; height: 60px;position:absolute; left:49.5%; top:76px}
.horizontal-line{width:66.8%; height:3px;position:absolute; left:16.5%; bottom:30px}
.framebox,.framebox3,.framebox4,.framebox5,.framebox6,.framebox7,.framebox8{width:100%;margin:0;padding:8px 8px 12px;}
.framebox p,.framebox3 p,.framebox4 p,.framebox5 p,.framebox6 p,.framebox7 p,.framebox8 p{line-height: 1.2em}
.framebox span,.framebox3 span,.framebox4 span,.framebox5 span,.framebox6 span,.framebox7 span,.framebox8 span{font-size: 26px}
.frameline{width: 3px; height:40px;position:absolute; left:49.8%;bottom:0;}
.frame-leftline{width: 3px; height:100px;position:absolute; left:42%;bottom:0}
.frame-rightline{width: 3px; height:100px;position:absolute; right:42%;bottom:0}
.frameline-c{width:50%;height:65px; position:absolute; left:25%;top:46px;}
.frameline-2d{width: 30px;height: 32px;position:absolute; left:23%;top:68px;font-size:18px}
.frameline-3d{width: 30px;height: 32px;position:absolute; left:70.5%;top:68px;font-size:18px}
.frameline4{width: 3px; height:31px;position:absolute; left:49.8%;bottom:0;}
.framewarp{padding-bottom:30px;}
.framewarp2{padding-bottom:90px}
}

.sample-warp{ float:left;width:100%; margin:0}
.sample-content{width:1500px; margin:90px auto 100px}
.sample-title{float:left;width:100%;text-align:center;margin-bottom: 50px;}
.sample-title{opacity: 0;-moz-transform: translateY(-30px);-ms-transform: translateY(-30px);-webkit-transform: translateY(-30px);transform: translateY(-30px);-moz-transition: opacity .8s, -moz-transform .8s;-o-transition: opacity .8s, -o-transform .8s;-webkit-transition: opacity .8s, -webkit-transform .8s;transition: opacity .8s, transform .8s;}
.sample-title.show {opacity: 1;-moz-transform: translateY(0);-ms-transform: translateY(0);-webkit-transform: translateY(0);transform: translateY(0);}
.sample-title h2{font-family: 'Noto Sans TC', sans-serif; font-weight: 500;font-size:30px;}
.samplepic{float:left; width:100%; margin:0;}
  .samplepic ul{list-style-type:none; padding: 0;margin: 0; font-size:0;}
  .samplepic li{width:8.133333%; float:left;margin:0 0.1% 6px;display: inline;}
img.photos:hover {position: relative;z-index: 2;}
  .samplepic img{max-width:100%;height: auto; display:block; box-shadow:0px 1px 3px #ccc;margin: 0;} 
.samplepic .photos{display:block;} 
img.photos {-webkit-transition:-webkit-transform .5s;transition:-webkit-transform .5s;transition:transform .5s;transition:transform 0.5s,-webkit-transform .5s}
.zoom-in {-webkit-transform:scale(2) rotate(0.2deg);transform:scale(2) rotate(0.2deg)}
.samplebox{width: 100%;float: left;}
.sample-warp .samplebox:nth-child(odd) {background-color:#f2f2f2;}
.sample-warp .samplebox:nth-child(even) {background-color:#e8e8e8}
@media screen and (max-width: 1600px) {
.sample-content{width:90%; margin:80px auto 90px}
}
@media screen and (max-width: 1200px) {
.sample-content{margin:60px auto 70px}
  .samplepic li{width:9.6%; float:left;margin:0 0.2% 6px;display: inline;}
}
@media screen and (max-width: 980px) {
.sample-content{margin:50px auto 60px}
.sample-title{margin-bottom:40px;}
.sample-title h2{font-size:28px}
  .samplepic li{width:12.1%; float:left;margin:0 0.2% 6px;display: inline;}
}
@media screen and (max-width: 767px) {
.sample-content{margin:40px auto 50px}
  .samplepic li{width:13.88571428%; float:left;margin:0 0.2% 6px;display: inline;}
}
@media screen and (max-width: 550px) {
.sample-content{margin:30px auto 40px}
.sample-title{margin-bottom:30px;}
.sample-title h2{font-size:24px}
  .samplepic li{width:19.4%; float:left;margin:0 0.3% 6px;display: inline;}
}