@import url(../../lib/bt/icons/1.7.2/icons.css);
@import url("https://fonts.font.im/css?family=Merienda|Open+Sans+Condensed:300|Oswald:300");
body { background-color: #FFFFFF; }

.font-Merienda { font-family: 'Merienda', cursive; }

.font-song { font-family: 'FangSong'; }

.company-name > small { display: block; padding-top: 10px; font-size: 18px; font-family: 'FangSong'; font-weight: 900; text-align: center; padding-bottom: 10px; }
@media (min-width: 768px) { .company-name > small { text-align: left; } }

.navbar { position: -webkit-sticky; position: sticky; top: 0; z-index: 1020; padding-top: 0.25rem; padding-bottom: 0.25rem; }
.navbar.navbar-light { background-color: #FFFFFF; }
.navbar .navbar-brand { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.navbar .navbar-brand > img { -webkit-transition: all 0.2s; transition: all 0.2s; height: 56px; }
@media (min-width: 768px) { .navbar .navbar-brand > img { height: 74px; } }
.navbar .navbar-brand > div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; margin-left: 10px; }
.navbar .navbar-brand > div > h1 { -webkit-transition: all 0.2s; transition: all 0.2s; font-size: 18px; margin: 0; padding: 0; }
@media (min-width: 768px) { .navbar .navbar-brand > div > h1 { font-size: 28px; } }
.navbar .navbar-brand > div > small { letter-spacing: 1px; font-size: #666666; font-size: 14px; margin-top: 6px; }
.navbar .navbar-brand + button { border-color: transparent !important; margin-right: -0.75rem !important; }
.navbar .navbar-brand + button:focus { outline: none; -webkit-box-shadow: none; box-shadow: none; }
@media (min-width: 768px) { .navbar { position: static; padding-top: 1rem; padding-bottom: 1rem; }
  .navbar .nav-item { margin-left: 2rem; }
  .navbar .nav-link { font-size: 18px; font-weight: bold; padding-right: 0 !important; padding-left: 0 !important; }
  .navbar .nav-link.active { color: #0d94bb !important; } }

.banner { background-size: cover; background-position: center; background-repeat: no-repeat; background-image: url(../images/banner_init.jpg); background-position: center top; height: 280px; }
@media (min-width: 768px) { .banner { border-bottom: 25px solid #9c9c9c; } }
.banner > .container { height: 100%; position: relative; }
.banner > .container > div { display: inline-block; position: absolute; color: #FFFFFF; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.banner > .container > div h3 { font-size: 22px; text-shadow: 1px 1px 0 #000000; letter-spacing: 2px; padding: 0; margin-bottom: 6px; }
.banner > .container > div small { font-size: 16px; text-shadow: 1px 1px 0 #000000; display: inline-block; padding-bottom: 18px; margin-bottom: 8px; position: relative; }
.banner > .container > div small::after { content: ' '; position: absolute; left: 0; bottom: 0; height: 2px; max-height: 2px; overflow: hidden; background-color: #FFFFFF; width: 20px; }
.banner > .container > div p { font-size: 12px; text-shadow: 1px 1px 0 #000000; padding: 0; margin: 10px 0 0 0; }
@media (min-width: 768px) { .banner > .container > div { left: 0; -webkit-transform: translateY(10%); transform: translateY(10%); }
  .banner > .container > div h3 { font-size: 28px; text-shadow: 2px 2px 0 #000000; -webkit-transform: scaleY(0.9); transform: scaleY(0.9); }
  .banner > .container > div small { padding-bottom: 28px; margin-bottom: 18px; } }
@media (min-width: 768px) { .banner { height: 750px; } }

.section { padding-top: 50px; padding-bottom: 50px; }
@media (min-width: 768px) { .section { padding-top: 100px; padding-bottom: 100px; } }
.section.no-pt { padding-top: 0; }
.section.no-pb { padding-bottom: 0; }
.section.section-gray { background-color: #f0eff4; }
.section.section-bg-img { position: relative; }
.section.section-bg-img .container { position: relative; z-index: 99; }
.section.section-bg-img::before, .section.section-bg-img::after { position: absolute; content: ' '; left: 0; top: 0; right: 0; bottom: 0; z-index: 1; }
.section.section-bg-img::before { background-color: rgba(45, 62, 80, 0.7); }
.section.section-bg-img::after { z-index: 0; background-image: url(../images/section-bg.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; }
.section .section-title-text { text-align: center; font-family: 'FangSong'; font-size: 12px; margin-bottom: 20px; }
@media (min-width: 768px) { .section .section-title-text { font-size: 16px; margin-bottom: 40px; font-weight: 900; } }
.section .section-title { height: 101px; background-repeat: no-repeat; background-position: center; background-size: contain; margin-bottom: 20px; }
@media (min-width: 768px) { .section .section-title { margin-bottom: 40px; } }
.section .section-title.section-title-jgsdj { background-image: url(../images/title-jgsdj.png); }
.section .section-title.section-title-dywezml { background-image: url(../images/title-dywezml.png); }
.section .section-title.section-title-cfmzdcm { background-image: url(../images/title-cfmzdcm.png); }

.space-line { height: 20px; background-image: url(../images/space.png); background-repeat: no-repeat; background-position: center; margin-bottom: 60px; }
@media (min-width: 768px) { .space-line { margin-bottom: 120px; } }
.space-line.margin-top { margin-top: 60px; }
@media (min-width: 768px) { .space-line.margin-top { margin-top: 120px; } }
.space-line.append-text { margin-bottom: 30px; }
@media (min-width: 768px) { .space-line.append-text { margin-bottom: 60px; } }

.space-text { height: 20px; background-image: url(../images/text.png); background-repeat: no-repeat; background-position: center; margin-bottom: 60px; }
@media (min-width: 768px) { .space-text { margin-bottom: 120px; } }

.row-pic-list-1 > div[class^=col-]:nth-child(odd) { margin-top: 15px; }
.row-pic-list-1 > div[class^=col-]:nth-child(even) { margin-top: -15px; }
.row-pic-list-1 > div[class^=col-] > div { position: relative; }
.row-pic-list-1 > div[class^=col-] > div > img { max-width: 100%; height: auto; }
.row-pic-list-1 > div[class^=col-]:nth-child(2) > div::before { content: ' '; z-index: 10; position: absolute; left: 0; bottom: 0; right: 0; top: 0; width: 100%; height: 100%; border: 5px solid #000000; }

.footer { padding-top: 30px; padding-bottom: 30px; background-color: #2d3e50; color: #FFFFFF; }
@media (min-width: 768px) { .footer { padding-top: 50px; padding-bottom: 50px; } }
.footer a { color: rgba(255, 255, 255, 0.8); text-decoration: none; }
.footer a:hover { color: white; }
.footer img.logo { width: 118px; padding: 5px 18px; background-color: #FFFFFF; margin-bottom: 30px; }
.footer h4 { font-size: 24px; margin: 0 0 15px 0; }
.footer ul > li { line-height: 2rem; }
.footer a.icp { display: inline-block; padding-top: 10px; font-size: 12px !important; }

@media (min-width: 768px) { .section-about .content > p { font-size: 22px; line-height: 44px; margin-bottom: 22px; } }

@media (min-width: 768px) { .section-about-items { margin-top: -250px; padding-top: 0px; } }

@media (min-width: 768px) { .row-about-items { -webkit-transform: translateY(calc(-50% + 25px)); transform: translateY(calc(-50% + 25px)); } }
.row-about-items > div[class^=col-] { margin-bottom: 30px; }
@media (min-width: 768px) { .row-about-items > div[class^=col-] { margin-bottom: 50px; } }
.row-about-items > div[class^=col-] .icon-div { border-radius: 5px; background-color: #bfbfbf; padding: 15px; }
.row-about-items > div[class^=col-] .icon-div i { font-size: 38px; line-height: 38px; color: #FFFFFF; }
@media (min-width: 768px) { .row-about-items > div[class^=col-] .icon-div.reverse { background-color: #FFFFFF; }
  .row-about-items > div[class^=col-] .icon-div.reverse i { color: #e5e3ee; } }
.row-about-items > div[class^=col-] .icon-div + div { margin-left: 10px; }
.row-about-items > div[class^=col-] .icon-div + div > h6 { font-size: 16px; line-height: 16px; font-weight: 500; padding: 0; margin: 0; }
.row-about-items > div[class^=col-] .icon-div + div > small { display: inline-block; font-family: 'Oswald', sans-serif; -webkit-transform: scale(1); transform: scale(1); -webkit-transform-origin: left; transform-origin: left; white-space: nowrap; padding-top: 6px; }
.row-about-items > div[class^=col-] .icon-div + div > p { font-size: 13px; color: #999999; margin: 4px 0 0 0; padding: 4px 0 0 0; font-family: 'FangSong'; position: relative; }
.row-about-items > div[class^=col-] .icon-div + div > p::before { position: absolute; content: ' '; left: 0; top: 0; width: 10px; height: 1px; max-height: 1px; background-color: #AAAAAA; }
@media (min-width: 768px) { .row-about-items > div[class^=col-] .icon-div + div > h6 { font-size: 13px; line-height: 13px; }
  .row-about-items > div[class^=col-] .icon-div + div > small { -webkit-transform: scale(0.7); transform: scale(0.7); padding-top: 0px; }
  .row-about-items > div[class^=col-] .icon-div + div > p { font-size: 13px; color: #999999; margin: 4px 0 0 0; padding: 4px 0 0 0; font-family: 'FangSong'; position: relative; }
  .row-about-items > div[class^=col-] .icon-div + div > p::before { position: absolute; content: ' '; left: 0; top: 0; width: 10px; height: 1px; max-height: 1px; background-color: #AAAAAA; } }

.row-pic-list-2 > div[class^=col-] { margin-bottom: 2rem; }
.row-pic-list-2 > div[class^=col-] > div:last-of-type { background-color: #f9f9fb; text-align: center; padding: 1.5rem 1rem; font-family: 'FangSong'; }
.row-pic-list-2 > div[class^=col-] > div:last-of-type h3 { font-size: 20px; font-weight: 900; margin-bottom: 10px; }
.row-pic-list-2 > div[class^=col-] > div:last-of-type p { font-size: 12px; margin-bottom: 0; position: relative; padding-bottom: 30px; }
.row-pic-list-2 > div[class^=col-] > div:last-of-type p::after { position: absolute; content: ' '; left: 50%; bottom: 0; height: 1px; max-height: 1px; background-color: #cfcfd1; overflow: hidden; width: 50px; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.row-pic-list-2 .img-div > img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }
.row-pic-list-2 .img-div.square { width: 100%; height: 0; position: relative; padding-bottom: 100%; }
.row-pic-list-2 .img-div.square img { position: absolute; width: 100%; height: 100%; }

.section-bg { background-image: url(../images/products/bg.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; padding-top: 60px; padding-bottom: 60px; }
@media (min-width: 768px) { .section-bg { padding-top: 120px; padding-bottom: 120px; } }