@media screen and (max-width: 760px) {
  * {
    box-sizing: border-box;
  }

  html,
  body {
    width: 100%;
    min-width: 0;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
  }

  body {
    font-size: 15px;
    line-height: 1.6;
  }

  img,
  video,
  iframe,
  table {
    max-width: 100%;
  }

  img,
  video {
    height: auto;
  }

  .container,
  .container-layout {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 14px;
    padding-right: 14px;
  }

  .line,
  .line-large {
    margin-left: 0;
    margin-right: 0;
  }

  .x1,
  .x2,
  .x3,
  .x4,
  .x5,
  .x6,
  .x7,
  .x8,
  .x9,
  .x10,
  .x11,
  .x12,
  .xl1,
  .xl2,
  .xl3,
  .xl4,
  .xl5,
  .xl6,
  .xl7,
  .xl8,
  .xl9,
  .xl10,
  .xl11,
  .xl12,
  .xs1,
  .xs2,
  .xs3,
  .xs4,
  .xs5,
  .xs6,
  .xs7,
  .xs8,
  .xs9,
  .xs10,
  .xs11,
  .xs12,
  .xm1,
  .xm2,
  .xm3,
  .xm4,
  .xm5,
  .xm6,
  .xm7,
  .xm8,
  .xm9,
  .xm10,
  .xm11,
  .xm12,
  .xb1,
  .xb2,
  .xb3,
  .xb4,
  .xb5,
  .xb6,
  .xb7,
  .xb8,
  .xb9,
  .xb10,
  .xb11,
  .xb12 {
    float: none !important;
    width: 100% !important;
    padding-left: 0;
    padding-right: 0;
  }

  .blank-large {
    height: 36px;
    line-height: 36px;
  }

  .blank-big {
    height: 28px;
    line-height: 28px;
  }

  .blank-middle {
    height: 20px;
    line-height: 20px;
  }

  .padding-large,
  .article .padding-large,
  .home-about .padding-large {
    padding: 22px 16px !important;
  }

  .title-c h3 {
    font-size: 22px;
    margin-bottom: 30px;
  }

  #pc-header .navbar {
    position: relative !important;
    box-shadow: 0 1px 8px rgba(0, 0, 0, .08);
  }

  #pc-header .logo {
    padding: 12px 46px 8px 0;
  }

  #pc-header .logo img {
    max-width: 210px;
    max-height: 44px;
  }

  #pc-header .text-center {
    text-align: left;
  }

  #pc-header .nav {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 8px 0 12px;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  #pc-header .nav::-webkit-scrollbar {
    display: none;
  }

  #pc-header .nav li {
    display: inline-block;
    flex: 0 0 auto;
  }

  #pc-header .nav li a {
    display: block;
    height: 36px;
    line-height: 36px;
    padding: 0 12px;
    border: 1px solid #eee;
    border-radius: 18px;
    background: #fff;
    font-size: 14px;
  }

  #pc-header .nav li.active a,
  #pc-header .nav li a:hover,
  #pc-header .nav li:hover a.first-level {
    color: #fff;
    border-color: #ff9600;
    background: #ff9600;
  }

  #pc-header .nav li ul,
  #pc-header .nav li .drop-menu {
    display: none !important;
  }

  #pc-header .searchBar {
    top: 19px;
    right: 14px !important;
  }

  #pc-header a.search-ico i {
    font-size: 20px;
  }

  .searchBar-m .form-group {
    width: 88%;
    top: 45%;
  }

  .searchBar-m .input {
    width: 82%;
    height: 48px;
    line-height: 48px;
  }

  .searchBar-m .button {
    width: 18%;
    height: 48px;
    line-height: 48px;
  }

  .dialog {
    width: calc(100% - 28px) !important;
    max-width: 420px;
  }

  .dialog .dialog-body {
    padding: 10px 18px 24px;
  }

  .slides,
  .owl-carousel,
  .owl-carousel .item {
    max-width: 100%;
  }

  .home-about {
    background-position: center top;
  }

  .home-about .line.bg-white {
    background: #fff;
  }

  .home-about h2,
  .inside h2 {
    font-size: 24px;
    line-height: 1.35;
  }

  .home-news-l,
  .home-news-r {
    margin: 0;
  }

  .home-news-h,
  .home-news-c {
    margin-bottom: 16px;
  }

  .home-news-c {
    padding: 12px;
  }

  .home-news-c .x3 {
    width: 34% !important;
    float: left !important;
  }

  .home-news-c .x2 {
    display: none;
  }

  .home-news-c .x7 {
    width: 66% !important;
    float: left !important;
    padding-left: 12px;
  }

  .home-news-c .news-title {
    margin: 0;
  }

  .home-news-c .news-title h2 a {
    margin-bottom: 6px;
    white-space: normal;
    font-size: 16px;
    line-height: 1.45;
  }

  .channel-banner {
    height: 190px;
  }

  .channel-banner .banner-info {
    top: 50%;
    margin-top: -38px;
    padding: 0 18px;
  }

  .channel-banner .banner-info h3 {
    font-size: 26px;
    margin-bottom: 18px;
  }

  .channel-banner .banner-info p {
    font-size: 18px;
  }

  .nav-bread {
    height: auto;
    line-height: 1.6;
    padding: 14px 0;
  }

  .nav-tree,
  .nav-x ul,
  .tab-normal .tab .tab-nav,
  .product-overview .tab .tab-nav,
  .video-detail .tab .tab-nav {
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .nav-tree {
    height: auto;
    line-height: normal;
  }

  .nav-tree li,
  .nav-x li,
  .tab-normal .tab .tab-nav li,
  .product-overview .tab .tab-nav li,
  .video-detail .tab .tab-nav li {
    display: inline-block;
    width: auto !important;
  }

  .nav-tree li a,
  .nav-x li a {
    height: 42px;
    line-height: 42px;
    padding: 0 14px;
  }

  .list-news .time,
  .list-news .news,
  .list-news .button {
    margin: 0;
  }

  .list-news {
    padding: 14px 0;
  }

  .list-news .news h3 a {
    font-size: 18px;
    margin-bottom: 8px;
  }

  .normal-list li a {
    padding: 18px 18px 18px 34px;
  }

  .normal-list li span {
    display: block;
    position: static;
    margin: 8px 0 0 34px;
  }

  .article .post h1 {
    font-size: 24px;
    line-height: 1.35;
  }

  .article .post h2 {
    font-size: 21px;
  }

  .article .post p,
  .article .post ul li,
  .article .post ol li p {
    font-size: 16px;
    line-height: 1.75;
  }

  .article .post table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .jw-video {
    height: auto;
    aspect-ratio: 16 / 9;
    border-right: 0;
  }

  .jw-video video {
    width: 100%;
    height: 100%;
  }

  .video-period-list {
    height: auto;
    max-height: 320px;
  }

  .inside .contact {
    padding-bottom: 24px;
  }

  .inside .contact .media {
    padding-bottom: 20px;
  }

  .home-contact .title,
  .home-contact .gb {
    width: 100%;
    float: none;
  }

  .home-contact .title h2 {
    font-size: 34px;
    line-height: 1.2;
    padding: 28px 16px 18px;
  }

  .guestbook {
    padding: 28px 14px;
  }

  .guestbook .padding {
    padding: 22px 16px;
  }

  .guestbook .input,
  .guestbook select,
  .guestbook .textarea,
  .dialog-body .input,
  .dialog-body select,
  .dialog-body .textarea {
    font-size: 16px;
  }

  footer {
    padding-top: 34px;
  }

  footer ul li.item-5,
  footer ul li.item-6 {
    width: 100% !important;
    float: none !important;
  }

  footer .qr {
    width: 150px;
    margin: 12px 0 0;
  }

  footer .tab .tab-body {
    padding: 16px 0;
  }

  footer .copyright {
    padding: 16px 0 28px;
    text-align: left;
  }

  footer .copyright .text-right {
    text-align: left;
    margin-top: 8px;
  }
}

@media screen and (max-width: 420px) {
  #pc-header .logo img {
    max-width: 180px;
  }

  .home-news-c .x3,
  .home-news-c .x7 {
    float: none !important;
    width: 100% !important;
    padding-left: 0;
  }

  .home-news-c .x7 {
    margin-top: 10px;
  }

  .channel-banner {
    height: 160px;
  }
}