@charset "UTF-8";
.icons-sprite, .icons-add, .icons-email, .icons-fb, .icons-home, .icons-line, .icons-more, .icons-more02, .icons-place, .icons-smartphone { background-image: url('../images/icons-sc8d715a35d.png'); background-repeat: no-repeat; }

.icons-add { background-position: 0 0; }

.icons-email { background-position: 0 -36px; }

.icons-fb { background-position: 0 -72px; }

.icons-home { background-position: 0 -128px; }

.icons-line { background-position: 0 -162px; }

.icons-more { background-position: 0 -218px; }

.icons-more02 { background-position: 0 -248px; }

.icons-place { background-position: 0 -278px; }

.icons-smartphone { background-position: 0 -314px; }

.unreset address, .unreset blockquote, .unreset dd, .unreset div, .unreset dl, .unreset dt, .unreset fieldset, .unreset form, .unreset frame, .unreset frameset, .unreset h1, .unreset h2, .unreset h3, .unreset h4, .unreset h5, .unreset h6, .unreset noframes, .unreset ol, .unreset p, .unreset ul, .unreset center, .unreset dir, .unreset hr, .unreset menu, .unreset pre { display: block; }

.unreset li { display: list-item; }

.unreset head { display: none; }

.unreset table { display: table; }

.unreset tr { display: table-row; }

.unreset thead { display: table-header-group; }

.unreset tbody { display: table-row-group; }

.unreset tfoot { display: table-footer-group; }

.unreset col { display: table-column; }

.unreset colgroup { display: table-column-group; }

.unreset td, .unreset th { display: table-cell; }

.unreset caption { display: table-caption; }

.unreset th { font-weight: bolder; text-align: center; }

.unreset caption { text-align: center; }

.unreset body { margin: 8px; }

.unreset h1 { font-size: 2em; margin: 0.67em 0; }

.unreset h2 { font-size: 1.5em; margin: 0.75em 0; }

.unreset h3 { font-size: 1.17em; margin: 0.83em 0; }

.unreset h4, .unreset p, .unreset blockquote, .unreset ul, .unreset fieldset, .unreset form, .unreset ol, .unreset dl, .unreset dir, .unreset menu { margin: 1.12em 0; }

.unreset h5 { font-size: .83em; margin: 1.5em 0; }

.unreset h6 { font-size: .75em; margin: 1.67em 0; }

.unreset h1, .unreset h2, .unreset h3, .unreset h4, .unreset h5, .unreset h6, .unreset b, .unreset strong { font-weight: bolder; }

.unreset blockquote { margin-left: 40px; margin-right: 40px; }

.unreset i, .unreset cite, .unreset em, .unreset var, .unreset address { font-style: italic; }

.unreset pre, .unreset tt, .unreset code, .unreset kbd, .unreset samp { font-family: monospace; }

.unreset pre { white-space: pre; }

.unreset button, .unreset textarea, .unreset input, .unreset select { display: inline-block; }

.unreset big { font-size: 1.17em; }

.unreset small, .unreset sub, .unreset sup { font-size: 0.83em; }

.unreset sub { vertical-align: sub; }

.unreset sup { vertical-align: super; }

.unreset table { border: 1px solid; border-spacing: 2px; }

.unreset thead, .unreset tbody, .unreset tfoot { vertical-align: middle; }

.unreset th, .unreset tr { vertical-align: inherit; border: 1px solid; padding: 5; font-size: 100%; }

.unreset td { vertical-align: inherit; border: 1px solid; padding-left: 5px; font-size: 100%; }

.unreset s, .unreset strike, .unreset del { text-decoration: line-through; }

.unreset hr { border: 1px inset; }

.unreset ol, .unreset ul, .unreset dir, .unreset menu, .unreset dd { margin-left: 40px; }

.unreset ol { list-style-type: decimal; }

.unreset ol ul, .unreset ul ol, .unreset ul ul, .unreset ol ol { margin-top: 0; margin-bottom: 0; }

.unreset ul { list-style-type: disc; }

.unreset u, .unreset ins { text-decoration: underline; }

.unreset br:before { content: "\A"; white-space: pre-line; }

.unreset center { text-align: center; }

.unreset :link, .unreset :visited { text-decoration: underline; }

.unreset :focus { outline: thin dotted invert; }

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; font-weight: normal; vertical-align: baseline; background: transparent; }

body { line-height: 1; }

ol, ul, li { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

/* remember to define a styles! */
:link, :visited { text-decoration: none; }

:focus { outline: 0; }

/* remember to highlight inserts somehow! */
ins { text-decoration: none; }

del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }

table tr td { vertical-align: middle; }

img { border: 0; }

a { color: inherit; }

input, button, textarea, select, optgroup, option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; }

/* padding */
*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

/*@purpose To enable resizing for IE */
/*@branch For IE6-Win, IE7-Win */
input, button, textarea, select { font-size: 100%; }

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }

.clearfix:after { clear: both; }

.clearfix { zoom: 1; }

/* other */
code, kbd, samp, tt { font-size: 100%; }

header nav #logo a, header nav #nav_top #lan li a, header nav #nav .list > a, header nav #nav .dropdown-menu li a, header nav #nav #lan li a, .sidebar .sidebar_list > li a, .btn a { width: 100%; height: 100%; display: block; color: inherit; }

header nav #logo a, #footer .footer_info .footer_logo, #contact .contact_info .contact_logo, .pagenum .btnleft a, .pagenum .btnright a { white-space: nowrap; text-indent: 100%; overflow: hidden; }

.bootstrap_default, header nav #nav_top > li, header nav #nav_top #lan li, header nav #nav .list, header nav #nav #lan li, #product_hot .product_list .product_des span, #product_new .product_list .product_des span, #product .product_content .product_list ul .product_des span { display: inline-block; margin-right: -6px; vertical-align: top; }

.table { display: table; border-spacing: 0.5rem; border-collapse: collapse; width: 100%; table-layout: fixed; }

/* animation-name: example; 動畫名稱 */
/* animation-duration: 4s; 動畫時間長度 */
/* animation-timing-function: linear; 動畫速度 */
/* animation-delay:2s; 動畫開始秒數'' */
/* animation-iteration-count: 3; 動畫循環次數 */
/* animation-direction: alternate; 動畫時間方向性 */
/* WEIGHTS */
/* FONT */
body { font-size: 10px; font-size: 1rem; line-height: 1.6; }

section .i_content_title h2 { font-size: 20px; font-size: 2rem; font-weight: 800; }
section .i_content_title h2 span { font-size: 10px; font-size: 1rem; font-weight: 800; }
section .content_title h2 { font-size: 20px; font-size: 2rem; font-weight: 800; }
section .content_title h2 span { font-size: 10px; font-size: 1rem; font-weight: 800; }
section .content_title02 h2 { font-size: 14px; font-size: 1.4rem; font-weight: 800; }
section .content_title02 h2 span { font-size: 8px; font-size: 0.8rem; }

#product_hot .product_list .product_title { font-size: 12px; font-size: 1.2rem; font-weight: 800; }

#news .news_list .news_title { font-size: 12px; font-size: 1.2rem; font-weight: 800; }

#news_detail .news_title h2 { font-size: 16px; font-size: 1.6rem; font-weight: 800; }
#news_detail .news_title h2 span { font-size: 8px; font-size: 0.8rem; }

#product .product_content { /* LIST */ /* DETAIL */ /* DM */ }
#product .product_content .product_list ul .product_title { font-size: 12px; font-size: 1.2rem; font-weight: 800; }
#product .product_content .product_detail_info span { font-size: 20px; font-size: 2rem; font-weight: 800; }
#product .product_content .product_detail_info .title { font-weight: 800; }
#product .product_content .product_dm_list ul .product_dm_info span { font-size: 12px; font-size: 1.2rem; font-weight: 800; }

.news_more { font-size: 8px; font-size: 0.8rem; }

/* Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; left: 0; top: 0; display: block; }
.slick-track:before, .slick-track:after { content: ""; display: table; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }

.slick-slide { float: left; height: 100%; min-height: 1px; display: none; }
[dir="rtl"] .slick-slide { float: right; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-arrow.slick-hidden { display: none; }

/* $slick-font-path: "./fonts/" !default; */
/* Slider */
.slick-loading .slick-list { background: #fff url("../images/ajax-loader.gif") center center no-repeat; }

/* Icons */
/* @if $slick-font-family == "slick" { @font-face { font-family: "slick"; src: slick-font-url("slick.eot"); src: slick-font-url("slick.eot?#iefix") format("embedded-opentype"), slick-font-url("slick.woff") format("woff"), slick-font-url("slick.ttf") format("truetype"), slick-font-url("slick.svg#slick") format("svg"); font-weight: normal; font-style: normal; }
} */
/* Arrows */
.slick-prev, .slick-next { position: absolute; display: block; height: 20px; width: 20px; line-height: 0px; font-size: 0px; cursor: pointer; background: transparent; color: transparent; top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); padding: 0; border: none; outline: none; }
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { outline: none; background: transparent; color: transparent; }
.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; }
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; }
.slick-prev:before, .slick-next:before { font-family: "slick"; font-size: 20px; line-height: 1; color: white; opacity: 0.75; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-prev { left: 0px; }
[dir="rtl"] .slick-prev { left: auto; right: -25px; }
.slick-prev:before { content: "←"; }
[dir="rtl"] .slick-prev:before { content: "→"; }

.slick-next { right: 0px; }
[dir="rtl"] .slick-next { left: -25px; right: auto; }
.slick-next:before { content: "→"; }
[dir="rtl"] .slick-next:before { content: "←"; }

/* Dots */
.slick-dotted.slick-slider { margin-bottom: 30px; }

.slick-dots { position: absolute; bottom: -25px; list-style: none; display: block; text-align: center; padding: 0; margin: 0; width: 100%; }
.slick-dots li { position: relative; display: inline-block; height: 20px; width: 20px; margin: 0 5px; padding: 0; cursor: pointer; }
.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0px; font-size: 0px; color: transparent; padding: 5px; cursor: pointer; }
.slick-dots li button:hover, .slick-dots li button:focus { outline: none; }
.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; }
.slick-dots li button:before { position: absolute; top: 0; left: 0; content: "•"; width: 20px; height: 20px; font-family: "slick"; font-size: 6px; line-height: 20px; text-align: center; color: black; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.slick-dots li.slick-active button:before { color: black; opacity: 0.75; }

body { font: normal 16px/1.6 Verdana, "微軟正黑體", sans-serif; color: #333; }

h2, h3 { display: inline-block; }

#wrapper { position: relative; }

.clear { clear: both; }

/* BOOTSTRAP */
body.modal-open { overflow: hidden; }

.bootstrap_default { padding: 0px; float: none !important; }

/* RWD */
.pc { display: block; }

.mobile { display: none; }

/* TABLE */
.table .table_row { display: table-row; }
.table .table_cell { display: table-cell; vertical-align: middle; }

#menu { display: none; width: 50px; height: 50px; padding: 10px; background: #326C95; cursor: pointer; position: fixed; top: 0px; right: 0px; z-index: 9999; }
#menu span { width: 30px; height: 1px; margin-bottom: 7px; background: #fff; position: relative; display: block; top: 6px; transition: 0.2s; -webkit-transition: 0.2s; -moz-transition: 0.2s; }

#menu.on { background: #244C75; }
#menu.on span { background: #fff; }
#menu.on span:nth-child(1) { top: 14px; transform: rotate(-45deg); }
#menu.on span:nth-child(2) { width: 0; opacity: 0; }
#menu.on span:nth-child(3) { top: -2px; transform: rotate(45deg); }

header { background: #000; padding: 30px 0px; /*  overflow:hidden; */ }
header nav { max-width: 1200px; margin: 0px auto; }
header nav #logo { background: url(../images/logo.png?20210120) no-repeat center; width: 260px; height: 80px; background-size: 260px; float: left; }
header nav #nav_top { float: right; display: block; margin-right: 10px; }
header nav #nav_top > li { margin: 0px 0px 0px 10px; }
header nav #nav_top .search_form { margin-bottom: 0px; }
header nav #nav_top .search_form > .vessel { width: 100%; display: inline-block; position: relative; }
header nav #nav_top .search_form label { display: none; }
header nav #nav_top .search_form input[type="text"] { background: #F5F5F5; border-radius: 18px; -moz-border-radius: 18px; -webkit-border-radius: 18px; width: 100%; height: 36px; color: #959595; padding: 0px 30px; border: none; line-height: 36px; outline: none; }
header nav #nav_top .search_form input[type="text"]::-webkit-input-placeholder { color: #959595; }
header nav #nav_top .search_form input[type="text"]::-moz-placeholder { color: #959595; }
header nav #nav_top .search_form input[type="text"]:-ms-input-placeholder { color: #959595; }
header nav #nav_top .search_form input[type="text"]:-moz-placeholder { color: #959595; }
header nav #nav_top .search_form input[type="text"]:focus { color: #959595; }
header nav #nav_top .search_form input[type="submit"] { background: url(../images/search.svg) no-repeat; background-size: 15px; width: 15px; height: 15px; position: absolute; top: 10px; right: 20px; border: none; box-shadow: none; cursor: pointer; }
header nav #nav_top .search_form input[type="submit"]:hover { opacity: 0.7; }
header nav #nav_top #lan li { margin: 0px 0px 0px 5px; }
header nav #nav_top #lan li a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; width: 36px; height: 36px; background: #F5F5F5; padding: 5px 0px; text-align: center; border-radius: 18px; -moz-border-radius: 18px; -webkit-border-radius: 18px; }
header nav #nav_top #lan li a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: #326C95; color: #fff; }
header nav #nav_top .nav_top_menu { padding: 5px 0px; }
header nav #nav_top .nav_top_menu a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; }
header nav #nav_top .nav_top_menu a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; color: #326C95; }
header nav #nav { float: right; display: block; }
header nav #nav .list { padding-top: 15px; }
header nav #nav .list > a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; padding: 0px 15px; }
header nav #nav .list > a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; color: #326C95; }
header nav #nav .dropdown.list { padding: 15px 15px 0px 15px; }
header nav #nav .dropdown-menu { padding: 0px; }
header nav #nav .dropdown-menu li a { padding: 15px 15px; }
header nav #nav .dropdown-menu li a:hover { background: #D5D5D5; }
header nav #nav .dropdown:hover .dropdown-menu { display: block; }
header nav #nav .nav_top_menu { display: none; padding: 10px 0px; border-bottom: 1px #326C95 solid; }
header nav #nav #lan { display: none; padding: 10px 0px; border-bottom: 1px #326C95 solid; }
header nav #nav #lan li { margin: 0px 0px 0px 5px; }
header nav #nav #lan li a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; width: 36px; height: 36px; background: #326C95; color: #fff; padding: 5px 0px; text-align: center; border-radius: 18px; -moz-border-radius: 18px; -webkit-border-radius: 18px; }
header nav #nav #lan li a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: #326C95; color: #fff; }

#footer { background: #F5F5F5; }
#footer .content { max-width: 1200px; padding: 80px 0px; margin: 0px auto; overflow: hidden; }
#footer .footer_info .footer_logo { background: url(../images/logo.png) no-repeat center; width: 200px; height: 56px; background-size: 200px; margin-bottom: 30px; }
#footer .footer_info li { margin-bottom: 10px; padding-left: 30px; }
#footer .footer_info li:nth-child(2) { background: url(../images/icons/place.png) no-repeat 0px 6px; }
#footer .footer_info li:nth-child(3) { background: url(../images/icons/smartphone.png) no-repeat 0px 6px; }
#footer .footer_info li:nth-child(4) { background: url(../images/icons/email.png) no-repeat 0px 6px; }
#footer .footer_nav .footer_nav_list span { display: block; margin-bottom: 30px; font-weight: 800; }
#footer .footer_nav .footer_nav_list a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; display: block; margin-bottom: 10px; }
#footer .footer_nav .footer_nav_list a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; color: #326C95; }

.copyright { text-align: center; padding: 30px 0px; position: relative; }
.copyright span { position: absolute; right: 30px; }
.copyright span a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; }
.copyright span a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; color: #326C95; }

#banner .banner img { width: 100%; }

#i_news { padding: 25px 0px; }
#i_news .content { position: relative; }
#i_news .content p { padding: 0px 0px 10px 0px; border-bottom: 1px #D5D5D5 solid; }
#i_news .content .news_date { color: #326C95; margin-right: 30px; }

#i_about { background: url(../images/bg_001.jpg) no-repeat center; background-size: cover; color: #fff; }
#i_about h2 { color: #fff; }
#i_about h2 .i_btn_more a { color: #fff; }
#i_about .i_about { margin-top: 30px; }
#i_about .i_about img { width: 100%; padding: 0px 15px; }

#product_hot { background: #F2FAFF; }
#product_hot .content { overflow: visible; }
#product_hot .product_list { margin: 0px 10px; }
#product_hot .product_list .product_img { width: 100%; }
#product_hot .product_list .product_img img { width: 100%; }
#product_hot .product_list .product_title { background: #fff; padding: 10px 20px; color: #02133C; }
#product_hot .product_list .product_des { background: #fff; padding: 0px 20px 20px 20px; }
#product_hot .product_list .product_des span { border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border: 1px #D5D5D5 solid; padding: 5px; margin: 5px 10px 5px 0px; }
#product_hot .product_list:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; }

#product_new { background: #F2FAFF; }
#product_new .content { overflow: visible; }
#product_new .product_list { margin: 0px 10px; }
#product_new .product_list .product_img { width: 100%; }
#product_new .product_list .product_img img { width: 100%; }
#product_new .product_list .product_title { background: #fff; padding: 10px 20px; color: #02133C; }
#product_new .product_list .product_des { background: #fff; padding: 0px 20px 20px 20px; }
#product_new .product_list .product_des span { border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border: 1px #D5D5D5 solid; padding: 5px; margin: 5px 10px 5px 0px; }
#product_new .product_list:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; }

#award_hot { background: url(../images/bg_001.jpg) no-repeat center; background-size: cover; text-align: center; }
#award_hot .content_title { color: #fff; }
#award_hot .award_list { text-align: center; padding: 10px; }
#award_hot .award_list ul { background: #fff; padding: 30px; }
#award_hot .award_list .award_img img { width: 100%; }
#award_hot .award_list .award_title { color: #02133C; padding: 20px 0px; }

/* CONTAINER */
section { padding: 60px 0px; }
section .content { max-width: 1200px; margin: 0px auto; overflow: hidden; }
section .content_member { max-width: 600px; margin: 0px auto; overflow: hidden; }
section .i_content_title h2 { width: 100%; color: #02133C; padding: 0px 0px 30px 0px; position: relative; }
section .i_content_title h2 span { position: absolute; }
section .i_content_title h2 .i_btn_more { right: 0px; bottom: 30px; }
section .i_content_title h2 .i_btn_more a { background: none; color: #333; }
section .i_content_title h2 .i_btn_more a:hover { color: #244C75; }
section .content_title h2 { width: 100%; text-align: center; padding: 0px 0px 30px 0px; }
section .content_title h2 span { display: block; }
section .content_title02 h2 { width: 100%; padding: 0px 0px 0px 10px; margin-bottom: 30px; border-left: 10px solid #244C75; }
section .content_title02 h2 span { display: block; color: #326C95; }
section .textatea img { width: 100%; }

/* SEARCH */
.search_form { margin-bottom: 30px; }
.search_form > .vessel { width: 100%; display: inline-block; position: relative; }
.search_form label { display: none; }
.search_form input[type="text"] { background: #F5F5F5; border-radius: 26px; -moz-border-radius: 26px; -webkit-border-radius: 26px; width: 100%; height: 46px; color: #959595; padding: 0px 30px; border: none; line-height: 46px; outline: none; }
.search_form input[type="text"]::-webkit-input-placeholder { color: #959595; }
.search_form input[type="text"]::-moz-placeholder { color: #959595; }
.search_form input[type="text"]:-ms-input-placeholder { color: #959595; }
.search_form input[type="text"]:-moz-placeholder { color: #959595; }
.search_form input[type="text"]:focus { color: #959595; }
.search_form input[type="submit"] { background: url(../images/search.svg) no-repeat; background-size: 15px; width: 15px; height: 15px; position: absolute; top: 16px; right: 20px; border: none; box-shadow: none; cursor: pointer; }
.search_form input[type="submit"]:hover { opacity: 0.7; }

/* SIDEBAR */
.sidebar { padding-right: 30px; }
.sidebar .sidebar_list .DNbtn { background: #244C75; color: #fff; padding: 10px 5px; border-bottom: 3px #fff solid; }
.sidebar .sidebar_list > li { border-bottom: 1px #fff solid; background: #326C95; color: #fff; }
.sidebar .sidebar_list > li a { transition: all 1s; -webkit-transition: all 1s; -moz-transition: all 1s; padding: 10px 10px; }
.sidebar .sidebar_list > li a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: #244C75; }

/* BREADCRUMBS */
#breadcrumbs { border-top: 1px #D5D5D5 solid; border-bottom: 1px #D5D5D5 solid; margin-top: -6px; overflow: hidden; }
#breadcrumbs span { display: block; max-width: 1200px; margin: 0px auto; padding: 10px 0px 10px 0px; }
#breadcrumbs img { margin-right: 10px; }

/* ABOUT */
/* NEWS */
#news { overflow: hidden; position: relative; }
#news .news_list { border-bottom: 1px #D5D5D5 solid; padding: 20px 0px 20px 0px; margin-bottom: 15px; position: relative; }
#news .news_list .news_date { color: #326C95; margin-bottom: 5px; }
#news .news_list .news_title { color: #326C95; }

#news_detail { overflow: hidden; position: relative; }
#news_detail .news_title { color: #02133C; margin-bottom: 30px; }
#news_detail .news_title span { margin-left: 10px; color: #326C95; }

/* PRODUCT */
#product .product_content { /* LIST */ /* DETAIL */ /* DM */ /* SEARCH */ }
#product .product_content .product_list { padding: 0px 10px; margin-bottom: 20px; }
#product .product_content .product_list ul { box-shadow: 0px 0px 5px 3px #eee; -moz-box-shadow: 0px 0px 5px 3px #eee; -webkit-box-shadow: 0px 0px 5px 3px #eee; }
#product .product_content .product_list ul .product_img { width: 100%; }
#product .product_content .product_list ul .product_img img { width: 100%; }
#product .product_content .product_list ul .product_title { background: #fff; padding: 10px 20px; color: #02133C; }
#product .product_content .product_list ul .product_des { background: #fff; padding: 0px 20px 20px 20px; }
#product .product_content .product_list ul .product_des span { border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border: 1px #D5D5D5 solid; padding: 5px; margin: 5px 10px 5px 0px; }
#product .product_content .product_list ul:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; box-shadow: 0px 0px 5px 3px #d4edff; -moz-box-shadow: 0px 0px 5px 3px #d4edff; -webkit-box-shadow: 0px 0px 5px 3px #d4edff; }
#product .product_content .product_detail_img img { width: 100%; border: 1px #DFE0EB solid; }
#product .product_content .product_detail_imgnav { margin-top: 10px; }
#product .product_content .product_detail_imgnav li { padding: 10px; }
#product .product_content .product_detail_info { padding-left: 30px; }
#product .product_content .product_detail_info li { padding-left: 15px; margin-bottom: 7.5px; }
#product .product_content .product_detail_info span { display: block; margin-bottom: 30px; }
#product .product_content .product_detail_title { color: #326C95; border-left: 3px #326C95 solid; padding-left: 12px; }
#product .product_content .product_detail_textatea { margin-top: 30px; }
#product .product_content .product_detail_textatea span { display: block; /* background:$color-primary; color:#fff; */ /* text-align:center; */ padding: 10px 0px; margin: 30px 0px; }
#product .product_content .product_dm_list { padding: 0px 10px; margin-bottom: 20px; text-align: center; }
#product .product_content .product_dm_list ul { box-shadow: 0px 0px 5px 3px #eee; -moz-box-shadow: 0px 0px 5px 3px #eee; -webkit-box-shadow: 0px 0px 5px 3px #eee; }
#product .product_content .product_dm_list ul .product_dm_img img { width: 100%; }
#product .product_content .product_dm_list ul .product_dm_info { padding-right: 10px; }
#product .product_content .product_dm_list ul .product_dm_info span { margin-bottom: 10px; color: #02133C; display: block; }
#product .product_content .product_dm_list ul:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; box-shadow: 0px 0px 5px 3px #d4edff; -moz-box-shadow: 0px 0px 5px 3px #d4edff; -webkit-box-shadow: 0px 0px 5px 3px #d4edff; }
#product .product_content .product_search { text-align: center; }
#product .product_content .product_search .search_form { margin-bottom: 30px; }
#product .product_content .product_search .search_form > .vessel { width: 100%; display: inline-block; position: relative; }
#product .product_content .product_search .search_form label { display: none; }
#product .product_content .product_search .search_form input[type="text"] { background: #F5F5F5; border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; width: 100%; height: 50px; color: #959595; padding: 0px 30px; border: none; line-height: 50px; outline: none; }
#product .product_content .product_search .search_form input[type="text"]::-webkit-input-placeholder { color: #959595; }
#product .product_content .product_search .search_form input[type="text"]::-moz-placeholder { color: #959595; }
#product .product_content .product_search .search_form input[type="text"]:-ms-input-placeholder { color: #959595; }
#product .product_content .product_search .search_form input[type="text"]:-moz-placeholder { color: #959595; }
#product .product_content .product_search .search_form input[type="text"]:focus { color: #959595; }
#product .product_content .product_search .search_form input[type="submit"] { background: url(../images/search.svg) no-repeat; background-size: 15px; width: 15px; height: 15px; position: absolute; top: 18px; right: 20px; border: none; box-shadow: none; cursor: pointer; }
#product .product_content .product_search .search_form input[type="submit"]:hover { opacity: 0.7; }

/* SN */
#sn { overflow: hidden; position: relative; }
#sn .sn_list { margin-bottom: 15px; }
#sn .sn_list .sn_title { background: #F5F5F5; color: #326C95; margin-bottom: 15px; padding: 10px 10px; }
#sn .sn_list .sn_list_detail { margin-bottom: 10px; }
#sn .sn_list .sn_list_detail .sn_list_image img { width: 100%; }
#sn .sn_list .sn_list_detail .sn_list_textarea { padding-left: 30px; }

/* FAQ */
#faq { overflow: hidden; position: relative; }
#faq #accordion .card { margin-bottom: 15px; }
#faq #accordion .card .card-header { padding: 15px 15px; border: 1px #D5D5D5 solid; }
#faq #accordion .card .card-header span { color: #326C95; margin-right: 10px; }
#faq #accordion .card .card-body { background: #F5F5F5; padding: 15px; margin: 15px 15px 15px 30px; }

/* CONTACT */
#contact iframe { width: 100%; margin-bottom: 30px; }
#contact .contact_info { padding-right: 60px; }
#contact .contact_info .contact_logo { background: url(../images/logo002.png) no-repeat center; width: 210px; height: 81px; background-size: 210px; margin-bottom: 30px; }
#contact .contact_info .contact_info_info { margin-bottom: 30px; padding-bottom: 30px; border-bottom: 1px #DFE0EB solid; }
#contact .contact_info .contact_info_info .contact_icon { padding-left: 0px; }
#contact .contact_info .contact_info_info li { margin-bottom: 10px; padding-left: 30px; }
#contact .contact_info .contact_info_info li:nth-child(2) { background: url(../images/icons/place.png) no-repeat 0px 6px; }
#contact .contact_info .contact_info_info li:nth-child(3) { background: url(../images/icons/smartphone.png) no-repeat 0px 6px; }
#contact .contact_info .contact_info_info li:nth-child(4) { background: url(../images/icons/email.png) no-repeat 0px 6px; }
#contact .contact_form li { margin-bottom: 15px; }
#contact .contact_form li label { margin-bottom: 10px; display: block; }
#contact .contact_form li input { width: 100%; padding: 10px 20px; }
#contact .contact_form li textarea { width: 100%; padding: 10px 20px; }

/* MENBER */
.member_info { text-align: center; }

.col-lg-9.col-md-12.col-12.bootstrap_default.content_member { max-width: 800px; float: right !important; }

.content_member .content_title h2 { text-align: left; }
.content_member .content_title h2 span { display: inline-block; color: #333; font-weight: normal; margin-left: 15px; }
.content_member .content_title h2 a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; color: #326C95; }
.content_member .content_title h2 a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; color: #326C95; }
.content_member .member_form li { margin-bottom: 30px; }
.content_member .member_form li label { margin: 0px 0px 10px 20px; display: block; }
.content_member .member_form li label span { color: #E30B0B; }
.content_member .member_form li input[type=text] { background: #F5F5F5; width: 100%; padding: 18px 20px; border: none; border: 1px solid #DFE0EB; border-radius: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; }
.content_member .member_form li input[type=password] { background: #F5F5F5; width: 100%; padding: 18px 20px; border: none; border: 1px solid #DFE0EB; border-radius: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; }
.content_member .member_info { margin-top: 30px; }
.content_member .member_info a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; color: #326C95; }
.content_member .member_info a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; color: #326C95; }
.content_member a { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; color: #326C95; }
.content_member a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; color: #326C95; }

.productsn_table { text-align: center; }
.productsn_table .table_row.productsn_table_title .table_cell { font-weight: bold; background: #326C95; color: #fff; }
.productsn_table .table_row .table_cell { border: 1px #326C95 solid; padding: 10px; }
.productsn_table .table_row:nth-child(even) .table_cell { background: #F5F5F5; }

#banner .slick-prev, #banner .slick-next { width: 30px; height: 65px; }
#banner .slick-prev { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_left001.png) no-repeat; opacity: 0.7; left: 60px; z-index: 999; }
#banner .slick-prev:before { content: ""; }
#banner .slick-prev:hover, #banner .slick-prev:focus { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_left001.png) no-repeat; opacity: 1; background-size: 12px; }
#banner .slick-next { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_right001.png) no-repeat; opacity: 0.7; right: 60px; z-index: 999; }
#banner .slick-next:before { content: ""; }
#banner .slick-next:hover, #banner .slick-next:focus { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_right001.png) no-repeat; opacity: 1; }

#product_hot .slick-prev, #product_hot .slick-next { width: 46px; height: 46px; }
#product_hot .slick-prev { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_left.png) no-repeat; opacity: 0.7; left: -60px; z-index: 999; }
#product_hot .slick-prev:before { content: ""; }
#product_hot .slick-prev:hover, #product_hot .slick-prev:focus { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_left.png) no-repeat; opacity: 1; }
#product_hot .slick-next { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_right.png) no-repeat; opacity: 0.7; right: -60px; z-index: 999; }
#product_hot .slick-next:before { content: ""; }
#product_hot .slick-next:hover, #product_hot .slick-next:focus { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_right.png) no-repeat; opacity: 1; }

#product_new .slick-prev, #product_new .slick-next { width: 46px; height: 46px; }
#product_new .slick-prev { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_left.png) no-repeat; opacity: 0.7; left: -60px; z-index: 999; }
#product_new .slick-prev:before { content: ""; }
#product_new .slick-prev:hover, #product_new .slick-prev:focus { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_left.png) no-repeat; opacity: 1; }
#product_new .slick-next { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_right.png) no-repeat; opacity: 0.7; right: -60px; z-index: 999; }
#product_new .slick-next:before { content: ""; }
#product_new .slick-next:hover, #product_new .slick-next:focus { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_right.png) no-repeat; opacity: 1; }

.product_detail_img .slick-prev, .product_detail_img .slick-next { width: 16px; height: 42px; }
.product_detail_img .slick-prev { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_left003.png) no-repeat; opacity: 1; left: 0px; z-index: 999; }
.product_detail_img .slick-prev:before { content: ""; }
.product_detail_img .slick-prev:hover, .product_detail_img .slick-prev:focus { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_left003.png) no-repeat; opacity: 1; }
.product_detail_img .slick-next { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_right003.png) no-repeat; opacity: 1; right: 0px; z-index: 999; }
.product_detail_img .slick-next:before { content: ""; }
.product_detail_img .slick-next:hover, .product_detail_img .slick-next:focus { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_right003.png) no-repeat; opacity: 1; }

/* SLICK */
.slick-prev, .slick-next { width: 46px; height: 46px; }

.slick-prev { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_left.png) no-repeat; opacity: 0.7; left: -60px; z-index: 999; }

.slick-prev:before { content: ""; }

/* [dir='rtl'] .slick-prev:before{content:url(../images/arrow_right.png);} */
.slick-prev:hover, .slick-prev:focus { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_left.png) no-repeat; opacity: 1; }

.slick-next { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_right.png) no-repeat; opacity: 0.7; right: -60px; z-index: 999; }

.slick-next:before { content: ""; }

/* [dir='rtl'] .slick-next:before{content:url(../images/arrow_left.png);} */
.slick-next:hover, .slick-next:focus { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: url(../images/arrow_right.png) no-repeat; opacity: 1; }

.pagenum { margin: 60px 0px 0px 0px; text-align: center; overflow: hidden; }
.pagenum li { display: inline-block; vertical-align: top; }
.pagenum li a { transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1); -webkit-transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1); -moz-transition: all 0.3s cubic-bezier(0.77, 0, 0.175, 1); background: #fff; border: 1px #326C95 solid; border-radius: 20px; -moz-border-radius: 20px; -webkit-border-radius: 20px; width: 40px; height: 40px; text-align: center; display: inline-block; padding: 6px 0px; margin: 0px 6px; }
.pagenum li a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; }
.pagenum .btnleft a { background: #fff url(../images/arrow_left_hover.svg) no-repeat center; background-size: 40px; border: 0px #326C95 solid; }
.pagenum .btnleft a:hover { background: #326C95 url(../images/arrow_left.svg) no-repeat center; background-size: 40px; }
.pagenum .btnright a { background: #fff url(../images/arrow_right_hover.svg) no-repeat center; background-size: 40px; border: 0px #326C95 solid; }
.pagenum .btnright a:hover { background: #326C95 url(../images/arrow_right.svg) no-repeat center; background-size: 40px; }
.pagenum a:hover, .pagenum a.on { background: #326C95; color: #fff; }
.pagenum a.on { background: #326C95; color: #fff; }

#tinynav1 { display: none; width: 100%; padding: 20px 10px; margin-bottom: 40px; background: #326C95; color: #fff; border: 0px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; cursor: pointer; -webkit-appearance: none; }

.Side label { position: relative; }

.Side label:after { content: '<>'; font: 12px "Consolas", monospace; color: #999; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); right: 8px; top: 2px; padding: 0 0 2px; border-bottom: 1px solid #ccc; position: absolute; pointer-events: none; }

.Side label:before { content: ''; right: 6px; top: 0px; width: 20px; height: 20px; position: absolute; pointer-events: none; display: block; }

#btn_top { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; opacity: 0; position: fixed; right: 30px; bottom: 30px; z-index: 999; }

#btn_top.active { opacity: 1; }

#top { width: 180px; height: 70px; background: url(../images/topup_bg.png) no-repeat right bottom; position: absolute; right: 0px; bottom: 0px; z-index: 888; }
#top span { background: #326C95; padding: 2px 3px; position: absolute; right: 20px; bottom: 0px; z-index: 888; }

.btn a { transition: all 1s; -webkit-transition: all 1s; -moz-transition: all 1s; border-radius: 40px; -moz-border-radius: 40px; -webkit-border-radius: 40px; background: #326C95; padding: 15px 30px; margin: 0px auto 0px auto; text-align: center; position: relative; }
.btn a:hover { transition: 0.5s; -webkit-transition: 0.5s; -moz-transition: 0.5s; background: #244C75; color: #fff; }

.btn_more { /* float:right; */ }
.btn_more a { background: #326C95; color: #fff; }
.btn_more a:hover { background: #244C75; color: #fff; }

.btn_fb a { background: #4167B2; color: #fff; }
.btn_fb a:hover { background: #214894; color: #fff; }

.btn_google a { background: #E72C33; color: #fff; }
.btn_google a:hover { background: #ce181f; color: #fff; }

.red { color: #326C95; }

.green { color: #326C95; }

.productsn_table .table_row .table_cell span.rwd-title {display:none}

/*Styles for screen 1366px and lower*/
/*Styles for screen 1024px and lower*/
@media screen and (max-width: 1024px) { #banner { height: 100%; }
  #footer { padding: 0px 30px; }
  #i_news { padding: 25px 0px; }
  #i_news .content { margin: 0px 30px; }
  section { padding: 60px 30px; }
  /* BREADCRUMBS */
  #breadcrumbs { padding: 0px 30px; margin-top: -6px; }
  /* NEWS */
  #news_detail .news_title span { display: block; margin: 20px 0px 0px 0px; }
  /* PRODUCT */
  #product .product_sidebar { padding-right: 0px; }
  /* CONTACT */
  #contact .contact_form { margin-top: 30px; }
  #product_hot .slick-prev, #product_new .slick-prev { left: -20px; }
  #product_hot .slick-next, #product_new .slick-next { right: -20px; } }
/*Styles for screen 1000px and lower*/
@media screen and (max-width: 1000px) { #menu { display: block; }
  /*header { background: #fff; padding: 30px 0px; border-top: 4px solid #326C95; !*  overflow:hidden; *! }*/
  header nav #logo { width: 170px; height: 70px; background-size: 170px; margin-left: 10px; }
  header nav #nav_top { margin: 25px 0px 0px 0px; }
  header nav #nav_top .search_form { margin-right: -10px; }
  header nav #nav_top .search_form input[type="text"] { width: 170px; }
  header nav #nav_top #lan { display: none; }
  /*header nav #nav_top .nav_top_menu { display: none; }*/
  header nav #nav { display: none; width: 100%; text-align: center; top: 0px; right: 0px; padding: 50px 0px 0px 0px; z-index: 9998; overflow-y: auto; }
  header nav #nav .list { display: block; padding: 0px; }
  header nav #nav .list a { padding: 10px 0px; border-bottom: 1px #326C95 solid; }
  header nav #nav .dropdown.list { padding: 0px; }
  header nav #nav .dropdown.list span { display: none; }
  header nav #nav .dropdown-menu { display: block; position: static; float: none; background: none; border: none; padding: 0px; text-align: center; }
  header nav #nav .dropdown:hover .dropdown-menu { display: block; }
  header nav #nav .nav_top_menu { display: block; }
  header nav #nav #lan { display: block; }
  /* SIDEBAR */
  .sidebar { padding-right: 0px; }
  .sidebar .sidebar_list { display: none; }
  .sidebar .sidebar_list .menu { display: block; }
  .sidebar #tinynav1 { display: block; }
  /* CONTACT */
  #contact .contact_info { padding-right: 0px; }
  #footer .footer_nav { margin-top: 30px; } }
/*Styles for screen 768px and lower*/
@media screen and (max-width: 768px) { .copyright span { position: relative; display: block; margin-top: 6px; }
  /* PRODUCT */
  #product .product_content { /* DETAIL */ }
  #product .product_content .product_detail_info { padding-left: 0px; }
  /* SLICK */
  #banner .slick-prev, #banner .slick-next { width: 30px; height: 30px; }
  #banner .slick-prev { background-size: 12px; left: 30px; }
  #banner .slick-next { background-size: 12px; right: 10px; } }
/*Styles for screen 680px and lower*/
@media screen and (max-width: 680px) { /* CONTAINER */
  /* SN */
  #sn .sn_list .sn_list_detail .sn_list_textarea { padding-left: 0px; }
  /* CONTACT */
  #contact .contact_info .contact_info_info .contact_icon img { width: 100%; }
  #contact .contact_info .fb-page { /* width:100%; */ }
  /* MENBER */
  .productsn_table { text-align: center; }
  .productsn_table .table_row.productsn_table_title { display: none; }
  .productsn_table .table_row:nth-child(even) .table_cell { background: #fff; }
  .productsn_table .table_row .table_cell { display: block; padding: 10px; text-align: left; border-bottom: 1px #326C95 solid; }
  .productsn_table .table_row .table_cell:first-child { background: #326C95; color: #fff; border-top: none; }
  .productsn_table .table_row .table_cell:before { content: attr(data-title); }
  .productsn_table .table_row .table_cell span.rwd-title {display:inline} }


/*Styles for screen 480px and lower*/
@media screen and (max-width: 480px) { .pagenum li a { padding: 8px 0px; margin: 0px 0px; } }

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