/*----------------------------------------

* Jhuang Ping Editor (c) & Management Update
* Version - 1.3 | 2019.06.04

* Github - https://github.com/jhuangping/_JPFrame

----------------------------------------*/
/* Reset ====================================================================*/
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

body, div, menu, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, button, textarea, th, td, figure { margin: 0; padding: 0; }

img { max-width: 100%; height: auto; border: 0; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }

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

table { border-collapse: collapse; border-spacing: 0; }

input, button, textarea, select { *font-size: 100%; }

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

a { text-decoration: none; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s; }

input, textarea { outline: none; }

section, article, aside, footer, header, nav, main { display: block; }

/* Fonts ======================================================================*/
@font-face { font-family: 'pacifico'; font-style: normal; font-weight: normal; src: url("fonts/pacifico/Pacifico-Regular.ttf"); }
@font-face { font-family: 'OpenSans'; font-style: normal; font-weight: normal; src: url("fonts/open_sans/OpenSans-Regular.ttf"); src: url("fonts/open_sans/OpenSans-Regular.ttf") format("truetype"), url("fonts/open_sans/OpenSans-Light.ttf") format("truetype"), url("fonts/open_sans/OpenSans-Bold.ttf") format("truetype"), url("fonts/open_sans/OpenSans-SemiBold.ttf") format("truetype"); }
@font-face { font-family: 'MyriadPro'; font-style: normal; font-weight: normal; src: url("fonts/myriad_pro/MyriadPro-Regular.otf"); }
/* Default ====================================================================*/
html { font-size: 10px; }

body { font-family: Arial, "Microsoft JhengHei", sans-serif; font-size: 1.6rem; line-height: 1.5; letter-spacing: 0px; color: #202020; overflow-x: hidden; }

.wrap { max-width: 1175px; margin: 0 auto; }

header.fixed{ position: fixed !important; z-index: 100; background-color: #000; height: 60px; }

@media all and (max-width: 992px) { .wrap { padding-left: 5%; padding-right: 5%; } }

.main { margin-bottom: 110px; }
.main .wrap { max-width: 875px; }

.table_scroll { overflow-x: auto; }

a { color: #1EA78D; }
@media all and (min-width: 993px) { a.tel { pointer-events: none; } }

@media all and (max-width: 992px) { .pc { display: none !important; } }
@media all and (min-width: 993px) { .mobile { display: none !important; } }
/* Header =====================================================================*/
header { display: flex; justify-content: center; position: absolute; width: 100%; transition: 1s; height: 130px; }
header .wrap { padding-top: 10px; z-index: 99990; display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; width: 100%; margin: 0px; }
@media all and (max-width: 1024px) { header .wrap { padding-left: 5%; padding-right: 5%; } }
@media all and (max-width: 992px) {
  header.menuOpen .wrap { background: #1EA78D; }
  header .wrap { flex-direction: column; align-items: flex-start; transition: all 1s; }
  header{ height: auto !important; }
}

/* Logo */
.logo { font-family: "pacifico"; font-size: 2.8rem; color: #fff; padding-bottom: 10px; }

/* Menu =======================================================================*/
.menu { display: flex; flex-direction: column; line-height: 24px; }
@media all and (max-width: 992px) { .menu { display: none; width: 100%; height: 100vh; overflow-y: scroll; } }

.menu-btn { width: 40px; height: 30px; cursor: pointer; position: absolute; z-index: 99991; top: 16px; right: 5%; display: flex; flex-direction: column; justify-content: space-around; align-items: center; }
.menu-btn span { width: 70%; height: 3px; display: block; background: #fff; border-radius: 5px; transition: all .3s; }
.menu-btn.open span { position: absolute; }
.menu-btn.open span:nth-child(1) { transform: rotate(-45deg); }
.menu-btn.open span:nth-child(2) { transform: rotate(45deg); }
.menu-btn.open span:nth-child(3) { opacity: 0; }
@media all and (min-width: 993px) { .menu-btn { display: none; } }

.menu-dropDown { position: relative; }

.menu-list { display: none; position: absolute; }

.menu-fold { display: none; position: absolute; top: 0px; right: 0px; width: 50px; height: 55px; }
.menu-fold:before, .menu-fold:after { content: ''; position: absolute; top: 50%; right: 5px; display: block; background: #fff; width: 10px; height: 1px; transition: all .3s; }
.menu-fold:after { transform: rotate(90deg); }
.menu-fold.open:after { transform: rotate(180deg); }
@media all and (max-width: 992px) { .menu-fold { display: block; } }

.menu-control-position { display: flex; flex-direction: column; align-items: flex-end; }
@media all and (max-width: 992px) { .menu-control-position { align-items: flex-start; } }

.menu-main { order: 2; display: flex; flex-direction: row; font-size: 1.8rem; width: 100%; }
.menu-main > li:hover > a:before { width: 100%; border-radius: 0px; left: 0px; }
.menu-main > li > a { color: #fff; padding: 10px 12px; display: block; position: relative; overflow: hidden; }
.menu-main > li > a:before { content: ''; background: #646464; position: absolute; left: 50%; bottom: 0px; width: 0px; height: 3px; border-radius: 10px; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
@media all and (max-width: 992px) { .menu-main { flex-direction: column; padding: 0 20px; }
  .menu-main > li > a { padding: 15px 12px; text-transform: capitalize; }
  .menu-main > li > a:before { display: none; }
  .menu-main > li:not(:last-child) > a { border-bottom: 1px solid #fff; } }

.menu-group { order: 1; display: flex; flex-direction: row; justify-content: flex-end; margin-top: 10px; margin-bottom: 20px; color: #fff; font-size: 1.3rem; }
.menu-group li { padding: 0 5px; display: flex; align-items: center; }
.menu-group li:nth-last-child(2) { padding-right: 12px; }
.menu-group li:last-child { padding-left: 12px; position: relative; }
.menu-group li:last-child:before { content: ''; position: absolute; top: 15%; left: -1px; width: 1px; height: 70%; background: #939393; }
.menu-group li a { color: #fff; text-transform: uppercase; }
.menu-group li a:before { font-family: "Font Awesome 5 Solid"; content: ''; border: 1px solid #fff; border-radius: 100%; padding: 5px; margin-right: 8px; }
.menu-group li a:hover { opacity: .5; }
.menu-group li.inquiry { position: relative; }
.menu-group li.inquiry a:before { content: '\f07a'; }
@media all and (max-width: 992px) { .menu-group { font-size: 1.5rem; width: 100%; }
  .menu-group li:last-child { padding-left: 0px; }
  .menu-group li:last-child:before { display: none; } }

.inquiry { position: relative; }
@media all and (max-width: 992px) { .inquiry { position: absolute; right: 90px; top: 21px; }
  .inquiry a { color: #fff; } }

.inquiry_no { position: absolute; display: block; width: 22px; height: 22px; border-radius: 100%; background: #ffd800; line-height: 22px; text-align: center; font-size: 15px; color: #000; top: -3px; left: -11px; font-weight: bold; }
@media all and (max-width: 992px) { .inquiry_no { top: 0px; left: -25px; } }

/* Search */
.menu-search a { color: #fff; text-transform: uppercase; }
.menu-search a:before { font-family: "Font Awesome 5 Solid", "Font Awesome 5 Regular", "Font Awesome 5 Brands"; content: '\f002' !important; border: 1px solid #fff; border-radius: 100%; padding: 5px; margin-right: 8px; }
.menu-search a:hover { opacity: .5; }
.menu-search input { width: 0px; border: none; border-radius: 50px; padding: 0px; background: #717171; color: #fff; margin-left: 0px; transition: all .3s; }
.menu-search input.inptOpen { width: 115px; margin-left: 6px; padding: 3px 8px; }
@media all and (max-width: 992px) { .menu-search { padding: 40px 0; display: flex; justify-content: center; width: 100%; }
  .menu-search input { width: 40%; margin-left: 6px; padding: 3px 8px; background: #fff; color: #252525; }
  .menu-search input.inptOpen { width: 40%; } }

/* Menu Style */
.theme01-menu .menu-dropDown { font-family: "MyriadPro"; }
.theme01-menu .menu-list { position: absolute; left: calc(50% - 100px); width: 210px; padding-top: 30px; }
.theme01-menu .menu-list:before { content: ''; width: 1px; height: 1px; position: absolute; top: 11px; left: calc(50% - 10px); border-style: solid; border-width: 9px; border-color: transparent transparent #6F6F6F transparent; }
.theme01-menu .menu-list > li { position: relative; padding-left: 1.5rem; background: #6F6F6F; }
.theme01-menu .menu-list > li:first-child { padding-top: 20px; }
.theme01-menu .menu-list > li:last-child { padding-bottom: 20px; }
.theme01-menu .menu-list > li > a { padding: 10px 20px 10px 10px; color: #fff; display: block; position: relative; overflow: hidden; }
.theme01-menu .menu-list > li > a:before { content: ''; display: inline-block; width: 1px; height: 1px; background: transparent; position: absolute; top: calc(50% - 6px); left: 0px; border-style: solid; border-width: 3px; border-radius: 0px; border-color: transparent transparent transparent #fff; }
.theme01-menu .menu-list > li > a:hover { color: #333; }
.theme01-menu .menu-list > li > a:hover:before { border-color: transparent transparent transparent #333; }
@media all and (max-width: 992px) { .theme01-menu .menu-list { position: static; width: 100%; padding-top: 0px; }
  .theme01-menu .menu-list:before { display: none; }
  .theme01-menu .menu-list li a { display: block; padding: 15px 12px 15px 30px; border-bottom: none; font-size: 1.5rem; }
  .theme01-menu .menu-list li a:before { left: 15px; border-color: transparent transparent transparent #95EEDC; } }

/* Language ===================================================================*/
.lang { font-size: 1.2rem; }

.btn-lang { position: relative; display: flex; justify-content: space-between; cursor: pointer; background: #D95022; padding: 4px 5px 4px 10px; line-height: 12px; text-transform: uppercase; transition: all .3s; }
.btn-lang:before { position: absolute; right: 4px; content: ''; width: 13px; height: 12px; background: #424242; }
.btn-lang:after { position: relative; z-index: 1; font-family: "Font Awesome 5 Solid"; content: '\f0d7'; display: flex; justify-content: center; width: 12px; color: #fff; margin-left: 10px; transition: all .3s; }
.btn-lang.open:after { transform: rotate(180deg); }
.btn-lang:hover { box-shadow: 0 0 3px #000 inset; }
@media all and (max-width: 992px) { .btn-lang { background: transparent; color: #fff; font-size: 1.8rem; line-height: 1.33; padding: 15px 12px; border-bottom: 1px solid #fff; text-transform: capitalize; }
  .btn-lang:before, .btn-lang:after { position: absolute; top: 30px; right: 5px; background: #fff; width: 10px; height: 1px; content: ''; margin: 0px; }
  .btn-lang:after { transform: rotate(90deg); }
  .btn-lang:hover { box-shadow: none; } }

.lang-options { display: none; position: absolute; z-index: 1; top: 22px; left: 12px; width: calc(100% - 17px); }
.lang-options a { display: block; padding: 5px 10px; background: #a5a5a5; border: 1px solid #fff; border-bottom: none; transition: all .3s; }
.lang-options a:before { display: none; }
.lang-options a:last-child { border-bottom: 1px solid #fff; }
.lang-options a:hover { background: #D95022; opacity: 1 !important; }
@media all and (max-width: 992px) { .lang-options { position: static; width: 100%; }
  .lang-options a { color: #fff; font-size: 1.5rem; background: #6F6F6F; border: none; padding: 15px 11px 15px 30px; display: block; position: relative; }
  .lang-options a:before { content: ''; width: 1px; height: 1px; background: transparent; position: absolute; display: inline-block; top: calc(50% - 3px); left: 15px !important; border-style: solid; border-width: 3px; border-radius: 0px; border-color: transparent transparent transparent #95EEDC; } }

/* Module ================================================================== */
.mold-tab .row, .mold-tab .tr, .mold-list .list, .mold-list .row { display: grid; }

/* Mold Table */
/* Mold Fix images */
.mold-fix { position: relative; padding-top: 40%; line-height: 0px; }
.mold-fix figure, .mold-fix .figure { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; overflow: hidden; }
.mold-fix img { width: auto !important; height: auto !important; transition: all .3s; }
.mold-fix.fix-in img { max-width: 100% !important; max-height: 100% !important; }
.mold-fix.fix-out img { max-width: inherit !important; max-height: inherit !important; }

/* Mold Grid */
.mold-grid { display: flex; flex-wrap: wrap; margin-left: -15px; margin-right: -15px; }
.mold-grid .item { padding-left: 15px; padding-right: 15px; }

/* Mold Lists */