/* nav */
.nav-bottom-line {
 --bs-nav-bottom-line-gap: 2rem;
 --bs-nav-bottom-line-font-size: 1.6rem;
 --bs-nav-bottom-line-width: 3rem;
 --bs-nav-bottom-line-height: 0.125rem;
 --bs-nav-bottom-line-link-active-color: var(--bs-emphasis-color);
 gap: var(--bs-nav-bottom-line-gap);
}
.nav-bottom-line .nav-link {
 position: relative;
 padding: 0 0 1rem 0;
 font-size: var(--bs-nav-bottom-line-font-size, --bs-nav-link-font-size, 16px);
}
.nav-bottom-line .nav-link::after {
 content: "";
 position: absolute;
 bottom: 0;
 left: 50%;
 transform: translateX(-50%);
 height: var(--bs-nav-bottom-line-height, 4px);
 width: var(--bs-nav-bottom-line-width, 30px);
 background-color: transparent;
}
.nav-bottom-line .nav-link:hover::after,
.nav-bottom-line .nav-link:focus::after {
 background-color: currentcolor;
}
.nav-bottom-line .nav-link.active,
.nav-bottom-line .show > .nav-link {
 font-weight: 700;
 color: var(--bs-nav-bottom-line-link-active-color);
}
.nav-bottom-line .nav-link.active::after,
.nav-bottom-line .show > .nav-link::after {
 background-color: currentcolor;
}
.nav-pills-no-radius .nav-link {
 border-radius: 0;
 padding: 12px 40px;
}
.nav-pills-no-radius .nav-link.active,
.nav-pills-no-radius .show > .nav-link {
 color: #fff;
 background-color: var(--main-color);
}
.nav-tabs-square .nav-link {
 border-radius: 0;
 padding: 12px 40px;
 background-color: #eee;
}
.nav-tabs-square .nav-link.active,
.nav-tabs-square .show > .nav-link {
 color: #fff;
 background-color: var(--main-color);
}
@media (max-width:992px) {
    .nav-tabs-square .nav-link {
        padding: 6px 20px;margin:2px;
    }
}
.nav-square .nav-link {
 border-radius: 0;
 padding: 12px 30px;
 margin: 0 12px;
 background-color: #fff;
 border:2px solid #eee;
 color:#333;
}
.nav-square .nav-link.active,
.nav-square .nav-link:hover,
.nav-square .show > .nav-link {
 color: #fff;
 background-color: var(--main-color);
}
@media (max-width:992px) {
    .nav-square .nav-link {
        padding: 6px 20px;margin:2px;font-size: 12px;
    }
}
/* ratio */
.ratio img { object-fit: cover; display: block; }
.ratio-3x4 { --bs-aspect-ratio: 133.3%; }
.ratio-2x3 { --bs-aspect-ratio: 150%; }
.img-cover { width: 100%; height: 100%; object-fit: cover; display: block; }

/* bg */
.bg-cover { background-position: center center; background-repeat: no-repeat; background-size: cover; }
.bg-line1{ background: repeating-linear-gradient(45deg,#fff, #fff 20px, #f3f3f3 21px); }
.bg-line2{ background: repeating-linear-gradient(-45deg,#fff, #fff 12px, #f2f2f2 13px); }
.bg-line3{ background: repeating-linear-gradient(45deg,transparent, transparent 40px,#eee 42px), repeating-linear-gradient(-45deg, transparent, transparent 40px,#eee 42px); }

/* width */
.w-10-px{ width: 10px; }
.w-20-px{ width: 20px; }
.w-30-px{ width: 30px; }
.w-40-px{ width: 40px; }
.w-50-px{ width: 50px; }
.w-60-px{ width: 60px; }
.w-70-px{ width: 70px; }
.w-80-px{ width: 80px; }
.w-90-px{ width: 90px; }
.w-100-px{ width: 100px; }
.w-110-px{ width: 110px; }
.w-120-px{ width: 120px; }
.w-130-px{ width: 130px; }
.w-140-px{ width: 140px; }
.w-150-px{ width: 150px; }
.w-160-px{ width: 160px; }
.w-170-px{ width: 170px; }
.w-180-px{ width: 180px; }
.w-190-px{ width: 190px; }
.w-200-px{ width: 200px; }
.w-210-px{ width: 210px; }
.w-220-px{ width: 220px; }
.w-230-px{ width: 230px; }
.w-240-px{ width: 240px; }
.w-250-px{ width: 250px; }
.w-260-px{ width: 260px; }
.w-270-px{ width: 270px; }

/* linear */

.bg-linear {
 background-image: linear-gradient(225deg, #2b2b2b, #333);
 color: #fff;
 padding: 12px;
 text-align: center;
}

.btn-linear {
 background-image: linear-gradient(225deg, #54abee, #18316f);
 --bs-btn-color: #fff;
 --bs-btn-bg: none;
 --bs-btn-border-color: #2e7eba;
 --bs-btn-hover-color: #fff;
 --bs-btn-hover-bg: #2e7eba;
 --bs-btn-hover-border-color: #2e7eba;
 --bs-btn-focus-shadow-rgb: 60, 153, 110;
 --bs-btn-active-color: #fff;
 --bs-btn-active-bg: #2e7eba;
 --bs-btn-active-border-color: #2e7eba;
 --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
 --bs-btn-disabled-color: #fff;
 --bs-btn-disabled-bg: #2e7eba;
 --bs-btn-disabled-border-color: #2e7eba;
}

/* clip */
.clip-skew { clip-path: polygon(100% 0, 80% 100%, 0 100%, 20% 0); }

.grid{display: grid;}
.grid-1 { grid-template-columns: repeat(1, 1fr); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }
.grid-5 { grid-template-columns: repeat(5, 1fr); }
.grid-6 { grid-template-columns: repeat(6, 1fr); }
.grid-7 { grid-template-columns: repeat(7, 1fr); }
.grid-8 { grid-template-columns: repeat(8, 1fr); }
.grid-9 { grid-template-columns: repeat(9, 1fr); }
.grid-10 { grid-template-columns: repeat(10, 1fr); }
.grid-11 { grid-template-columns: repeat(11, 1fr); }
.grid-12 { grid-template-columns: repeat(12, 1fr); }

@media (min-width: 576px) {
 .grid-sm-1 { grid-template-columns: repeat(1, 1fr); }
 .grid-sm-2 { grid-template-columns: repeat(2, 1fr); }
 .grid-sm-3 { grid-template-columns: repeat(3, 1fr); }
 .grid-sm-4 { grid-template-columns: repeat(4, 1fr); }
 .grid-sm-5 { grid-template-columns: repeat(5, 1fr); }
 .grid-sm-6 { grid-template-columns: repeat(6, 1fr); }
 .grid-sm-7 { grid-template-columns: repeat(7, 1fr); }
 .grid-sm-8 { grid-template-columns: repeat(8, 1fr); }
 .grid-sm-9 { grid-template-columns: repeat(9, 1fr); }
 .grid-sm-10 { grid-template-columns: repeat(10, 1fr); }
 .grid-sm-11 { grid-template-columns: repeat(11, 1fr); }
 .grid-sm-12 { grid-template-columns: repeat(12, 1fr); }
}
@media (min-width: 768px) {
 .grid-md-1 { grid-template-columns: repeat(1, 1fr); }
 .grid-md-2 { grid-template-columns: repeat(2, 1fr); }
 .grid-md-3 { grid-template-columns: repeat(3, 1fr); }
 .grid-md-4 { grid-template-columns: repeat(4, 1fr); }
 .grid-md-5 { grid-template-columns: repeat(5, 1fr); }
 .grid-md-6 { grid-template-columns: repeat(6, 1fr); }
 .grid-md-7 { grid-template-columns: repeat(7, 1fr); }
 .grid-md-8 { grid-template-columns: repeat(8, 1fr); }
 .grid-md-9 { grid-template-columns: repeat(9, 1fr); }
 .grid-md-10 { grid-template-columns: repeat(10, 1fr); }
 .grid-md-11 { grid-template-columns: repeat(11, 1fr); }
 .grid-md-12 { grid-template-columns: repeat(12, 1fr); }
}
@media (min-width: 992px) {
 .grid-lg-1 { grid-template-columns: repeat(1, 1fr); }
 .grid-lg-2 { grid-template-columns: repeat(2, 1fr); }
 .grid-lg-3 { grid-template-columns: repeat(3, 1fr); }
 .grid-lg-4 { grid-template-columns: repeat(4, 1fr); }
 .grid-lg-5 { grid-template-columns: repeat(5, 1fr); }
 .grid-lg-6 { grid-template-columns: repeat(6, 1fr); }
 .grid-lg-7 { grid-template-columns: repeat(7, 1fr); }
 .grid-lg-8 { grid-template-columns: repeat(8, 1fr); }
 .grid-lg-9 { grid-template-columns: repeat(9, 1fr); }
 .grid-lg-10 { grid-template-columns: repeat(10, 1fr); }
 .grid-lg-11 { grid-template-columns: repeat(11, 1fr); }
 .grid-lg-12 { grid-template-columns: repeat(12, 1fr); }
}
@media (min-width: 1200px) {
 .grid-xl-1 { grid-template-columns: repeat(1, 1fr); }
 .grid-xl-2 { grid-template-columns: repeat(2, 1fr); }
 .grid-xl-3 { grid-template-columns: repeat(3, 1fr); }
 .grid-xl-4 { grid-template-columns: repeat(4, 1fr); }
 .grid-xl-5 { grid-template-columns: repeat(5, 1fr); }
 .grid-xl-6 { grid-template-columns: repeat(6, 1fr); }
 .grid-xl-7 { grid-template-columns: repeat(7, 1fr); }
 .grid-xl-8 { grid-template-columns: repeat(8, 1fr); }
 .grid-xl-9 { grid-template-columns: repeat(9, 1fr); }
 .grid-xl-10 { grid-template-columns: repeat(10, 1fr); }
 .grid-xl-11 { grid-template-columns: repeat(11, 1fr); }
 .grid-xl-12 { grid-template-columns: repeat(12, 1fr); }
}
@media (min-width: 1400px) {
 .grid-xxl-1 { grid-template-columns: repeat(1, 1fr); }
 .grid-xxl-2 { grid-template-columns: repeat(2, 1fr); }
 .grid-xxl-3 { grid-template-columns: repeat(3, 1fr); }
 .grid-xxl-4 { grid-template-columns: repeat(4, 1fr); }
 .grid-xxl-5 { grid-template-columns: repeat(5, 1fr); }
 .grid-xxl-6 { grid-template-columns: repeat(6, 1fr); }
 .grid-xxl-7 { grid-template-columns: repeat(7, 1fr); }
 .grid-xxl-8 { grid-template-columns: repeat(8, 1fr); }
 .grid-xxl-9 { grid-template-columns: repeat(9, 1fr); }
 .grid-xxl-10 { grid-template-columns: repeat(10, 1fr); }
 .grid-xxl-11 { grid-template-columns: repeat(11, 1fr); }
 .grid-xxl-12 { grid-template-columns: repeat(12, 1fr); }
}
  
.span-1x1 { grid-area: span 1 / span 1; }
.span-1x2 { grid-area: span 1 / span 2; }
.span-1x3 { grid-area: span 1 / span 3; }
.span-1x4 { grid-area: span 1 / span 4; }
.span-1x5 { grid-area: span 1 / span 5; }
.span-1x6 { grid-area: span 1 / span 6; }

.span-2x1 { grid-area: span 2 / span 1; }
.span-2x2 { grid-area: span 2 / span 2; }
.span-2x3 { grid-area: span 2 / span 3; }
.span-2x4 { grid-area: span 2 / span 4; }
.span-2x5 { grid-area: span 2 / span 5; }
.span-2x6 { grid-area: span 2 / span 6; }

.span-3x1 { grid-area: span 3 / span 1; }
.span-3x2 { grid-area: span 3 / span 2; }
.span-3x3 { grid-area: span 3 / span 3; }
.span-3x4 { grid-area: span 3 / span 4; }
.span-3x5 { grid-area: span 3 / span 5; }
.span-3x6 { grid-area: span 3 / span 6; }

.span-4x1 { grid-area: span 4 / span 1; }
.span-4x2 { grid-area: span 4 / span 2; }
.span-4x3 { grid-area: span 4 / span 3; }
.span-4x4 { grid-area: span 4 / span 4; }
.span-4x5 { grid-area: span 4 / span 5; }
.span-4x6 { grid-area: span 4 / span 6; }

.span-5x1 { grid-area: span 5 / span 1; }
.span-5x2 { grid-area: span 5 / span 2; }
.span-5x3 { grid-area: span 5 / span 3; }
.span-5x4 { grid-area: span 5 / span 4; }
.span-5x5 { grid-area: span 5 / span 5; }
.span-5x6 { grid-area: span 5 / span 6; }

.span-6x1 { grid-area: span 6 / span 1; }
.span-6x2 { grid-area: span 6 / span 2; }
.span-6x3 { grid-area: span 6 / span 3; }
.span-6x4 { grid-area: span 6 / span 4; }
.span-6x5 { grid-area: span 6 / span 5; }
.span-6x6 { grid-area: span 6 / span 6; }

@media (min-width: 992px) {
 .span-lg-1x1 { grid-area: span 1 / span 1; }
 .span-lg-1x2 { grid-area: span 1 / span 2; }
 .span-lg-1x3 { grid-area: span 1 / span 3; }
 .span-lg-1x4 { grid-area: span 1 / span 4; }
 .span-lg-1x5 { grid-area: span 1 / span 5; }
 .span-lg-1x6 { grid-area: span 1 / span 6; }
 .span-lg-2x1 { grid-area: span 2 / span 1; }
 .span-lg-2x2 { grid-area: span 2 / span 2; }
 .span-lg-2x3 { grid-area: span 2 / span 3; }
 .span-lg-2x4 { grid-area: span 2 / span 4; }
 .span-lg-2x5 { grid-area: span 2 / span 5; }
 .span-lg-2x6 { grid-area: span 2 / span 6; }
 .span-lg-3x1 { grid-area: span 3 / span 1; }
 .span-lg-3x2 { grid-area: span 3 / span 2; }
 .span-lg-3x3 { grid-area: span 3 / span 3; }
 .span-lg-3x4 { grid-area: span 3 / span 4; }
 .span-lg-3x5 { grid-area: span 3 / span 5; }
 .span-lg-3x6 { grid-area: span 3 / span 6; }
 .span-lg-4x1 { grid-area: span 4 / span 1; }
 .span-lg-4x2 { grid-area: span 4 / span 2; }
 .span-lg-4x3 { grid-area: span 4 / span 3; }
 .span-lg-4x4 { grid-area: span 4 / span 4; }
 .span-lg-4x5 { grid-area: span 4 / span 5; }
 .span-lg-4x6 { grid-area: span 4 / span 6; }
 .span-lg-5x1 { grid-area: span 5 / span 1; }
 .span-lg-5x2 { grid-area: span 5 / span 2; }
 .span-lg-5x3 { grid-area: span 5 / span 3; }
 .span-lg-5x4 { grid-area: span 5 / span 4; }
 .span-lg-5x5 { grid-area: span 5 / span 5; }
 .span-lg-5x6 { grid-area: span 5 / span 6; }
 .span-lg-6x1 { grid-area: span 6 / span 1; }
 .span-lg-6x2 { grid-area: span 6 / span 2; }
 .span-lg-6x3 { grid-area: span 6 / span 3; }
 .span-lg-6x4 { grid-area: span 6 / span 4; }
 .span-lg-6x5 { grid-area: span 6 / span 5; }
 .span-lg-6x6 { grid-area: span 6 / span 6; }
}


  
.lh-1 { line-height: 1; }
.lh-1_1 { line-height: 1.1; }
.lh-1_2 { line-height: 1.2; }
.lh-1_3 { line-height: 1.3; }
.lh-1_4 { line-height: 1.4; }
.lh-1_5 { line-height: 1.5; }
.lh-1_6 { line-height: 1.6; }
.lh-1_7 { line-height: 1.7; }
.lh-1_8 { line-height: 1.8; }
.lh-1_9 { line-height: 1.9; }
.lh-2 { line-height: 2; }
.lh-2_1 { line-height: 2.1; }
.lh-2_2 { line-height: 2.2; }
.lh-2_3 { line-height: 2.3; }
.lh-2_4 { line-height: 2.4; }
.lh-2_5 { line-height: 2.5; }
.lh-2_6 { line-height: 2.6; }
.lh-2_7 { line-height: 2.7; }
.lh-2_8 { line-height: 2.8; }
.lh-2_9 { line-height: 2.9; }
.lh-3 { line-height: 3; }
.lh-3_1 { line-height: 3.1; }
.lh-3_2 { line-height: 3.2; }
.lh-3_3 { line-height: 3.3; }
.lh-3_4 { line-height: 3.4; }
.lh-3_5 { line-height: 3.5; }
.lh-3_6 { line-height: 3.6; }
.lh-3_7 { line-height: 3.7; }
.lh-3_8 { line-height: 3.8; }
.lh-3_9 { line-height: 3.9; }
.lh-4 { line-height: 4; }

.fs-30{font-size: 26px;}
.fs-29{font-size: 26px;}
.fs-28{font-size: 26px;}
.fs-27{font-size: 26px;}
.fs-26{font-size: 26px;}
.fs-25{font-size: 25px;}
.fs-24{font-size: 24px;}
.fs-23{font-size: 23px;}
.fs-22{font-size: 22px;}
.fs-21{font-size: 21px;}
.fs-20{font-size: 20px;}
.fs-19{font-size: 19px;}
.fs-18{font-size: 18px;}
.fs-17{font-size: 17px;}
.fs-16{font-size: 16px;}
.fs-15{font-size: 15px;}
.fs-14{font-size: 14px;}
.fs-13{font-size: 13px;}
.fs-12{font-size: 12px;}

@media (min-width: 992px){
 .fs-lg-30{font-size: 26px;}
 .fs-lg-29{font-size: 26px;}
 .fs-lg-28{font-size: 26px;}
 .fs-lg-27{font-size: 26px;}
 .fs-lg-26{font-size: 26px;}
 .fs-lg-25{font-size: 25px;}
 .fs-lg-24{font-size: 24px;}
 .fs-lg-23{font-size: 23px;}
 .fs-lg-22{font-size: 22px;}
 .fs-lg-21{font-size: 21px;}
 .fs-lg-20{font-size: 20px;}
 .fs-lg-19{font-size: 19px;}
 .fs-lg-18{font-size: 18px;}
 .fs-lg-17{font-size: 17px;}
 .fs-lg-16{font-size: 16px;}
 .fs-lg-15{font-size: 15px;}
 .fs-lg-14{font-size: 14px;}
 .fs-lg-13{font-size: 13px;}
 .fs-lg-12{font-size: 12px;}
}

.img-hover-scale{overflow: hidden;position: relative;}
.img-hover-scale img{transition: .5s;}
.img-hover-scale:hover img{transform: scale(1.2);}
.color-white{color:#fff;}
.shortline{display: inline-block;width: 30px;height: 2px;}
.bg-main{background-color: var(--main-color);}
.color-main{color:var(--main-color)}
.bg-img{position: absolute;left: 0;top:0;width: 100%;z-index:-1;object-fit: cover;}
.flex-center{align-items: center;justify-content: center;}
.p-indent-4rem{font-size: 2rem;text-indent: 4rem;color:#666}
.p-indent-2rem{font-size: 1rem;text-indent: 2rem;color:#666}
.p-indent {
 font-size: 1rem;
 text-align: justify;
 color: #666;
 line-height: 2;
 text-indent: 4rem;
}

.grid-company{
 display: grid;
 gap:32px;
 grid-template-columns: 2fr 1fr 1fr;
 grid-template-rows: minmax(200px,auto);
}
.grid-company .company-text{grid-area: 1/1/span 2/span 1;}
.grid-company img:nth-of-type(1){grid-area: 1/2/span 2/span 2;}
/* .grid-company img:nth-of-type(1){grid-area: 1/2/span 2/span 2;padding-left: 60px;padding-bottom: 60px;} */
/* .grid-company img:nth-of-type(2){grid-area: 2/2/span 1/span 1;z-index: 99;} */
.grid-company img:nth-of-type(2){min-height:200px;grid-area: 3/1/span 2/span 1;}
.grid-company img:nth-of-type(3){min-height:200px;grid-column-end: span 2;max-height: 240px;}
.grid-company img:nth-of-type(4){min-height:200px;grid-column-end: span 2;max-height: 240px;}
@media (max-width:992px) {
    .grid-company{gap:12px;}
    .grid-company .company-text{grid-area: 1/1/span 1/span 3;}
    .grid-company img:nth-of-type(1){grid-area: 2/1/span 1/span 1;padding-left: 0;padding-bottom: 0;}
    .grid-company img:nth-of-type(2){grid-area: 2/2/span 1/span 2;z-index: 99;}
    .grid-company img:nth-of-type(3){grid-column-end: span 3;}
    .grid-company img:nth-of-type(4){grid-column-end: span 3;}
}