/* CSS Document */

body {	-webkit-text-size-adjust:100%; font-family: '微軟正黑體', sans-serif; overflow-x: hidden; }
img {	border:0; }

/* Reset ================================================================================= */

a { text-decoration:none; 
-webkit-transition: all 0.4s ease-out 0s;
-moz-transition: all 0.4s ease-out 0s;
transition: all 0.4s ease-out 0s; }
a:hover { text-decoration:none; }

* { margin:0; padding:0; 
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */}

.content-Box { max-width:1200px; margin:0 auto; text-align:left; position:relative; clear:both;}

#content { font-size: 15px; line-height:24px; color: #626262; letter-spacing: 0.05rem; padding-top: 200px; }
#content p{ padding-bottom: 20px;}

.banner { }
.loop .owl-dots { }
.loop .owl-item {position: relative; }
.loop .owl-item > div {display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center;}
.loop .owl-nav { position: absolute; top:calc(50% - 50px); width: 100%; z-index: 11;}
.loop .owl-prev, .loop .owl-next { position:absolute; z-index:100; top:calc(50% - 40px); background:none !important;}
.loop .owl-prev { left:0px; }
.loop .owl-next { right:0px;}
.loop .owl-prev:before, .loop .owl-next:before { font-family: 'Font Awesome 5 Free';font-weight: 900 !important;font-size:70px; color: #fff; opacity: 0.3;transition: all 0.4s ease-out 0s;width: 107px; height: 107px; background-size: contain; display: block;}
.loop .owl-prev:before { /*background-image:url(../images/left-arrow.png);*/ content: ""; }
.loop .owl-next:before { /*background-image:url(../images/right-arrow.png);*/ content: ""; }
.loop .owl-prev:hover:before, .loop .owl-next:hover:before { opacity: 1;}
.loop .owl-stage-outer {z-index: 2; width: 100%;}
.loop .owl-dots { position: absolute; z-index: 100; bottom: 45px; width: 100%; text-align: center !important; padding: 0 50px; }
.loop .owl-dots .owl-dot span, .loop  .owl-dots .owl-dot span { background: #fff !important; width: 10px !important; height: 10px !important; border-radius: 100%; opacity: 0.5;}
.loop .owl-dots .owl-dot.active span, .loop  .owl-dots .owl-dot:hover span { opacity: 1; }

.path-bg { background:url(../images/path-bg.png) no-repeat top center; background-size: cover;padding:0px 20px 0 20px; height: 35px; margin-top: -35px; position: relative; z-index: 5;}
#path { text-align: left;  color: #484848; padding-top: 2px;}
#path li { display: inline-block; vertical-align: top; font-size: 15px;}
#path li:after { content:">"; display: inline-block; vertical-align: top; padding: 0 0 0 4px;}
#path li:last-child { pointer-events: none;}
#path li:last-child:after { display: none;}
#path li a { color: #484848;}
#path li a:hover { opacity: 0.6;}

/*hig-info*/
.hig-info-pto { line-height: 0; text-align: center; padding: 30px 0;}

/*system*/
.system-slogon { padding: 50px 20px 40px 20px; text-align: center; font-weight: bold; font-size: 30px; color: #0D76C9; line-height: 140%;}
.system-slogon > span { font-size: 22px; color: #EDAE00; display: block;}
.pto-type-1 { line-height: 0; text-align: center;}
.system-pto img { width: 100%;}
.system-pto img:nth-of-type(2) { display: none;}

.system-section-2 { padding: 90px 20px 60px 20px; background: #eaeaea; }
.system-section-2 > div { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center;}
.system-section-2 > div > a { margin: 0 25px 30px 25px; width: 350px; }
.system-section-2 > div > a:hover { transform: scale(0.95);}
.btn01 { border-radius: 5px; border: 3px solid #fff; padding: 20px; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: center;}
.btn01 > div:nth-of-type(1) { line-height: 0;}
.btn01 > div:nth-of-type(1) img { max-width: 40px;}
.btn01 > div:nth-of-type(2) { padding-left: 25px; font-weight: bold; color: #0D76C9; font-size: 18px; line-height: 150%;}
.btn02 { background: #edc500; border-radius: 5px; border: 3px solid #edc500; padding: 20px; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: center;}
.btn02 > div:nth-of-type(1) { padding-right: 25px; font-weight: bold; color: #fff; font-size: 18px;}
.btn02 > div:nth-of-type(2) { line-height: 0;}
.btn02 > div:nth-of-type(2) img { max-width: 50px;}

/*products*/
.products-section { display: flex; flex-direction: column; flex-wrap: nowrap;}
.products-section > div { padding: 65px 20px 40px 20px;}
.products-section > div:nth-child(odd) { background: #fff;}
.products-section > div:nth-child(even) { background: #eaeaea;}
.title01 { margin-bottom: 30px;}
.title01 span { display: inline-block; min-width: 265px; padding: 8px 20px; text-align: center; background: #0D76C9; font-size: 20px; color: #fff; font-weight: bold; border-radius: 10px;}

.pro-list { display: flex; flex-direction: row; flex-wrap: wrap; margin-right: -40px;}
.pro-list > div { margin:0 40px 35px 0; width: calc(33.33% - 40px);}

.pro-box { background: #fff; box-shadow: 5px 10px 10px 0px rgba(0,0,0,0.2);}
.pro-title { min-height: 34px; color: #fff; text-align: center; background: #0D76C9; font-weight: bold; font-size: 17px; line-height: 120%; padding-top: 6px;}
.pro-pto { line-height: 0; overflow: hidden; margin-bottom: 15px;}
.pro-pto img { width: 100%;}
.pro-name { text-align:center; margin-bottom: 15px; color: #EDAE00; font-size: 20px; font-weight: bold;}
.pro-info-box { position: relative;}
.pro-info-box:hover .pro-info-link { opacity: 1;}
.pro-info-link { position: absolute; z-index: 2; width: 100%; height: 100%; background:rgba(0,0,0,.8); display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; transition: all 0.4s ease-out 0s; opacity: 0;}
.pro-info-link > img { width: 28px !important;}
.pro-info { min-height: 52px; padding: 0px 3%; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center;}
.pro-info > div:nth-of-type(1) { width: 55px; text-align: center;}
.pro-info > div:nth-of-type(1) img { width: auto; display: inline-block;}
.pro-info > div:nth-of-type(2) { width: calc(100% - 55px); font-size: 15px; color: #ffffff; font-weight: bold; padding-left: 5px;}
.pro-info-1 { background: linear-gradient(90deg, #90bb3c 0%, #cbd728 100%);}
.pro-info-2 { background: linear-gradient(90deg, #5270b3 0%, #6faadf 100%);}
.pro-info-3 { background: linear-gradient(90deg, #e2a702 0%, #edc500 100%);}
.pro-info-4 { background: linear-gradient(90deg, #a9a9a9 0%, #a9a9a9 100%);}
.pro-info-5 { background: linear-gradient(90deg, #626d78 0%, #626d78 100%); padding: 0 3%;}
.pro-info2 { justify-content: center; align-items: center; background: #eaeaea;display: flex; flex-direction: row; flex-wrap: nowrap; padding: 12px 10px; font-weight: bold;}
.pro-info2:hover { background:#d6d6d6; }
.pro-info2 > div:nth-of-type(1) { margin-right: 10px; }
.pro-info2 > div:nth-of-type(1) img { width: 40px; }
.pro-info2 > div:nth-of-type(2) { width: auto; color: #0D76C9; font-size: 18px;}

.pro-bottom { display:flex; flex-direction: row; flex-wrap: wrap; margin-right: -20px;}
.pro-bottom > a { margin:0 20px 20px 0; width: calc(19% - 20px);}
.pro-bottom > div { margin:0 20px 20px 0; width: calc(24% - 20px); display: flex; flex-direction: column; flex-wrap: nowrap;}
.pro-bottom > div > a { background: #f5f5f5; padding: 10px;display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center;}
.pro-bottom > div > a:nth-of-type(1) {margin-bottom: 10px;}
.pro-bottom > div > a > div:nth-of-type(1) { width: 30px; text-align: right; line-height: 0;}
.pro-bottom > div > a > div:nth-of-type(2) { width: calc(100% - 30px); padding-left: 8px; font-weight: bold; color: #0D76C9; font-size: 16px;}
.pro-bottom > a:hover { opacity: 0.5;}
.pro-bottom-btn { background: #f5f5f5;padding: 20px; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: center; }
.pro-bottom-btn > div:nth-of-type(1) { line-height: 0;}
.pro-bottom-btn > div:nth-of-type(1) img { max-width: 40px; }
.pro-bottom-btn > div:nth-of-type(2) { padding-left: 10px; font-weight: bold; color: #0D76C9; font-size: 16px; line-height: 150%;}

.pro-note { text-align: center; color: #0D76C9; line-height: 160%; font-size: 20px; padding-bottom: 30px;}
.pro-note-btn { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; margin: 0 auto 60px auto; max-width: 600px; background: #eaeaea; padding: 20px;}
.pro-note-btn:hover { transform: scale(0.95);}
.pro-note-btn > div:nth-of-type(1) { line-height: 0; width: 80px;}
.pro-note-btn > div:nth-of-type(2) { padding-left: 40px; color: #0D76C9; font-size: 26px; font-weight: bold;}


/*products-detail*/
.products-detail-section { padding: 0 20px;}
.pro-b {max-width: 900px; margin: 0 auto;}
.loop3 { padding: 0 0px;}
.loop3 .owl-dots { display: none !important;}
.loop3 .owl-item {position: relative;}
.loop3 .owl-item img {width: inherit !important;}
.loop3 .owl-item > div {display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center;}
.loop3 .owl-nav { position: absolute; top:calc(50% - 10px); width: 100%; z-index: 11;}
.loop3 .owl-prev, .loop3 .owl-next { position:absolute; z-index:100; top:calc(50% - 40px); background:none !important;}
.loop3 .owl-prev { left:0px; }
.loop3 .owl-next { right:0px;}
.loop3 .owl-prev:before, .loop3 .owl-next:before { font-family: 'Font Awesome 5 Free';font-weight: 900 !important;font-size:70px; color: #d5d5d5; opacity: 0.7;transition: all 0.4s ease-out 0s;display: block;}
.loop3 .owl-prev:before { /*background-image:url(../images/left-arrow.png);*/ content: "\f0d9"; }
.loop3 .owl-next:before { /*background-image:url(../images/right-arrow.png);*/ content: "\f0da"; }
.loop3 .owl-prev:hover:before, .loop3 .owl-next:hover:before { opacity: 1;}
.loop3 .owl-stage-outer {z-index: 2;}
.loop3 .owl-dots { position: absolute; z-index: 100; bottom: 45px; width: 100%; text-align: center !important; padding: 0 50px; }
.loop3 .owl-dots .owl-dot span, .loop3  .owl-dots .owl-dot span { background: #fff !important; width: 10px !important; height: 10px !important; border-radius: 100%; opacity: 0.5;}
.loop3 .owl-dots .owl-dot.active span, .loop3  .owl-dots .owl-dot:hover span { opacity: 1; }

.title02 { padding-bottom: 17px; margin-bottom: 15px; position: relative; border-bottom: 1px solid #0D76C9; font-size: 22px; color: #EDAE00; font-weight: bold;}
.title02-2 { font-size: 26px; color: #0D76C9; margin-bottom: 30px; margin-top: 30px; }
.title02:after { content: ""; position: absolute; width: 8px; height: 8px; border-radius: 100%; background: #0D76C9; right: 0; bottom: -4px;}

.title03 { font-size: 22px; color: #0D76C9; font-weight: bold; padding-bottom: 26px;}
.title04 { color: #0D76C9; font-weight: bold; padding-bottom: 5px; }

.list-type-1 { list-style: none; margin-bottom: 50px;}
.list-type-1 li {position: relative; padding-left: 28px; padding-bottom: 4px;}
.list-type-1 li:before {position: absolute; content: ""; left: 3px; top: 10px; width: 0;height: 0;border-style: solid;border-width: 7.5px 0 7.5px 15px;border-color: transparent transparent transparent #7c7c7c;}

.products-detail-content { margin-bottom: 30px; display: flex; flex-direction: row; flex-wrap: nowrap;}
.products-detail-content > div:nth-of-type(1) { padding-right: 30px;width: 60%;}
.products-detail-content > div:nth-of-type(2) { width: 40%;}

.p-detail-control { display: flex; flex-direction: row; flex-wrap: wrap;}
.p-detail-control > div { width: 335px; margin: 0 60px 40px 0;}
.p-detail-control-pto { line-height: 0; box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.3); position: relative; margin-bottom: 30px;}
.p-detail-control-pto:hover a { opacity: 1;}
.p-detail-control-pto a { position: absolute; width: 100%; height: 100%; background: rgba(0,0,0,.8); display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: center; opacity: 0;}
.p-detail-control-pto a img { width: 28px;}

.p-curve { display: flex; flex-direction: row; flex-wrap: wrap;}
.p-curve > div { width: 50%; margin-bottom: 60px; line-height: 0; padding: 0 30px;}

.pto-1300 img { min-width: 1300px; }

/*application*/
.application-bottom { background: #f5f5f5; padding: 70px 20px;margin-top: -400px;}
.application-spec { border-spacing: 0; width: 100%; border: 1px solid #0D76C9; min-width: 1600px;}
.application-spec td { text-align: center; font-size: 15px; color: #484848; padding: 5px; line-height: 130%;    min-width: 60px;
}
.application-spec td a { color: #484848;}
.application-spec-note{ padding-bottom: 12px; display: none;}
.bg-blue { background: #0D76C9;}
.bg-blue2 { background: #d8e6f4;}
.bg-orange { background: #e4b645;}
.bg-orange2 { background: #f9efd2;}
.bg-white { background: #f5f5f5;}
.spec-title-1 { font-size: 20px !important; padding-top: 10px !important; padding-bottom: 10px !important;}
.border-right-white { border-right: 1px solid #fff;}
.border-bottom-white { border-bottom: 1px solid #fff;}
.border-right-blue { border-right: 1px solid #0D76C9;}
.color-white { color: #fff !important;}
.color-blue { color: #0D76C9 !important;}

.application-section-1 { width: 1366px; height: 1087px; margin: 0 auto;position: relative; margin-bottom: 50px; background-image: url(../images/application-0.jpg); background-position: center center; background-repeat: no-repeat; background-size: 100%; transform: scale(0.65);transform-origin: 50% 0;}
.application-section-l1:after, .application-section-l2:after, .application-section-l3:after, .application-section-r1:after, .application-section-r2:after, .application-section-r3:after  { content: ""; position: absolute; width: 100%; height: 100%; z-index: 2; top: 0; left: 0;}
.application-section-l1:after { background-image: url(../images/application-l1.jpg);background-size: 100%;}
.application-section-l2:after { background-image: url(../images/application-l2.jpg);background-size: 100%;}
.application-section-l3:after { background-image: url(../images/application-l3.jpg);background-size: 100%;}
.application-section-r1:after { background-image: url(../images/application-r1.jpg);background-size: 100%;}
.application-section-r2:after { background-image: url(../images/application-r2.jpg);background-size: 100%;}
.application-section-r3:after { background-image: url(../images/application-r3.jpg);background-size: 100%;}
.application-select {position: absolute;z-index: 4; }
.application-1 {top:40px; left: 160px;}
.application-2 {top:365px; left: 20px;}
.application-3 {top:740px; left: 78px;}
.application-4 {top:25px; right: 159px;}
.application-5 {top:310px; right: 20px;}
.application-6 {top:737px; right: 77px;}
.application-7 {top:838px; right: 573px;}
.application-select > div { display: flex; flex-direction: column; flex-wrap: nowrap; }
.app-select-box {margin-bottom: 0px; width: 220px;}
.app-select-box:hover .app-select-btn {opacity: 1;}
.app-select-box:hover .app-select-pto img { transform: scale(1.1);}
.app-select-pto {line-height: 0; margin-bottom: 10px; text-align: center;}
.app-select-pto img {transition: all 0.4s ease-out 0s;}
.app-select-name {text-align: center; border-bottom: 1px solid #0084c9; color: #626262; font-size: 18px; margin-bottom: 10px; padding-bottom: 10px; position: relative; z-index: 3;}
.app-select-btn {display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; opacity: 0.35;transition: all 0.4s ease-out 0s; }
.app-select-btn > a {display: block; width: calc(50% - 3px); text-align: center; color: #fff; font-size: 18px; line-height: 35px;}
.app-select-btn2 > a {width: calc(100% - 0px);}
.app-select-btn > a:hover { transform: scale(0.95);}
.app-select-btn > a:nth-of-type(1) { background: #f1af00;}
.app-select-btn > a:nth-of-type(2) { background: #0084c9;}

.app-select-box-l2 { padding-bottom: 20px;}
.app-select-box-r1 { padding-bottom: 0px;}
.app-select-box-r2 { padding-bottom: 10px;}

.app-0-rwd { text-align: center; font-weight: bold; font-size: 18px; margin-bottom: 25px; display: none;}

/*location*/
.location-select-bg { background: #0D76C9; padding: 15px 20px;}
.location-select-bg2 { background: #e0ad20;}
.location-select-bg3 { background: #438f3d;}
.location-select { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center;}
.location-select > div:nth-of-type(1) { color: #fff; font-size: 22px; font-weight: bold;}
.location-select > div:nth-of-type(2) { margin-left: 40px; position: relative;}
.location-menu { width: 270px; line-height: 40px; border: 1px solid #fff; padding: 0 45px 0 15px; font-size: 18px; color: #fff; position: relative; cursor: pointer;}
.location-menu:after { content: "";position: absolute; right: 15px; top:14px; width: 0;height: 0;border-style: solid;border-width: 12px 12px 0 0;border-color: #fff transparent transparent transparent;}
.location-menu-open { display: none; position: absolute; z-index: 10; left: 0; top:57px; box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.3); background: #fff; width: 100%;}
.location-menu-open a { display: block; padding: 8px 20px; color: #0D76C9; font-size: 17px; line-height: 120%;}
.location-menu-open2 a { color: #e0ad20;}
.location-menu-open3 a { color: #438f3d;}
.location-menu-open a:hover,.location-menu-open a.current { background: #0D76C9; color: #fff;}
.location-menu-open2 a:hover,.location-menu-open2 a.current { background: #e0ad20;}
.location-menu-open3 a:hover,.location-menu-open3 a.current { background: #438f3d;}

.location-map { position: relative; height: 550px;}
.location-info-box { position: absolute; z-index: 3;top:45px; right: 50px; box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.3); background: #f5f5f5;  max-width: 330px; width: 100%;}
.location-info { padding: 20px 40px 20px 20px; font-size: 15px; color: #000; position: relative;line-height: 24px;}
.location-info span { display: block; color: #0D76C9; margin-bottom: 15px;}
.location-info2 span { color: #e0ad20;}
.location-info3 span { color: #438f3d;}
.location-close { position: absolute; top:20px; right: 10px; cursor: pointer; width: 25px; height: 25px;}
.location-close:before, .location-close:after { content: ""; position: absolute; width: 25px; height: 1px; background: #444; top:10px; right: 0;}
.location-close:before { transform: rotate(45deg);}
.location-close:after { transform: rotate(135deg);}

.location-link { min-height: 52px; padding: 0px 20px; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center;}
.location-link > div:nth-of-type(1) { width: 40px;}
.location-link > div:nth-of-type(1) img { width: 25px;}
.location-link > div:nth-of-type(2) { width: calc(100% - 40px); font-size: 15px; color: #ffffff; font-weight: normal;}
.location-link-1 { background: #438f3d;}
.location-link-2 { background: #EDAE00;}
.location-link-3 { background: #0D76C9;}

.location-bottom { display: flex; flex-direction: row; flex-wrap: wrap;}
.location-bottom > div { position: relative; width: 50%; padding: 60px 0;}
.location-bottom-data { display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center; }
.location-bottom-data > div:nth-of-type(1) { line-height: 0; margin-bottom: 25px;}
.location-bottom-data > div:nth-of-type(2) { color: #0D76C9; font-size: 17px; font-weight: bold; line-height: 130%; letter-spacing: 0.1rem;}
.location-bottom-btn { position: absolute; width: 100%; height: 100%; top: 0; left: 0;display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: center; align-items: center; background: rgba(0,0,0,.8); opacity: 0; }
.location-bottom-btn:hover { opacity: 1; }
.location-bottom-btn img { width: 28px; }

/*qa*/
.qa-title { padding: 50px 20px;}
.qa-section { padding: 0 20px 50px 20px;}
.qa-list { display: flex; flex-direction: column; flex-wrap: nowrap;}
.qa-list > div { margin-bottom: 60px;}
.q-title { background: #a8a8a8; color: #fff; font-weight: bold; font-size: 18px; padding: 5px 15px;}
.q-title span { font-size: 22px; display: inline-block; vertical-align: top; padding-right: 10px; font-family: Arial;}
.q-pto { line-height: 0;}
.q-pto img { width: 100%; }
.a-title { background: #EDAE00; color: #fff; font-weight: bold; font-size: 18px; padding: 5px 15px 10px 15px;}
.a-title span { font-size: 22px; display: inline-block; padding-right: 10px; font-family: Arial;}
.a-btn { display: inline-block; width: 106px; line-height: 25px; border-radius: 5px; background: #fff; color: #EDAE00 !important; font-size: 18px; padding: 0 5px; margin: 7px 10px 0 10px; text-align: center; font-weight: normal; cursor: pointer;}
.qa-list > div:nth-child(even) .a-title { background: #0D76C9;}
.qa-list > div:nth-child(even) .a-btn{ color: #0D76C9 !important;}

.a-content { display: flex; flex-direction: row; flex-wrap: wrap;}
.a-content > div { width: 50%;background: #fcf7e9; }
.a-content > div:nth-child(even) .a-content-title, .a-content > div:nth-child(even) .a-content-data { border-right-width: 0;}
.a-content-title { text-align: center; background: #f6e7bd; border-right: 1px solid #EDAE00; border-bottom: 1px solid #EDAE00; padding: 5px; color: #EDAE00; font-weight: bold; font-size: 18px;}
.a-content-data { padding: 30px; border-right: 1px solid #EDAE00; color: #484948; font-size: 25px; line-height: 150%;}

.qa-list > div:nth-child(even) .a-content-title { background: #c4daee; color: #0D76C9; border-color:#0D76C9;}
.qa-list > div:nth-child(even) .a-content-data { border-color:#0D76C9;}
.qa-list > div:nth-child(even) .a-content > div  { background: #ebf3f9;}

.qa-bottom-section { margin-left: -20px; margin-bottom: -50px; background: #f5f5f5; width: calc(100% + 40px); display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; padding: 40px 20px;}
.qa-bottom-section > a { display: inline-block; margin: 0 10px; position: relative;}
.qa-bottom-section > a:after { content: ""; position: absolute; bottom: -4px; left: 0; width: 100%; height: 0px; background: #3a83c6;}
.qa-bottom-section > a img { width: 45px;}
.qa-bottom-section > a:hover:after { height: 2px;}

/*news*/
.news-section div, .news-section a {word-wrap:break-word;}
.news-section {padding: 0 20px 40px 20px;}
.news-content { max-width: 1300px; margin: 0 auto; text-align: left; background: #f5f5f5; margin-bottom: 50px; position: relative; border-top:4px solid #0D76C9; padding-left: 66px;}
.news-content:before { content: ""; position: absolute; z-index: 3; top: -4px; left: 0; width: 0;height: 0;border-style: solid;border-width: 50px 50px 0 0;border-color: #EDAE00 transparent transparent transparent;}
.news-content:after { content: ""; position: absolute; z-index: 2; top: -4px; left: 0; width: 0;height: 0;border-style: solid;border-width: 66px 66px 0 0;border-color: #fff transparent transparent transparent;}
.news-content-title { display: flex; flex-direction: row; flex-wrap: wrap; border-bottom: 1px solid #EDAE00; margin-bottom: 15px;}
.news-content-title > div:nth-of-type(1) { width: 62%; padding: 20px 20px 20px 0; border-right: 1px solid #EDAE00; font-size: 22px; font-weight: bold; color: #0D76C9; line-height: 130%; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center;}
.news-content-title > div:nth-of-type(2) { width: 38%; background: #fff; padding: 30px 20px; text-align: center;}

.news-table { margin-bottom: 35px; border-spacing: 0;}
.news-table th, .news-table td {padding: 8px 0; font-size: 20px; color: #484848;}
.news-table th { text-align: left;}
.news-table td b { color: #0D76C9;}

.news-btn { padding-bottom: 35px;}
.news-btn a { display: inline-block; margin: 0 10px 10px 0; line-height: 34px; border-radius: 17px; padding: 0 10px; font-size: 18px; color: #fff; font-weight: bold; cursor: pointer;}
.news-btn a:hover { color: #fff;}
.news-btn-blue { background: #0D76C9;}
.news-btn-orange { background: #EDAE00;}

/*news-gallery*/
.flow-detail-top {max-width: 860px; margin: 0 auto; position: relative; padding: 0 60px;}
.slider-for img { width: 100%;}
.slider-for .slick-prev, .slider-for .slick-next { position:absolute; z-index:100; top:calc(50% - 30px); background:none !important; width: 48px; height: 48px; border-radius: 100% !important; border:0px solid #333333 !important;  text-align: center;  opacity: 1; }
.slider-for .slick-prev { left: -60px; }
.slider-for .slick-next { right: -60px; }
.slider-for .slick-prev:before, .slider-for .slick-next:before { font-family: 'Font Awesome 5 Free';font-weight: 900 !important;font-size:30px; color: #0D76C9; opacity: 1;transition: all 0.4s ease-out 0s; display: block;width: 15px; height: 15px; background-size: contain; margin: 0 auto;}
.slider-for .slick-prev:hover, .slider-for .slick-next:hover { opacity: 0.6;}
.slider-for .slick-prev:before { content: "\f0d9";}
.slider-for .slick-next:before { content: "\f0da";}

.slider-nav { padding:0 55px 15px 55px; margin: 30px 0; border-bottom:1px solid #0D76C9;}
.slider-nav .slick-slide img { display:inline-block;
-webkit-transition: all 0.2s ease-out 0s;
-moz-transition: all 0.2s ease-out 0s;
transition: all 0.2s ease-out 0s;}
.slider-nav .slick-slide:hover img { opacity:0.6;}
.slider-nav .slick-slide { position:relative; text-align:center; margin:0 5px; border:1px solid #eeeeee; line-height:0; opacity: 0.5;}
.slider-nav .slick-center { opacity: 1;}
.slider-nav .slick-dots { text-align:center; display:none !important;}
.slider-nav .slick-dots li { width:auto; height:3px; overflow:hidden;}
.slider-nav .slick-dots li button { width:30px; height:3px; background:#fff; margin:0 2px;}
.slider-nav .slick-dots li button::before { content:""; display:none; }
.slider-nav .slick-dots li.slick-active button  { background:#de4609;}
/*.single-item .slick-prev, .single-item .slick-next { display:none !important;}*/
.slider-nav .slick-prev, .slider-nav .slick-next { position:absolute; z-index:100; top:calc(50% - 30px); background:none !important; width: 48px; height: 48px; border-radius: 100% !important; border: 0px solid #333333 !important;  text-align: center; padding-top: 3px; opacity: 1; }
.slider-nav .slick-prev { left: 0;}
.slider-nav .slick-next { right: 0;}
.slider-nav .slick-prev:before, .slider-nav .slick-next:before  { font-family: 'Font Awesome 5 Free';font-weight: 900 !important;font-size:30px; color: #0D76C9; opacity: 1;transition: all 0.4s ease-out 0s; display: block;width: 15px; height: 15px; background-size: contain; margin: 0 auto;}
.slider-nav .slick-prev::before { content: "\f0d9";}
.slider-nav .slick-next::before { content: "\f0da";}
.slider-nav .slick-prev:hover, .slider-nav .slick-prev:focus, .slider-nav .slick-next:hover, .slider-nav .slick-next:focus { opacity: 0.6;}

.slider a { display: block;}
.slider a:before { content:""; display:block; position:absolute; width:100%; height:100%; z-index:1;}

.gallery-list-open { display: none;margin-left: -66px; }
.news-gallery-list {padding: 0 0 0 15px; display: flex; flex-direction: row; flex-wrap: wrap;}
.news-gallery-list > div {width: calc(33.33% - 15px); margin: 0 15px 15px 0; position: relative;}
.news-gallery-pto {line-height: 0;}
.news-gallery-btn {display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: center; background: rgba(0,0,0,.8); opacity: 0; position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.news-gallery-btn:hover { opacity: 1;}
.news-gallery-btn img {width: 28px; opacity: 1;}

#page { text-align: center;}
#page a { display: inline-flex; justify-content: center; align-items: center; width: 20px; height: 20px; border-radius: 100%; margin: 0 10px 10px 10px; border:1px solid #0D76C9;}
#page a:hover, #page a.current { background: #0D76C9; color:#fff;}

/*news2*/
.news-content-title2 > div:nth-of-type(1) { width: 100%; min-height: 180px; border-right-width: 0;}
.news-data { padding: 0 40px 40px 0;}

/*about*/
.about-section-1 { padding: 50px 20px 60px 20px;}
.about-logo { line-height: 0; text-align: center; margin-bottom: 35px;}
.about-slogon { padding: 0 0 40px 0;}
.about-slogon > span { color: #0D76C9;}

.about-section-1-content { position: relative;}
.about-section-1-content > div { position: relative; z-index: 3;}
.about-section-1-content:before { position: absolute; content: ""; width: 100%; height: 70%; border-radius: 10px; border: 1px solid #0D76C9; top:80px; left: 0;}
.about-section-1-icon { position: relative; width: 265px; margin: 0 auto 40px auto; background: #fff; text-align: center;}
.about-section-1-icon:before, .about-section-1-icon:after { content: ""; position: absolute; width: 10px; height: 10px; border-radius: 100%; background: #0D76C9; top:43%; }
.about-section-1-icon:before { left: -4px;}
.about-section-1-icon:after { right: -4px;}
.about-section-1-data { max-width: 1000px; margin: 0 auto 50px auto; padding: 0 30px; text-align: center; line-height: 180%;text-indent: 2em;}
.about-section-1-pto { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; padding: 0 30px;}
.about-section-1-pto > div { margin: 0 14px 14px 14px; line-height: 0; position: relative;}
.about-section-1-pto > div > span { position: absolute; left: 0; bottom: 0; width: 100%; background: rgba(58,131,198,.7); text-align: center; padding: 5px; color: #fff; font-size: 16px; display: block; line-height: 120%;}

.about-section-2-top { position: relative; z-index: 2; padding: 0 20px;}
.about-iocn-2 { text-align: center; margin-bottom: 30px;}
.color-orange { color: #EDAE00;}
.about-section-2-line{ width: 1px; height: 90px; margin: 0 auto; position: relative; background: #EDAE00;}
.about-section-2-line:before, .about-section-2-line:after { content: ""; position: absolute; width: 10px; height: 10px; border-radius: 100%; background: #EDAE00; left:calc(50% - 5px); }
.about-section-2-line:before { top:-4px; }
.about-section-2-line:after { bottom:-4px; }

.about-section-2-content { background: url(../images/about-section2-bg.jpg) no-repeat top center; background-size: cover; padding: 80px 20px; margin-top: -50px; margin-left: -20px; width: calc(100% + 40px);}
.about-section-2-pto { padding-left: 10%; line-height: 0;}

.about-section-3 { padding: 100px 20px 280px 20px;}
.about-section-3-line { background: #0D76C9; height: 66px;}
.about-section-3-line:before, .about-section-3-line:after { background: #0D76C9;}
.about-section-3-content { max-width: 1190px; margin: -2px auto 0 auto; text-align: center;}
.about-section-3-content div, .about-section-3-content a {word-wrap:break-word;}
.about-section-3-data { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; padding-bottom: 40px;}
.about-section-3-data > div { width: 31%; border: 1px solid #0D76C9; padding: 2% 4% 4% 4%;}
.about-section-3-data-pto { line-height: 0; text-align: center;}
.about-section-3-data-txt { border-top:1px solid #0D76C9; line-height: 140%; padding-top: 20px; text-align: left;}
.about-section-3-pto { line-height: 0;}

.about-section-4 { padding: 0px 20px; position: relative;}
.about-section-4 > div { position: relative; z-index: 3; margin-top: -125px;}
.about-section-4:before { content: ""; position: absolute; top:125px; left: 0; width: 100%; height: calc(100% - 125px); background: #eaeaea;}
.about-section-4-title { text-align: center; margin-bottom: 50px; line-height: 0;}
.about-section-4-title img {max-width: 200px;}

.history-content {display: flex; flex-direction: row; flex-wrap: wrap; max-width: 1150px; margin: 0 auto; padding-bottom: 80px;}
.history-content > div { margin: 10px 0;}
.history-content > div:nth-child(odd) { width: 85px; position: relative;}
.history-content > div:nth-child(odd):after { content: ""; width: 1px; height: 100%; background: #EDAE00; position: absolute; top: 0; right: 20px;}
.history-content > div:nth-child(odd) span { display: block;width: 50px; height: 50px; line-height: 50px; border-radius: 100%; background: #EDAE00; color: #fff; font-weight: bold; text-align: center; font-size: 18px;}
.history-content > div:nth-child(even) { width: calc(100% - 85px); }
.history-content > div:nth-child(even) > div { border-bottom: 1px solid #fff; padding-bottom: 15px; margin-bottom: 5px;}

.about-section-4-title2 { text-align: center; padding-bottom: 30px; line-height: 0;}
.about-section-4-title2 img {max-width: 200px;}

.about-btn-mail { text-align: center; padding: 50px 20px;}
.about-btn-mail img { width: 110px;}
.about-btn-mail a { width: 200px; height: 200px; display: inline-block; border-radius: 100%; background: #0D76C9; color: #fff; text-align: center; padding-top: 50px;}
.about-btn-mail span { display: block; margin-top: 15px; font-size: 22px; font-weight: bold;}

/*contact*/
.contact-section { display: flex; flex-direction: row; flex-wrap: wrap;}
.contact-section > div { width: 50%;}
.contact-section > div:nth-of-type(1) { line-height: 0;}
.contact-section > div:nth-of-type(1) iframe { height: 100%; width: 100%; border-width: 0;}
.contact-data { max-width: 800px; margin: 0 auto 0 0; padding: 100px 20px 100px 200px;}
.contact-title { position: relative; border-bottom: 1px solid #484848; margin-bottom: 18px; line-height: 0;}
.contact-title:after { content: ""; position: absolute; width: 4px; height: 4px; border-radius: 100%; background: #484848; right: 0; bottom: -2px;}
.contact-title img { position: relative; margin-left: -130px; max-width: 420px;}

.contact-bottom { display: flex; flex-direction: row; flex-wrap: wrap;}
.contact-bottom > div:nth-of-type(1) { width: calc(100% - 150px); padding-right: 25px;}
.contact-bottom > div:nth-of-type(2) { width: 150px;}
.contact-info { font-weight: bold; font-size: 18px; padding-bottom: 10px; color: #EDAE00; line-height: 130%;}
.contact-info2 { padding-bottom: 30px; font-weight: bold;}

.contact-mail { padding: 40px 0 0 0;}
.contact-mail a { width: 150px; height: 150px; padding-top: 40px;}
.contact-mail img { width: 60px;}
.contact-mail span { font-size: 17px;}


@media only screen and (max-width:  1920px) {
    .path-bg { background-size:auto;}
}

@media only screen and (max-width:  1599px) {
    #content { padding-top: 120px; }
}
@media only screen and (max-width:  1200px) {
    #content { font-size:16px; line-height: 26px; padding-top: 90px;}
    
    .path-bg { background-color: #eaeaea; margin-top: 0; padding-top: 5px;}
    .loop .owl-dots { bottom: 10px; }
    
    .system-slogon { font-size: 28px; padding: 30px 20px;}
    .system-slogon > span { font-size: 17px; }
    
    .system-section-2 { flex-wrap: wrap; padding: 50px 20px 20px 20px;}
    .btn01 > div:nth-of-type(2), .btn02 > div:nth-of-type(1) { font-size: 18px;}
    .btn01 > div:nth-of-type(1) img, .btn02 > div:nth-of-type(1) img { max-width: 50px;}
    
    .products-section > div { padding: 30px 20px 10px 20px;}
    .title01 { margin-bottom: 30px;}
    .title01 span { font-size: 20px; min-width: 220px; }
    
    .pro-list > div { width: calc(50% - 40px);}
    
    .pro-note {font-size: 18px;}
    .pro-note-btn { margin: 0 auto 60px auto; max-width: 400px; }
    .pro-note-btn > div:nth-of-type(1) { width: 60px;}
    .pro-note-btn > div:nth-of-type(2) { padding-left: 20px; font-size: 24px;}
    
    
    .pro-bottom > a {  width: calc(25% - 20px);}
    .pro-bottom > div { width: calc(100% - 20px);}
    
    .title02 { font-size: 26px;}
    .title02-2 { font-size: 22px; }
    .title03 { font-size: 22px;}
    .list-type-1 li { padding-left: 20px;}
    .list-type-1 li:before {top: 8px;border-width: 5px 0 5px 10px;}
    
    .qa-list > div { margin-bottom: 40px;}
    .a-btn {margin-top: 1px; font-size: 16px;}
    .q-title, .a-title { font-size: 18px;}
    .q-title span, .a-title span { font-size: 18px;}
    
    .a-content-title { font-size: 16px;}
    .a-content-data  { font-size: 16px; padding: 20px;}
    
    .news-content-title > div:nth-of-type(1) { font-size: 22px; }
    .news-table th, .news-table td { font-size: 18px; padding: 4px 0;}
    
    .news-content-title2 > div:nth-of-type(1) { min-height: 100px;}
    
    .about-section-1 {padding: 30px 20px;}
    .about-logo { margin-bottom: 20px;}
    .about-logo img { max-width: 90px;}
    .about-slogon { padding: 0 0 20px 0;}
    .about-section-1-icon  { width: 200px;}
    .about-section-1-icon img  { width: 134px;}
    .about-section-1-icon:before, .about-section-1-icon:after { top:57%;}
    
    .about-iocn-2 img { width: 134px;}
    
    .about-section-2-pto { padding-left: 0;}
    
    .about-section-3 { padding-bottom: 200px;}
    
    .about-section-4-title img { width: 120px;}
    .about-section-4:before { top:65px; height: calc(100% - 65px);}
    
    .about-section-4-title2 img { width: 180px;}
    
    .about-btn-mail img { width: 70px;}
    .about-btn-mail a { width: 130px; height: 130px; padding-top: 30px;}
    .about-btn-mail span { font-size: 20px;}
    
    .contact-section > div { width: 100%;}
    .contact-section > div:nth-of-type(1) { order: 2;}
    .contact-section > div:nth-of-type(2) { order: 1; }
    .contact-data { padding: 30px 20px; max-width: 100%;}
    .contact-title img {margin-left: 0; max-width: 300px; padding-bottom: 15px;}
    .contact-info { font-size: 20px;}
    
    .contact-section > div:nth-of-type(1) iframe { height: 350px;}
    
    .application-spec-note{ display: block;}
    
}
@media only screen and (max-width: 980px) {
    .pro-bottom > a {  width: calc(50% - 28px);}
    
    .products-detail-content { flex-wrap: wrap;}
    
    .spec-title-1 { font-size: 20px !important;}
    
    .about-section-1-content:before { height: 85%;}
    .products-detail-content > div:nth-of-type(1){width: 100%;}
    .products-detail-content > div:nth-of-type(2){width: 100%;}
    .application-section-1 { background: none !important; width: auto; height: auto; transform: scale(1);}
    .application-section-l1:after, .application-section-l2:after, .application-section-l3:after, .application-section-r1:after, .application-section-r2:after, .application-section-r3:after { display: none;}
    .application-select { position: relative; top: auto; left: auto; right: auto;}
    .app-select-box {padding-bottom: 30px; margin: 0 auto; width: 90%;}
    .application-bottom { margin-top: 0px;}
    .app-0-rwd { display: block;}
    
    .about-section-1-data { text-align: left;}
    
    .system-section-2 > div { flex-wrap: wrap;}
}
@media only screen and (max-width: 768px) {
    .system-pto img:nth-of-type(1) { display: none;}
    .system-pto img:nth-of-type(2) { display: block;}
    
    .p-detail-control {flex-direction: column; align-items: center;}
    .p-detail-control > div { margin-right: 0; width: 100%; max-width: 335px;}
    
    .location-info-box { top:30px; right: 0px; width: 95%;}
    
    .a-content > div { width: 100%;}
}
@media only screen and (max-width: 640px) {
    .pro-list > div { width: calc(100% - 40px);}
    
    .p-curve > div { width: 100%; margin-bottom: 30px; padding: 0 10px; }
    
    .location-bottom-data > div:nth-of-type(1) img { width: 70px;}
    .location-bottom-data > div:nth-of-type(2) { font-size: 18px;}
    
    .a-btn { display: block; margin: 10px 0 5px 0;}
    
    .news-content-title > div:nth-of-type(1) { width: 100%; padding: 20px 0; border-top: 1px solid #EDAE00; border-right: 0px solid #EDAE00; order: 2; }
    .news-content-title > div:nth-of-type(2) { width: 100%; order: 1; }

    .slider-for .slick-prev, .slider-for .slick-next, .slider-nav .slick-prev, .slider-nav .slick-next { width: 30px; height: 30px;}
	.slider-for .slick-prev { left: -50px; }
	.slider-for .slick-next { right: -50px; }
	.slider-nav .slick-prev { left: 10px;}
	.slider-nav .slick-next { right: 10px;}
}
@media only screen and (max-width: 570px) {
    .pro-bottom > a {  width: calc(100% - 20px); justify-content: flex-start;}
    .path-bg{height: unset;}
    
    .loop3 .owl-nav { top:calc(50% + 20px); }
    .loop3 .owl-prev:before, .loop3 .owl-next:before { font-size: 40px;}
    
    .location-select > div:nth-of-type(1) { font-size: 22px; }
    .location-select { flex-direction: column; align-items: flex-start;}
    .location-select > div:nth-of-type(2) { margin-left: 0; margin-top: 10px; width: 100%;}
    .location-menu { width: 100%;}
    
    .contact-bottom > div:nth-of-type(1) { width: 100%; padding-right: 0px;}
    .contact-bottom > div:nth-of-type(2) { width: 100%;}
}

@media only screen and (max-width: 414px) {
    .slider-for .slick-prev, .slider-for .slick-next { top:calc(50% - 40px);}
    .slider-nav .slick-prev, .slider-nav .slick-next { top:calc(50% - 20px);}
    .slider-for .slick-prev:before, .slider-for .slick-next:before, .slider-nav .slick-prev:before, .slider-nav .slick-next:before { font-size: 20px;}
	

}

@media only screen and (max-width: 320px) {

}