@charset "utf-8";

/* 색 설정 */
:root { --main-color: #C0202E; --black-color : #171819; --white-color : #fff; --header-mobile-menu-bg: rgba(23, 24, 25, 0.97); }

/* size */
@media screen and (max-width: 1250px) { } /* tablet */
@media screen and (max-width: 650px) { } /* mobile */

/* 스크롤 커스텀 */
html::-webkit-scrollbar { width: 8px; }
html::-webkit-scrollbar-thumb { background-color: var(--main-color); border-radius: 10px; }

/* 드래그 블록 커스텀 */
::selection { background-color:var(--main-color); color:#fff; }


/* default */
*{ font-size: 16px; font-weight: 400; font-family: 'Pretendard', sans-serif; color : #171819; box-sizing: border-box; letter-spacing: inherit; line-height: 140%; }

body{ font-family: 'Pretendard', sans-serif; font-weight:400; font-size: 16px; letter-spacing: -0.04em; }
section{ display:block; }
a{ color:inherit; }
a:hover{ text-decoration: none; color: inherit;  }

.inner{ width:1200px; margin:0 auto;  }

.paging_box{ margin-top: 20px; padding:10px 0; display:flex; align-items: center; justify-content: center; }
.paging_box .pg_page{ background-color:#FFF; border:1px solid #e6e6e6; }
.paging_box .pg_current{ background-color: #0F1C2E; color:#fff; border:1px solid #0F1C2E; }

select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url('../img/common/select-icon.png') no-repeat 98% 50% #fff; }
select::-ms-expand{ display:none; }
p{ word-break: keep-all; }

@media screen and (max-width: 1250px) {
    .inner{ width:100%; padding:0 20px; }
} /* tablet */
@media screen and (max-width: 650px) {
    .paging_box{ font-size: 13px; }
} /* mobile */

#hd_login_msg{ display: none; }



/* #########################common css######################## */
section{padding: 150px 0;}
.title-box h1{ font-size: 48px; font-weight: 700;}
.title-box p{ font-size: 20px; font-weight: 500; margin: 20px 0; }
.title-box h1 b{ color: var(--main-color); font-size: 48px; font-weight: 700; }
@media screen and (max-width: 1250px) {
    section{padding: 120px 0;}
    .title-box h1, .title-box h1 b{ font-size: 38px; }
    .title-box p{ font-size: 18px; margin: 16px 0; }
}
@media screen and (max-width: 960px) {
    section{padding: 80px 0;}
    .title-box h1, .title-box h1 b{ font-size: 32px; }
    .title-box p{ font-size: 16px; margin: 12px 0; }
}
@media screen and (max-width: 650px) {
    section{padding: 50px 0;}
    .title-box h1, .title-box h1 b{ font-size: 28px; }
    .title-box p{ font-size: 15px; margin: 8px 0;}
}
/* sub-visual */
.sub-visual{ height: 580px; display: flex; align-items: center; justify-content: center;}
.sub-visual.company{ background: url('../img/company/sub-visual-bg.jpg') no-repeat center center / cover;}
.sub-visual.factory{ background: url('../img/factory/sub-visual-bg.jpg') no-repeat center center / cover;}
.sub-visual.product{ background: url('../img/product/sub-visual-bg.jpg') no-repeat center center / cover;}
.sub-visual.tank{ background: url('../img/tank/sub-visual-bg.jpg') no-repeat center center / cover;}
.sub-visual.location{ background: url('../img/location/sub-visual-bg.png') no-repeat center center / cover;}
.sub-visual.notice{ background: url('../img/notice/sub-visual-bg.jpg') no-repeat center center / cover;}
.sub-visual .visual-text-box{ text-align: center; }
.sub-visual .visual-text-box h1{ color: #FFF; font-size: 60px; font-weight: 600; margin-bottom: 30px; line-height: normal;}
.sub-visual .visual-text-box h2{ color: #FFF; font-size: 32px; font-weight: 500; line-height: normal;}
@media screen and (max-width: 1250px) {
    .sub-visual .visual-text-box h1{ font-size: 52px;  margin-bottom: 20px;}
    .sub-visual .visual-text-box h2{ font-size: 28px; }
}
@media screen and (max-width: 960px) {
    .sub-visual{ height: 35vh}
    .sub-visual .visual-text-box h1{ font-size: 38px;  margin-bottom: 10px;}
    .sub-visual .visual-text-box h2{ font-size: 24px; }
}
@media screen and (max-width: 650px) {
    .sub-visual .visual-text-box h1{ font-size: 28px; }
    .sub-visual .visual-text-box h2{ font-size: 20px; }
}
/* header */
header{ position: fixed; left: 0; top: 0; width: 100%; height: 100px; z-index: 9999; display: flex; align-items: center; transition: background-color 0.25s ease; }
header .inner{ display: flex; align-items: center; justify-content: space-between; position: relative; width: 100%; max-width: 1200px; margin: 0 auto; }
header .logo, header .logo-mobile{ width: 200px; flex-shrink: 0;}
header .logo-mobile{ display: none;}
header .logo a, header .logo-mobile a{ display: block; line-height: 0;}
header .logo img, header .logo-mobile img{ width: 100%; height: auto; vertical-align: top;}
header .menu ul{ display: flex; align-items: center; gap: 40px; }
header .menu ul li a{color: #FFF; font-size: 18px; font-style: normal; font-weight: 600;}
header .menu ul li{ position: relative; }
header .menu ul li .sub-menu{ position: absolute; left: 50%; top: 100%; margin-top: 8px; transform: translateX(-50%) translateY(8px); min-width: 170px; padding: 12px 14px; border-radius: 8px; background: rgba(23, 24, 25, 0.96); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease; }
header .menu ul li .sub-menu::before{ content: ""; position: absolute; left: 0; top: -10px; width: 100%; height: 10px; }
header .menu ul li .sub-menu a{ display: block; padding: 6px 0; font-size: 14px; font-weight: 500; color: #fff; white-space: nowrap; }
header .menu ul li .sub-menu a:hover{ color: #d94754;}
header .menu ul li .main-menu:hover + .sub-menu, header .menu ul li .main-menu:focus + .sub-menu, header .menu ul li:focus-within .sub-menu, header .menu ul li:hover .sub-menu{ opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }
header.active .menu ul li a{color: var(--black-color);}
header.active .menu ul li .sub-menu a{ color: #fff; }
header.active .menu ul li .sub-menu a:hover{ color: #d94754;}
header .menu ul li.off-page{display: none;}
header.active{ background-color: #fff;}
header.active .logo{ display: none;}
header.active .logo-mobile{ display: block;}

header.white-header .menu ul li a{color: var(--black-color);}
header.white-header .menu ul li .sub-menu a{ color: #fff; }
header.white-header .menu ul li .sub-menu a:hover{ color: #d94754;}
header.white-header{ background-color: #fff;}
header.white-header .logo{ display: none;}
header.white-header .logo-mobile{ display: block;}

/* 햄버거 버튼 */
header .btn-menu{ display: none; position: relative; z-index: 10001; width: 44px; height: 44px; padding: 0; border: none; background: transparent; cursor: pointer; flex-shrink: 0; -webkit-tap-highlight-color: transparent; }
header .btn-menu__bar{ display: block; width: 24px; height: 2px; margin: 5px auto; background: #fff; border-radius: 1px; transition: transform 0.3s ease, opacity 0.3s ease; }
header.header--open .btn-menu__bar:nth-child(1){ transform: translateY(7px) rotate(45deg); }
header.header--open .btn-menu__bar:nth-child(2){ opacity: 0; }
header.header--open .btn-menu__bar:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }
header.active .btn-menu__bar{background-color: var(--black-color);}

header.white-header .btn-menu__bar{ display: block; width: 24px; height: 2px; margin: 5px auto; background: #333; border-radius: 1px; transition: transform 0.3s ease, opacity 0.3s ease; }

@media screen and (max-width: 960px) {
    header{ height: 80px; }
    header.header--open{ background-color: var(--header-mobile-menu-bg); }
    header .logo, header .logo-mobile{ width: 160px; }
    header .btn-menu{ display: block; }
    header .menu{display: none; position: fixed; left: 0; top: 80px; width: 100%; height: calc(100dvh - 80px); max-height: calc(100vh - 80px); margin: 0; padding: 24px 20px 40px; background: var(--header-mobile-menu-bg); overflow-y: auto; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-8px); transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease; }
    header.header--open .menu{display: block; opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); }
    
    /* white-header*/
    header.white-header.header--open .btn-menu__bar{ background-color: var(--white-color); }
    header.white-header.header--open .logo{ display: block; }
    header.white-header.header--open .logo-mobile{ display: none; }
    header.white-header.header--open .menu ul li a{color: #fff;}

    header .menu ul{ flex-direction: column; align-items: stretch; gap: 0; }
    header .menu ul li{ border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
    header .menu ul li a{ display: block; padding: 18px 8px; font-size: 16px; }
    header .menu ul li .sub-menu{ display: block; position: static; left: auto; top: auto; margin-left: 30px; margin-top: 0; transform: none; min-width: 0; padding: 0 8px 12px; border-radius: 0; background: transparent; box-shadow: none; opacity: 1; visibility: visible; pointer-events: auto; transition: none; }
    header .menu ul li .sub-menu::before{ display: none; }
    header .menu ul li .sub-menu:hover{background-color: transparent;}
    header .menu ul li .sub-menu a{ padding: 8px 0; font-size: 14px; color: rgba(255, 255, 255, 0.8); }

    header .menu ul li .main-menu:hover + .sub-menu,
    header .menu ul li .main-menu:focus + .sub-menu,
    header .menu ul li:focus-within .sub-menu,
    header .menu ul li:hover .sub-menu{
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: none;
    }
}
@media screen and (max-width: 650px) {
    header{ height: 72px; }
    header .logo, header .logo-mobile { width: 140px; }
    header .menu{ top: 72px; height: calc(100dvh - 72px); max-height: calc(100vh - 72px); padding: 16px 16px 32px; }
    header .menu ul li a{ padding: 16px 6px; }
}
/*footer*/
footer{background: #F9F9F9; padding: 50px 0;}
footer .logo-menu{display: flex; justify-content: space-between; align-items: center; margin-bottom: 50px;}
footer .logo-menu .logo{width: 200px;}
footer .logo-menu .logo img{width: 100%; height: 100%; object-fit: contain;}
footer .logo-menu .menu ul{display: flex; justify-content: space-between; align-items: center; gap: 30px;}
footer .logo-menu .menu ul li a{font-size: 16px; font-weight: 400;}
footer .info-sns {display: flex; justify-content: space-between;}
footer .info-sns .info div{margin: 20px 0; display: flex; gap: 20px;}
footer .info-sns .info div span{font-size: 16px; font-weight: 400;}
footer .info-sns .info .copyright{color: #8B939B;}
footer .info-sns .sns{display: flex; gap: 30px; }
footer .info-sns .sns a{width: 30px; height: 30px;}
footer .info-sns .sns a img{width: 100%; height: 100%; object-fit: cover;}
@media screen and (max-width: 1250px) {
    footer{ padding: 40px 0; }
    footer .logo-menu{ gap: 24px; margin-bottom: 40px; }
    footer .logo-menu .logo{ width: 180px; }
    footer .logo-menu .menu ul{flex-wrap: wrap; justify-content: flex-end; }
    footer .info-sns .info div{flex-wrap: wrap; }
}
@media screen and (max-width: 960px) {
    footer{ padding: 30px 0; }
    footer .logo-menu{ flex-direction: column; align-items: flex-start; margin-bottom: 30px; }
    footer .logo-menu .logo{ width: 170px; }
    footer .logo-menu .menu{ width: 100%; }
    footer .logo-menu .menu ul{ justify-content: flex-start; gap: 20px; flex-wrap: wrap; }
    footer .info-sns{ flex-direction: column; gap: 20px; }
    footer .info-sns .info div{ margin: 15px 0; gap: 15px; flex-wrap: wrap; }
    footer .info-sns .sns{ gap: 20px; }
}
@media screen and (max-width: 650px) {
    footer{ padding: 20px 0; }
    footer .logo-menu{ gap: 10px; margin-bottom: 20px; }
    footer .logo-menu .logo{ width: 140px; }
    footer .logo-menu .menu ul{ gap: 5px 15px; }
    footer .logo-menu .menu ul li a{ font-size: 14px; }
    footer .info-sns .info div{ margin: 10px 0; }
    footer .info-sns .info div{gap: 10px; margin: 10px 0;}
    footer .info-sns .info div span{ font-size: 14px; }
    footer .info-sns .sns a{ width: 25px; height: 25px; }
}
/* ###########################index.html############################## */
/* sec1 */
.sec1{ height: 100vh; display: flex; align-items: center; position: relative; }
.video-bg{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.video-overlay{ position:absolute; background:rgba(0,0,0,0.5); z-index:1; width: 100%; height: 100%; top: 0; left: 0;}
.sec1 .inner{ position: relative; z-index: 2; }
.sec1 .text-box h2{ color: #FFF; font-size: 38px; font-weight: 600; }
.sec1 .text-box h1{ color: #FFF; font-size: 60px; font-weight: 700; }
.sec1 .text-box p{ color: #FFF; font-size: 24px; font-weight: 500; margin-top: 30px; }
@media screen and (max-width: 1250px) {
    .sec1{ min-height: 100vh; padding-top: 100px; }
    .sec1 .text-box h2{ font-size: 32px; }
    .sec1 .text-box h1{ font-size: 52px; margin-top: 8px; }
    .sec1 .text-box p{ font-size: 20px; margin-top: 24px; }
}
@media screen and (max-width: 960px) {
    .sec1{ min-height: 100dvh; min-height: 100vh; padding-top: -100px; }
    .sec1 .inner{ padding: 0 20px 80px; }
    .sec1 .text-box h2{ font-size: 24px;}
    .sec1 .text-box h1{ font-size: 42px; line-height: 120%; margin-top: 6px; }
    .sec1 .text-box p{ font-size: 18px; margin-top: 18px; }
}
@media screen and (max-width: 650px) {
    .sec1{ min-height: 100dvh; min-height: 100vh; padding-top: 72px; }
    .sec1 .inner{ padding: 0 16px 56px; }
    .sec1 .text-box h2{ font-size: 18px; }
    .sec1 .text-box h1{ font-size: 34px; margin-top: 4px; }
    .sec1 .text-box p{ font-size: 15px; margin-top: 14px;}
}
/*sec2*/
.sec2 .slide{ display: flex; align-items: center; gap: 100px; }
.sec2 .title-box { flex: 1; }
.sec2 .title-box h3{ color: var(--main-color); font-size: 32px; font-weight: 600; margin-bottom: 10px; }
.sec2 .title-box p{ margin: 30px 0; }
.sec2 .btn-box{ border-radius: 5px; border: 1px solid var(--black-color); width: 150px; height: 40px; display: flex; align-items: center; justify-content: center; }
.sec2 .btn-box a{ font-size: 18px; font-weight: 500; }
.sec2 .image-box{ flex: 1; height: 350px; border-radius: 10px; overflow: hidden; }
.sec2 .image-box img{ width: 100%; height: 100%; object-fit: cover; }
.sec2 .slider-pagination{ display: flex; align-items: center; gap: 10px; margin-top: 50px; }
.sec2 .slider-pagination span{ width: 20px; height: 20px; border-radius: 50%; background: rgba(0, 0, 0, 0.30); margin: 0; }
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{ background-color: var(--black-color); }
.swiper-pagination-bullet.swiper-pagination-bullet-active{ width: 50px !important; border-radius: 20px !important; }
@media screen and (max-width: 1250px) {
    .sec2 .slide{ gap: 48px; }
    .sec2 .title-box h3{ font-size: 26px; }
    .sec2 .title-box p{ margin: 24px 0; }
    .sec2 .image-box{ height: 300px; }
}
@media screen and (max-width: 960px) {
    .sec2 .slide{ flex-direction: column-reverse; align-items: stretch; gap: 24px; }
    .sec2 .title-box{flex: none;}
    .sec2 .title-box h3{ font-size: 22px; }
    .sec2 .title-box p{ margin: 16px 0 20px;}
    .sec2 .title-box p br{ display: none; }
    .sec2 .btn-box{ width: 170px; height: 44px; }
    .sec2 .btn-box a{ font-size: 16px; }
    .sec2 .image-box{flex: none; height: 260px; border-radius: 8px; }
    .sec2 .slider-pagination{ justify-content: center; margin-top: 20px; }
    .sec2 .slider-pagination span{ width: 15px; height: 15px;}
}
@media screen and (max-width: 650px) {
    .sec2 .slide{ gap: 18px; }
    .sec2 .title-box h3{ font-size: 18px; }
    .sec2 .title-box p{ margin: 12px 0 16px;}
    .sec2 .btn-box{ width: 150px; height: 40px; }
    .sec2 .btn-box a{ font-size: 14px; }
    .sec2 .image-box{ height: 210px; border-radius: 6px; }
    .sec2 .slider-pagination{ margin-top: 22px; gap: 8px; }
    .sec2 .slider-pagination span{ width: 12px; height: 12px; }
    .swiper-pagination-bullet.swiper-pagination-bullet-active{ width: 30px !important; border-radius: 12px !important; }
}
/*sec3*/
.sec3{ background: url('../img/main/main-sec3-bg.jpg') no-repeat center center / cover;}
.sec3 .title-box {flex: 1;}
.sec3 .title-box > *{color: var(--white-color);}
.sec3 .sec3-1{margin-bottom: 150px;}
.sec3 .sec3-1 .items{display: flex; justify-content: space-between; align-items: flex-start;gap: 24px; margin-top: 100px;}
.sec3 .sec3-1 .item{ flex: 1; border-top: 1px solid #fff; padding-top: 30px;}
.sec3 .sec3-1 .item h4{ font-size: 24px; color: #fff; font-weight: 600;}
.sec3 .sec3-1 .item p{font-size: 18px; font-weight: 500; color: #ddd;}
.sec3 .sec3-1 .item p.t1{margin: 20px 0 10px 0;}
.sec3 .sec3-2{display: flex; justify-content: space-between; gap: 24px;}
.sec3 .sec3-2 .items{flex: 2; display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap;}
.sec3 .sec3-2 .item{width: calc((100% - 24px) / 2); display: flex; justify-content: space-between; gap: 20px;}
.sec3 .sec3-2 .item .num{color: #fff; font-size: 40px; font-weight: 700;}
.sec3 .sec3-2 .item .text-box{padding: 20px; border-radius: 5px; border: 1px solid rgba(255, 255, 255, 0.50); background: rgba(255, 255, 255, 0.10);}
.sec3 .sec3-2 .item .text-box h4{font-size: 24px; font-weight: 600; color: #fff;}
.sec3 .sec3-2 .item .text-box p{font-size: 18px; font-weight: 500; color: #ddd;}
.sec3 .sec3-2 .item .text-box p.t1{margin: 20px 0 10px 0;}
@media screen and (max-width: 1250px) {
    .sec3 .sec3-1{ margin-bottom: 100px; }
    .sec3 .sec3-1 .items{margin-top: 50px; }
    .sec3 .sec3-1 .item h4{font-size: 20px;}
    .sec3 .sec3-1 .item p{font-size: 18px;}
    .sec3 .sec3-1 .item p.t1{ margin: 16px 0 8px 0; }
    .sec3 .sec3-2{flex-direction: column;}
    .sec3 .sec3-2 .item .num{ font-size: 32px; }
    .sec3 .sec3-2 .item .text-box{ padding: 18px; }
    .sec3 .sec3-2 .title-box br{ display: none; }
    .sec3 .sec3-2 .item .text-box h4{ font-size: 20px; }
    .sec3 .sec3-2 .item .text-box p{ font-size: 18px; }
    .sec3 .sec3-2 .item .text-box p.t1{ margin: 16px 0 8px 0; }
}
@media screen and (max-width: 960px) {
    .sec3 .sec3-1{ margin-bottom: 70px; }
    .sec3 .sec3-1 .items{ flex-direction: column;}
    .sec3 .sec3-1 .item{ padding-top: 20px; width: 100%;}
    .sec3 .sec3-1 .item:nth-child(1){border-top: none; padding-top: 0;}
    .sec3 .sec3-1 .item h4{ font-size: 18px; }
    .sec3 .sec3-1 .item p{ font-size: 16px;}
    .sec3 .sec3-2 .item .num{ font-size: 28px; }
    .sec3 .sec3-2 .item .text-box{ width: 100%;}
    .sec3 .sec3-2 .item .text-box h4{ font-size: 18px; }
    .sec3 .sec3-2 .item .text-box p{ font-size: 16px;}
}
@media screen and (max-width: 650px) {
    .sec3 .sec3-1{ margin-bottom: 50px; }
    .sec3 .sec3-1 .title-box br{ display: none; }
    .sec3 .sec3-1 .items{ gap: 22px; margin-top: 28px;}
    .sec3 .sec3-1 .item h4{ font-size: 16px; }
    .sec3 .sec3-1 .item p{ font-size: 14px; }
    .sec3 .sec3-1 .item p.t1{ margin: 10px 0 5px 0; }
    .sec3 .sec3-2 .items{ flex-direction: column;}
    .sec3 .sec3-2 .item{width: 100%;}
    .sec3 .sec3-2 .item .num{ font-size: 24px; }
    .sec3 .sec3-2 .item .text-box{ padding: 10px; }
    .sec3 .sec3-2 .item .text-box h4{ font-size: 16px; }
    .sec3 .sec3-2 .item .text-box p{ font-size: 14px; }
    .sec3 .sec3-2 .item .text-box p.t1{ margin: 10px 0 5px 0; }
}
/*sec4*/
.sec4 .content{margin-top: 50px; display: flex; justify-content: space-between; gap: 24px;}
.sec4 .content .office-wrap{flex: 1;}
.sec4 .content .office{padding: 30px 0; border-top: 5px solid #8B939B; border-bottom: 1px solid #8B939B; margin-bottom: 30px;}
.sec4 .content .office h3{font-size: 28px; font-weight: 700;}
.sec4 .content .office .info{margin-top: 30px; display: flex; flex-direction: column; gap: 20px;}
.sec4 .content .office .info div{display: flex; align-items: center; gap: 20px;}
.sec4 .content .office .info .label{display: inline-block; width: 100px; margin-right: 30px; font-size: 20px; font-weight: 500;}
.sec4 .content .office .info .value{flex: 1; font-size: 20px; font-weight: 400;}
.sec4 .content .map{height: 300px !important;}
.sec4 .content .map iframe{border-radius: 10px !important;}
@media screen and (max-width: 1250px){
    .sec4 .content{margin-top: 40px;}
    .sec4 .content .office h3{font-size: 24px;}
    .sec4 .content .office .info div{gap: 15px;}
    .sec4 .content .office .info .label,
    .sec4 .content .office .info .value{font-size: 18px;}
}
@media screen and (max-width: 960px){
    .sec4 .content{margin-top: 30px;}
    .sec4 .content .office{padding: 20px 0; margin-bottom: 20px;}
    .sec4 .content .office h3{font-size: 20px;}
    .sec4 .content .office .info{gap: 10px;}
    .sec4 .content .office .info div{gap: 10px;}
    .sec4 .content .office .info .label{width: 80px;}
    .sec4 .content .office .info .label,
    .sec4 .content .office .info .value{font-size: 16px;}
    .sec4 .content .map{height: 250px !important;}
}
@media screen and (max-width: 800px){
    .sec4 .content{flex-direction: column; gap: 20px;}
}
@media screen and (max-width: 650px){
    .sec4 .content .office h3{font-size: 18px;}
    .sec4 .content .office .info .label{width: 60px;}
    .sec4 .content .office .info .label,
    .sec4 .content .office .info .value{font-size: 15px;}
    .sec4 .content .map{height: 200px !important;}
}
/* ###########################company-1.html############################## */
.company1-sec1 .desc{margin-top: 50px;}
.company1-sec1 .desc p{font-size: 20px; font-weight: 400;}
.company1-sec1 .desc > div:nth-of-type(1){margin: 50px 0;}
.company1-sec1 .desc > div .title{font-size: 28px; font-weight: 500; margin-bottom: 20px;}
.company1-sec1 .desc > div span{font-size: 20px; font-weight: 400;}
.company1-sec1 .desc > div p{display: flex; gap: 50px; }
@media screen and (max-width: 960px) {
    .company1-sec1 .desc{margin-top: 40px;}
    .company1-sec1 .desc p{font-size: 18px;}
    .company1-sec1 .desc > div .title{font-size: 24px; margin-bottom: 15px;}
    .company1-sec1 .desc > div span{font-size: 18px;}
    .company1-sec1 .desc > div p{gap: 30px; flex-wrap: wrap;}
    .company1-sec1 .desc > div p{gap: 30px;}
}
@media screen and (max-width: 650px) {
    .company1-sec1 .title-box b{display: block;}
    .company1-sec1 .desc{margin-top: 30px;}
    .company1-sec1 .desc p{font-size: 16px;}
    .company1-sec1 .desc > div .title{font-size: 20px; margin-bottom: 10px;}
    .company1-sec1 .desc > div span{font-size: 16px;}
    .company1-sec1 .desc > div p{gap: 10px;}
}
/*.company1-sec2*/
.company1-sec2 {background: url('../img/company/company1-sec2-bg.jpg') no-repeat center center / cover;}
.company1-sec2 .title-box h1{color: #fff;}
.company1-sec2 .content{display: flex; justify-content: space-between; margin-top: 50px; background-color: rgba(255, 255, 255, 0.1); padding: 20px 0; border-top: 1px solid #fff; border-bottom: 1px solid #fff;}
.company1-sec2 .content .item{flex: 1; border-right: 1px solid #fff; padding: 0 20px;}
.company1-sec2 .content .item:last-child{border-right: none;}
.company1-sec2 .content .item h4{color: #fff; font-size: 24px; font-weight: 700; margin-bottom: 20px;}
.company1-sec2 .content .item ul{display: flex; flex-direction: column; gap: 10px;}
.company1-sec2 .content .item ul li{color: #fff; font-size: 20px; }
@media screen and (max-width: 1250px) {
    .company1-sec2 .content{ margin-top: 40px;}
    .company1-sec2 .content .item h4{ font-size: 22px; margin-bottom: 16px; }
    .company1-sec2 .content .item ul li{ font-size: 18px; }
}
@media screen and (max-width: 960px) {
    .company1-sec2 .content{ flex-wrap: wrap; padding: 10px 0; margin-top: 30px; }
    .company1-sec2 .content .item{ flex: 1 1 50%;}
    .company1-sec2 .content .item:nth-child(even){ border-right: none;}
    .company1-sec2 .content .item:nth-child(1), .company1-sec2 .content .item:nth-child(2){ border-bottom: 1px solid #fff;}
    .company1-sec2 .content{ margin-top: 30px;}
    .company1-sec2 .content .item{ padding: 16px;}
    .company1-sec2 .content .item h4{ font-size: 18px; margin-bottom: 10px; }
    .company1-sec2 .content .item ul{ gap: 8px; }
    .company1-sec2 .content .item ul li{ font-size: 16px;}
}
@media screen and (max-width: 650px) {
    .company1-sec2 .content{ margin-top: 20px;}
    .company1-sec2 .content .item:last-child{ border-bottom: none; }
    .company1-sec2 .content .item h4{ font-size: 16px; margin-bottom: 5px; }
    .company1-sec2 .content .item ul{ gap: 5px; }
    .company1-sec2 .content .item ul li{ font-size: 14px; }
}
/*company1-sec3*/
.company1-sec3 .desc{margin: 30px 0; font-size: 20px;}
.company1-sec3 .cards{display: flex; justify-content: space-between; gap: 24px;}
.company1-sec3 .cards .card{ flex: 1; border-radius: 5px; overflow: hidden; background: #F5F5F5; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15);}
.company1-sec3 .cards .card .img-box{width: 100%; height: 230px;}
.company1-sec3 .cards .card .img-box img{width: 100%; height: 100%; object-fit: cover;}
.company1-sec3 .cards .card .text{padding: 20px;}
.company1-sec3 .cards .card .text h5{font-size: 20px; font-weight: 600;}
.company1-sec3 .cards .card .text p{font-size: 18px;}
.company1-sec3 .cards .card .text p.t1{margin: 30px 0 20px 0;}
@media screen and (max-width: 1250px) {
    .company1-sec3 .desc{ margin: 24px 0; font-size: 18px; }
    .company1-sec3 .cards{ gap: 16px; }
    .company1-sec3 .cards .card .img-box{ height: 200px; }
    .company1-sec3 .cards .card .text{ padding: 16px; }
    .company1-sec3 .cards .card .text h5{ font-size: 18px; }
    .company1-sec3 .cards .card .text p{ font-size: 16px; }
    .company1-sec3 .cards .card .text p.t1{ margin: 20px 0 15px 0; }
}
@media screen and (max-width: 960px) {
    .company1-sec3 .desc{ margin: 20px 0; font-size: 16px; }
    .company1-sec3 .desc br{ display: none; }
    .company1-sec3 .cards .card .text{ padding: 14px; flex: 1; }
    .company1-sec3 .cards .card .text h5{ font-size: 17px; }
    .company1-sec3 .cards .card .text p{ font-size: 15px; line-height: 155%; }
    .company1-sec3 .cards .card .text p.t1{ margin: 15px 0 10px 0; }
}
@media screen and (max-width: 800px) {
    .company1-sec3 .cards{ flex-direction: column;}
    .company1-sec3 .cards .card{ width: 100%; height: 100%; display: flex;}
    .company1-sec3 .cards .card .img-box{ width: 40%; height: auto;}
}
@media screen and (max-width: 650px) {
    .company1-sec3 .desc{ margin: 14px 0 18px 0; font-size: 15px; line-height: 155%; }
    .company1-sec3 .cards .card .text{ padding: 12px; }
    .company1-sec3 .cards .card .text h5{ font-size: 16px; }
    .company1-sec3 .cards .card .text p{ font-size: 14px; line-height: 150%; }
    .company1-sec3 .cards .card .text p.t1{ margin: 10px 0 5px 0; }
}
@media screen and (max-width: 500px) {
    .company1-sec3 .cards .card{ flex-direction: column;}
    .company1-sec3 .cards .card .img-box{ width: 100%; height: 40%;}
}
/* ###########################company-2.html############################## */
.company2-sec1 .inner{width: 996px; position: relative;}
.company2-sec1 .company2-sec1-bg{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.company2-sec1 .table{display: flex; justify-content: space-between; gap: 78px}
.company2-sec1 .table .right{flex: 1}
.company2-sec1 .table .right img{width: 100%;}
.company2-sec1 .table .left div{border-radius: 5px; width: 200px; height: 50px; display: flex; justify-content: space-between; align-items: center; background: #F5F5F5; padding: 0 20px;}   
.company2-sec1 .table .left .main{font-size: 18px; font-weight: 600; margin-bottom: 20px; background: #F5F5F5; justify-content: center;}
.company2-sec1 .table .left .sub{margin-bottom: 10px; border: 1px solid #DDD; background-color: #fff;}
.company2-sec1 .table .left .sub span{font-size: 16px; font-weight: 500;}
.company2-sec1 .total{margin-top: 80px; height: 60px; width: 100%; display: flex; justify-content: center; align-items: center; font-size: 20px; font-weight: 600; color: var(--main-color); border-radius: 5px; border: 1px solid #C0202E; background: rgba(192, 32, 46, 0.10);;}
@media screen and (max-width: 1250px) {
    .company2-sec1 .inner{ width: 100%; max-width: 996px; padding: 0 20px; }
    .company2-sec1 .company2-sec1-bg{ width: 90%; opacity: 0.5; }
    .company2-sec1 .company2-sec1-bg img{ width: 100%; }
    .company2-sec1 .table{ gap: 36px; align-items: center; }
    .company2-sec1 .table .left div{ width: 180px; height: 46px; padding: 0 16px; }
    .company2-sec1 .table .left .main{ font-size: 17px; margin-bottom: 16px; }
    .company2-sec1 .table .left .sub span{ font-size: 15px; }
    .company2-sec1 .total{ margin-top: 56px; height: 54px; font-size: 18px; }
}
@media screen and (max-width: 960px) {
    .company2-sec1 .inner{ padding: 0 16px; }
    .company2-sec1 .company2-sec1-bg{ display: none; }
    .company2-sec1 .table{ flex-direction: column; gap: 28px; }
    .company2-sec1 .table .right{ width: 100%; margin: 0 auto; }
    .company2-sec1 .table .left{ width: 100%; margin: 0 auto; }
    .company2-sec1 .table .left div{ width: 100%; }
    .company2-sec1 .table .left .main{font-size: 18px; }
    .company2-sec1 .table .left .sub span{ font-size: 16px; }
    .company2-sec1 .total{ margin-top: 30px; height: 50px; font-size: 16px; }
}
@media screen and (max-width: 650px) {
    .company2-sec1 .inner{ padding: 0 10px; }
    .company2-sec1 .table{ gap: 20px; }
    .company2-sec1 .table .left div{ height: 40px; padding: 0 12px;}
    .company2-sec1 .table .left .main{font-size: 16px;}
    .company2-sec1 .table .left .sub span{ font-size: 15px; }
    .company2-sec1 .total{ margin-top: 20px; height: 40px; font-size: 15px; }
}
/* ###########################company-3.html############################## */
.company3-sec1{padding: 50px 0;}
.company3-sec1 .tabs{margin: 50px 0; display: flex; gap: 30px; align-items: center;}
.company3-sec1 .tabs .tab{font-size: 18px; font-weight: 500; color: #8B939B;  border-radius: 5px; cursor: pointer;}
.company3-sec1 .tabs .tab.active{padding: 8px 20px; background-color: var(--black-color); color: #fff;}
.company3-sec1 .content{display: grid; grid-template-columns: repeat(4, 1fr); row-gap: 50px; column-gap: 24px;}
.company3-sec1 .content div input{margin-bottom: 20px;}
.company3-sec1 .content .item .img-box{border-radius: 10px; border: 1px solid #ddd; width: 100%;aspect-ratio: 210 / 297; height: auto; background-repeat: no-repeat; background-position: center; background-size: cover;}
.company3-sec1 .content .item .text{ margin-top: 20px; }
.company3-sec1 .content .item .text .label{font-size: 18px; color: #F79520;}
.company3-sec1 .content .item .text .title{font-size: 22px; font-weight: 600; color: #171819; margin-top: 5px; overflow: hidden;  text-overflow: ellipsis; display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}  
@media screen and (max-width: 1250px) {
    .company3-sec1{ padding: 40px 0; }
    .company3-sec1 .tabs{ margin: 36px 0; gap: 20px; flex-wrap: wrap; }
    .company3-sec1 .tabs .tab{ font-size: 17px; }
    .company3-sec1 .tabs .tab.active{ padding: 7px 16px; }
    .company3-sec1 .content{ grid-template-columns: repeat(4, 1fr); row-gap: 40px; column-gap: 24px; }
    .company3-sec1 .content .item .text .label{ font-size: 18px; }
    .company3-sec1 .content .item .text .title{ font-size: 20px; }
}
@media screen and (max-width: 950px) {
    .company3-sec1{ padding: 32px 0; }
    .company3-sec1 .tabs{ margin: 28px 0;}
    .company3-sec1 .tabs .tab{ font-size: 16px; }
    .company3-sec1 .tabs .tab.active{ padding: 6px 14px; }
    .company3-sec1 .content{ grid-template-columns: repeat(3, 1fr); row-gap: 30px; column-gap: 16px; }
    .company3-sec1 .content .item .text{ margin-top: 16px; }
    .company3-sec1 .content .item .text .label{ font-size: 16px; }
    .company3-sec1 .content .item .text .title{ font-size: 18px; }
}
@media screen and (max-width: 650px) {
    .company3-sec1{ padding: 24px 0; }
    .company3-sec1 .tabs{ margin: 22px 0; gap:20px; }
    .company3-sec1 .tabs .tab{ font-size: 14px;}
    .company3-sec1 .tabs .tab.active{ padding: 6px 12px; }
    .company3-sec1 .content{ grid-template-columns: repeat(2, 1fr); row-gap: 20px; column-gap: 10px; }
    .company3-sec1 .content .item .text .label{ font-size: 14px; }
    .company3-sec1 .content .item .text .title{ font-size: 16px; }
}
/* ###########################factory-1.html############################## */
/*.factory1-sec1*/
.factory1-sec1 .img-box{margin: 50px 0; aspect-ratio: 8 / 3; height: auto; border-radius: 5px; overflow: hidden;}
.factory1-sec1 .img-box img{width: 100%; height: 100%; object-fit: cover;}
.factory1-sec1 .text-box{display: flex; justify-content: space-between;}
.factory1-sec1 .text-box .left{font-size: 20px; flex: 1; line-height: 150%;}
.factory1-sec1 .text-box .right{display: flex; flex-direction: column; gap: 8px; }
.factory1-sec1 .text-box .right p img{display: inline-block; margin-right: 10px; width: 24px; height: auto;}
.factory1-sec1 .text-box .right p span{font-size: 20px; font-weight: 600;}
.factory1-sec1 .text-box .right p{font-size: 20px}
@media screen and (max-width: 1250px) {
    .factory1-sec1 .img-box{margin: 40px 0;}
    .factory1-sec1 .text-box .left{font-size: 18px;}
    .factory1-sec1 .text-box .right{gap: 4px;}
    .factory1-sec1 .text-box .right p,
    .factory1-sec1 .text-box .right p span{font-size: 18px;}
}
@media screen and (max-width: 960px) {
    .factory1-sec1 .text-box{flex-direction: column; gap: 30px;}
    .factory1-sec1 .text-box .right{ width: 100%;}
}
@media screen and (max-width: 650px) {
    .factory1-sec1 .img-box{margin: 28px 0; aspect-ratio: 16 / 9;}
    .factory1-sec1 .text-box {gap: 20px;}
    .factory1-sec1 .text-box .left{font-size: 16px;}
    .factory1-sec1 .text-box .right{gap: 6px;}
    .factory1-sec1 .text-box .right p,
    .factory1-sec1 .text-box .right p span{font-size: 16px;}
    .factory1-sec1 .text-box .right p img{margin-right: 8px; width: 20px;}
}
/*factory1-sec2*/
.factory1-sec2{background: url('../img/factory/factory1-sec2-bg.jpg') no-repeat center center / cover;}
.factory1-sec2 .title-box h1{color: #fff; text-align: center;}
.factory1-sec2 .content {margin-top: 50px;}
.factory1-sec2 .content .items{display: flex; justify-content: space-between; gap: 24px;}
.factory1-sec2 .content .items .item{flex: 1;}
.factory1-sec2 .content .items .item .img-box{border-radius: 5px; aspect-ratio: 4 / 3; height: auto; overflow: hidden;}
.factory1-sec2 .content .items .item .img-box img{width: 100%; height: 100%; object-fit: cover;}
.factory1-sec2 .content .items .item .text-box .title{padding: 30px 0; border-bottom: 1px solid #fff; margin-bottom: 30px;}
.factory1-sec2 .content .items .item .text-box .title h3{font-size: 24px; font-weight: 600; color: #fff; margin-bottom: 10px;}
.factory1-sec2 .content .items .item .text-box .title p{font-size: 20px; font-weight: 500; color: #fff;}
.factory1-sec2 .content .items .item .text-box .desc p, 
.factory1-sec2 .content .items .item .text-box .desc ul li{font-size: 20px; font-weight: 500; color: #fff;}
.factory1-sec2 .content .items .item .text-box .desc ul li{list-style: disc; margin: 10px 0 10px 20px;}
@media screen and (max-width: 1250px) {
    .factory1-sec2 .content{margin-top: 40px;}
    .factory1-sec2 .content .items .item .text-box .title h3{font-size: 22px;}
    .factory1-sec2 .content .items .item .text-box .title p{font-size: 18px;}
    .factory1-sec2 .content .items .item .text-box .desc p,
    .factory1-sec2 .content .items .item .text-box .desc ul li{font-size: 18px;}
}
@media screen and (max-width: 960px) {
    .factory1-sec2 .content{margin-top: 30px;}
    .factory1-sec2 .content .items{flex-direction: column; gap: 40px;}
    .factory1-sec2 .content .items .item{flex: none; display: flex; width: 100%; gap: 24px;}
    .factory1-sec2 .content .items .item .text-box .title{padding: 20px 0; margin-bottom: 20px;}
    .factory1-sec2 .content .items .item .text-box .title h3{font-size: 20px;}
    .factory1-sec2 .content .items .item .img-box{aspect-ratio: 16 / 9; flex: 1;}
    .factory1-sec2 .content .items .item .text-box{flex: 1.5;}
    .factory1-sec2 .content .items .item .text-box .desc ul li{margin: 5px 0 5px 10px;}
}

@media screen and (max-width: 650px) {
    .factory1-sec2 .content{margin-top: 20px;}
    .factory1-sec2 .content .items{gap: 20px;}
    .factory1-sec2 .content .items .item{display: block;}
    .factory1-sec2 .content .items .item .text-box .title h3{font-size: 18px;}
    .factory1-sec2 .content .items .item .text-box .title p{font-size: 16px;}
    .factory1-sec2 .content .items .item .text-box .desc p,
    .factory1-sec2 .content .items .item .text-box .desc ul li{font-size: 16px;}
}
/*factory-table*/
.factory-table .content h2{font-size: 32px; font-weight: 600; margin: 50px 0 30px 0;}
.factory-table .content .table{display: flex; justify-content: space-between; gap: 24px; align-items: flex-start;}
.factory-table .content .table .left{flex: 3;}
.factory-table .content .table .left img{width: 100%; height: 100%; object-fit: contain;}
.factory-table .content .table .right{flex: 1; padding: 20px; border-radius: 5px; background: #F9F9F9; box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.20);}
.factory-table .content .table .right div{display: flex; flex-direction: column; gap: 5px;}
.factory-table .content .table .right div p{font-size: 20px; font-weight: 400;}
.factory-table .content .table .right div p img{display: inline-block; margin-right: 10px; width: 24px; height: auto;}
.factory-table .content .table .right div p span{font-size: 20px; font-weight: 600;}
.factory-table .content .table .right > div:nth-of-type(2){margin-top: 30px;}
@media screen and (max-width: 1250px) {
    .factory-table .content h2{font-size: 28px; margin: 40px 0 20px;}
    .factory-table .content .table .right{padding: 18px;}
    .factory-table .content .table .right div p,
    .factory-table .content .table .right div p span{font-size: 18px;}
    .factory-table .content .table .right > div:nth-of-type(2){margin-top: 24px;}
}
@media screen and (max-width: 960px) {
    .factory-table .content h2{font-size: 24px; margin: 30px 0 10px;}
    .factory-table .content .table{flex-direction: column; gap: 16px;}
    .factory-table .content .table .left,
    .factory-table .content .table .right{width: 100%;}
    .factory-table .content .table .right > div:nth-of-type(2){margin-top: 20px;}
}
@media screen and (max-width: 650px) {
    .factory-table .content .table .right div p,
    .factory-table .content .table .right div p span{font-size: 15px;}
    .factory-table .content .table .right div p img{width: 20px; margin-right: 8px;}
    .factory-table .content .table .right > div:nth-of-type(2){margin-top: 15px;}
}
/*factory-images*/
.factory-images{padding-top: 0;}
.factory-images .inner{padding-bottom: 50px;}
.factory-images .image-slider{width: 100vw; overflow: hidden;}
.factory-images .mySwiper .swiper-wrapper{transition-timing-function: linear;}
.factory-images .swiper-slide{width: 380px !important; height: 280px; flex-shrink: 0;}
.factory-images .swiper-slide img{width: 100%; height: 100%; object-fit: cover; border-radius: 5px;}
@media screen and (max-width: 1250px) {
    .factory-images .inner{padding-bottom: 40px;}
    .factory-images .swiper-slide{width: 320px !important; height: 236px;}
}
@media screen and (max-width: 960px) {
    .factory-images .inner{padding-bottom: 30px;}
    .factory-images .title-box p br{display: none;}
    .factory-images .swiper-slide{width: 280px !important; height: 206px;}
}
@media screen and (max-width: 650px) {
    .factory-images .inner{padding-bottom: 20px;}
    .factory-images .swiper-slide{width: 220px !important; height: 162px;}
}
.factory3.factory-table{padding-top: 0;}
.factory3.factory-table .content .table .right div p:nth-of-type(1){display: flex; align-items: center;}
.factory3.factory-table .content .table .right div p img{display: inline-block; margin-right: 10px; width: 32px; height: auto;}
@media screen and (max-width: 1250px) {.factory3.factory-table .content .table .right div p img{width: 20px; margin-right: 8px;}}
/*########################product-1.html################################*/
/*product1-banner*/
.product1-banner .text-box h2{font-size: 38px; font-weight: 600; text-align: center;}
.product1-banner .text-box p{font-size: 20px; text-align: center; margin-top: 20px; color: #555;}
/*product1-sec1*/
.product1-sec1{position: relative; padding: 100px 0; }
.product1-sec1::before{content: ' '; position: absolute; top: 0; left: 0; width: 100%; height: 500px; border-radius: 50px; background: url('../img/product/product1-sec1-img1.jpg') no-repeat center center / cover; z-index: -1;}
.product1-sec2.product1-sec1::before{content: ' '; position: absolute; top: 0; left: 0; width: 100%; height: 500px; border-radius: 50px; background: url('../img/product/product1-sec2-img1.jpg') no-repeat center center / cover; z-index: -1;}
.product1-sec3.product1-sec1::before{content: ' '; position: absolute; top: 0; left: 0; width: 100%; height: 500px; border-radius: 50px; background: url('../img/product/product1-sec3-img1.jpg') no-repeat center center / cover; z-index: -1;}
.product1-sec1 .title-box h1,
.product1-sec1 .title-box p{color: #fff;}
.product1-sec1 .img-box{width: 100%; height: 40%; max-height: 500px; margin: 50px 0;}
.product1-sec1 .img-box img{width: 100%; height: 100%; object-fit: cover; border-radius: 5px;}
.product1-sec1 .table-box h2{font-size: 32px; font-weight: 500; margin-bottom: 50px;}
.product1-sec1 .table-box .table{width: 50%;}
.product1-sec1 .table-box .table img{width: 100%; height: 100%; object-fit: contain;}
@media screen and (max-width: 1250px) {
    .product1-banner .text-box h2{font-size: 32px;}
    .product1-sec1{padding: 80px 0;}
    .product1-sec1 .img-box{margin: 40px 0;}
    .product1-sec1 .table-box h2{font-size: 28px; margin-bottom: 40px;}
    .product1-sec1 .table-box .table{width: 60%; max-width: 600px;}
}
@media screen and (max-width: 960px) {
    .product1-banner .text-box h2{font-size: 26px;}
    .product1-banner .text-box p{font-size: 18px;}
    .product1-sec1{padding: 60px 0;}
    .product1-sec1::before, .product1-sec2.product1-sec1::before, .product1-sec3.product1-sec1::before{border-radius: 30px; height: 400px;}
    .product1-sec1 .img-box{margin: 30px 0; aspect-ratio: 16 / 9;}
    .product1-sec1 .table-box h2{font-size: 24px; margin-bottom: 30px;}
}
@media screen and (max-width: 650px) {
    .product1-banner .text-box h2{font-size: 22px;}
    .product1-banner .text-box p{font-size: 16px;}
    .product1-banner .text-box h2 br, .product1-banner .text-box p br{display: none;}
    .product1-sec1{padding: 40px 0;}
    .product1-sec1 .img-box{margin: 20px 0;}
    .product1-sec1 .table-box h2{font-size: 20px; margin-bottom: 20px;}
    .product1-sec1 .table-box .table{width: 100%; max-width: none;}
}
/*product1-sec2*/
.product1-sec2.product1-sec1{position: relative;}
.product1-sec2 .cards{display: flex; justify-content: space-between; gap: 24px;}
.product1-sec2 .card{flex: 1;}
.product1-sec2 .card .img-box{width: 100%; height: 470px;}
.product1-sec2 .card .img-box img{width: 100%; height: 100%; object-fit: cover; border-radius: 5px;}
.product1-sec2 .card .text-box h2{font-size: 32px; font-weight: 600; margin-bottom: 20px;}
.product1-sec2 .card .text-box p{font-size: 20px; color: #555;}
@media screen and (max-width: 1250px) {
    .product1-sec2 .card .img-box{height: 380px;}
    .product1-sec2 .card .text-box h2{font-size: 28px; margin-bottom: 14px;}
    .product1-sec2 .card .text-box p{font-size: 18px;}
}
@media screen and (max-width: 960px) {
    .product1-sec2 .cards{flex-wrap: wrap; gap: 12px;}
    .product1-sec2 .card{flex: 0 0 calc((100% - 16px) / 2);}
    .product1-sec2 .card .img-box{height: auto; aspect-ratio: 4 / 3;}
    .product1-sec2 .card .text-box h2{font-size: 24px; margin-bottom: 10px;}
    .product1-sec2 .card .text-box p{font-size: 16px;}
}
@media screen and (max-width: 650px) {
    .product1-sec2 .card .text-box h2{font-size: 20px; margin-bottom: 8px;}
    .product1-sec2 .card .text-box p{font-size: 15px;}
}
@media screen and (max-width: 500px) {
    .product1-sec2 .cards{display: block;}
    .product1-sec2 .card + .card{margin-top: 22px;}
    .product1-sec2 .card .img-box{aspect-ratio: 16 / 11;}
}
/*product1-sec3*/
.product1-sec3 .content > div{border-bottom: 1px solid #ddd; padding-bottom: 30px; margin-bottom: 30px;}
.product1-sec3 .content > div:last-child{border-bottom: none;}
.product1-sec3 .content > div h2{font-size: 32px; font-weight: 500; margin-bottom: 20px;}
.product1-sec3 .content > div p{font-size: 20px; color: #555;}
.product1-sec3 .content > div:last-child{display: flex; gap: 80px;}
.product1-sec3 .content .info{display: flex; gap: 50px;}
.product1-sec3 .content .info h4{font-size: 24px; font-weight: 500;}
.product1-sec3 .content .info ul li{font-size: 20px; color: #555; list-style: disc; margin-bottom: 10px;}
@media screen and (max-width: 1250px) {
    .product1-sec3 .content > div{padding-bottom: 20px; margin-bottom: 20px;}
    .product1-sec3 .content > div h2{font-size: 28px; margin-bottom: 14px;}
    .product1-sec3 .content > div p{font-size: 18px;}
    .product1-sec3 .content > div:last-child{gap: 40px;}
    .product1-sec3 .content .info{gap: 28px;}
    .product1-sec3 .content .info h4{font-size: 22px;}
    .product1-sec3 .content .info ul li{font-size: 18px;}
}
@media screen and (max-width: 960px) {
    .product1-sec3 .content > div h2{font-size: 24px; margin-bottom: 10px;}
    .product1-sec3 .content > div p{font-size: 16px;}
    .product1-sec3 .content .info h4{font-size: 20px;}
    .product1-sec3 .content .info ul li{font-size: 16px; margin-bottom: 6px;}
}
@media screen and (max-width: 650px) {
    .product1-sec3 .content > div{padding-bottom: 10px; margin-bottom: 10px;}
    .product1-sec3 .content > div h2{font-size: 20px; margin-bottom: 8px;}
    .product1-sec3 .content > div p{font-size: 15px;}
    .product1-sec3 .content > div:last-child{gap: 10px; flex-direction: column;}
    .product1-sec3 .content .info{ gap: 10px;}
    .product1-sec3 .content .info h4{font-size: 18px; width: 80px;}
    .product1-sec3 .content .info ul{padding-left: 16px;}
    .product1-sec3 .content .info ul li{font-size: 15px;}
}
/*########################product-2.html################################*/
/*product2-sec1*/
.product2-sec1{padding: 100px 0;}
.product2-sec1 .content{display: flex; justify-content: space-between; gap: 24px; margin-top: 50px;}
.product2-sec1 .content .img-box{flex: 1; aspect-ratio: 1 / 1;}
.product2-sec1 .content .img-box img{width: 100%; height: 100%; object-fit: cover; border-radius: 5px;}
.product2-sec1 .content .text-box{flex: 1;}
.product2-sec1 .content .text-box h2,
.product2-sec2 .text-box h2{font-size: 32px; font-weight: 700; margin-bottom: 20px;}
.product2-sec1 .content .text-box p{font-size: 18px; line-height: 160%;}
.product2-sec1 .content .text-box p b{color: var(--main-color); font-weight: normal; font-size: 18px;}
.product2-sec1 .content .text-box p.t1{margin-bottom: 20px;}
/*product2-sec2*/
.product2-sec2{padding: 0px 0px 150px 0px;}
.product2-sec2 .inner{display: flex; justify-content: space-between; gap: 24px;}
.product2-sec2 .text-box{flex: 1;}
.product2-sec2 .map-box{flex: 2;}
.product2-sec2 .text-box h2{border-bottom: 4px solid #ddd; margin-bottom: 30px; padding-bottom: 30px;}
.product2-sec2 .info div{margin-bottom: 20px;}
.product2-sec2 .info div span:first-child{font-size: 18px; color: #777; margin-bottom: 5px;}
.product2-sec2 .info div span:last-child{font-size: 18px;}
.product2-sec2 .map-box{width: 100%; height: 495px;}
@media screen and (max-width: 1250px) {
    .product2-sec1{padding: 80px 0;}
    .product2-sec1 .content{margin-top: 40px; gap: 20px;}
    .product2-sec1 .content .text-box h2,
    .product2-sec2 .text-box h2{font-size: 28px;}
    .product2-sec2 .inner{gap: 20px;}
    .product2-sec2 .text-box h2{margin-bottom: 24px; padding-bottom: 24px;}
    .product2-sec2 .info div{margin-bottom: 16px;}
    .product2-sec2 .map-box{height: 420px;}
}
@media screen and (max-width: 960px) {
    .product2-sec1{padding: 60px 0;}
    .product2-sec1 .content{margin-top: 30px;}
    .product2-sec1 .content .text-box{flex: 1.2;}
    .product2-sec1 .content .text-box h2{font-size: 24px; margin-bottom: 10px;}
    .product2-sec1 .content .text-box p{font-size: 16px;}
    .product2-sec1 .content .text-box p b{font-size: 16px;}
    .product2-sec1 .content .text-box p br{display: none;}
    .product2-sec2 .inner{flex-direction: column; gap: 24px;}
    .product2-sec2 .text-box,
    .product2-sec2 .map-box{flex: none; width: 100%;}
    .product2-sec2 .text-box h2{font-size: 24px; margin-bottom: 18px; padding-bottom: 18px;}
    .product2-sec2 .info div span:first-child,
    .product2-sec2 .info div span:last-child{font-size: 16px;}
    .product2-sec2 .map-box{height: 340px;}
}
@media screen and (max-width: 650px) {
    .product2-sec1{padding: 40px 0;}
    .product2-sec1 .content{margin-top: 20px; flex-direction: column;}
    .product2-sec1 .content .img-box{flex: none; width: 100%; aspect-ratio: 16 / 9;}
    .product2-sec1 .content .text-box{flex: none; width: 100%;}
    .product2-sec1 .content .text-box h2{font-size: 20px; }
    .product2-sec1 .content .text-box p{font-size: 15px;}
    .product2-sec1 .content .text-box p b{font-size: 15px;}
    .product2-sec2 .inner{gap: 18px;}
    .product2-sec2 .text-box h2{font-size: 20px; margin-bottom: 14px; padding-bottom: 14px;}
    .product2-sec2 .info div{margin-bottom: 10px;}
    .product2-sec2 .map-box{height: 260px;}
}
/*##########################tank.html##############################*/
/*tank-sec1*/
.tank-sec1 .title-box h1{text-align: center; margin-bottom: 40px;}
.tank-sec1 .title-box p{text-align: center; color: #555;}
/*tank-sec2*/
.tank-sec2{padding-top: 0;}
.tank-title span{color: var(--main-color); font-size: 20px; font-weight: 500;}
.tank-title h1{font-size: 48px; font-weight: 700; margin-top: 10px;}
.tank-sec2 .process{margin-top: 40px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; row-gap: 30px; column-gap: 15px;}
.tank-sec2 .process .item{padding: 20px; width: 250px; align-self: stretch; display: flex; flex-wrap: wrap; justify-content: center; background: #F9F9F9; border-radius: 5px; filter: drop-shadow(2px 2px 4px rgba(0, 0, 0, 0.25));}
.tank-sec2 .process .item .img-box{width: 100px; height: 100px; margin: 0 auto;}
.tank-sec2 .process .item .img-box img{width: 100%; height: 100%; object-fit: contain;}
.tank-sec2 .process .item .text-box{margin-top: 15px; text-align: center;}
.tank-sec2 .process .item .text-box h5{font-size: 28px; font-weight: 700; text-align: center;}
.tank-sec2 .process .item .text-box h5 b{font-size: 20px; font-weight: 700; display: block;}
.tank-sec2 .process .item .text-box p{font-size: 20px; color: #555; text-align: center;}
.tank-sec2 .process .arrow{width:  24px; height: 24px;}
.tank-sec2 .process .arrow img{width: 100%; height: 100%; object-fit: contain;}
.tank-sec2 .process .arrow4{display: none;}
@media screen and (max-width: 1250px) {
    .tank-sec1 .title-box h1{margin-bottom: 30px;}
    .tank-title span{font-size: 18px;}
    .tank-title h1{font-size: 40px;}
    .tank-sec2 .process{margin-top: 32px; row-gap: 22px; column-gap: 15px;}
    .tank-sec2 .process .item{width: calc((100% - 200px) / 4); padding: 18px 14px;}
    /* .tank-sec2 .process .arrow{display: none;} */
    .tank-sec2 .process .item .img-box{width: 80px; height: 80px;}
    .tank-sec2 .process .item .text-box h5{font-size: 22px;}
    .tank-sec2 .process .item .text-box p{font-size: 18px;}
    .tank-sec2 .process .arrow img{width: 26px;}
}
@media screen and (max-width: 960px) {
    .tank-title h1{font-size: 32px;}
    .tank-sec2 .process{margin-top: 24px; column-gap: 15px; justify-content: flex-start;}
    .tank-sec2 .process .item{width: calc((100% - 110px) / 3);}
    .tank-sec2 .process .item .img-box{width: 60px; height: 60px;}
    .tank-sec2 .process .item .text-box h5{font-size: 20px;}
    .tank-sec2 .process .item .text-box p{font-size: 16px;}
    .tank-sec2 .process .item .text-box h5 br{display: none;}
    .tank-sec2 .process .arrow4{display: block;}
    .tank-sec2 .process .arrow3{display: none;}
    .tank-sec2 .process .arrow6{display: none;}
}
@media screen and (max-width: 650px) {
    .tank-sec1 .title-box h1{margin-bottom: 20px;}
    .tank-title span{font-size: 16px;}
    .tank-title h1{font-size: 26px; margin-top: 6px;}
    .tank-sec2 .process{margin-top: 18px; row-gap: 12px; column-gap: 12px;}
    .tank-sec2 .process .item{width: calc((100% - 50px) / 2); padding: 14px 10px;}
    .tank-sec2 .process .item .img-box{width: 40px; height: 40px;}
    .tank-sec2 .process .item .text-box{margin-top: 10px;}
    .tank-sec2 .process .item .text-box h5{font-size: 18px;}
    .tank-sec2 .process .item .text-box h5 b{font-size: 16px;}
    .tank-sec2 .process .item .text-box p{font-size: 15px;}
    .tank-sec2 .process .arrow{width:  20px; height: 20px;}
    .tank-sec2 .process .arrow1,
    .tank-sec2 .process .arrow3,
    .tank-sec2 .process .arrow5,
    .tank-sec2 .process .arrow7{display: block;}
    .tank-sec2 .process .arrow2,
    .tank-sec2 .process .arrow4,
    .tank-sec2 .process .arrow6{display: none;}
}
/*tank-sec3*/
.tank-sec3{padding-top: 0;}
.tank-sec3 .content .content1{margin: 50px 0;}
.tank-sec3 .content h2{font-size: 32px; font-weight: 600; margin-bottom: 30px;}
.tank-sec3 .content .items{display: flex; justify-content: space-between; gap: 24px;}
.tank-sec3 .content .item{flex: 1; height: 200px; position: relative; border-radius: 5px; overflow: hidden;}
.tank-sec3 .content .item span{font-size: 24px; font-weight: 600; color: #fff; position: absolute; bottom: 10px; left: 10px;}
.tank-sec3 .content2 .items{display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px;}
.tank-sec3 .content2 .item{height: 280px;}
@media screen and (max-width: 1250px) {
    .tank-sec3 .content .content1{margin: 40px 0;}
    .tank-sec3 .content h2{font-size: 28px; margin-bottom: 22px;}
    .tank-sec3 .content .items{gap: 16px;}
    .tank-sec3 .content .item{height: 180px;}
    .tank-sec3 .content .item span{font-size: 20px; bottom: 8px; left: 8px;}
    .tank-sec3 .content2 .items{gap: 16px;}
    .tank-sec3 .content2 .item{height: 240px;}
}
@media screen and (max-width: 960px) {
    .tank-sec3 .content .content1{margin: 30px 0;}
    .tank-sec3 .content h2{font-size: 24px; margin-bottom: 20px;}
    .tank-sec3 .content .items{display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px;}
    .tank-sec3 .content .item{height: 160px;}
    .tank-sec3 .content .item span{font-size: 18px;}
    .tank-sec3 .content2 .items{grid-template-columns: repeat(4, 1fr); gap: 15px;}
    .tank-sec3 .content2 .item{height: 200px;}
}
@media screen and (max-width: 650px) {
    .tank-sec3 .content .content1{margin: 20px 0;}
    .tank-sec3 .content h2{font-size: 20px; margin-bottom: 10px;}
    .tank-sec3 .content .items{gap: 10px;}
    .tank-sec3 .content .item{height: 120px;}
    .tank-sec3 .content .item span{font-size: 15px; left: 6px; bottom: 6px;}
    .tank-sec3 .content2 .items{grid-template-columns: repeat(3, 1fr); gap: 10px;}
    .tank-sec3 .content2 .item{height: 130px;}
}
/*tank-sec4*/
.tank-sec4{padding-top: 0;}
.tank-sec4 .content .content1{margin: 50px 0; display: flex;}
.tank-sec4 .content .content1 .left{width: 400px;}
.tank-sec4 .content h2{font-size: 32px; font-weight: 600; margin-bottom: 15px;}
.tank-sec4 .content p{font-size: 20px; color: #555;}
.tank-sec4 .slide-wrap{ width: calc(100vw - ((100vw - 1200px) / 2) - 400px); margin-right: calc((100vw - 1200px) / -2);}
.tank-sec4 .swiper-slide{width: 280px;}
.tank-sec4 .item {width: 100%;}
.tank-sec4 .content .item img{height: 280px; width: 100%; object-fit: cover; border-radius: 5px;}
.tank-sec4 .content .item span{font-size: 24px; font-weight: 600; margin-top: 20px; display: inline-block;}
.swiper-horizontal>.swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{left: unset !important; top: unset !important;}
.swiper-progressbar{width: 800px !important; background-color: #EDEDED !important; height: 7px !important; margin-top: 50px !important; border-radius: 5px !important;}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background-color: var(--main-color) !important;}
/*tank-sec4-content2*/
.tank-sec4 .content .content2{display: flex; margin-top: 100px;}
.tank-sec4 .content .content2 .left{width: 400px;}
.tank-sec4 .content .content2 .right{display: flex; gap: 24px; width: calc(100vw - ((100vw - 1200px) / 2) - 400px); margin-right: calc((100vw - 1200px) / -2);}
.tank-sec4 .content .content2 .item{width: 220px; aspect-ratio: 7 / 9; border-radius: 5px; overflow: hidden;}
.tank-sec4 .content .content2 .item img{height: 100%; width: 100%; object-fit: cover;}
@media screen and (max-width: 1250px) {
    .tank-sec4 .content .content1{margin: 40px 0; }
    .tank-sec4 .content .content1{flex-direction: column; gap: 20px;}
    .tank-sec4 .content .content1 .left{width: 100%;}
    .tank-sec4 .content h2{font-size: 28px;}
    .tank-sec4 .content p{font-size: 18px;}
    .tank-sec4 .slide-wrap{width: 100% !important; margin-right: 0 !important;}
    .tank-sec4 .swiper-slide{width: 240px;}
    .tank-sec4 .content .item img{height: 240px;}
    .tank-sec4 .content .item span{font-size: 20px;}
    .swiper-progressbar{width: calc(100vw - 40px) !important;}
    .tank-sec4 .content .content2{flex-direction: column; gap: 20px;}
    .tank-sec4 .content .content2 .left{width: 100%;}
    .tank-sec4 .content .content2 .right{width: 100%; margin-right: 0;}
    .tank-sec4 .content .content1 .left p br,
    .tank-sec4 .content .content2 .left p br{display: none;}
}
@media screen and (max-width: 960px) {
    .tank-sec4 .content .content1{margin: 30px 0; }
    .tank-sec4 .content h2{font-size: 24px; margin-bottom: 10px;}
    .tank-sec4 .content p{font-size: 16px;}
    .tank-sec4 .swiper-slide{width: 200px;}
    .tank-sec4 .content .item img{height: 200px;}
    .tank-sec4 .content .item span{font-size: 18px;}
    .tank-sec4 .swiper-slide{width: 200px;}
    .tank-sec4 .content .content2 .right{gap: 12px; flex-wrap: wrap;}
    .tank-sec4 .content .content2 .item{flex: 1;}
}
@media screen and (max-width: 650px) {
    .tank-sec4 .content .content1{margin: 20px 0; }
    .tank-sec4 .content h2{font-size: 20px;}
    .tank-sec4 .content p{font-size: 15px;}
    .tank-sec4 .content .item img{height: 180px;}
    .tank-sec4 .content .item span{font-size: 16px;}
}
@media screen and (max-width: 480px){
    .tank-sec4 .content .content2 .item{width: calc((100% - 12px) / 2); flex: none;}
}
/*###########################location.html##############################*/
.location-sec1 .inner h1{font-size: 38px; font-weight: 600; line-height: 1.35;}
.location-sec1 .inner .content{margin-top: 50px; padding-top: 30px; border-top: 4px solid #ddd;}
.location-sec1 .inner .content .info{display: flex; gap: 60px; flex-wrap: wrap;}
.location-sec1 .inner .content .info .info-list span{font-size: 18px; color: #777;}
.location-sec1 .inner .content .info .info-list p{font-size: 18px; margin-top: 5px;}
.location-sec1 .inner .content .map{height: 500px; width: 100%; margin-top: 50px; overflow: hidden;}
.location-sec1 .inner .content .map iframe{display: block; width: 100%; height: 100%; border: 0;}
@media screen and (max-width: 1250px) {
    .location-sec1 .inner h1{font-size: 32px;}
    .location-sec1 .inner .content{margin-top: 40px; padding-top:30px;}
    .location-sec1 .inner .content .info{gap: 40px;}
    .location-sec1 .inner .content .map{height: 420px; margin-top: 40px;}
}
@media screen and (max-width: 960px) {
    .location-sec1 .inner h1{font-size: 26px;}
    .location-sec1 .inner .content{margin-top: 30px; padding-top: 20px; border-top-width: 3px;}
    .location-sec1 .inner .content .info{flex-direction: column; gap: 20px;}
    .location-sec1 .inner .content .info .info-list span,
    .location-sec1 .inner .content .info .info-list p{font-size: 16px;}
    .location-sec1 .inner .content .map{height: 360px; margin-top: 32px;}
}
@media screen and (max-width: 650px) {
    .location-sec1 .inner h1{font-size: 22px;}
    .location-sec1 .inner h1 br{display: none;}
    .location-sec1 .inner .content{border-top-width: 2px;}
    .location-sec1 .inner .content .info{gap: 16px;}
    .location-sec1 .inner .content .info .info-list span,
    .location-sec1 .inner .content .info .info-list p{font-size: 15px;}
    .location-sec1 .inner .content .map{height: min(280px, 62vw); margin-top: 20px;}
}
/*##########################notice.html##############################*/
.notice1-sec1 .inner h1{font-size: 38px; font-weight: 600; margin-bottom: 50px; text-align: center;}
.notice1-sec1 .inner h1 br{display: none;}
.notice1-sec1 .inner .content{margin-top: 50px;}
.notice1-sec1 .inner .content div input{margin-bottom: 20px;}
.notice1-sec1 .inner .content .item{display: flex; gap: 24px; padding-bottom: 50px; margin-bottom: 50px; border-bottom: 1px solid #ddd; min-width: 0; align-items: flex-start;}
.notice1-sec1 .inner .content div:last-child .item{border-bottom: none;}
.notice1-sec1 .inner .content .item .img-box{flex: 1; min-width: 0; border-radius: 5px; overflow: hidden; aspect-ratio: 16 / 9; height: auto; min-height: 0;}
.notice1-sec1 .inner .content .item .text-box{flex: 2; min-width: 0;}
.notice1-sec1 .inner .content .item .text-box .date{font-size: 16px; color: var(--main-color);}
.notice1-sec1 .inner .content .item .text-box h4{font-size: 20px; font-weight: 500; margin: 20px 0;}
.notice1-sec1 .inner .content .item .text-box p{font-size: 16px; color: #555;}
@media screen and (max-width: 1250px) {
    .notice1-sec1 .inner h1{font-size: 32px; margin-bottom: 40px;}
    .notice1-sec1 .inner .content{margin-top: 40px;}
    .notice1-sec1 .inner .content .item{gap: 20px; padding-bottom: 40px; margin-bottom: 40px;}
    .notice1-sec1 .inner .content .item .text-box h4{font-size: 19px; margin: 15px 0;}
    .notice1-sec1 .inner .content .item .text-box p{font-size: 15px;}
}
@media screen and (max-width: 960px) {
    .notice1-sec1 .inner h1{font-size: 26px; margin-bottom: 32px;}
    .notice1-sec1 .inner .content{margin-top: 30px;}
    .notice1-sec1 .inner .content div input{margin-bottom: 10px;}
    .notice1-sec1 .inner .content .item{gap: 16px; padding-bottom: 32px; margin-bottom: 32px;}
    .notice1-sec1 .inner .content .item .text-box .date{font-size: 15px;}
    .notice1-sec1 .inner .content .item .text-box h4{font-size: 18px; margin: 10px 0px;}
    .notice1-sec1 .inner .content .item .text-box p{font-size: 15px;}
}
@media screen and (max-width: 650px) {
    .notice1-sec1 .inner h1{font-size: 22px; margin-bottom: 20px; padding: 0 4px;}
    .notice1-sec1 .inner h1 br{display: block;}
    .notice1-sec1 .inner .content{margin-top: 20px;}
    .notice1-sec1 .inner .content .item{flex-direction: column;  gap: 12px; padding-bottom: 24px; margin-bottom: 24px;}
    .notice1-sec1 .inner .content .item .img-box{flex: none; width: 100%; max-width: 100%;}
    .notice1-sec1 .inner .content .item .text-box{flex: none; width: 100%;}
    .notice1-sec1 .inner .content .item .text-box .date{font-size: 14px;}
    .notice1-sec1 .inner .content .item .text-box h4{font-size: 16px;}
    .notice1-sec1 .inner .content .item .text-box p{font-size: 14px;}
}
/*##########################notice-2.html##############################*/
.notice2-sec1 .inner h1{font-size: 38px; font-weight: 600; margin-bottom: 50px; text-align: center; line-height: 1.35;}
.notice2-sec1 .inner .video{width: 100%; aspect-ratio: 16 / 7; margin: 50px 0; border-radius: 5px; overflow: hidden; background: #111;}
.notice2-sec1 .inner .video video{display: block; width: 100%; height: 100%; object-fit: cover;}
.notice2-sec1 .inner p{font-size: 20px; color: #555; text-align: center; line-height: 160%;}
@media screen and (max-width: 1250px) {
    .notice2-sec1 .inner h1{font-size: 32px; margin-bottom: 40px;}
    .notice2-sec1 .inner .video{margin: 40px 0;}
    .notice2-sec1 .inner p{font-size: 18px;}
}
@media screen and (max-width: 960px) {
    .notice2-sec1 .inner h1{font-size: 26px; margin-bottom: 30px;}
    .notice2-sec1 .inner .video{aspect-ratio: 16 / 9; margin: 30px 0;}
    .notice2-sec1 .inner p{font-size: 16px;}
}
@media screen and (max-width: 650px) {
    .notice2-sec1 .inner h1{font-size: 22px; margin-bottom: 20px;}
    .notice2-sec1 .inner .video{margin: 24px 0; border-radius: 4px;}
    .notice2-sec1 .inner p{font-size: 15px; line-height: 150%; }
    .notice2-sec1 .inner p br{display: none;}
}