@charset "utf-8";
/* *******************************************************
 * filename : main_responsive.css
 * date : 2026-06-20
******************************************************** */
.fp-scrollable .fp-section:not(.fp-auto-height):not([data-percentage]), .fp-scrollable .fp-slide:not(.fp-auto-height):not([data-percentage]), .fp-scrollable.fp-responsive .fp-is-overflow.fp-section:not(.fp-auto-height):not([data-percentage]) {
  min-height: auto !important;
}
@media all and (max-width: 1024) {
  .fp-scrollable .fp-section, .fp-scrollable .fp-slide, .fp-scrollable.fp-responsive .fp-is-overflow.fp-section {
    height: auto !important;
  }
}
/* ******************  메인 비주얼 ********************** */
@media all and (max-width: 1770px) {
  .main-visual-img-con {
    display: flex;
    justify-content: end;
  }
  .main-visual-img-box {
    width: 60vw;
  }
}
@media all and (max-width: 1440px) {
	.mask-layer {
    background-size: contain;
}
}
@media all and (max-width: 1280px) {
  .fp-overflow {
    height: 100%;
  }
  #fullpage #mainVisual {
    height: 60rem !important;
  }
  .main-visual-txt-box {
    align-items: flex-start;
    flex-wrap: initial;
    padding-top: 16.56% !important;
    padding-bottom: 0 !important;
  }
  .main-visual-txt-box .main-visual-txt1 {
    font-size: 3.8rem;
  }
  .main-visual-txt-box .main-visual-txt2 {
    font-size: 1.8rem;
  }
	.mask-layer {background-size:85vw auto}
  .mask-layer,  .path-group {
    width: 85vw;
    height: 50vh;
  }
  .main-visual-img-box .path svg {
    width: 80%;
  }
  .path-group .path.path1 {
    left: 5rem;
    margin-top: -16rem;
  }
  .main-visual-img-box .path.path2 {
    right: 60rem;
    margin-top: -15rem;
    top: auto;
    bottom: 30vh
  }
  .path-group .path.path3 {
    right: 17rem;
    margin-top: -20rem;
  }
  .path-group .path.path4 {
    left: 30rem;
    margin-top: 5rem;
  }
  .path-group .path.path5 {
    right: 30rem;
    margin-top: 5.6rem;
  }
}
@media all and (max-width: 1024px) {
    #fullpage #mainVisual {
        height: 100vh !important;
		min-height: -webkit-fill-available;  
    }
  #fullpage #mainVisual {
            height: 100vh !important;
	  min-height: -webkit-fill-available;  
  }
  .main-visual-img-box {
    width: 65vw !important
  }
}
@media all and (max-width: 800px) {
  #mainVisual {
    height: calc(100vh - var(--header-height));
  }
  /* 메인 비주얼 :: 텍스트 */
  .main-visual-txt-box {
    padding-top: 28.28% !important;
  }
  .main-visual-txt-box .main-visual-txt1 {
    font-size: 3rem;
  }
  .main-visual-txt-box .main-visual-txt2 {
    font-size: 1.7rem;
  }
	.mask-layer {background-size:85vw auto}
  .mask-layer, .path-group {
    width: 85vw;
    height: 40vh;
  }
  .main-visual-img-box {
    width: 100vw !important;
    height: 40vh;
  }
  .main-visual-img-con {
    flex-direction: column;
  }
  .main-visual-img-box .path svg {
    width: 50%;
  }
  .main-visual-img-box .path.path2 {
    display: none;
  }
  .path-group .path.path1 {
    left: 5rem;
    margin-top: -12rem;
  }
  .path-group .path.path3 {
    right: 8rem;
    margin-top: -16rem;
  }
  .path-group .path.path4 {
    left: 30rem;
    margin-top: 2rem;
  }
  .path-group .path.path5 {
    right: 4rem;
    margin-top: 1.6rem;
  }
}
@media all and (max-width: 480px) {
  #fullpage #mainVisual {
    height: 75vh !important;
  }
  .main-visual-txt-box .main-visual-txt1 {
    font-size: 2.5rem;
  }
  .main-visual-txt-box .main-visual-txt2 {
    font-size: 1.5rem;
  }
	
	 .main-visual-img-box .path svg {
    width: 30px;
  }
	.main-visual-img-box .path.path1 svg {width:45px;}
  .path-group .path.path1 {
    left: 3rem;
    margin-top: -9rem;
  }
  .path-group .path.path3 {
    right: 8rem;
    margin-top: -14rem;
  }
  .path-group .path.path4 {
    left: 10rem;
        margin-top: -3rem;
  }
  .path-group .path.path5 {
    margin-top: -2rem;
  }
}
@media all and (max-width: 480px) and (max-height: 700px) {
  .main-visual-txt-box {
    padding-top: 10rem !important;
  }
}
@media all and (max-width: 1024px) and (min-width: 801px) and (max-height: 1366px) {
	    #fullpage #mainVisual {
        height: 900px !important;
    }
    .main-visual-img-con {
        top: 20%;
    }
}
/* pc형 세로 작을 경우 css */
@media all and (max-width: 1280px) and (min-width: 801px) and (max-height: 850px) {

  .main-visual-txt-box {
    padding-top: 15% !important;
  }
	.main-visual-txt-box br {display:none;}
  .main-visual-img-box {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    width: 85vw;padding-top: 25%;
  }
}
.fp-scrollable .fp-auto-height .fp-overflow {
     height: auto!important; 
}
@media all and (max-width: 1280px) and (min-width: 801px) and (min-height: 800px) {
  .main-visual-txt-box {
    padding-top: 22% !important;
  }
  .main-visual-img-box {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    width: 85vw;
  }
}
/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: 공통 -------- */
@media all and (max-width: 1280px) {
  .main-wrap .main-tit-box .main-sub-tit .pc-br {
    display: block;
  }
}
@media all and (max-width: 800px) {
  .main-tit-box .main-tit {
    font-size: 1.8rem;
    line-height: 1.5;
  }
  .main-tit-box .main-sub-tit {
    margin-top: 2rem;
    font-size: 2.6rem;
    line-height: 1.46;
  }
  .main-wrap .main-tit-box .main-sub-tit .pc-br {
    display: none;
  }
}
/* -------- 메인 컨텐츠 :: 컨텐츠1(vision) -------- */
@media all and (max-width: 1280px) {
  #mainContent1 {
    padding: 0;
    width: 100%;
    height: 85vh !important;
    overflow: hidden;
    min-height: inherit;
  }
  .vision-scroll {
    width: 63rem;
  }
  .vision-list .vision-item {
    width: 30rem;
    height: 34.5rem;
  }
}
@media all and (max-width: 1024px) {
  #mainContent1 {
    padding: 10rem 0 5rem 0;height: 100vh !important;min-height: -webkit-fill-available;  
  }
  .vision-wrap {
    flex-wrap: wrap;
  }
  .vision-scroll {
    width: 100%;
    order: 2;
  }
  .vision-list {
    padding: 0rem 0 0rem;
  }
  #mainContent1.active .vision-list .vision-item:nth-child(odd) {
    transform: translateY(4rem);
  }
  .vision-title {
    width: 100%;
    order: 1;
    position: relative;
    padding-bottom: 0;
    top: 0;
  }
  .vision-title img {
    height: 60px;
  }
  .vision-list .vision-item {
    width: 23%;
    padding: 3rem 2rem;
    transform: translateY(0rem);
  }
  .vision-list .vision-item h3 {
    font-size: 3rem;
  }
  .vision-list .vision-item p {
    font-size: 1.8rem;
  }
}
@media all and (max-width: 1024px) and (min-width: 801px) and (max-height: 1366px) {
	    #mainContent1 {
        height: 700px !important;
    }
}
@media all and (max-width: 800px) {
  #mainContent1 {
    height: auto !important;padding: 5rem 0 5rem 0;
  }
  .vision-list .vision-item {
    width: 48%;
    height: 23.5rem;
    background-size: 70% auto;
    background-position: right bottom;
  }
  .vision-title p {
    margin: 3rem 0;
    font-size: 1.8rem;
  }
	#mainContent1 .main-vision-bg-box {
    height: 100% !important;
}
	.main-vision-bg {
    position: absolute;
    top: 0;
    left: -1.3021vw;
    right: -4.1354vw;
    bottom: 0;
    background: #111433;
    height: 100%;
    bottom: 0;
    top: 0;
}
}
@media all and (max-width: 480px) and (max-width: 700px) {
  .vision-title img {
    height: 42px;
  }
  .vision-title p {
    margin: 2rem 0;
    font-size: 1.6rem;
  }
  .vision-list .vision-item h3 {
    font-size: 2rem;
  }
  .vision-list .vision-item p {
    font-size: 1.4rem;
  }
}
/* -------- 메인 컨텐츠 :: 컨텐츠2(performance) -------- */
@media all and (max-width: 1280px) {
  #mainContent2 {
    padding: 11rem 0 6rem 0;
  }
  .performance-item {
    padding: 1.7rem 0;
  }
  .performance-item-inner p._ico {
    width: 6.1rem;
    height: 6.1rem;
  }
  .performance-item-inner .subject p {
    font-size: 3rem;
  }
  .performance-item-inner .subject p + span {
    font-size: 2rem;
  }
}
@media all and (max-width: 1024px) {
  #mainContent2 {
    padding: 10rem 0 5rem 0;
  }
  .performance-item {
    padding: 1.4rem 0;
  }
  .performance-item-inner p._ico {
    width: 5.1rem;
    height: 5.1rem;
  }
  .performance-item-inner .subject p {
    font-size: 2.5rem;
  }
  .performance-item-inner .subject p + span {
    font-size: 1.6rem;
  }
}
@media all and (max-width: 480px) and (max-width: 700px) {
  .performance-item-inner a {
    gap: 1.6rem;
  }
  .performance-item-inner p._ico {
    width: 3.1rem;
    height: 3.1rem;
  }
  .performance-item-inner .subject p {
    font-size: 1.6rem;
  }
  .performance-item-inner .subject {
    gap: 1.2rem;
    width: calc(100% - 5rem);
  }
  .performance-item-inner .subject p + span {
    font-size: 1.2rem;
  }
}
/* -------- 메인 컨텐츠 :: 컨텐츠3(technology) -------- */
@media all and (max-width: 1280px) {
  #mainContent3 {
    padding: 11rem 0 6rem 0;
  }
  #mainContent3 .main-sub-tit {
    font-size: 3.8rem;
  }
  .main-tech-slide-list .list-item .list-box .inner-item .txt-box .tit {
    font-size: 2.9rem;
    margin-bottom: 1.2rem;
  }
  .main-tech-slide-list .list-item .list-box .inner-item .txt-box .txt {
    font-size: 1.7rem;
  }
}
@media all and (max-width: 1024px) {
  #mainContent3 {
    padding: 10rem 0 5rem 0;
  }
  #mainContent3 .main-sub-tit {
    font-size: 3.2rem;
  }
  .main-tech-slide-list .list-item .list-box .inner-item .txt-box .tit {
    font-size: 2.6rem;
  }
}
@media all and (max-width: 800px) {
  #mainContent3 .main-sub-tit {
    font-size: 2.6rem;
  }
}
@media all and (max-width: 480px) and (max-width: 700px) {
  #mainContent3 .main-sub-tit {
    font-size: 1.8rem;
    line-height: 1.26;
  }
  .main-tech-slide-list .list-item .list-box .inner-item .txt-box {
    padding: 1.5rem 2.2rem;
  }
  .main-tech-slide-list .list-item .list-box .inner-item .txt-box .txt {
    font-size: 1.3rem;
  }
  .main-tech-slide-list .list-item .list-box .inner-item .txt-box .tit {
    font-size: 2.2rem;
  }
  .main-tech-slide-list .list-item .list-box .inner-item .txt-box .tit span {
    font-size: 1.3rem;
    margin-left: 5px;
  }
  .main-tech-slide-list {
    margin-top: 2.4rem;
  }
  .main-tech-con .slick-dots li, .main-tech-con .slick-dots li button {
    height: 5px;
  }
}
/* -------- 메인 컨텐츠 :: 컨텐츠4(banner) -------- */
@media all and (max-width: 1280px) {
  #mainContent4 .main-tech-banner {
    padding: 8rem 0;
  }
  .main-tech-banner .main-tit {
    font-size: 4.9rem;
    margin-bottom: 1.6rem;
  }
  .main-tech-banner .main-sub-tit {
    font-size: 2.8rem;
    margin-bottom: 4.1rem;
  }
  .main-tech-banner .main-txt {
    font-size: 1.8rem;
  }
}
@media all and (max-width: 480px) and (max-width: 700px) {
  #mainContent4 .main-tech-banner {
    padding: 5rem 0;
  }
  .main-tech-banner .main-tit {
    font-size: 2.9rem;
    margin-bottom: 1.2rem;
  }
  .main-tech-banner .main-sub-tit {
    font-size: 1.8rem;
    margin-bottom: 2.1rem;
  }
  .main-tech-banner .main-txt {
    font-size: 1.3rem;
  }
}
/* -------- 메인 컨텐츠 :: 컨텐츠5(product) -------- */
@media all and (max-width: 1280px) {
  #mainContent5 {
    padding: 11rem 0 4rem 0;
  }
  .product-list {
    margin-top: 3.8rem;
  }
  .product-item {
    width: 32%;
  }
  .product-item-top {
    padding: 4.9rem 1rem;
  }
  .product-item .product-item-top ._ico img {
    height: 100px
  }
  .product-item-info {
    padding: 3.2rem;
  }
  .product-item-info h5 {
    font-size: 2.9rem;
    margin-bottom: 1.1rem;
  }
  .product-item-info h5 span {
    font-size: 1.8rem;
  }
  .product-item-info li {
    font-size: 1.6rem;
    line-height: 2.8rem;
  }
}
@media all and (max-width: 1024px) {
  #mainContent5 {
    padding: 10rem 0 5rem 0;
  }
  .product-list {
    margin-top: 2.5rem;
  }
  .product-item-top {
    padding: 3.9rem 1rem;
  }
  .product-item .product-item-top ._ico img {
    height: 70px;
  }
  .product-item-info h5 {
    font-size: 2.5rem;
    margin-bottom: 0.8rem;
  }
  .product-item-info {
    padding: 3.2rem 2.2rem;
    min-height: 20rem;
  }
}
@media all and (max-width: 800px) {
  .product-list {
    flex-wrap: wrap;
    margin-top: 0.5rem;
  }
  .product-item {
            width: 49%;
    margin-top: 1.2rem;
	  margin-bottom:4rem;
  }
}
@media all and (max-width: 480px) and (max-width: 700px) {
 .product-item {
        width: 100%;
        margin-bottom: 2rem;
    }
  .product-item-top {
    padding: 2.9rem 1rem;
  }
  .product-item .product-item-top ._ico img {
    height: 50px;
  }
  .product-item-info h5 {
    font-size: 1.8rem;
    margin-bottom: 1.6rem;
  }
  .product-item-info li {
    font-size: 1.4rem;
    line-height: 2.2rem;
  }
  .product-item-info li span {
    font-size: 12px;
  }
  .product-item-info h5 span {
    font-size: 1.4rem;
    display: inline-block;
  }
  .product-item-info p {
    font-size: 1.3rem;
  }
}
/* -------- 메인 컨텐츠 :: 컨텐츠6(organization) -------- */
@media all and (max-width: 1440px) {
.organization-box:before {
    width: 95vw;
}
	}
@media all and (max-width: 1280px) {
  #mainContent6 {
    padding: 11rem 0 6rem 0;        height: auto !important;
  }
  .main-organization-wrap {
    position: relative;
    bottom: 0;
    margin-top: 8rem;
  }
  .organization-box {
    padding: 2.8rem 0;
  }
  .organization-inner h4 {
    font-size: 2.1rem;
    line-height: 2.8rem;
    margin-bottom: 3.7rem;
  }
  .organization-list {
    gap: 3rem;
  }
  .organization-box:before {
    max-height: 100% !important;
  }
  .organization-item {
    width: 26%;
  }
  .organization-item:last-child {
    width: 54%;
  }
  .organization-item .teams {
    font-size: 2.7rem;
    margin-bottom: 1.1rem;
  }
  .organization-item li {
    font-size: 1.8rem;
  }
  #mainContent6 .main-tit-box .main-tit {
    font-size: 3.8rem;
    margin-bottom: 2.9rem;
  }
  #mainContent6 .main-tit-box .main-sub-tit {
    font-size: 1.8rem;
    line-height: 2.9rem;
  }
}
@media all and (max-width: 1280px) and (min-width: 801px) and (max-height: 850px) {

	#mainContent6 .fp-overflow {height:auto !important;    max-height:inherit !important;  }
}
@media all and (max-width: 1024px) {
  #mainContent6 {
    padding: 10rem 0 5rem 0;
  }
  #mainContent6 .main-tit-box .main-tit {
    font-size: 3.2rem;
    margin-bottom: 2.1rem;
  }
  .organization-item .teams {
    font-size: 2.2rem;
  }
  .organization-item li {
    font-size: 1.6rem;
  }
}
@media all and (max-width: 800px) {
  #mainContent6 .main-tit-box .main-tit {
    font-size: 2.6rem;
  }
  .main-organization-wrap {
    margin-top: 4rem;
  }
}
@media all and (max-width: 480px) and (max-width: 700px) {
  #mainContent6 .main-tit-box .main-tit {
    font-size: 1.8rem;
  }
  #mainContent6 .main-tit-box .main-sub-tit {
    font-size: 1.3rem;
    line-height: 2.1rem;
  }
  .organization-box:before {
    width: 95vw;
  }
  .organization-inner h4 {
    font-size: 1.6rem;
    line-height: 2.1rem;
    margin-bottom: 2.7rem;
  }
  .organization-item .teams {
    font-size: 1.6rem;
  }
  .organization-item li {
    font-size: 1.3rem;
    line-height: 2.1rem;
  }
}
/* -------- 메인 컨텐츠 :: 컨텐츠7(history) -------- */
@media all and (max-width: 1280px) {
  #mainContent7 {
    padding: 11rem 0 6rem 0;
  }
  #mainContent7 .main-sub-tit {
    font-size: 3.8rem;
  }
  #mainContent7 .main-txt {
    font-size: 1.8rem;
    line-height: 2.4rem;
  }
  #mainContent7 .main-tit-box {
    margin-bottom: 6.2rem;
  }
  .main-history-list .main-history-flow .history-item {
    margin: 0 1rem;
    width: 38rem;
    padding: 2.2rem 4.4rem;
  }
  .history-item .history-year {
    font-size: 2.8rem;
  }
  .history-item .history-strong {
    font-size: 1.8rem;
    line-height: 2.8rem;
    margin-bottom: 0.9rem;
  }
  .history-item .history-txt {
    font-size: 1.8rem;
    line-height: 2.8rem;
  }
}
@media all and (max-width: 1024px) {
  #mainContent7 {
    padding: 10rem 0 5rem 0;
  }
  .main-history-list {
    margin-bottom: 2.2rem;
  }
  .main-history-list .main-history-flow .history-item {
    margin: 0 0.5rem;
    width: 32rem;
    padding: 2.2rem 4.4rem;
  }
  #mainContent7 .main-tit-box {
    margin-bottom: 4.2rem;
  }
}
@media all and (max-width: 800px) {
  #mainContent7 .main-sub-tit {
    font-size: 2.6rem;
  }
  .history-item .history-year {
    font-size: 2.3rem;
  }
  .history-item .history-txt {
    font-size: 1.5rem;
    line-height: 2.1rem;
  }
}
@media all and (max-width: 480px) and (max-width: 700px) {
  #mainContent7 .main-sub-tit {
    font-size: 1.8rem;
  }
  #mainContent7 .main-txt {
    font-size: 1.4rem;
    line-height: 2.1rem;
  }
  #mainContent7 .main-txt br {
    display: none;
  }
  .main-history-list .main-history-flow .history-item {
    width: 26rem;
    padding: 2rem 2.4rem;
  }
  .history-item .history-year {
    font-size: 1.8rem;
  }
  .history-item .history-strong {
    font-size: 1.6rem;
    line-height: 2.1rem;
  }
  .history-item .history-txt {
    font-size: 1.3rem;
    line-height: 1.6rem;
  }
}
/* -------- 메인 컨텐츠 :: 컨텐츠8(company) -------- */
@media all and (max-width: 1280px) {
  #mainContent8 {
    padding: 11rem 0 6rem 0;
  }
  .company-wrap h1 {
    width: 28vw;
  }
  .company-wrap h1 img {
    max-width: 100%;
  }
  .company-table {
    width: 72VW;
  }
  .company-table table tbody td {
    padding: 2rem 0;
    line-height: 2.6rem;
    font-size: 1.8rem;
  }
  .main-btn-group a {
    padding: 1.2rem 3rem;
  }
  .main-btn-group a span {
    font-size: 2rem;
    line-height: 2.8rem;
  }
}
@media all and (max-width: 800px) {
  .company-wrap h1 {
    display: none;
  }
  .company-table {
    width: 100%;
  }
  .company-table table tbody th {
    padding: 1.5rem 0;
    line-height: 2.8rem;
    font-size: 1.6rem;
  }
  .company-table table tbody td {
    padding: 1.5rem 0;
    line-height: 2.6rem;
    font-size: 1.6rem;
  }
  .main-btn-group a span {
    font-size: 1.6rem;
    line-height: 2.2rem;
  }
  .popup-head h4 {
    font-size: 4.8em;
  }
}
@media all and (max-width: 480px) and (max-width: 700px) {
  .company-table table tbody th {
    width: 20%;
  }
  .company-table table tbody td, .company-table table tbody th {
    padding: 1rem 0;
    line-height: 2.1rem;
    font-size: 1.4rem;
  }
  .main-btn-group {
    margin-top: 2rem;
    gap: 8px;
  }
  .main-btn-group a {
    padding: 0.8rem 2rem;
  }
  .main-btn-group a span {
    font-size: 1.4rem;
    line-height: 2rem;
  }
  .main-btn-group a svg {
    height: 12px;
  }
  .popup-head h4 {
    font-size: 2.5em;
  }
}

@media all and (max-width: 1024px) and (min-width: 801px) and (max-height: 1366px) {
	    #mainContent1 {
        height: 700px !important;
    }
	.fp-auto-height,
.fp-auto-height .fp-tableCell,
	.fp-scrollable .fp-section, .fp-scrollable .fp-slide, .fp-scrollable.fp-responsive .fp-is-overflow.fp-section{
  height: auto !important;
  min-height: auto !important;
}
}