@charset "UTF-8";
.info-area .wrap::after, .logo-area .wrap::after, .info-group ul li::after, .item_group::after { content: ""; display: block; clear: both; }

/* http://meyerweb.com/eric/tools/css/reset/  v2.0 | 20110126 License: none (public domain) */
html, body, div, span, applet, object, iframe, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, 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, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; border: 0; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

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

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

html { color: #707070; font-family: "arial", "arial Black", "PingFang", "Microsoft JhengHei"; }

a { text-decoration: none; }

.wrap { width: calc(100% - (15px * 2)); margin: 0 auto; padding: 0 15px; }

@media (min-width: 576px) { .wrap { max-width: 576px; } }

@media (min-width: 768px) { .wrap { max-width: 768px; } }

@media (min-width: 992px) { .wrap { max-width: 992px; } }

@media (min-width: 1200px) { .wrap { max-width: 1200px; } }

.mobile { display: block; }

@media (min-width: 768px) { .mobile { display: none; } }

.desktop { display: none; }

@media (min-width: 768px) { .desktop { display: block; } }

.fixed { position: fixed; }

.info-area { border-bottom: 1px solid #ddd; }

.info-area .info { float: left; }

.open_time { padding: 26px 0; }

.open_time > i { color: #17a6bf; }

.open_time > span { margin-left: 5px; color: #333333; }

.social-group { float: right; font-size: 0; }

.social-group > .item { display: inline-block; border-width: 0 1px; border-style: solid; border-color: #ddd; font-size: 16px; line-height: 20px; }

.social-group > .item a { display: inline-block; padding: 18px; }

.social-group > .item + .item { border-left-width: 0; }

.social-group i { color: #333333; }

.logo-area { padding: 20px 0; }

.logo { float: left; width: 125px; height: 46px; margin: 11px 0; }

@media (min-width: 768px) { .logo { margin: 8px 0; } }

.logo > a { display: inline-block; width: 100%; height: 100%; text-indent: -9999px; background-image: url(../image/logo.svg); background-repeat: no-repeat; }

.info-group { float: right; color: #333333; }

.info-group i { color: #17a6bf; }

.info-group ul { height: 62px; }

.info-group ul li { display: inline-block; border: 1px solid #ddd; border-radius: 10px; cursor: pointer; }

.info-group ul li div { float: left; }

.info-group ul li .icon { padding: 14px 10px; }

.info-group ul li .data { display: inline-block; padding: 8px 10px; border-left: 1px solid #ddd; font-size: 20px; line-height: 1.1em; font-weight: bold; color: #333333; }

.info-group ul li span { display: block; font-size: 16px; font-weight: lighter; color: #333333; }

.info-group ul li + li { margin-left: 15px; }

.info-group ul li:last-child .data { padding-right: 40px; }

.nav { top: 0; left: 0; right: 0; z-index: 1; font-size: 0; background-color: #333333; }

@media (min-width: 768px) { .nav { text-align: center; } }

.nav .side_Bar { position: relative; padding: 10px 0; background-color: #333333; font-size: 14px; text-align: right; }

.nav .side_Bar i { display: inline-block; padding: 5px 10px; border: 1px solid; border-radius: 6px; color: #ddd; }

.nav .menu_group { display: none; }

@media (min-width: 768px) { .nav .menu_group { display: block; } }

.nav .menu_group.on { display: block; }

.nav a { display: block; padding: 20px; background-color: #333333; border-bottom: 1px solid rgba(221, 221, 221, 0.3); color: #fff; font-size: 16px; -webkit-transition: color 0.3s; transition: color 0.3s; }

@media (min-width: 768px) { .nav a { border-bottom-width: 0; } }

.nav a:last-child { border-bottom-width: 0; }

.nav a:hover { color: #17a6bf; }

@media (min-width: 768px) { .nav a { display: inline-block; padding: 27px; } }

.nav .active { color: #17a6bf; }

.main_banner { background-image: url(../image/60667231_l.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; color: #707070; letter-spacing: 1px; height: 550px; position: relative; }

@media (min-width: 768px) { .main_banner { background-position: right bottom; background-size: contain; } }

@media (min-width: 1200px) { .main_banner { background-size: 45%; } }

.main_banner .bg_shadow { height: 100%; background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.15)), color-stop(10%, rgba(0, 0, 0, 0.1)), color-stop(20%, rgba(0, 0, 0, 0.05)), color-stop(30%, rgba(0, 0, 0, 0)), color-stop(70%, rgba(0, 0, 0, 0)), color-stop(80%, rgba(0, 0, 0, 0.05)), color-stop(90%, rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.15))); background: linear-gradient(0deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.1) 10%, rgba(0, 0, 0, 0.05) 20%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.05) 80%, rgba(0, 0, 0, 0.1) 90%, rgba(0, 0, 0, 0.15) 100%); }

.main_banner .wrap { height: 100%; font-size: 0; }

@media (min-width: 768px) { .main_banner .wrap::before { content: ""; display: inline-block; height: 100%; width: 0; vertical-align: middle; } }

.main_banner .main_title { padding-top: 50px; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 16px; text-shadow: 0 0 0.5em #fff, 0 0 0.5em #fff, 0 0 0.5em #fff; }

@media (min-width: 768px) { .main_banner .main_title { padding-top: 0; display: inline-block; vertical-align: middle; } }

.main_banner .main_title h1 span { display: block; border-bottom: 1px solid #ddd; font-size: 16px; font-weight: normal; padding-bottom: 10px; margin-bottom: 15px; line-height: 1.6; color: #707070; }

.main_banner .main_title h1 { padding-bottom: 15px; font-size: 47px; line-height: 50px; color: #17a6bf; }

.main_banner .main_title p { color: #333333; }

.item_title { text-align: center; }

.item_title h2 { margin-bottom: 40px; font-size: 40px; }

.item_title .separation_line { position: relative; display: block; width: 100px; height: 1px; margin: 0 auto; background-color: #ddd; margin-bottom: 60px; }

.item_title .separation_line::after { content: ""; width: 50px; height: 5px; border-radius: 3px; position: absolute; top: -2px; left: 0; right: 0; margin: 0 auto; background-color: #17a6bf; }

.item_title p { font-size: 20px; line-height: 30px; letter-spacing: 1px; margin-bottom: 60px; text-align: left; }

main > section .item { width: 100%; margin-bottom: 80px; }

main > section .item + .item:last-child { margin-bottom: 0; }

main > section .item h3 { font-size: 30px; }

main > section .item p { font-size: 16px; line-height: 20px; }

.about_us { padding: 80px 0; }

.about_us p { margin: 0 15px; text-align: justify; }

@media (min-width: 768px) { .about_us p { width: 70%; margin: 0 auto; } }

.about_us p + p { margin-top: 10px; }

.about_us .item { padding: 0 70px; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; color: #333333; }

@media (min-width: 768px) { .about_us .item { width: calc(100% / 3); float: left; padding-left: 20px; padding-right: 20px; } }

.about_us .item .item_icon { color: #17a6bf; margin-bottom: 50px; }

.about_us .item h3 { margin-bottom: 30px; }

.products { background-image: url(../image/97230226_l.jpg); background-repeat: no-repeat; background-position: center center; background-size: cover; background-attachment: fixed; }

.products .products_bg { padding: 80px 0; background-color: rgba(51, 51, 51, 0.75); }

.products h2, .products .item_icon { color: #fff; }

.products .item { position: relative; padding: 0 15px; -webkit-box-sizing: border-box; box-sizing: border-box; }

@media (min-width: 768px) { .products .item { width: calc(100% / 2); float: left; margin-bottom: 80px; }
  .products .item:nth-child(3), .products .item:last-child { margin-bottom: 0; } }

@media (min-width: 992px) { .products .item { width: calc(100% / 4); }
  .products .item:first-child, .products .item:nth-child(2) { margin-bottom: 0; } }

.products .item h3 { color: #fff; -webkit-transition: all 1.5s; transition: all 1.5s; }

.products .item:nth-child(odd) .item_content { background-color: #17a6bf; }

.products .item:nth-child(even) .item_content { background-color: #e3c915; }

.products .item_icon { position: absolute; top: 50%; left: 50%; text-align: center; margin-bottom: 15px; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 0; -webkit-transition: all 1.5s; transition: all 1.5s; }

.products .item_icon i { display: inline-block; border-radius: 50%; padding: 10px; }

.products .item_header { padding-top: 100px; padding-bottom: 100px; text-align: center; background-color: #17a6bf; -webkit-transition: all 0.5s; transition: all 0.5s; cursor: pointer; }

.products .item_header:hover { background-color: #e3c915; }

.products .item_header:hover .item_icon { opacity: 1; }

.products .item_header:hover h3 { opacity: 0; }

.products .item_content { padding: 20px; }

.products .item_content li { margin-bottom: 15px; }

.products .item_content li:last-child { margin-bottom: 0; }

.products .item_content a { display: block; font-size: 20px; line-height: 30px; color: #fff; -webkit-transition: color 0.5s; transition: color 0.5s; }

.products .item_content a:hover { color: #333333; }

.contact_us { padding: 80px 0; }

.contact_us .item { padding: 0 15px; -webkit-box-sizing: border-box; box-sizing: border-box; }

@media (min-width: 768px) { .contact_us .item { float: left; margin-bottom: 0; } }

@media (min-width: 768px) { .contact_us .item { width: calc(100% / 2); } }

@media (min-width: 992px) { .contact_us .map { width: calc(100% / 3 * 2); }
  .contact_us .contact_data { width: calc(100% / 3); } }

.contact_us dl { line-height: 1.5; }

.contact_us dt { display: inline-block; width: 75px; vertical-align: top; }

.contact_us dt.time { width: 105px; }

.contact_us dt i { color: #17a6bf; }

.contact_us dt span { margin-left: 5px; }

.contact_us dt span::after { content: " - "; }

.contact_us dd { display: inline-block; margin-bottom: 15px; width: calc(100% - 85px); word-break: break-all; }

.contact_us dd.time { width: calc(100% - 115px); }

.contact_us .phone > li { display: inline; }

.contact_us .phone > li::after { content: "、"; }

.contact_us .phone > li:last-child::after { content: ""; }

.contact_us a { color: #707070; }

.contact_us a:hover { color: #17a6bf; }

body { position: relative; }

.goto { position: fixed; right: 20px; bottom: 100px; }

.goto a { display: inline-block; width: 64px; height: 64px; background-color: #17a6bf; border-radius: 50%; padding: 6px 12px; -webkit-box-sizing: border-box; box-sizing: border-box; opacity: 0.6; -webkit-transition: opacity 0.5s; transition: opacity 0.5s; }

.goto a:hover { opacity: 1; }

.goto i { color: #fff; }

.p_item_list { display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: #fff; overflow-y: auto; z-index: 100; }

.p_item_list .wrap { margin-top: 100px; margin-bottom: 100px; }

.p_item_list .btn_close { cursor: pointer; position: absolute; right: 32px; top: 32px; width: 32px; height: 32px; opacity: 0.3; }

.p_item_list .btn_close::before, .p_item_list .btn_close::after { content: ""; height: 33px; width: 2px; position: absolute; left: 15px; background-color: #333; }

.p_item_list .btn_close::before { -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.p_item_list .btn_close::after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

.p_item_list .item-2 .item_group:first-child, .p_item_list .item-2 .item_group:nth-child(2) { margin-bottom: 15px; }

.p_item_list .item-2 .item { float: left; }

.p_item_list .item-2 .item + .item { margin-left: 15px; }

@media (min-width: 768px) { .p_item_list .item-2 .item { width: 100%; }
  .p_item_list .item-2 .item:nth-child(3), .p_item_list .item-2 .item:last-child { margin-bottom: 0; } }

@media (min-width: 992px) { .p_item_list .item-2 .item { width: calc(100% / 2 - 15px); } }

.p_item_list .item-3 .item { float: left; border-width: 0; background-color: initial; }

.p_item_list .item-3 .item + .item { margin-left: 15px; border-left: 1px solid #ddd; }

@media (min-width: 992px) { .p_item_list .item-3 .item { width: calc(100% / 3 - 10px); } }

.p_item_list .item-3 .item_group { border: 1px solid #ddd; background-color: #fff; }

.p_item_list .item { position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; border: 1px solid #ddd; background-color: #fff; margin: 0 auto; margin-bottom: 20px; }

@media (min-width: 768px) { .p_item_list .item { width: 100%; } }

@media (min-width: 992px) { .p_item_list .item { width: 60%; } }

.p_item_list .item_header { background-color: #17a6bf; color: #fff; text-align: center; padding: 20px 0; }

.p_item_list .item_content { margin-top: 20px; margin-bottom: 20px; }

.p_item_list ul { margin: 0 15px; }

.p_item_list li { margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px solid #ddd; }

.p_item_list a { cursor: none; color: #333333; }

footer { background-color: #333333; padding: 30px 0; text-align: center; font-size: 14px; line-height: 20px; color: #ddd; }

footer span { color: #17a6bf; }
/*# sourceMappingURL=all.css.map */