@charset "UTF-8";
@import url(../font-awesome/css/font-awesome.min.css);
@import url(https://fonts.googleapis.com/css?family=Raleway:100,200,300,400,500,600,700,800,900);
@import url(https://fonts.googleapis.com/earlyaccess/cwtexyen.css);
.container::after, .inner::after, .wrapper::after, .box::after { clear: both; content: ''; display: block; visibility: hidden; height: 0; }

.mobile-menu-items li a:link:before, .mobile-menu-items li a:visited:before, .mobile-menu-items li:before, .breadcrumb-wrap ul.breadcrumb .home:before, .breadcrumb-wrap ul.breadcrumb li.icon:before { font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; color: #333; font-size: 18px; padding-right: 0.5em; vertical-align: top; }

/* ================================================================ FlexSlider ================================================================*/
@font-face { font-family: 'flexslider-icon'; src: url("../fonts/flexslider-icon.eot"); src: url("../fonts/flexslider-icon.eot?#iefix") format("embedded-opentype"), url("../fonts/flexslider-icon.woff") format("woff"), url("../fonts/flexslider-icon.ttf") format("truetype"), url("../fonts/flexslider-icon.svg#flexslider-icon") format("svg"); font-weight: normal; font-style: normal; }
.flex-container a:hover, .flex-slider a:hover { outline: none; }

.slides, .slides > li, .flex-control-nav, .flex-direction-nav { margin: 0; padding: 0; list-style: none; }

.flex-pauseplay span { text-transform: capitalize; }

.flexslider { margin: 0; padding: 0; }
.flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; }
.flexslider .slides img { width: 100%; display: block; }
.flexslider .slides:after { content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }

html[xmlns] .flexslider .slides { display: block; }

* html .flexslider .slides { height: 1%; }

.no-js .flexslider .slides > li:first-child { display: block; }

.flexslider { margin: 0 0 0px; position: relative; zoom: 1; -moz-box-shadow: "" 0 1px 4px rgba(0, 0, 0, 0.2); -webkit-box-shadow: "" 0 1px 4px rgba(0, 0, 0, 0.2); box-shadow: "" 0 1px 4px rgba(0, 0, 0, 0.2); }
.flexslider .slides { zoom: 1; }
.flexslider .slides img { height: auto; -moz-user-select: none; }

.flex-viewport { max-height: 2000px; -moz-transition: all 1s ease; -o-transition: all 1s ease; -webkit-transition: all 1s ease; transition: all 1s ease; }

.loading .flex-viewport { max-height: 300px; }

.carousel li { margin-right: 5px; }

.flex-direction-nav { *height: 0; }
.flex-direction-nav a { text-decoration: none; display: block; width: 35px; height: 70px; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 0; cursor: pointer; color: rgba(0, 104, 174, 0.8); -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.flex-direction-nav a:before { display: inline-block; content: ''; width: 35px; height: 70px; background: url("../images/icon-arrow.svg") 0 50% no-repeat; }
.flex-direction-nav a.flex-next:before { -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -webkit-transform: rotate(-180deg); transform: rotate(-180deg); }
.flex-direction-nav .flex-prev { left: 0px; }
.flex-direction-nav .flex-next { right: 0px; text-align: right; }

.flexslider:hover .flex-direction-nav .flex-prev { opacity: 0.7; left: 10px; }
.flexslider:hover .flex-direction-nav .flex-prev:hover { opacity: 1; }
.flexslider:hover .flex-direction-nav .flex-next { opacity: 0.7; right: 10px; }
.flexslider:hover .flex-direction-nav .flex-next:hover { opacity: 1; }

.flex-direction-nav .flex-disabled { opacity: 0 !important; filter: alpha(opacity=0); cursor: default; z-index: -1; }

.flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom: 5px; left: 10px; opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; }
.flex-pauseplay a:before { font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f004'; }
.flex-pauseplay a:hover { opacity: 1; }
.flex-pauseplay a.flex-play:before { content: '\f003'; }

.flex-control-nav { position: absolute; z-index: 9999; width: 100%; bottom: 25%; text-align: center; }
.flex-control-nav li { margin: 0 6px; display: inline-block; zoom: 1; *display: inline; }

.flex-control-paging li a { width: 16px; height: 16px; display: block; cursor: pointer; text-indent: -9999px; background: rgba(255, 255, 255, 0.7); -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.flex-control-paging li a:hover { background: rgba(0, 104, 174, 0.7); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.flex-control-paging li a.flex-active { cursor: default; background: #0068ae; }

.flex-control-thumbs { margin: 5px 0 0; position: static; overflow: hidden; }
.flex-control-thumbs li { width: 25%; float: left; margin: 0; }
.flex-control-thumbs img { width: 100%; height: auto; display: block; opacity: .7; cursor: pointer; -moz-user-select: none; -moz-transition: all 1s ease; -o-transition: all 1s ease; -webkit-transition: all 1s ease; transition: all 1s ease; }
.flex-control-thumbs img:hover { opacity: 1; }
.flex-control-thumbs .flex-active { opacity: 1; cursor: default; }

#carousel img { display: block; opacity: .3; cursor: pointer; }
#carousel img:hover { opacity: 1; }
#carousel .flex-active-slide img { opacity: 1; cursor: default; }

@media (max-width: 860px) { .flex-direction-nav a { margin-top: -25px; width: 25px; height: 50px; }
  .flex-direction-nav a:before { width: 25px; height: 50px; }
  .flex-direction-nav .flex-prev { opacity: 1; left: 10px; }
  .flex-direction-nav .flex-next { opacity: 1; right: 10px; } }
@media (max-width: 480px) { .flex-direction-nav .flex-prev { opacity: 1; left: 10px; }
  .flex-direction-nav .flex-next { opacity: 1; right: 10px; } }
/* layout */
body { background: #fff; font-family: "Raleway", "微軟正黑體", sans-serif; font-size: 14px; color: #333; line-height: 18px; }
body a:link, body a:visited { color: #333; outline: 0; text-decoration: none; }
body a:hover, body a:active { color: #003366; outline: 0; text-decoration: none; }
body .ework { display: inline-block; letter-spacing: 0; font-size: 10px; padding: 5px 5px 5px 25px; }

.container { width: 100%; }

.inner { position: relative; }

.pagetop { position: fixed; right: 0; bottom: 80px; width: 36px; height: 40px; cursor: pointer; z-index: 9000; background: #555; color: #fff; }
.pagetop a { position: absolute; left: 0px; top: 20px; width: 100%; text-align: center; color: #fff; }
.pagetop a:link, .pagetop a:visited { color: #fff; outline: 0; }
.pagetop:before { content: ""; width: 14px; height: 14px; position: absolute; left: 50%; top: 50%; margin-top: -8px; margin-left: -8px; border-top: solid 1px #fff; border-left: solid 1px #fff; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.pagetop:after { content: ""; width: 24px; height: 1px; position: absolute; left: 5px; top: 5px; border-top: solid 1px #fff; }
.pagetop:hover { background: #0068ae; color: #fff; }

.pagetop-hide { opacity: 0; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }

.pagetop-show { opacity: 1; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }

.back-home { position: fixed; right: 0; bottom: 120px; width: 36px; height: 40px; cursor: pointer; z-index: 9000; background: #003366; color: #fff; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.back-home a:link, .back-home a:visited { position: absolute; left: 0; top: 0; width: 100%; height: 40px; text-align: center; color: #fff; font-size: 12px; text-indent: -9999px; overflow: hidden; }
.back-home a:link:before, .back-home a:visited:before { display: block; content: ""; width: 36px; height: 40px; background: url("../images/icon-back-home.svg") 50% 50% no-repeat; background-size: 25px auto; }
.back-home:hover { background: #0068ae; color: #fff; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }

.back-home-show { opacity: 1; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }

.mobile-menu-btn { display: none; cursor: pointer; position: fixed; top: 0; right: 0; width: 40px; height: 40px; opacity: 1; z-index: 9999; background: #003366; cursor: pointer; }
.mobile-menu-btn span { -moz-transition: margin 0s, -moz-transform 0.2s, background-color 0.1s; -o-transition: margin 0s, -o-transform 0.2s, background-color 0.1s; -webkit-transition: margin 0s, -webkit-transform 0.2s, background-color 0.1s; transition: margin 0s, transform 0.2s, background-color 0.1s; -moz-transform-origin: 50% 50% 50%; -ms-transform-origin: 50% 50% 50%; -webkit-transform-origin: 50% 50% 50%; transform-origin: 50% 50% 50%; display: block; position: absolute; top: 10px; right: 8px; width: 22px; height: 3px; background: #fff; }
.mobile-menu-btn span:nth-child(2) { top: calc(10px + 3px + 5px); }
.mobile-menu-btn span:nth-child(3) { top: calc(10px + 3px * 2 + 5px * 2); }

.mobile-menu-btn-opened { position: absolute; position: fixed; }
.mobile-menu-btn-opened span:first-child { background-color: #fff; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); margin-top: 8px; }
.mobile-menu-btn-opened span:nth-child(2) { -moz-transform: scale(0, 1); -ms-transform: scale(0, 1); -webkit-transform: scale(0, 1); transform: scale(0, 1); }
.mobile-menu-btn-opened span:nth-child(3) { background-color: #fff; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -8px; }

.wrapper { position: relative; width: 100%; height: 100%; z-index: 2; -moz-transition: -moz-transform 0.5s ease-in-out; -o-transition: -o-transform 0.5s ease-in-out; -webkit-transition: -webkit-transform 0.5s ease-in-out; transition: transform 0.5s ease-in-out; }

.move-to-left { -moz-transform: translateX(-250px); -ms-transform: translateX(-250px); -webkit-transform: translateX(-250px); transform: translateX(-250px); }

.move-y-hidden { display: none; }

.mobile-menu { width: 250px; height: 100%; position: fixed; overflow-y: auto; top: 0; z-index: 9900; right: -250px; background-color: #dbe8f4; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }

.mobile-menu-inner { position: relative; width: 100%; padding-top: 40px; }
.mobile-menu-inner .search-warp { position: absolute; top: 0; left: 0; width: calc(100% - 40px); margin: 0; }
.mobile-menu-inner .search-warp .shbox { width: calc(100% - 40px); height: 40px; }
.mobile-menu-inner .search-warp .shicon { width: 40px; height: 40px; padding: 10px; }

.menu-opened { display: block !important; }

.mobile-menu-items { position: relative; }
.mobile-menu-items li { position: relative; font-size: 18px; font-weight: bold; color: #333; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.mobile-menu-items li:nth-child(1) { border-top: 1px solid #fff; }
.mobile-menu-items li a:link, .mobile-menu-items li a:visited { position: relative; display: block; width: 100%; padding: 10px; padding-left: 30px; box-sizing: border-box; border-bottom: 1px dotted #fff; }
.mobile-menu-items li a:link:before, .mobile-menu-items li a:visited:before { position: absolute; top: 10px; left: 10px; width: 20px; height: 20px; content: '\f054'; color: #444; }
.mobile-menu-items li:before { position: absolute; top: 10px; left: 10px; width: 20px; height: 20px; content: '\f054'; color: #444; }

.header { position: fixed; top: 0; left: 0; z-index: 10005; width: 100%; background: #fff; }

.header-top { position: relative; width: 100%; height: 90px; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -ms-flex-item-align: center; align-items: center; }
.header-top .logo { display: inline-block; vertical-align: top; width: 415px; height: 60px; }
.header-top .logo a { display: block; }
.header-top .logo h1 { width: 0; overflow: hidden; font-size: 18px; color: #444; line-height: 1.2; }
.header-top .headerRight { width: calc(100% - 415px); display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; -ms-justify-content: flex-end; -ms-flex-pack: flex-end; justify-content: flex-end; }

.language-btn { display: inline-block; vertical-align: top; font-size: 0; }
.language-btn a:link, .language-btn a:visited { display: inline-block; vertical-align: top; width: 35px; height: 35px; margin-right: 5px; font-size: 16px; line-height: 35px; color: #fff; background: #4d4d4d; text-align: center; }
.language-btn a:link:last-child, .language-btn a:visited:last-child { margin-right: 0; }
.language-btn a:link.current, .language-btn a:visited.current { background: #0068ae; }

.search-warp { display: inline-block; vertical-align: top; width: 220px; margin-left: 5px; }
.search-warp .shbox { float: left; width: 185px; height: 35px; background: #dedede; border: 0; outline: 0; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; outline: none; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; padding: 8px 10px; box-sizing: border-box; border: 1px #dedede solid; font-family: "Raleway", "微軟正黑體", sans-serif; font-size: 16px; font-weight: bold; background: #dedede; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.search-warp .shbox::-webkit-input-placeholder { font-weight: 300; color: #555; font-size: 16px; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.search-warp .shbox:-moz-placeholder { color: #555; font-size: 16px; }
.search-warp .shbox::-moz-placeholder { color: #555; font-size: 16px; }
.search-warp .shbox:-ms-input-placeholder { color: #555; font-size: 16px; }
.search-warp .shbox:hover { color: #333; background: #ccc; border: 1px solid rgba(0, 80, 151, 0.5); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.search-warp .shbox:hover::-webkit-input-placeholder { color: #333; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.search-warp .shbox:hover:-moz-placeholder { color: #333; }
.search-warp .shbox:hover::-moz-placeholder { color: #333; }
.search-warp .shbox:hover:-ms-input-placeholder { color: #333; }
.search-warp .shbox:hover:focus::-webkit-input-placeholder { -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); color: rgba(85, 85, 85, 0.5); }
.search-warp .shbox:hover:focus:-moz-placeholder { color: rgba(85, 85, 85, 0.5); }
.search-warp .shbox:hover:focus::-moz-placeholder { color: rgba(85, 85, 85, 0.5); }
.search-warp .shbox:hover:focus:-ms-input-placeholder { color: rgba(85, 85, 85, 0.5); }
.search-warp .shbox::-webkit-input-placeholder { font-weight: bold; }
.search-warp .shicon { float: left; width: 35px; height: 35px; border: 0; padding: 7px; box-sizing: border-box; background: #4d4d4d; outline: 0; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; }

.nav { background: #005eab url("../images/bg-btn.jpg") 50% 50% no-repeat; }

.menu { width: 100%; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; }
.menu li { position: relative; display: inline-block; vertical-align: top; flex: 1; -webkit-flex: 1; border-right: 1px solid rgba(255, 255, 255, 0.5); }
.menu li:first-child { border-left: 1px solid rgba(255, 255, 255, 0.5); }
.menu li a { display: block; padding: 15px 0; box-sizing: border-box; font-size: 22px; line-height: 1; color: #fff; text-align: center; }
.menu .submenu { display: none; position: absolute; top: 100%; left: 0; background: #fff; -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25); -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25); box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.25); }
.menu .submenu li { display: block; border: 0; min-width: 220px; }
.menu .submenu li a:link, .menu .submenu li a:visited { display: block; padding: 12px 5px; padding-left: 25px; box-sizing: border-box; border-bottom: 1px solid rgba(15, 43, 128, 0.1); font-size: 20px; line-height: 1.3; text-align: left; font-weight: bold; color: #333; }
.menu .submenu li a:link::before, .menu .submenu li a:visited::before { font-family: FontAwesome; content: "\f105"; font-size: 14px; position: absolute; margin-left: -14px; margin-top: 2px; color: #DC4F5F; }
.menu .submenu li a:hover, .menu .submenu li a:active { color: white; background: #0068ae; }

.banner { position: relative; }
.banner .banner-photo { position: relative; }
.banner .banner-photo img { width: 100%; }
.banner .banner-photo a { color: #fff; }
.banner .banner-photo .banner-info { position: absolute; top: 50%; left: 0; width: 100%; text-align: center; }
.banner .banner-photo .banner-info .title { font-size: 36px; line-height: 1.2; color: #fff; letter-spacing: 1px; }
.banner .banner-photo .banner-info .text { margin-top: 20px; font-size: 16px; line-height: 1.5; color: #fff; letter-spacing: 2px; }

@keyframes wave { 0% { bottom: 50px; }
  50% { bottom: 40px; }
  100% { bottom: 50px; } }
.scroll-btn { position: absolute; bottom: 50px; left: 50%; z-index: 100; width: 60px; margin-left: -30px; font-size: 15px; line-height: 1; color: #fff; text-align: center; text-transform: uppercase; -moz-animation: 0.8s wave ease-in-out infinite; -webkit-animation: 0.8s wave ease-in-out infinite; animation: 0.8s wave ease-in-out infinite; }
.scroll-btn:before { content: ''; position: absolute; bottom: -20px; left: 50%; margin-left: -8px; width: 16px; height: 10px; background: url("../images/icon-down.svg") 50% 0 no-repeat; }

.main-container { padding: 40px 0; box-sizing: border-box; background: #fff url("../images/bg-01.jpg") 50% 50% no-repeat; background-size: 100% 100%; }

.box { position: relative; }
.box .col:nth-child(1) { float: left; width: calc(100% - 315px); }
.box .col:nth-child(1) .row { width: calc(100% / 2 - 10px); margin-right: 10px; overflow: hidden; }
.box .col:nth-child(1) .row:nth-child(1), .box .col:nth-child(1) .row:nth-child(2) { margin-bottom: 10px; }
.box .col:nth-child(2) { float: left; width: 315px; }
.box .col:nth-child(2) .row { width: 100%; }
.box .row { float: left; line-height: 0; }
.box .row img { line-height: 0; width: 100%; }
.box .row video { line-height: 0; width: 100%; overflow: hidden; }
.box .video { position: relative; text-align: center; color: #fff; }
.box .video a { color: #fff; line-height: 0; }
.box .video a:hover .info { opacity: 0; -moz-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); }
.box .video .info { position: absolute; bottom: 0; right: 0; min-width: 40%; height: 100%; padding: 10px; box-sizing: border-box; background: rgba(0, 104, 174, 0.7); display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-flex-flow: column wrap; flex-flow: column wrap; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; -moz-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); }
.box .video .info .title { font-size: 28px; line-height: 1.2; }
.box .video .info .text { margin-top: 15px; font-size: 16px; line-height: 1.5; }
.box #video1 .info { background: rgba(0, 104, 174, 0.8); }
.box #video2 .info { background: rgba(207, 153, 33, 0.8); }
.box #video3 { height: calc(271.4px * 2 + 10px); overflow: hidden; }
.box #video3 .info { width: 100%; height: 50%; background: rgba(193, 127, 42, 0.8); }
.box .proImg { position: relative; text-align: center; color: #fff; }
.box .proImg a { color: #fff; line-height: 0; }
.box .proImg a:hover .info { opacity: 1; -moz-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); }
.box .proImg .info { opacity: 0; position: absolute; bottom: 0; right: 0; width: 100%; height: 100%; padding: 10px; box-sizing: border-box; background: rgba(119, 84, 135, 0.9); display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-flex-flow: column wrap; flex-flow: column wrap; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; -moz-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); }
.box .proImg .info .title { font-size: 28px; line-height: 1.2; }
.box .proImg .info .text { margin-top: 15px; font-size: 16px; line-height: 1.5; }
.box #proImg1 .info { background: rgba(91, 58, 109, 0.8); }
.box #proImg2 .info { background: rgba(43, 58, 138, 0.8); }

.about-container { background: #00398d url("../images/about-bg.jpg") 50% 50% no-repeat; }

.about-heading { position: relative; padding: 40px 0 30px; box-sizing: border-box; color: #fff; text-align: center; }
.about-heading h2 a { position: relative; font-size: 40px; line-height: 1.2; color: #fff; text-transform: uppercase; }
.about-heading h2 a:before { content: ''; position: absolute; bottom: -15px; left: calc(50% - 50px); width: 100px; height: 1px; background: #fff; }
.about-heading h3 { padding-top: 30px; font-size: 28px; line-height: 1.5; }

.about-info { padding-bottom: 30px; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; -ms-flex-pack: space-between; justify-content: space-between; }
.about-info li { display: inline-block; vertical-align: top; min-width: 30%; border-bottom: 1px solid rgba(255, 255, 255, 0.5); border-right: 1px solid rgba(255, 255, 255, 0.5); color: #fff; text-align: center; -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); -moz-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); }
.about-info li:hover { background: rgba(0, 0, 0, 0.5); -moz-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); }
.about-info li a { display: block; height: 100%; padding: 20px 0; color: #fff; }
.about-info li .title { position: relative; font-size: 22px; line-height: 1.2; }
.about-info li .title:before { content: ''; display: block; width: 100%; height: 60px; margin-bottom: 20px; background: url("../images/icon-a01.svg") 50% 50% no-repeat; }
.about-info li .title:after { content: ''; position: absolute; bottom: -15px; left: calc(50% - 50px); width: 100px; height: 1px; background: #fff; }
.about-info li .text { max-width: 350px; margin: auto; padding-top: 30px; font-size: 15px; line-height: 1.6; letter-spacing: 1px; }
.about-info li:nth-child(2) .title:before { background-image: url("../images/icon-a02.svg"); }
.about-info li:nth-child(3) .title:before { background-image: url("../images/icon-a03.svg"); }

.item-container { padding: 30px 0; }
.item-container a { display: block; position: relative; display: inline-block; vertical-align: top; width: calc(100% / 2 - 25px); color: #fff; line-height: 0; }
.item-container a:nth-child(1) { margin-right: 40px; }
.item-container a .photo { line-height: 0; }
.item-container a .photo img { width: 100%; line-height: 0; }
.item-container a .item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 30px; box-sizing: border-box; line-height: 0; -moz-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); }
.item-container a .info { width: 100%; height: 100%; border: 1px solid rgba(255, 255, 255, 0.5); color: #fff; text-align: center; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-flex-flow: column wrap; flex-flow: column wrap; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; -moz-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); }
.item-container a .info .title { position: relative; font-size: 40px; line-height: 1.2; text-transform: uppercase; font-weight: bold; }
.item-container a .info .text { position: relative; font-size: 28px; line-height: 1.5; }
.item-container a:hover .item { padding: 0; -moz-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); }
.item-container a:hover .info { background: rgba(0, 0, 0, 0.5); -moz-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 400ms cubic-bezier(0.42, 0, 0.58, 1); }

.footer { width: 100%; }
.footer .footer-line { width: 100%; height: 25px; background: url("../images/footer-line.jpg") 50% 0 no-repeat; }
.footer .flex { margin-top: 30px; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; -moz-justify-content: space-between; -ms-justify-content: space-between; -ms-flex-pack: space-between; justify-content: space-between; }
.footer .logo-mark { display: inline-block; vertical-align: top; margin-right: 10px; }
.footer .logo-mark img { width: 70px; height: auto; }
.footer .logo-link { display: inline-block; vertical-align: top; }
.footer .logo-link a { color: #0068ae; }
.footer .logo-link .ch { display: block; font-size: 30px; line-height: 1.2; font-family: 'cwTeXYen', sans-serif; }
.footer .logo-link .en { display: block; font-size: 14px; font-weight: bold; }
.footer .logo-link .en2 { display: block; font-size: 24px; line-height: 1.2; font-weight: 900; text-transform: uppercase; max-width: 350px; }
.footer .address-info { display: block; margin-top: 10px; font-size: 16px; line-height: 1.5; font-weight: bold; color: #0068ae; max-width: 430px; }
.footer .address-info a { color: #0068ae; }
.footer .address-info li { display: block; position: relative; padding: 3px 0; padding-left: 28px; }
.footer .address-info li:before { content: ""; position: absolute; top: 4px; left: 0px; width: 20px; height: 20px; }
.footer .address-info li:nth-child(1):before { background: url("../images/icon-address.svg") no-repeat 50% 50%; }
.footer .address-info li:nth-child(2):before { background: url("../images/icon-telephone.svg") no-repeat 50% 50%; }
.footer .address-info li:nth-child(3):before { background: url("../images/icon-fax.svg") no-repeat 50% 50%; }
.footer .address-info li:nth-child(4):before { background: url("../images/icon-email.svg") no-repeat 50% 50%; }
.footer .address-info li.address:before{ background: url("../images/icon-address.svg") no-repeat 50% 50%; }
.footer .address-info li.telephone:before { background: url("../images/icon-telephone.svg") no-repeat 50% 50%; }
.footer .address-info li.fax:before { background: url("../images/icon-fax.svg") no-repeat 50% 50%; }
.footer .address-info li.email:before { background: url("../images/icon-email.svg") no-repeat 50% 50%; }
.footer .copyright-footer { display: block; text-align: center; margin-top: 10px; font-size: 12px; }

.nav-footer { display: inline-block; vertical-align: top; margin: 0 10px; }
.nav-footer .nav-menu { display: inline-block; vertical-align: top; }
.nav-footer .nav-menu li { min-width: 105px; }
.nav-footer .nav-menu li a:link, .nav-footer .nav-menu li a:visited { display: block; padding: 5px 0; box-sizing: border-box; font-size: 20px; line-height: 1.2; color: #0068ae; font-weight: 600; }
.nav-footer .nav-menu li a:hover, .nav-footer .nav-menu li a:active { color: #003366; }
.nav-footer .nav-menu-pro { display: inline-block; vertical-align: top; }
.nav-footer .nav-menu-pro li { min-width: 135px; max-width: 290px; }
.nav-footer .nav-menu-pro li a:link, .nav-footer .nav-menu-pro li a:visited { position: relative; display: block; padding: 5px 0; padding-left: 20px; box-sizing: border-box; font-size: 18px; line-height: 1.2; color: #0068ae; font-weight: 600; }
.nav-footer .nav-menu-pro li a:link:before, .nav-footer .nav-menu-pro li a:visited:before { position: absolute; top: 8px; left: 0px; content: ''; width: 15px; height: 15px; background: url(../images/icon-arrow.svg) 0 0 no-repeat; -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -webkit-transform: rotate(-180deg); transform: rotate(-180deg); }
.nav-footer .nav-menu-pro li a:hover, .nav-footer .nav-menu-pro li a:active { color: #003366; }
.nav-footer .nav-menu-pro-en li a:link, .nav-footer .nav-menu-pro-en li a:visited { font-size: 16px; }

.footer-share { display: inline-block; vertical-align: top; text-align: center; min-width: 114px; }
.footer-share .socialIcon { display: block; height: 30px; }
.footer-share .socialIcon li { display: inline-block; margin-left: 5px; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.footer-share .socialIcon li:hover { opacity: .6; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.footer-share .QR-Code { display: block; vertical-align: top; margin-top: 20px; }

/* media */
.inner { width: 1300px; margin-left: auto; margin-right: auto; }
.inner:after { content: " "; display: block; clear: both; }

@media (max-width: 1360px) { .inner { width: 1200px; margin-left: auto; margin-right: auto; }
  .inner:after { content: " "; display: block; clear: both; } }
@media (max-width: 1280px) { .inner { width: 1120px; margin-left: auto; margin-right: auto; }
  .inner:after { content: " "; display: block; clear: both; } }
@media (max-width: 1200px) { .inner { width: 1000px; margin-left: auto; margin-right: auto; }
  .inner:after { content: " "; display: block; clear: both; } }
@media (max-width: 1024px) { .inner { width: 900px; margin-left: auto; margin-right: auto; }
  .inner:after { content: " "; display: block; clear: both; } }
@media (max-width: 920px) { .inner { width: 800px; margin-left: auto; margin-right: auto; }
  .inner:after { content: " "; display: block; clear: both; } }
@media (max-width: 820px) { .inner { width: 740px; margin-left: auto; margin-right: auto; }
  .inner:after { content: " "; display: block; clear: both; } }
@media (max-width: 768px) { .inner { width: 660px; margin-left: auto; margin-right: auto; }
  .inner:after { content: " "; display: block; clear: both; } }
@media (max-width: 680px) { .inner { width: 560px; margin-left: auto; margin-right: auto; }
  .inner:after { content: " "; display: block; clear: both; } }
@media (max-width: 580px) { .inner { width: calc(100% - 20px); margin: 0 10px; } }
@media (max-width: 1360px) { .box #video3 { height: calc(243.2px * 2 + 10px); } }
@media (max-width: 1280px) { .box #video3 { height: calc(220.78px * 2 + 10px); }
  .about-info li { min-width: 30%; } }
@media (max-width: 1200px) { .box #video3 { height: calc(187.03px * 2 + 10px); } }
@media (max-width: 1024px) { .box #video3 { height: calc(304px * 2 + 10px); }
  .box .col:nth-child(1) { width: 100%; }
  .box .col:nth-child(1) .row { width: calc(100% - 360px); }
  .box .col:nth-child(1) .row:nth-child(3) { width: calc(100% / 2 - 5px); }
  .box .col:nth-child(1) .row:nth-child(4) { width: calc(100% / 2 - 5px); margin-right: 0; }
  .box .col:nth-child(2) { position: absolute; top: 0; right: 0; width: 350px; }
  .box .col:nth-child(2) .row { width: 100%; }
  .box .video .info { width: 40%; } }
@media (max-width: 920px) { .box #video3 { height: calc(270px * 2 + 10px); }
  .box .col:nth-child(1) .row { width: calc(100% - 320px); }
  .box .col:nth-child(2) { width: 310px; } }
@media (max-width: 820px) { .box #video3 { height: calc(248px * 2 + 10px); }
  .box .col:nth-child(1) .row { width: calc(100% - 300px); }
  .box .col:nth-child(2) { width: 290px; } }
@media (max-width: 768px) { .box #video3 { height: calc(214px * 2 + 10px); }
  .box .col:nth-child(1) .row { width: calc(100% - 260px); }
  .box .col:nth-child(2) { width: 250px; } }
@media (max-width: 680px) { .box #video3 { height: calc(187px * 2 + 10px); }
  .box .col:nth-child(1) .row { width: calc(100% - 228px); }
  .box .col:nth-child(2) { width: 218px; } }
@media (max-width: 580px) { .box { padding: 20px; box-sizing: border-box; }
  .box .col:nth-child(1) .row { width: 100%; margin-right: 0 !important; margin-bottom: 20px !important; }
  .box .col:nth-child(1) .row:nth-child(3), .box .col:nth-child(1) .row:nth-child(4) { width: 100%; }
  .box .col:nth-child(2) { position: relative; width: 100%; }
  .box .col:nth-child(2) .row { width: 100%; }
  .box #video3 { height: 480px; }
  .box #video3 .info { position: absolute !important; height: auto; } }
@media (max-width: 480px) { .box .video a:hover .info { opacity: 1; }
  .box .video .info { position: relative; width: 100%; height: auto; padding: 20px 10px; }
  .box .proImg .info { opacity: 1; position: relative; width: 100%; height: auto; padding: 20px 10px; } }
@media (max-width: 1280px) { .menu li a { padding: 15px 10px; font-size: 20px; } }
@media (max-width: 1024px) { .scroll-btn { display: none; }
  .menu li a { padding: 15px 5px; font-size: 18px; } }
@media (max-width: 800px) { .header { -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); }
  .header-top { height: auto; }
  .header-top .logo { width: 210px; height: 40px; padding-top: 5px; box-sizing: border-box; }
  .header-top .logo img { width: 100%; height: auto; }
  .header-top .headerRight { width: auto; display: block; position: absolute; right: 35px; top: 5px; }
  .header-top .headerRight .language-btn a { width: 28px; height: 30px; margin: 0; font-size: 14px; line-height: 30px; }
  .header-top .headerRight .search-warp { display: none; }
  .nav { display: none; }
  .mobile-menu-btn, .mobile-menu-opened { display: block; }
  .flex-control-nav { bottom: 10px; }
  .nav-footer { display: none; } }
@media (max-width: 768px) { .banner .banner-photo .banner-info { margin-top: -20px; }
  .banner .banner-photo .banner-info .title { font-size: 20px; letter-spacing: 0; }
  .banner .banner-photo .banner-info .text { margin-top: 10px; font-size: 14px; letter-spacing: 0; }
  .about-container { background: rgba(0, 57, 141, 0.9); }
  .about-heading { padding-bottom: 0px; }
  .about-info { display: block; }
  .about-info li { display: block; border: 0; margin: 40px 0 20px; -moz-box-shadow: 0 0 0 transparent; -webkit-box-shadow: 0 0 0 transparent; box-shadow: 0 0 0 transparent; }
  .item-container a { width: 100%; margin-right: 0; }
  .item-container a:nth-child(1) { margin-right: 0; margin-bottom: 30px; } }
@media (max-width: 640px) { .footer .flex { display: block; }
  .footer .logo-warp { display: block; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-flex-flow: wrap; flex-flow: wrap; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; width: 100%; margin: 0 auto 30px; }
  .footer .logo-mark { display: block; text-align: center; }
  .footer .logo-link { display: block; }
  .footer-share { width: 100%; } }
@media (max-width: 480px) { .footer .logo-link .en2 { text-align: center; } }
/* breadcrumb */
.breadcrumb-wrap { width: 100%; padding: 10px 20px; box-sizing: border-box; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.breadcrumb-wrap ul.breadcrumb li { position: relative; display: inline-block; font-size: 14px; line-height: 20px; }
.breadcrumb-wrap ul.breadcrumb .home { width: 15px; text-indent: -9999px; text-transform: uppercase; }
.breadcrumb-wrap ul.breadcrumb .home:before { content: "\f015"; position: absolute; top: 1px; left: 0; width: 20px; height: 20px; color: #666; text-indent: 0; }
.breadcrumb-wrap ul.breadcrumb .home:hover:before { color: #000; }
.breadcrumb-wrap ul.breadcrumb li.icon a:link, .breadcrumb-wrap ul.breadcrumb li.icon a:visited { color: #444; }
.breadcrumb-wrap ul.breadcrumb li.icon a:hover, .breadcrumb-wrap ul.breadcrumb li.icon a:active { color: #000; }
.breadcrumb-wrap ul.breadcrumb li.icon:before { content: "\f105"; padding: 0 5px; font-size: 16px; }

.top-banner { height: 270px; overflow: hidden; background: #064172; font-size: 0; line-height: 0; text-align: center; }
.top-banner.bg-line { position: relative; }
.top-banner.bg-line:before { content: ''; position: absolute; top: 0; left: 0; z-index: 5; width: 2170px; height: 100%; background: url("../images/line-top.svg")-217px 270px; background-size: 2170px 375px; opacity: 0.1; }
.top-banner .heading { position: absolute; top: 0; left: 324px; margin-top: calc(2.5px + 60px); width: 220px; height: 100%; background: url("../images/line-top-title.svg") 0 0 no-repeat; background-size: 217px 160px; font-size: 16px; line-height: 1.5; color: #fff; text-align: center; vertical-align: middle; }
.top-banner .heading h3 { margin-top: 40px; text-transform: uppercase; }
.top-banner .heading h4 { margin-top: 10px; font-size: 34px; font-weight: bold; letter-spacing: 3px; text-transform: uppercase; }
.top-banner .heading.en h3 { font-size: 12px; }
.top-banner .heading.en h4 { font-size: 30px; letter-spacing: 0; }
.top-banner li { display: inline-block; vertical-align: top; }
.top-banner li img { height: 100%; }
.top-banner li:nth-child(1) { width: 570px; text-align: right; }
.top-banner li:nth-child(2) { width: calc(100% - 570px); text-align: left; }

.main-bottom { padding-top: 60px; background: #fff; overflow: hidden; }
.main-bottom .tilte { font-size: 28px; line-height: 1.5; color: #0068ae; font-weight: bold; text-align: center; padding-bottom: 30px; letter-spacing: 2px; }
.main-bottom.bg-line-2 { position: relative; }
.main-bottom.bg-line-2:before { content: ''; position: absolute; top: 0; left: 0; width: 2170px; height: 100%; background: url("../images/line-top-2.svg")-217px 0px repeat-y; background-size: 2170px 375px; opacity: 0.1; }
.main-bottom.bg-g { background: #eee; }

.about-wrap { max-width: 1100px; margin: auto; box-sizing: border-box; }
.about-wrap section { position: relative; }
.about-wrap section .heading { position: absolute; top: 0; right: 0; width: 288px; height: 222px; font-size: 30px; line-height: 1.3; color: #fff; font-weight: bold; text-align: center; background: url("../images/bg-title-hexagon.svg") 0 bottom no-repeat; }
.about-wrap section .heading h2 { padding-top: 100px; }
.about-wrap section .heading h2.en { padding-top: 80px; font-size: 24px; line-height: 1.4; text-transform: uppercase; }
.about-wrap .sec01 .heading { top: -120px; }
.about-wrap .sec01 .box-right { position: absolute; right: 0; bottom: 0; width: 250px; border-bottom: 20px solid #e30613; }
.about-wrap .sec01 .box-right ul li { position: relative; margin-bottom: 30px; padding-left: 40px; box-sizing: border-box; }
.about-wrap .sec01 .box-right ul li:before { content: ''; position: absolute; top: 0; left: 0; width: 30px; height: 30px; background: url("../images/icon-about-01.svg") 50% 50% no-repeat; }
.about-wrap .sec01 .box-right ul li .title { font-size: 18px; color: #f7931e; }
.about-wrap .sec01 .box-right ul li .title span.en { font-size: 12px; font-style: italic; text-transform: uppercase; }
.about-wrap .sec01 .box-right ul li .text { width: 250px; font-size: 10px; -moz-transform: scale(0.8); -ms-transform: scale(0.8); -webkit-transform: scale(0.8); transform: scale(0.8); transform-origin: top left; }
.about-wrap .sec01 .box-right ul li:nth-of-type(2):before { background-image: url("../images/icon-about-02.svg"); }
.about-wrap .sec01 .box-right ul li:nth-of-type(3):before { background-image: url("../images/icon-about-03.svg"); }
.about-wrap .detail { max-width: 700px; margin: auto; padding-bottom: 20px; }
.about-wrap .detail .t1 { font-size: 26px; line-height: 1.5; color: #4d4d4d; }
.about-wrap .detail .t1 .bold { font-weight: bold; color: #333; }
.about-wrap .detail .t2 { display: inline-block; vertical-align: top; font-size: 16px; line-height: 2; color: #ed1c24; font-weight: bold; letter-spacing: 1px; }
.about-wrap .detail .t2:before { display: inline-block; vertical-align: top; content: ''; width: 200px; height: 50%; padding-top: 20px; margin-top: -5px; margin-right: 10px; border-bottom: 1px solid #ccc; }
.about-wrap .detail .info { margin-top: 20px; font-size: 18px; line-height: 2; color: #444; }
.about-wrap .detail .info span { display: block; }
.about-wrap .detail .info .bold { font-weight: bold; color: #333; }
.about-wrap .sec02 { margin: 50px 0; }
.about-wrap .sec02 .heading { z-index: 100; left: 0px; right: inherit; background-image: url("../images/bg-title-hexagon2.svg"); }
.about-wrap .sec02 .detail { margin-top: 50px; }
.about-wrap .philosophy-en { padding: 50px 50px 0; box-sizing: border-box; }
.about-wrap .philosophy-en ul li { position: relative; width: 100%; height: auto; margin-top: 70px; text-align: left; background: #eee; padding: 40px 60px; box-sizing: border-box; }
.about-wrap .philosophy-en ul li .title { font-size: 24px; line-height: 1; font-weight: bold; color: #ea063d; }
.about-wrap .philosophy-en ul li .text { padding-top: 10px; font-size: 16px; line-height: 1.8; font-weight: bold; }
.about-wrap .philosophy-en ul li:nth-of-type(1):before { content: ''; position: absolute; top: -50px; right: -100px; width: 180px; height: 150px; background: url("../images/icon-philosophy-01.svg") center center no-repeat; }
.about-wrap .philosophy-en ul li:nth-of-type(2):before { content: ''; position: absolute; top: -50px; left: -100px; width: 180px; height: 150px; background: url("../images/icon-philosophy-02.svg") center center no-repeat; }
.about-wrap .philosophy-en ul li:nth-of-type(3):before { content: ''; position: absolute; top: -50px; right: -100px; width: 180px; height: 150px; background: url("../images/icon-philosophy-03.svg") center center no-repeat; }
.about-wrap .philosophy ul { position: relative; height: 500px; }
.about-wrap .philosophy ul li { width: 240px; height: 250px; text-align: center; background: url("../images/bg-detail-hexagon.svg") center center no-repeat; }
.about-wrap .philosophy ul li .title { padding-top: 70px; font-size: 24px; line-height: 1; font-weight: bold; color: #ea063d; }
.about-wrap .philosophy ul li .text { width: 190px; margin: auto; padding-top: 10px; font-size: 15px; line-height: 1.8; font-weight: bold; }
.about-wrap .philosophy ul li:nth-of-type(1) { position: absolute; top: 230px; left: 37px; }
.about-wrap .philosophy ul li:nth-of-type(1):before { content: ''; position: absolute; top: -100px; left: 30px; width: 180px; height: 150px; background: url("../images/icon-philosophy-01.svg") center center no-repeat; }
.about-wrap .philosophy ul li:nth-of-type(1) .title { padding-top: 60px; }
.about-wrap .philosophy ul li:nth-of-type(1) .text { width: 200px; }
.about-wrap .philosophy ul li:nth-of-type(2) { position: absolute; top: 105px; left: 255px; }
.about-wrap .philosophy ul li:nth-of-type(2):before { content: ''; position: absolute; top: -100px; left: 30px; width: 180px; height: 150px; background: url("../images/icon-philosophy-02.svg") center center no-repeat; }
.about-wrap .philosophy ul li:nth-of-type(2) .text { width: 150px; }
.about-wrap .philosophy ul li:nth-of-type(3) { position: absolute; top: 230px; left: 470px; }
.about-wrap .philosophy ul li:nth-of-type(3):before { content: ''; position: absolute; top: -100px; left: 30px; width: 180px; height: 150px; background: url("../images/icon-philosophy-03.svg") center center no-repeat; }
.about-wrap .philosophy ul li:nth-of-type(3) .text { width: 170px; }
.about-wrap .sec03 { padding-top: 50px; }
.about-wrap .sec03 .detail { padding: 20px; padding-bottom: 0; box-sizing: border-box; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjEuMCIgeDI9IjEuMCIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2YyZjJmMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -moz-linear-gradient(45deg, #ffffff, #f2f2f2); background: -webkit-linear-gradient(45deg, #ffffff, #f2f2f2); background: linear-gradient(45deg, #ffffff, #f2f2f2); }
.about-wrap .sec03 .detail ul { font-size: 0; }
.about-wrap .sec03 .detail ul li { position: relative; display: inline-block; vertical-align: top; width: 45%; padding: 20px; padding-left: 50px; box-sizing: border-box; font-size: 18px; line-height: 1.5; color: #333; }
.about-wrap .sec03 .detail ul li:nth-child(3) { margin-left: 50px; }
.about-wrap .sec03 .detail ul li:nth-child(1), .about-wrap .sec03 .detail ul li:nth-child(2) { border-bottom: 1px dashed #ccc; }
.about-wrap .sec03 .detail ul li:before { content: ""; position: absolute; top: 5px; left: 0; width: 50px; height: 50px; background: url("../images/icon-creativity-01.svg") no-repeat 50% 50%; }
.about-wrap .sec03 .detail ul li:nth-of-type(1):before { background-image: url(../images/icon-creativity-01.svg); }
.about-wrap .sec03 .detail ul li:nth-of-type(2):before { background-image: url(../images/icon-creativity-02.svg); }
.about-wrap .sec03 .detail ul li:nth-of-type(3):before { background-image: url(../images/icon-creativity-03.svg); }
.about-wrap .sec03 .detail ul li:nth-of-type(4):before { background-image: url(../images/icon-creativity-04.svg); }
.about-wrap .sec03 .detail ul li .bold { font-weight: bold; }
.about-wrap .sec04 { padding-top: 80px; padding-bottom: 50px; }
.about-wrap .sec04 .heading { left: 0px; right: inherit; background-image: url("../images/bg-title-hexagon2.svg"); }
.about-wrap .sec04 .detail { padding: 40px; box-sizing: border-box; border-bottom: 1px dashed #ccc; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjEuMCIgeTE9IjEuMCIgeDI9IjAuMCIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2YyZjJmMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -moz-linear-gradient(135deg, #ffffff, #f2f2f2); background: -webkit-linear-gradient(135deg, #ffffff, #f2f2f2); background: linear-gradient(-45deg, #ffffff, #f2f2f2); font-size: 22px; line-height: 1.5; color: #333; font-weight: bold; text-align: center; }

.patent { padding-top: 40px; }
.patent .tilte { font-size: 28px; line-height: 1.5; color: #0068ae; font-weight: bold; text-align: center; padding-bottom: 30px; letter-spacing: 2px; }

.patent-list { max-width: 1200px; margin: auto; font-size: 0; line-height: 0; }
.patent-list li { display: inline-block; vertical-align: top; background: #005097; background: #fff; padding: 15px; box-sizing: border-box; width: calc(100% / 4 - 30px); margin-right: 40px; margin-bottom: 40px; -moz-box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.25); -webkit-box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.25); box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.25); -moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); }
.patent-list li img { width: 100%; }
.patent-list li:nth-child(4n) { margin-right: 0; }
.patent-list li:hover { -moz-box-shadow: 2px 5px 15px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 2px 5px 15px rgba(0, 0, 0, 0.5); box-shadow: 2px 5px 15px rgba(0, 0, 0, 0.5); -moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); }

.list-wrap { max-width: 1100px; margin: auto; font-size: 0; line-height: 0; }
.list-wrap li { display: inline-block; vertical-align: top; width: calc(100% / 3 - 61px); margin-right: 90px; margin-bottom: 60px; background: #005097; padding: 1px; box-sizing: border-box; -moz-box-shadow: 8px 8px 8px rgba(0, 0, 0, 0.25); -webkit-box-shadow: 8px 8px 8px rgba(0, 0, 0, 0.25); box-shadow: 8px 8px 8px rgba(0, 0, 0, 0.25); -moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); }
.list-wrap li:nth-child(3n) { margin-right: 0; }
.list-wrap li .photo { overflow: hidden; font-size: 0; line-height: 0; }
.list-wrap li .photo img { width: 100%; -moz-transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); }
.list-wrap li .text { padding: 15px 10px; box-sizing: border-box; font-size: 22px; line-height: 1.2; color: #fff; font-weight: bold; text-align: center; letter-spacing: 1px; }
.list-wrap li .text a { color: #fff; }
.list-wrap li:hover { -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); }
.list-wrap li:hover .photo img { -moz-transform: scale(1.1); -ms-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1); -moz-transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); }

.pro-wrap .gallery { display: inline-block; vertical-align: top; width: 50%; margin-right: 50px; }
.pro-wrap .pro-info { position: relative; display: inline-block; vertical-align: top; width: calc(100% - 50% - 60px); font-size: 0; }
.pro-wrap .pro-info .inquiry_brn { position: absolute; right: 0; bottom: -5px; padding-left: 50px; padding-bottom: 10px; box-sizing: border-box; border-bottom: 5px solid #ef8b1e; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.pro-wrap .pro-info .inquiry_brn:hover { padding-left: 60px; padding-right: 20px; border-color: #f3a83b; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.pro-wrap .pro-info .inquiry_brn:hover .t1 { color: #e95a24; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.pro-wrap .pro-info .inquiry_brn:hover:before { margin-left: 10px; -moz-transform: scale(1.2); -ms-transform: scale(1.2); -webkit-transform: scale(1.2); transform: scale(1.2); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.pro-wrap .pro-info .inquiry_brn:before { content: ''; position: absolute; top: 0; left: 0; width: 36px; height: 46px; padding-right: 10px; box-sizing: border-box; background: url("../images/hexagon-email.svg") 0 0 no-repeat; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.pro-wrap .pro-info .inquiry_brn .t1 { font-size: 16px; line-height: 1; font-weight: bold; color: #ef8b1e; text-transform: uppercase; letter-spacing: 3px; }
.pro-wrap .pro-info .inquiry_brn .t2 { font-size: 20px; line-height: 1.2; font-weight: bold; color: #005097; letter-spacing: 2px; text-transform: uppercase; }
.pro-wrap .pro-info .title { position: relative; padding: 10px 10px; padding-right: 146px; box-sizing: border-box; border-bottom: 5px solid #005097; font-size: 24px; line-height: 1.2; font-weight: bold; color: #005097; letter-spacing: 2px; }
.pro-wrap .pro-info .text { padding: 30px 10px; box-sizing: border-box; font-size: 16px; line-height: 2; color: #333; letter-spacing: 1px; }
.pro-wrap .pro-info .share { padding-left: 10px; box-sizing: border-box; vertical-align: top; font-size: 13px; line-height: 1; font-weight: bold; color: #005097; text-transform: uppercase; }
.pro-wrap .pro-info .share span { margin-right: 5px; }
.pro-wrap .pro-info .share a { display: inline-block; vertical-align: middle; font-size: 0; margin-right: 5px; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.pro-wrap .pro-info .share a:hover { -moz-transform: scale(1.2); -ms-transform: scale(1.2); -webkit-transform: scale(1.2); transform: scale(1.2); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }

.pro-intro { position: relative; width: 100%; margin-top: 40px; padding-top: 140px; background: #fff url("../images/product-bg.jpg") repeat-x center 0; }
.pro-intro .heading { position: absolute; top: 0; left: 50%; width: 230px; height: 150px; margin-left: -115px; padding-top: 60px; box-sizing: border-box; font-size: 24px; font-weight: bold; color: #fff; text-align: center; letter-spacing: 1px; background: url("../images/bg-hexagon.svg") center 0 no-repeat; }
.pro-intro .heading:before { content: ''; position: absolute; top: 8px; left: 50%; margin-left: -20px; width: 40px; height: 40px; background: url("../images/icon-gear.svg") center center no-repeat; }
.pro-intro .info { padding: 40px; box-sizing: border-box; }
.pro-intro .info .section { max-width: 900px; margin: auto; }
.pro-intro .info .section img { max-width: 100%; height: auto; }
.pro-intro .info .section video { max-width: 100%; height: auto; }
.pro-intro .info .title { padding-left: 40px; box-sizing: border-box; font-size: 22px; line-height: 1.4; font-weight: bold; color: #005097; background: url("../images/icon-hexagon.svg") 0 0 no-repeat; background-size: 30px 30px; }
.pro-intro .info .text { padding-top: 20px; font-size: 15px; line-height: 1.8; color: #333; letter-spacing: 1px; }
.pro-intro .info .table { width: 100%; overflow-x: auto; }
.pro-intro .info table { width: 100%; }
.pro-intro .info table th, .pro-intro .info table td { padding: 5px; border: 1px solid #7fa7ca; font-size: 16px; line-height: 2; color: #005097; text-align: center; }
.pro-intro .info table thead tr th { width: 20%; font-weight: bold; background: #0068ae; color: #fff; }
.pro-intro .info table thead tr th:nth-child(1) { background: #005097; }
.pro-intro .info table tbody tr td { background: #f2f6f9; }
.pro-intro .info table tbody tr td:nth-child(1) { background: #e6eef4; }

.video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }

.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.equipment-list { max-width: 1200px; }
.equipment-list li { background: #005097; padding: 0; width: calc(100% / 3 - 40px); margin-right: 60px; -moz-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); }
.equipment-list li a { cursor: default; }
.equipment-list li .text { letter-spacing: 1px; }
.equipment-list li:hover { -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1); }
.equipment-list li:hover .photo img { -moz-transform: scale(1.1); -ms-transform: scale(1.1); -webkit-transform: scale(1.1); transform: scale(1.1); -moz-transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 500ms cubic-bezier(0.42, 0, 0.58, 1); }

.technology { max-width: 1100px; margin: auto; margin-bottom: 40px; }
.technology .heading { position: relative; padding-bottom: 25px; border-bottom: 5px solid #005097; text-align: center; }
.technology .heading span { position: relative; font-size: 28px; line-height: 1; font-weight: bold; color: #005097; }
.technology .heading span:after { content: ''; display: block; position: absolute; bottom: -28px; left: 0; width: 100%; height: 5px; background: #ef8b1e; }

.production-size { margin-top: 60px; font-size: 0; }
.production-size .table-wrap { display: inline-block; vertical-align: top; width: 50%; padding: 0 20px; box-sizing: border-box; }
.production-size .table-wrap .standard-table { max-width: 480px; margin: auto; }
.production-size .info { display: inline-block; vertical-align: top; width: 50%; }
.production-size .info .text { max-width: 400px; margin: auto; }
.production-size .info .text li { position: relative; margin-bottom: 15px; padding-left: 35px; box-sizing: border-box; font-size: 20px; line-height: 1.5; font-weight: bold; color: #005097; }
.production-size .info .text li:before { content: ''; position: absolute; top: 0; left: 0; width: 30px; height: 30px; background: url("../images/icon-info.svg") center center no-repeat; }
.production-size .info .text li .red { color: #ed1c24; }
.production-size .info .photo-list { position: relative; max-width: 400px; margin: auto; }
.production-size .info .photo-list li { position: relative; margin-top: 30px; }
.production-size .info .photo-list .photo { position: relative; display: block; font-size: 0; line-height: 0; background: #e6e6e6; -moz-transform: rotate(3deg); -ms-transform: rotate(3deg); -webkit-transform: rotate(3deg); transform: rotate(3deg); }
.production-size .info .photo-list .photo img { width: 100%; border: 5px solid #fff; box-sizing: border-box; -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -webkit-transform: rotate(-3deg); transform: rotate(-3deg); -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.5); box-shadow: 0 0 1px rgba(0, 0, 0, 0.5); }
.production-size .info .photo-list .title { position: absolute; bottom: 20px; right: 0; padding: 10px; box-sizing: border-box; background: #ef8b1e; font-size: 14px; line-height: 1; color: #fff; text-align: center; text-transform: uppercase; }

.standard-table { width: 100%; -moz-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); }
.standard-table th, .standard-table td { padding: 5px; border: 1px solid rgba(0, 80, 151, 0.5); font-size: 20px; line-height: 1.2; color: #005097; text-align: center; padding: 15px 10px; }
.standard-table thead tr th { width: 50%; font-weight: bold; background: #005097; color: #fff; }
.standard-table thead tr th:nth-child(2) { background: #0068ae; }
.standard-table tbody tr td { background: #e6eef4; }
.standard-table tbody tr td:nth-child(2) { background: #f2f6f9; }

.contact-box { display: block; width: 100%; max-width: 460px; margin: 40px auto 0px; padding: 20px 20px 10px; box-sizing: border-box; border: 5px solid #005097; background: #005097; color: #fff; text-align: center; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.contact-box a:link, .contact-box a:visited { color: #fff; }
.contact-box:hover { background: rgba(0, 80, 151, 0.85); border: 5px solid #666; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.contact-box .t1 { position: relative; box-sizing: border-box; font-size: 24px; line-height: 1.2; }
.contact-box .t1:before { content: ''; display: inline-block; vertical-align: top; margin-right: 10px; width: 30px; height: 26px; background: url("../images/icon-email2.svg") center center no-repeat; }
.contact-box .t1:after { content: ''; display: inline-block; vertical-align: top; margin-left: 10px; width: 20px; height: 26px; background: url("../images/icon-arrow-right.svg") center center no-repeat; }
.contact-box .t2 { margin-top: 10px; font-size: 18px; line-height: 1.4; }

.contact-wrap { max-width: 900px; margin: auto; }
.contact-wrap .heading { font-size: 24px; line-height: 1.5; color: #005097; font-weight: bold; text-align: center; margin-bottom: 40px; }
.contact-wrap .line { position: relative; width: 100%; border-bottom: 5px solid #005097; text-align: center; }
.contact-wrap .line .text { margin-bottom: -10px; box-sizing: border-box; }
.contact-wrap .line span { position: relative; font-size: 15px; line-height: 1; background: #fff; font-weight: bold; color: #e51c24; }
.contact-wrap .line span:before, .contact-wrap .line span:after { display: inline-block; vertical-align: top; content: ''; width: 40px; height: 20px; }

.contact-form { margin-top: 40px; margin-bottom: 40px; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; }
.contact-form .finish { display: block; width: 100%; font-size: 18px; line-height: 2; font-weight: bold; text-align: center; }

.form-container { max-width: 680px; }
.form-container .options { position: relative; display: inline-block; vertical-align: top; width: calc(50% - 17px); margin: 8px 0; margin-right: 30px; font-size: 0; }
.form-container .options:nth-child(2n) { margin-right: 0; }
.form-container .options.name:before, .form-container .options.company:before, .form-container .options.tel:before, .form-container .options.mobile:before, .form-container .options.fax:before, .form-container .options.email:before, .form-container .options.message:before { content: ""; position: absolute; top: 0px; left: 0px; width: 26px; height: 30px; background: url("../images/hexagon-name.svg") 0 0 no-repeat; }
.form-container .options.name:before { background-image: url("../images/hexagon-name.svg"); }
.form-container .options.company:before { background-image: url("../images/hexagon-company.svg"); }
.form-container .options.tel:before { background-image: url("../images/hexagon-phone.svg"); }
.form-container .options.mobile:before { background-image: url("../images/hexagon-mobile.svg"); }
.form-container .options.fax:before { background-image: url("../images/hexagon-fax.svg"); }
.form-container .options.email:before { background-image: url("../images/hexagon-email.svg"); }
.form-container .options.message:before { background-image: url("../images/hexagon-message.svg"); }
.form-container .options.infoW { width: 100%; }
.form-container .options .field-label { position: relative; display: inline-block; vertical-align: top; width: 140px; padding-left: 30px; box-sizing: border-box; font-size: 20px; line-height: 34px; font-weight: bold; color: #333; }
.form-container .options .required { position: absolute; top: 0; right: 2px; font-size: 22px; color: #e51c24; }
.form-container .options .field { position: relative; display: inline-block; width: calc(100% - 140px); outline: none; color: #005097; outline: none; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; padding: 8px 10px; box-sizing: border-box; border: 1px #dedede solid; font-family: "Raleway", "微軟正黑體", sans-serif; font-size: 18px; font-weight: bold; background: #fff; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; }
.form-container .options .field::-webkit-input-placeholder { font-weight: 300; color: #999; font-size: 18px; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.form-container .options .field:-moz-placeholder { color: #999; font-size: 18px; }
.form-container .options .field::-moz-placeholder { color: #999; font-size: 18px; }
.form-container .options .field:-ms-input-placeholder { color: #999; font-size: 18px; }
.form-container .options .field:hover { color: #ef8b1e; background: #f9f9f9; border: 1px solid rgba(0, 80, 151, 0.5); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.form-container .options .field:hover::-webkit-input-placeholder { color: #ef8b1e; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.form-container .options .field:hover:-moz-placeholder { color: #ef8b1e; }
.form-container .options .field:hover::-moz-placeholder { color: #ef8b1e; }
.form-container .options .field:hover:-ms-input-placeholder { color: #ef8b1e; }
.form-container .options .field:hover:focus::-webkit-input-placeholder { -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); color: rgba(153, 153, 153, 0.5); }
.form-container .options .field:hover:focus:-moz-placeholder { color: rgba(153, 153, 153, 0.5); }
.form-container .options .field:hover:focus::-moz-placeholder { color: rgba(153, 153, 153, 0.5); }
.form-container .options .field:hover:focus:-ms-input-placeholder { color: rgba(153, 153, 153, 0.5); }
.form-container .options .textarea { display: inline-block; vertical-align: top; width: calc(100% - 140px); max-width: calc(100% - 140px); outline: none; color: #005097; outline: none; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; padding: 8px 10px; box-sizing: border-box; border: 1px #dedede solid; font-family: "Raleway", "微軟正黑體", sans-serif; font-size: 18px; font-weight: bold; background: #fff; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.form-container .options .textarea::-webkit-input-placeholder { font-weight: 300; color: #999; font-size: 18px; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.form-container .options .textarea:-moz-placeholder { color: #999; font-size: 18px; }
.form-container .options .textarea::-moz-placeholder { color: #999; font-size: 18px; }
.form-container .options .textarea:-ms-input-placeholder { color: #999; font-size: 18px; }
.form-container .options .textarea:hover { color: #ef8b1e; background: #f9f9f9; border: 1px solid rgba(0, 80, 151, 0.5); -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.form-container .options .textarea:hover::-webkit-input-placeholder { color: #ef8b1e; -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); }
.form-container .options .textarea:hover:-moz-placeholder { color: #ef8b1e; }
.form-container .options .textarea:hover::-moz-placeholder { color: #ef8b1e; }
.form-container .options .textarea:hover:-ms-input-placeholder { color: #ef8b1e; }
.form-container .options .textarea:hover:focus::-webkit-input-placeholder { -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1); color: rgba(153, 153, 153, 0.5); }
.form-container .options .textarea:hover:focus:-moz-placeholder { color: rgba(153, 153, 153, 0.5); }
.form-container .options .textarea:hover:focus::-moz-placeholder { color: rgba(153, 153, 153, 0.5); }
.form-container .options .textarea:hover:focus:-ms-input-placeholder { color: rgba(153, 153, 153, 0.5); }

.btn-wrap { width: 100%; margin: 30px auto; text-align: center; }
.btn-wrap .btn { position: relative; padding: 8px 12px; padding-left: 36px; box-sizing: border-box; border: 0; outline: none; background: #ccc; font-family: "Raleway", "微軟正黑體", sans-serif; font-size: 17px; line-height: 1; letter-spacing: .1rem; font-weight: bold; text-transform: uppercase; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; }
.btn-wrap .btn:before { content: ""; position: absolute; top: 5px; left: 8px; width: 24px; height: 24px; }
.btn-wrap .btn:hover { color: #000; -moz-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; -webkit-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; }
.btn-wrap .reset { color: #555; background-color: #f8f7f0; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U2ZTZlNiIvPjxzdG9wIG9mZnNldD0iNDUlIiBzdG9wLWNvbG9yPSIjZjRmNGY0Ii8+PHN0b3Agb2Zmc2V0PSI1MCUiIHN0b3AtY29sb3I9IiNlOWU5ZTkiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNmU2ZTYiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e6e6e6), color-stop(45%, #f4f4f4), color-stop(50%, #e9e9e9), color-stop(100%, #e6e6e6)); background: -moz-linear-gradient(top, #e6e6e6, #f4f4f4 45%, #e9e9e9 50%, #e6e6e6); background: -webkit-linear-gradient(top, #e6e6e6, #f4f4f4 45%, #e9e9e9 50%, #e6e6e6); background: linear-gradient(to bottom, #e6e6e6, #f4f4f4 45%, #e9e9e9 50%, #e6e6e6); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5); }
.btn-wrap .reset:before { background: url("../images/icon-clear.svg") center center no-repeat; }
.btn-wrap .reset:hover { color: #333; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U2ZTZlNiIvPjxzdG9wIG9mZnNldD0iNSUiIHN0b3AtY29sb3I9IiNmNGY0ZjQiLz48c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iI2U5ZTllOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2U2ZTZlNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e6e6e6), color-stop(5%, #f4f4f4), color-stop(50%, #e9e9e9), color-stop(100%, #e6e6e6)); background: -moz-linear-gradient(top, #e6e6e6, #f4f4f4 5%, #e9e9e9 50%, #e6e6e6); background: -webkit-linear-gradient(top, #e6e6e6, #f4f4f4 5%, #e9e9e9 50%, #e6e6e6); background: linear-gradient(to bottom, #e6e6e6, #f4f4f4 5%, #e9e9e9 50%, #e6e6e6); -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); }
.btn-wrap .submit { margin-left: 10px; color: #fff; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwNjhhZSIvPjxzdG9wIG9mZnNldD0iNDUlIiBzdG9wLWNvbG9yPSIjMDA2OGFlIi8+PHN0b3Agb2Zmc2V0PSI1MCUiIHN0b3AtY29sb3I9IiMwMDUwOTciLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyYjNhODkiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0068ae), color-stop(45%, #0068ae), color-stop(50%, #005097), color-stop(100%, #2b3a89)); background: -moz-linear-gradient(top, #0068ae, #0068ae 45%, #005097 50%, #2b3a89); background: -webkit-linear-gradient(top, #0068ae, #0068ae 45%, #005097 50%, #2b3a89); background: linear-gradient(to bottom, #0068ae, #0068ae 45%, #005097 50%, #2b3a89); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.8); -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.8); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.8); }
.btn-wrap .submit:before { background: url("../images/icon-mailto.svg") center center no-repeat; }
.btn-wrap .submit:hover { color: #fff; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwNjhhZSIvPjxzdG9wIG9mZnNldD0iNSUiIHN0b3AtY29sb3I9IiMwMDY4YWUiLz48c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzAwNTA5NyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzJiM2E4OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0068ae), color-stop(5%, #0068ae), color-stop(50%, #005097), color-stop(100%, #2b3a89)); background: -moz-linear-gradient(top, #0068ae, #0068ae 5%, #005097 50%, #2b3a89); background: -webkit-linear-gradient(top, #0068ae, #0068ae 5%, #005097 50%, #2b3a89); background: linear-gradient(to bottom, #0068ae, #0068ae 5%, #005097 50%, #2b3a89); -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); }
.btn-wrap .back { position: relative; color: #fff; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwNjhhZSIvPjxzdG9wIG9mZnNldD0iNDUlIiBzdG9wLWNvbG9yPSIjMDA2OGFlIi8+PHN0b3Agb2Zmc2V0PSI1MCUiIHN0b3AtY29sb3I9IiMwMDUwOTciLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyYjNhODkiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0068ae), color-stop(45%, #0068ae), color-stop(50%, #005097), color-stop(100%, #2b3a89)); background: -moz-linear-gradient(top, #0068ae, #0068ae 45%, #005097 50%, #2b3a89); background: -webkit-linear-gradient(top, #0068ae, #0068ae 45%, #005097 50%, #2b3a89); background: linear-gradient(to bottom, #0068ae, #0068ae 45%, #005097 50%, #2b3a89); -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.8); -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.8); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.8); }
.btn-wrap .back:before { background: url("../images/icon-back.svg") center center no-repeat; }
.btn-wrap .back:hover { color: #fff; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwNjhhZSIvPjxzdG9wIG9mZnNldD0iNSUiIHN0b3AtY29sb3I9IiMwMDY4YWUiLz48c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzAwNTA5NyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzJiM2E4OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #0068ae), color-stop(5%, #0068ae), color-stop(50%, #005097), color-stop(100%, #2b3a89)); background: -moz-linear-gradient(top, #0068ae, #0068ae 5%, #005097 50%, #2b3a89); background: -webkit-linear-gradient(top, #0068ae, #0068ae 5%, #005097 50%, #2b3a89); background: linear-gradient(to bottom, #0068ae, #0068ae 5%, #005097 50%, #2b3a89); -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.3); }

.location-wrap { display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-flex-flow: row-reverse nowrap; flex-flow: row-reverse nowrap; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; -ms-justify-content: flex-end; -ms-flex-pack: flex-end; justify-content: flex-end; background: #fff; font-size: 0; -moz-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); background: url("../images/contact-bg.jpg") right top no-repeat; background-size: 800px 500px; margin-bottom: 25px; }
.location-wrap .map { width: 50%; height: 350px; border: 10px #fff solid; box-sizing: border-box; }
.location-wrap .map iframe { width: 100%; height: 100%; }
.location-wrap .location-info { width: 50%; display: -webkit-flex; display: -moz-flex; display: -webkit-flex; display: flex; -webkit-align-items: center; -moz-align-items: center; -ms-align-items: center; -ms-flex-item-align: center; align-items: center; -webkit-justify-content: center; -moz-justify-content: center; -ms-justify-content: center; -ms-flex-pack: center; justify-content: center; font-size: 16px; line-height: 2; }
.location-wrap .location-info .companyName { position: relative; margin-bottom: 40px; border-bottom: 5px solid #ef8b1e; font-size: 26px; font-weight: bold; color: #005097; text-align: center; }
.location-wrap .location-info .companyName:before { content: ''; position: absolute; top: 50%; left: -35px; width: 30px; height: 30px; background: url("../images/icon-hexagon.svg") 0 0 no-repeat; }
.location-wrap .location-info .companyName .t2 { position: absolute; bottom: -30px; left: 0; width: 100%; font-size: 16px; font-weight: bold; color: #ef8b1e; text-transform: uppercase; text-align: center; font-style: italic; }
.location-wrap .location-info .address-info { max-width: 300px; margin-top: 10px; font-size: 16px; line-height: 1.5; font-weight: bold; color: #0068ae; }
.location-wrap .location-info .address-info a { color: #0068ae; }
.location-wrap .location-info .address-info li { display: block; position: relative; padding: 3px 0; padding-left: 28px; }
.location-wrap .location-info .address-info li:before { content: ""; position: absolute; top: 4px; left: 0px; width: 20px; height: 20px; }
.location-wrap .location-info .address-info li:nth-of-type(1):before { background: url("../images/icon-address.svg") no-repeat 50% 50%; }
.location-wrap .location-info .address-info li:nth-of-type(2):before { background: url("../images/icon-telephone.svg") no-repeat 50% 50%; }
.location-wrap .location-info .address-info li:nth-of-type(3):before { background: url("../images/icon-fax.svg") no-repeat 50% 50%; }
.location-wrap .location-info .address-info li:nth-of-type(4):before { background: url("../images/icon-email.svg") no-repeat 50% 50%; }
.location-wrap .location-info .address-info li.email:before{ background: url("../images/icon-email.svg") no-repeat 50% 50%; }

@media (max-width: 1600px) { .top-banner.bg-line:before { background-position: calc(-217px - 60px) 270px; }
  .top-banner .heading { left: calc(324px - 60px); }
  .main-bottom.bg-line-2:before { background-position: calc(-217px - 60px) 0px; } }
@media (max-width: 1280px) { .top-banner.bg-line:before { background-position: calc(-217px - 120px) 270px; }
  .top-banner .heading { left: calc(324px - 120px); }
  .top-banner li:nth-child(1) { width: 510px; }
  .top-banner li:nth-child(2) { width: calc(100% - 510px); }
  .main-bottom.bg-line-2:before { background-position: calc(-217px - 120px) 0px; } }
@media (max-width: 1024px) { .top-banner { height: 200px; }
  .top-banner.bg-line:before { background-position: calc(-217px - 210px) 225px; }
  .top-banner .heading { left: calc(324px - 210px); margin-top: calc(2.5px + 15px); }
  .top-banner li img { height: 200px; }
  .top-banner li:nth-child(1) { width: 380px; }
  .top-banner li:nth-child(2) { width: calc(100% - 380px); }
  .main-bottom.bg-line-2:before { background-position: calc(-217px - 210px) 22px; }
  .about-wrap section .detail { padding-top: 50px; }
  .about-wrap .philosophy { padding-top: 50px; }
  .about-wrap .sec03 { padding-top: 150px; padding-bottom: 30px; }
  .about-wrap .sec04 { padding-top: 100px; padding-bottom: 30px; }
  .patent-list li { padding: 5px; }
  .pro-wrap .gallery { width: 40%; margin-right: 50px; }
  .pro-wrap .pro-info { width: calc(100% - 40% - 60px); }
  .pro-wrap .pro-info .title { padding-right: 170px; letter-spacing: 1px; }
  .pro-wrap .pro-info .text { font-size: 16px; line-height: 1.8; font-weight: bold; } }
@media (max-width: 768px) { .top-banner { height: 200px; }
  .top-banner.bg-line:before { background-position: calc(-217px - 260px) 225px; }
  .top-banner .heading { left: calc(324px - 280px); margin-top: calc(2.5px + 15px); }
  .top-banner li img { height: 200px; }
  .top-banner li:nth-child(1) { width: 300px; }
  .top-banner li:nth-child(2) { width: calc(100% - 300px); }
  .main-bottom.bg-line-2:before { background-position: calc(-217px - 260px) 22px; }
  .about-wrap .philosophy { padding-top: 80px; }
  .about-wrap .sec01 .box-right { display: none; }
  .about-wrap .sec03 { padding-top: 180px; padding-bottom: 30px; }
  .about-wrap .sec04 { padding-top: 180px; }
  .patent-list li { width: calc(100% / 2 - 10px); margin-right: 20px; padding: 10px; }
  .patent-list li:nth-child(4n) { margin-right: 20px; }
  .patent-list li:nth-child(2n) { margin-right: 0; }
  .list-wrap li { width: calc(100% / 3 - 30px); margin-right: 45px; }
  .list-wrap li:nth-child(3n) { margin-right: 0; }
  .list-wrap li .text { font-size: 18px; line-height: 1.2; }
  .pro-wrap .gallery { display: block; width: 100%; padding: 0 30px; box-sizing: border-box; max-width: 500px; margin-right: 0; margin: auto; }
  .pro-wrap .pro-info { display: block; width: 100%; }
  .pro-intro .info { padding: 30px; }
  .location-wrap { display: block; line-height: 0; }
  .location-wrap .map { width: 100%; height: 250px; }
  .location-wrap .location-info { width: 100%; padding: 20px; box-sizing: border-box; } }
@media (max-width: 640px) { .top-banner { height: auto; }
  .top-banner li { background: rgba(0, 0, 0, 0.3); }
  .top-banner li img { opacity: .2; height: 200px; }
  .top-banner li:nth-child(1) { display: none; width: 100%; }
  .top-banner li:nth-child(2) { width: 100%; }
  .top-banner.bg-line:before { display: none; background-position: center 225px; }
  .top-banner .heading { left: calc(50% - 110px); margin-top: calc(2.5px + 15px); }
  .main-bottom.bg-line-2:before { background-position: center 22px; }
  .about-wrap section { position: relative; }
  .about-wrap section .heading { position: relative; top: 0; right: 0; width: 288px; height: 222px; font-size: 30px; color: #fff; font-weight: bold; text-align: center; background: url("../images/bg-title-hexagon.svg") 0 bottom no-repeat; }
  .about-wrap section .heading h2 { padding-top: 100px; }
  .about-wrap section .detail { padding-top: 0; }
  .about-wrap .sec01 .heading { top: -40px; }
  .about-wrap .sec01 .detail .t2:before { display: none; }
  .about-wrap .sec01 .detail .info span { display: inline; }
  .about-wrap .sec02 .heading { background-image: url("../images/bg-title-hexagon.svg"); }
  .about-wrap .philosophy-en { padding-top: 0; padding-right: 20px; }
  .about-wrap .philosophy-en ul { padding-bottom: 50px; }
  .about-wrap .philosophy-en ul li:nth-of-type(1), .about-wrap .philosophy-en ul li:nth-of-type(2), .about-wrap .philosophy-en ul li:nth-of-type(3) { padding: 40px 50px; }
  .about-wrap .philosophy-en ul li:nth-of-type(1):before, .about-wrap .philosophy-en ul li:nth-of-type(2):before, .about-wrap .philosophy-en ul li:nth-of-type(3):before { top: -50px; left: -70px; right: inherit; width: 130px; height: 120px; }
  .about-wrap .philosophy { padding: 0px; }
  .about-wrap .philosophy ul { position: relative; height: auto; padding-bottom: 50px; }
  .about-wrap .philosophy ul li:nth-of-type(1), .about-wrap .philosophy ul li:nth-of-type(2), .about-wrap .philosophy ul li:nth-of-type(3), .about-wrap .philosophy ul li:nth-of-type(4), .about-wrap .philosophy ul li:nth-of-type(5), .about-wrap .philosophy ul li:nth-of-type(6), .about-wrap .philosophy ul li:nth-of-type(7) { position: relative; top: 0; left: 0; right: 0; margin: 0; margin: auto; margin-top: 30px; }
  .about-wrap .philosophy ul li:nth-of-type(1):before, .about-wrap .philosophy ul li:nth-of-type(2):before, .about-wrap .philosophy ul li:nth-of-type(3):before, .about-wrap .philosophy ul li:nth-of-type(4):before, .about-wrap .philosophy ul li:nth-of-type(5):before, .about-wrap .philosophy ul li:nth-of-type(6):before, .about-wrap .philosophy ul li:nth-of-type(7):before { content: ''; position: absolute; top: -35px; bottom: 0; left: 0; right: 0; width: 130px; height: 120px; margin: 0; margin-left: -30px; }
  .about-wrap .philosophy ul li:nth-of-type(7) { width: 240px; height: 250px; background-image: url("../images/bg-detail-hexagon.svg"); }
  .about-wrap .philosophy ul li:nth-of-type(7):before { content: ''; position: absolute; top: -35px; width: 130px; height: 120px; margin-left: -30px; background: url("../images/icon-philosophy-07.svg") center center no-repeat; }
  .about-wrap .philosophy ul li:nth-of-type(7) .title { padding-top: 80px; }
  .about-wrap .sec01, .about-wrap .sec02, .about-wrap .sec03, .about-wrap .sec04 { padding: 0; }
  .about-wrap .sec03 .detail { background: rgba(255, 255, 255, 0.5); }
  .about-wrap .sec03 .detail ul li { display: block; width: 100%; }
  .about-wrap .sec03 .detail ul li:nth-child(3) { margin-left: 0; }
  .about-wrap .sec03 .detail ul li:nth-child(1), .about-wrap .sec03 .detail ul li:nth-child(2) { border-bottom: 0px dashed #ccc; }
  .about-wrap .sec04 { margin-top: 30px; }
  .about-wrap .sec04 .heading { background-image: url("../images/bg-title-hexagon.svg"); }
  .about-wrap .sec04 .detail { background: rgba(255, 255, 255, 0.5); border: 0; }
  .pro-wrap .gallery { max-width: 560px; }
  .pro-intro .info { padding: 20px; }
  .form-container .options { width: 100%; margin-right: 0px; }
  .form-container .options .textarea { display: block; width: calc(100% - 30px); max-width: inherit; margin-left: 30px; }
  .standard-table th, .standard-table td { padding: 2px 5px; } }
@media (max-width: 480px) { .patent-list { width: 90%; }
  .patent-list li { width: 100%; margin-right: 0 !important; }
  .list-wrap li { width: calc(100% / 2 - 15px); margin-right: 30px; }
  .list-wrap li:nth-child(3n) { margin-right: 30px; }
  .list-wrap li:nth-child(2n) { margin-right: 0; }
  .pro-wrap .pro-info .title { padding-right: 10px; padding-bottom: 60px; letter-spacing: 0; }
  .pro-intro .info { padding: 10px; }
  .production-size .table-wrap { width: 100%; }
  .production-size .info { width: 100%; margin-top: 30px; }
  .standard-table th, .standard-table td { padding: 0 5px; line-height: 1.5; }
  .location-wrap .location-info .companyName:before { display: none; } }
@media (max-width: 390px) { .list-wrap { padding: 0 30px; box-sizing: border-box; }
  .list-wrap li { width: 100%; margin-right: 0; }
  .list-wrap li:nth-child(3n) { margin-right: 0; } }

/*# sourceMappingURL=style.css.map */