/* MAIN PAGE STYLES */
/* main */
#main {}
#main .section-banner {height: 1030px;}
#main .section-banner .section-inner {position: relative; width: 100%; height: 100%;}
#main .section-banner .banner-txt {display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 16px; width: 100%; height: 100%;}
#main .section-banner .banner-txt .txt-tit {font-size: 28px; font-weight: 600; color: #fff;}
#main .section-banner .banner-txt .txt-desc {font-size: 96px; font-weight: 100; color: #fff;}
#main .section-banner .scroll-down {position: absolute; left: 50%; bottom: 70px; transform: translate(-50%, 0); display: inline-flex; justify-content: center; align-items: center; width: 75px; height: 75px; border: 1px solid #fff; font-size: 14px; font-weight: 600; color: #fff; animation: scrollDown 5s infinite;}

@keyframes scrollDown {
	0% {transform: translate(-50%, 0);}
	20% {transform: translate(-50%, 20px);}
	40% {transform: translate(-50%, 0);}
}

#main .section-article {}
#main .section-article .section-inner {max-width: 100%; margin-inline: auto;}

#main #section-product {background-color: #fff; padding: 150px 0 260px;}
#main #section-product .section-inner {width: 1700px;}
#main #section-product .product-head {display: flex; justify-content: space-between; align-items: center;}
#main #section-product .product-head .head-txt {display: flex; flex-direction: column; gap: 20px;}
#main #section-product .product-head .head-txt .txt-tit {font-size: 45px; font-weight: 300; color: #333; text-transform: uppercase;}
#main #section-product .product-head .head-txt .txt-desc {font-size: 18px; font-weight: 400; color: #888;}
#main #section-product .product-head .btn-more {display: inline-flex; justify-content: center; align-items: center; width: 180px; height: 60px; border: 1px solid #333; font-size: 16px; font-weight: 600; color: #333;}
#main #section-product .product-list {position: relative; display: flex; align-items: flex-start; gap: 38px; margin-top: 70px;}
#main #section-product .product-list::before {content: "dong bo"; position: absolute; bottom: -160px; right: 0; font-size: 400px; font-weight: 700; color: rgba(51, 51, 51, 0.03); text-transform: uppercase;}
#main #section-product .product-list .product-item {position: relative; width: calc(100% / 5); box-shadow: 0 7px 30px 0 rgba(0, 0, 0, 0.1);}
#main #section-product .product-list .product-item:nth-child(odd) {margin-top: 70px;}
#main #section-product .product-list .product-item .item-img {}
#main #section-product .product-list .product-item .item-img > img {}
#main #section-product .product-list .product-item .item-txt {position: absolute; bottom: 40px; left: 0; width: 100%; font-size: 28px; font-weight: 700; color: #fff; text-align: center;}


#main #section-ideology {width: 100%; padding: 150px 0; background: url("../images/main/ideology-bg.png") center center / cover no-repeat;}
#main #section-ideology .section-inner {width: 100%;}
#main #section-ideology .ideology-head {display: flex; flex-direction: column; align-items: center; gap: 20px;}
#main #section-ideology .ideology-head .head-tit {font-size: 45px; font-weight: 300; color: #fff; text-transform: uppercase;}
#main #section-ideology .ideology-head .head-desc {font-size: 16px; font-weight: 400; color: #fff;}
#main #section-ideology .ideology-list {display: flex; max-width: 1920px; margin: 100px auto 0;}
#main #section-ideology .ideology-list .ideology-item {position: relative; display: inline-flex; flex-direction: column; align-items: center; flex: 1;}
#main #section-ideology .ideology-list .ideology-item:not(:last-child)::after {content: ""; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 1px; height: 200px; background-color: rgba(255, 255, 255, 0.2);}
#main #section-ideology .ideology-list .ideology-item .item-icon {}
#main #section-ideology .ideology-list .ideology-item .item-icon > img {}
#main #section-ideology .ideology-list .ideology-item .item-tit {margin-top: 49px; font-size: 30px; font-weight: 700; color: #fff;}
#main #section-ideology .ideology-list .ideology-item .item-desc {margin-top: 20px; font-size: 18px; font-weight: 400; color: #fff;}

#main #section-partner {width: 100%; padding: 150px 0; background: url("../images/main/partner_bg.png") center bottom / cover no-repeat;}
#main #section-partner .section-inner {width: 1700px;}
#main #section-partner .partner-head {display: flex; justify-content: center; align-items: center;}
#main #section-partner .partner-head .head-tit {font-size: 45px; font-weight: 700; color: #333;}
#main #section-partner .partner-list {display: flex; flex-wrap: wrap; gap: 50px; margin-top: 100px;}
#main #section-partner .partner-list .partner-item {display: inline-flex; justify-content: center; align-items: center; width: calc((100% / 5) - 40px); height: 130px; background-color: #fff; border: 1px solid #f0f0f0;}
#main #section-partner .partner-list .partner-item > img {}

#main #section-service {background-color: #fff; padding: 150px 0;}
#main #section-service .section-inner {width: 1200px;}
#main #section-service .service-list {display: flex; align-items: flex-start; gap: 40px;}
#main #section-service .service-list .service-item {position: relative; width: 50%; flex-shrink: 0; min-height: 180px; padding: 30px 40px; border: 1px solid #f0f0f0;}
#main #section-service .service-list .service-item .item-head {}
#main #section-service .service-list .service-item .item-head .head-tit {font-size: 24px; font-weight: 700; color: #333;}
#main #section-service .service-list .service-item .item-head .btn-link {position: absolute; top: 20px; right: 20px;}
#main #section-service .service-list .service-item .item-content {position: relative; margin-top: 20px;}
#main #section-service .service-list .service-item .item-content .post-list {display: flex; flex-direction: column; gap: 12px;}
#main #section-service .service-list .service-item .item-content .post-list .post-item {display: flex; justify-content: space-between; align-items: center;}
#main #section-service .service-list .service-item .item-content .post-list .post-item .post-tit {width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 16px; font-weight: 400; color: #666; line-height: 1.5;}
#main #section-service .service-list .service-item .item-content .post-list .post-item .post-date {flex-shrink: 0; font-size: 16px; font-weight: 400; color: #999; line-height: 1.5;}
#main #section-service .service-list .service-item .item-content .inquiry-desc {font-size: 16px; font-weight: 400; color: #666; line-height: 1.5;}
#main #section-service .service-list .service-item .item-content .inquiry-icon {position: absolute; top: 50%; right: 40px; transform: translateY(-50%);}

#main #section-branch {}
#main #section-branch .section-inner {width: 100%;}
#main #section-branch .branch-list {display: flex; width: 100%;}
#main #section-branch .branch-list .branch-item {position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px; flex: 1; height: 320px;}
#main #section-branch .branch-list .branch-item .item-tit {font-size: 18px; font-weight: 400; color: #fff;}
#main #section-branch .branch-list .branch-item .item-desc {font-size: 30px; color: #fff;}
#main #section-branch .branch-list .branch-item .btn-link {transform: translateX(0); transition: transform 0.5s;}
#main #section-branch .branch-list .branch-item:hover .btn-link {transform: translateX(20px);}

/* SUB PAGES STYLES */
body:not(#main) .section-banner {position: relative; width: 100%; height: 700px;}
body:not(#main) .section-banner::after {content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 1700px; height: 190px; background-color: #fff;}
body:not(#main) .section-banner .section-inner {}
body:not(#main) .section-banner .banner-txt {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px;}
body:not(#main) .section-banner .banner-txt .txt-tit {font-size: 28px; font-weight: 400; color: #fff;}
body:not(#main) .section-banner .banner-txt .txt-desc {font-size: 80px; font-weight: 200; color: #fff; white-space: nowrap;}
body:not(#main) .section-sub {position: relative; top: -170px; width: 1700px; margin-inline: auto; padding-bottom: 30px; background-color: #fff; max-width: 100%;}
body:not(#main) .section-sub .section-inner {width: 1200px; padding: 80px 0 0 0; margin-inline: auto;}
body:not(#main) .section-sub .breadcrumbs {display: flex; justify-content: flex-end; margin-bottom: 62px;}
body:not(#main) .section-sub .breadcrumbs > ul {display: flex; justify-content: center; align-items: center;}
body:not(#main) .section-sub .breadcrumbs > ul .home {display: inline-block; width: 17px; height: 16px; background: url("../images/icon-home.svg") center center / cover no-repeat; margin-right: 10px;}
body:not(#main) .section-sub .breadcrumbs > ul > li {position: relative; font-size: 15px; font-weight: 400; color: #666;}
body:not(#main) .section-sub .breadcrumbs > ul > li:not(:last-child) {padding-right: 9px; margin-right: 9px;}
body:not(#main) .section-sub .breadcrumbs > ul > li:not(:last-child)::after {content: ""; position: absolute; top: 50%; right: -2px; transform: translateY(-50%); display: inline-block; width: 5px; height: 7px; background: url("../images/arrow-right_small.svg") center center / cover no-repeat;}
body:not(#main) .section-sub .content-head {width: 100%; text-align: center;}
body:not(#main) .section-sub .content-head > span {font-size: 50px; font-weight: 700; color: #222; line-height: 1.4;}
body:not(#main) .section-sub .content-head > span > em {font-style: normal; color: #59C8A5; font-weight: 700;}
body:not(#main) .section-sub .content-head > span > strong {color: #5085E6; font-weight: 700;}
body:not(#main) .section-sub .content-table .pagination {display: flex; justify-content: center; align-items: center; gap: 6px; margin-top: 50px;}
body:not(#main) .section-sub .content-table .pagination .btn-first,
body:not(#main) .section-sub .content-table .pagination .btn-prev,
body:not(#main) .section-sub .content-table .pagination .btn-next,
body:not(#main) .section-sub .content-table .pagination .btn-last {display: inline-flex; justify-content: center; align-items: center; width: 42px; height: 42px; border: 1px solid #ddd;}
body:not(#main) .section-sub .content-table .pagination .btn-first {background: url("../images/pagination-first.svg") center center / auto 10px no-repeat;}
body:not(#main) .section-sub .content-table .pagination .btn-prev {background: url("../images/pagination-prev.svg") center center / auto 10px no-repeat;}
body:not(#main) .section-sub .content-table .pagination .btn-next {background: url("../images/pagination-next.svg") center center / auto 10px no-repeat;}
body:not(#main) .section-sub .content-table .pagination .btn-last {background: url("../images/pagination-last.svg") center center / auto 10px no-repeat;}
body:not(#main) .section-sub .content-table .pagination .pages {display: flex; align-items: center; gap: 33px; margin-inline: 24px;}
body:not(#main) .section-sub .content-table .pagination .pages > a {font-size: 16px; font-weight: 300; color: #666;}
body:not(#main) .section-sub .content-table .pagination .pages > a.active {font-weight: 500; color: #222; text-decoration: underline;}

/* introduce */
#introduce {}
#introduce .section-banner {background: url("../images/intro/intro_banner.png") center center / cover no-repeat;}
#introduce #section-introduce {}
#introduce #section-introduce .section-inner {}
#introduce #section-introduce .introduce-content {display: flex; align-items: flex-start; gap: 85px;}
#introduce #section-introduce .introduce-content .content-img {width: 485px; flex-shrink: 0;}
#introduce #section-introduce .introduce-content .content-img > img {}
#introduce #section-introduce .introduce-content .content-txt {padding-top: 40px;}
#introduce #section-introduce .introduce-content .content-txt .txt-main {}
#introduce #section-introduce .introduce-content .content-txt .txt-main > h2 {font-size: 32px; font-weight: 400; color: #000; line-height: 1.4;}
#introduce #section-introduce .introduce-content .content-txt .txt-desc {margin-top: 30px;}
#introduce #section-introduce .introduce-content .content-txt .txt-desc > p {font-size: 18px; font-weight: 400; color: #666; line-height: 1.4; white-space: pre-line;}
#introduce #section-introduce .introduce-content .content-txt .txt-sign {margin-top: 40px;}
#introduce #section-introduce .introduce-content .content-txt .txt-sign > span {font-size: 18px; font-weight: 400; color: #666;}
#introduce #section-introduce .introduce-content .content-txt .txt-sign > span > strong {display: inline-block; margin-left: 20px; font-family: "Maru Buri", sans-serif; font-size: 20px; font-weight: 700; color: #333;}

/* ideology */
#ideology {position: relative;}
#ideology::after {content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 45%; background-color: #fafafa; z-index: -1;}
#ideology .section-banner {background: url("../images/ideology/ideology_banner.png") center center / cover no-repeat;}
#ideology #section-ideology {background-color: transparent;}
#ideology #section-ideology .section-inner {}
#ideology #section-ideology .ideology-content {}
#ideology #section-ideology .ideology-content .content-items {display: flex; align-items: flex-start; gap: 53px; margin-top: 100px;}
#ideology #section-ideology .ideology-content .content-items .item {box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25); border-radius: 20px; contain: paint;}
#ideology #section-ideology .ideology-content .content-items .item:nth-child(even) {margin-top: 80px;}
#ideology #section-ideology .ideology-content .content-items .item .item-img {}
#ideology #section-ideology .ideology-content .content-items .item .item-img > img {}
#ideology #section-ideology .ideology-content .content-items .item .item-txt {position: absolute; bottom: 40px; left: 0; width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px;}
#ideology #section-ideology .ideology-content .content-items .item .item-txt .txt-tit {font-size: 28px; font-weight: 700; color: #fff;}
#ideology #section-ideology .ideology-content .content-items .item .item-txt .txt-desc {font-size: 16px; font-weight: 400; color: #fff;}
#ideology #section-ideology .ideology-content .content-txt {margin-top: 100px;}
#ideology #section-ideology .ideology-content .content-txt .txt-desc {width: 100%; text-align: center;}
#ideology #section-ideology .ideology-content .content-txt .txt-desc > p {font-size: 24px; font-weight: 400; color: #222; line-height: 1.4;}
#ideology #section-ideology .ideology-content .content-txt .txt-desc > p > b {font-weight: 700;}

/* history */
#history {}
#history .section-banner {background: url("../images/history/history_banner.png") center center / cover no-repeat;}
#history #section-history {}
#history #section-history .section-inner {}
#history #section-history .history-content {}
#history #section-history .history-content .content-items {display: flex; flex-direction: column; gap: 100px; margin-top: 100px;}
#history #section-history .history-content .content-items .item {}
#history #section-history .history-content .content-items .item .item-img {width: 100%; height: 350px;}
#history #section-history .history-content .content-items .item .item-img > img {}
#history #section-history .history-content .content-items .item .item-info {display: flex; justify-content: flex-start; align-items: flex-start; gap: 100px; margin-top: 50px; padding-inline: 80px;}
#history #section-history .history-content .content-items .item .item-info .info-card {display: flex; flex-direction: column; width: 350px; padding: 36px 0 40px 45px; background-color: #59C8A5; border-radius: 0 0 0 60px; transform: translateY(-50%);}
#history #section-history .history-content .content-items .item:nth-child(even) .item-info {flex-direction: row-reverse;}
#history #section-history .history-content .content-items .item:nth-child(even) .item-info .info-card {background-color: #5085E6; border-radius: 0 0 60px 0;}
#history #section-history .history-content .content-items .item .item-info .info-card .card-name {font-size: 24px; font-weight: 700; color: rgba(255, 255, 255, 0.15); line-height: 1.4; text-transform: uppercase;}
#history #section-history .history-content .content-items .item .item-info .info-card .card-years {margin-top: 12px; font-size: 40px; font-weight: 700; color: #fff; line-height: 1.4;}
#history #section-history .history-content .content-items .item .item-info .info-card .card-desc {margin-top: 18px; font-size: 18px; font-weight: 400; color: rgba(255, 255, 255, 0.6); line-height: 1.4;}
#history #section-history .history-content .content-items .item .item-info .info-history {display: flex; flex-direction: column; gap: 20px;}
#history #section-history .history-content .content-items .item .item-info .info-history .history-row {display: flex; align-items: flex-start; gap: 40px;}
#history #section-history .history-content .content-items .item .item-info .info-history .history-row .row-tit {font-size: 24px; font-weight: 800; color: #000; line-height: 1;}
#history #section-history .history-content .content-items .item .item-info .info-history .history-row .row-desc {font-size: 18px; font-weight: 400; color: #666; line-height: 1.5;}

/* partner */
#partner {}
#partner .section-banner {background: url("../images/partner/partner_banner.png") center center / cover no-repeat;}
#partner #section-partner {}
#partner #section-partner .section-inner {}
#partner #section-partner .partner-content {}
#partner #section-partner .partner-content .partner-list {display: flex; flex-wrap: wrap; gap: 26px 30px; margin-top: 100px;}
#partner #section-partner .partner-content .partner-list .partner-item {display: inline-flex; justify-content: center; align-items: center; width: calc((100% / 4) - 23px); height: 130px; background-color: #fff; border: 1px solid #f0f0f0;}
#partner #section-partner .partner-content .partner-list .partner-item > img {}

/* location */
#location {}
#location .section-banner {background: url("../images/location/location_banner.png") center center / cover no-repeat;}
#location #section-location {}
#location #section-location .section-inner {}
#location #section-location .location-content {display: flex; flex-direction: column; gap: 100px;}
#location #section-location .location-content .branch-item {}
#location #section-location .location-content .branch-item .item-head {text-align: center;}
#location #section-location .location-content .branch-item .item-head > span {font-size: 50px; font-weight: 700; color: #222; line-height: 1.4;}
#location #section-location .location-content .branch-item .item-map {width: 100%; height: 400px; border: 1px solid #ddd; border-radius: 0 0 0 60px; margin-top: 70px;}
#location #section-location .location-content .branch-item:nth-child(2) .item-map {border-radius: 0 0 60px 0;}
#location #section-location .location-content .branch-item .item-desc {display: flex; align-items: center; gap: 120px; margin-top: 40px;}
#location #section-location .location-content .branch-item .item-desc .contact-way {display: inline-flex; align-items: center; gap: 10px;}
#location #section-location .location-content .branch-item .item-desc .contact-way .way-icon {width: 34px;}
#location #section-location .location-content .branch-item .item-desc .contact-way .way-icon > img {}
#location #section-location .location-content .branch-item .item-desc .contact-way .way-desc {font-size: 18px; font-weight: 400; color: #666;}

/* product */
#product {}
#product .section-banner {background: url("../images/product/product_banner.png") center center / cover no-repeat;}
#product #section-product {}
#product #section-product .section-inner {}
#product #section-product .product-content {}
#product #section-product .product-content .content-tab {display: flex; flex-wrap: wrap; gap: 10px 14px;}
#product #section-product .product-content .content-tab .btn-tab {width: calc((100% / 4) - 11px); height: 70px; background-color: #fff; border: 1px solid #ddd; font-size: 18px; font-weight: 400; color: #222;}
#product #section-product .product-content .content-tab .btn-tab.active {background-color: #222; border-color: #222; color: #fff; font-weight: 700;}
#product #section-product .product-content .content-table {width: 100%; margin-top: 52px;}
#product #section-product .product-content .content-table .table-wrapper {width: 100%;}
#product #section-product .product-content .content-table .table-wrapper > table {width: 100%;}
#product #section-product .product-content .content-table .table-wrapper > table > thead {}
#product #section-product .product-content .content-table .table-wrapper > table > thead > tr {background-color: #fafafa; border-top: 2px solid #222;}
#product #section-product .product-content .content-table .table-wrapper > table > thead > tr > th {height: 100px; vertical-align: middle; font-family: "Noto Sans KR"; font-size: 20px; font-weight: 700; color: #222;}
#product #section-product .product-content .content-table .table-wrapper > table > tbody {border-bottom: 1px solid #ddd;}
#product #section-product .product-content .content-table .table-wrapper > table > tbody > tr {background-color: #fff; border-top: 1px solid #ddd;}
#product #section-product .product-content .content-table .table-wrapper > table > tbody > tr > td {height: 100px; vertical-align: middle; font-family: "Noto Sans KR"; font-size: 18px; font-weight: 400; color: #666; line-height: 1.4; text-align: center;}

/* news */
#news {}
#news .section-banner {background: url("../images/news/news_banner.png") center center / cover no-repeat;}
#news #section-news {}
#news #section-news .section-inner {}
#news #section-news .news-content {}
#news #section-news .news-content .content-search {display: flex; justify-content: center; align-items: center; gap: 10px; width: 100%; height: 170px; background-color: #fafafa;}
#news #section-news .news-content .content-search > select {width: 123px; height: 50px; background-color: #fff; border: 1px solid #ddd; padding-inline: 20px; font-size: 16px; font-weight: 400; color: #666;}
#news #section-news .news-content .content-search > input {width: 355px; height: 50px; background-color: #fff; border: 1px solid #ddd; padding-inline: 20px; font-size: 16px; font-weight: 400; color: #666;}
#news #section-news .news-content .content-search .btn-search {display: inline-flex; justify-content: center; align-items: center; width: 106px; height: 50px; background-color: #222; border: 1px solid #222; font-size: 16px; font-weight: 700; color: #fff;}
#news #section-news .news-content .content-table {width: 100%; margin-top: 70px;}
#news #section-news .news-content .content-table .table-wrapper {width: 100%;}
#news #section-news .news-content .content-table .table-wrapper > table {width: 100%;}
#news #section-news .news-content .content-table .table-wrapper > table > tbody {}
#news #section-news .news-content .content-table .table-wrapper > table > tbody > tr {border-bottom: 1px solid #ddd;}
#news #section-news .news-content .content-table .table-wrapper > table > tbody > tr > td {height: 130px; background-color: #fff; vertical-align: middle; font-size: 18px; font-weight: 400; color: #222; transition: background-color 0.15s;}
#news #section-news .news-content .content-table .table-wrapper > table > tbody > tr > td .index {display: block; font-size: 48px; font-weight: 400; color: #ccc; text-align: center; transition: color 0.15s;}
#news #section-news .news-content .content-table .table-wrapper > table > tbody > tr > td .date {display: block; font-size: 16px; font-weight: 400; color: #ccc; text-align: center; transition: color 0.15s;}
#news #section-news .news-content .content-table .table-wrapper > table > tbody > tr:hover > td {background-color: #fafafa;}
#news #section-news .news-content .content-table .table-wrapper > table > tbody > tr:hover > td .index {color: #222;}
#news #section-news .news-content .content-table .table-wrapper > table > tbody > tr:hover > td .date {color: #222;}
#news #section-news .news-content .content-table .table-wrapper > table > tbody > tr > td > a {display: inline-flex; justify-content: center; align-items: center; width: 40px; height: 40px; border: 1px solid #ddd; border-radius: 50%;}
#news #section-news .news-content .content-table .table-wrapper > table > tbody > tr > td > a > img {}

/* news_detail */
#news_detail {}
#news_detail .section-banner {background: url("../images/news/news_banner.png") center center / cover no-repeat;}
#news_detail #section-news_detail {}
#news_detail #section-news_detail .section-inner {}
#news_detail #section-news_detail .news_detail-content {}
#news_detail #section-news_detail .news_detail-content .content-head {display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 20px; padding: 50px 0; border-top: 1px solid #222;}
#news_detail #section-news_detail .news_detail-content .content-head .tit {font-size: 32px; font-weight: 400; color: #222; line-height: 1.4;}
#news_detail #section-news_detail .news_detail-content .content-head .date {font-size: 16px; font-weight: 400; color: #999; line-height: 1.4;}
#news_detail #section-news_detail .news_detail-content .content-desc {border: solid #ddd; border-width: 1px 0; padding: 60px 0;}
#news_detail #section-news_detail .news_detail-content .content-desc > p {font-size: 18px; font-weight: 400; color: #666; line-height: 1.4; white-space: pre-line;}
#news_detail #section-news_detail .news_detail-content .content-button {display: flex; justify-content: center; margin-top: 50px;}
#news_detail #section-news_detail .news_detail-content .content-button .btn-back {}
#news_detail #section-news_detail .news_detail-content .content-button .btn-back > img {}

/* inquiries */
#inquiries {}
#inquiries .section-banner {background: url("../images/inquiries/inquiries_banner.png") center center / cover no-repeat;}
#inquiries #section-inquiries {}
#inquiries #section-inquiries .section-inner {}
#inquiries #section-inquiries .inquiries-content {}
#inquiries #section-inquiries .inquiries-content .content-term {}
#inquiries #section-inquiries .inquiries-content .content-term .term-tit {font-size: 20px; font-weight: 600; color: #222;}
#inquiries #section-inquiries .inquiries-content .content-term .term-content {width: 100%; height: 210px; margin-top: 20px; padding: 20px; background-color: #fafafa; border: 1px solid #ddd; overflow-y: auto;}
#inquiries #section-inquiries .inquiries-content .content-term .term-content > p {font-size: 18px; font-weight: 400; color: #666; line-height: 1.4;}
#inquiries #section-inquiries .inquiries-content .content-term .term-check {margin-top: 20px;}
#inquiries #section-inquiries .inquiries-content .content-term .term-check .checkbox {display: flex; justify-content: flex-end; align-items: center;}
#inquiries #section-inquiries .inquiries-content .content-term .term-check .checkbox input[type="checkbox"] {display: none;}
#inquiries #section-inquiries .inquiries-content .content-term .term-check .checkbox input[type="checkbox"] + label {display: flex; align-items: center; cursor: pointer;}
#inquiries #section-inquiries .inquiries-content .content-term .term-check .checkbox input[type="checkbox"] + label::before {content: ""; display: inline-block; width: 20px; height: 20px; border: 1px solid #ddd; border-radius: 0px; transition: background-color 0.15s, border-color 0.15s;}
#inquiries #section-inquiries .inquiries-content .content-term .term-check .checkbox input[type="checkbox"] + label > span {display: inline-block; padding-left: 10px; font-size: 18px; font-weight: 400; color: #222;}
#inquiries #section-inquiries .inquiries-content .content-term .term-check .checkbox input[type="checkbox"]:checked + label::before {border-color: #ddd; background: url("../images/icon-checked.svg") center center / 13px no-repeat;}
#inquiries #section-inquiries .inquiries-content .content-form {display: flex; flex-direction: column; gap: 50px; margin-top: 50px; width: 100%;}
#inquiries #section-inquiries .inquiries-content .content-form .form-item {display: flex; align-items: flex-start; width: 100%;}
#inquiries #section-inquiries .inquiries-content .content-form .form-item .item-label {flex-shrink: 0; width: 168px;}
#inquiries #section-inquiries .inquiries-content .content-form .form-item .item-label > span {font-size: 20px; font-weight: 600; color: #222;}
#inquiries #section-inquiries .inquiries-content .content-form .form-item .item-element {width: 100%;}
#inquiries #section-inquiries .inquiries-content .content-form .form-item .item-element > input {width: 100%; padding: 10px 20px; border-bottom: 1px solid #ddd; font-size: 18px; font-weight: 400; color: #222;}
#inquiries #section-inquiries .inquiries-content .content-form .form-item .item-element > textarea {width: 100%; height: 250px; padding: 20px; border: 1px solid #ddd; font-size: 18px; font-weight: 400; color: #222; resize: none;}
#inquiries #section-inquiries .inquiries-content .form-button {display: flex; justify-content: center; margin-top: 50px;}
#inquiries #section-inquiries .inquiries-content .form-button .btn-inquiry {display: inline-flex; justify-content: center; align-items: center; width: 220px; height: 70px; border: 1px solid #222; font-size: 18px; font-weight: 500; color: #000;}

@media (max-width: 767px) {
    /* MAIN PAGE STYLES */
    /* main */
    #main {}
    #main .section-banner {height: 550px;}
    #main .section-banner .section-inner {}
    #main .section-banner .banner-txt {text-align: center; gap: 12px;}
    #main .section-banner .banner-txt .txt-tit {font-size: 20px; line-height: 1.4;}
    #main .section-banner .banner-txt .txt-desc {font-size: 64px;}
    #main .section-banner .scroll-down {display: none;}

    #main .section-article {}
    #main .section-article .section-inner {}

    #main #section-product {padding: 40px 15px;}
    #main #section-product .section-inner {}
    #main #section-product .product-head {}
    #main #section-product .product-head .head-txt {gap: 10px;}
    #main #section-product .product-head .head-txt .txt-tit {font-size: 28px;}
    #main #section-product .product-head .head-txt .txt-desc {font-size: 16px; line-height: 1.4;}
    #main #section-product .product-head .btn-more {display: none;}
    #main #section-product .product-list {flex-direction: row-reverse; flex-wrap: wrap; gap: 20px; margin-top: 15px;}
    #main #section-product .product-list::before {bottom: -42px; right: 0; white-space: nowrap; font-size: 90px;}
    #main #section-product .product-list .product-item {width: calc((100% / 2) - 10px);}
    #main #section-product .product-list .product-item:nth-child(odd) {margin-top: 0;}
    #main #section-product .product-list .product-item:nth-child(1) {order: 2; transform: translateY(50%);}
    #main #section-product .product-list .product-item:nth-child(2) {order: 1;}
    #main #section-product .product-list .product-item:nth-child(3) {order: 3;}
    #main #section-product .product-list .product-item:nth-child(4) {order: 4; transform: translateY(50%);}
    #main #section-product .product-list .product-item:nth-child(5) {order: 5;}
    #main #section-product .product-list .product-item .item-img {}
    #main #section-product .product-list .product-item .item-img > img {}
    #main #section-product .product-list .product-item .item-txt {bottom: 30px; font-size: 18px; font-weight: 500;}
    #main #section-product .product-button {display: flex; justify-content: center; align-items: center; margin-top: 40px;}
    #main #section-product .product-button .btn-more {display: inline-flex; justify-content: center; align-items: center; width: 180px; height: 60px; border: 1px solid #333; font-size: 16px; font-weight: 600; color: #333;}

    #main #section-ideology {padding: 40px 15px;}
    #main #section-ideology .section-inner {}
    #main #section-ideology .ideology-head {}
    #main #section-ideology .ideology-head .head-tit {font-size: 26px;}
    #main #section-ideology .ideology-head .head-desc {font-size: 16px; line-height: 1.4; text-align: center;}
    #main #section-ideology .ideology-list {flex-wrap: wrap; gap: 40px 0; margin-top: 40px;}
    #main #section-ideology .ideology-list .ideology-item {width: calc(100% / 2); flex: unset;}
    #main #section-ideology .ideology-list .ideology-item:not(:last-child)::after {display: none;}
    #main #section-ideology .ideology-list .ideology-item .item-icon {max-height: 60px;}
    #main #section-ideology .ideology-list .ideology-item .item-icon > img {height: 100%;}
    #main #section-ideology .ideology-list .ideology-item .item-tit {margin-top: 24px; font-size: 20px;}
    #main #section-ideology .ideology-list .ideology-item .item-desc {font-size: 14px;}

    #main #section-partner {padding: 40px 15px; background-size: contain;}
    #main #section-partner .section-inner {}
    #main #section-partner .partner-head {}
    #main #section-partner .partner-head .head-tit {font-size: 28px; text-align: center; line-height: 1.4;}
    #main #section-partner .partner-list {gap: 15px 10px; margin-top: 40px;}
    #main #section-partner .partner-list .partner-item {width: calc((100% / 2) - 5px); height: unset; aspect-ratio: 320 / 130 auto;}
    #main #section-partner .partner-list .partner-item > img {max-width: 80%; max-height: 40%;}

    #main #section-service {padding: 40px 15px;}
    #main #section-service .section-inner {}
    #main #section-service .service-list {flex-direction: column; gap: 15px;}
    #main #section-service .service-list .service-item {width: 100%; padding: 20px 20px 25px; min-height: unset;}
    #main #section-service .service-list .service-item .item-head {}
    #main #section-service .service-list .service-item .item-head .head-tit {font-size: 20px;}
    #main #section-service .service-list .service-item .item-head .btn-link {top: 10px;}
    #main #section-service .service-list .service-item .item-content {}
    #main #section-service .service-list .service-item .item-content .post-list {}
    #main #section-service .service-list .service-item .item-content .post-list .post-item {}
    #main #section-service .service-list .service-item .item-content .post-list .post-item .post-tit {font-size: 14px;}
    #main #section-service .service-list .service-item .item-content .post-list .post-item .post-date {font-size: 14px;}
    #main #section-service .service-list .service-item .item-content .inquiry-desc {font-size: 14px;}
    #main #section-service .service-list .service-item .item-content .inquiry-icon {max-width: 60px; right: 0;}

    #main #section-branch {}
    #main #section-branch .section-inner {}
    #main #section-branch .branch-list {flex-direction: column;}
    #main #section-branch .branch-list .branch-item {height: unset; gap: 12px; aspect-ratio: 720 / 320 auto;}
    #main #section-branch .branch-list .branch-item .item-tit {font-size: 16px;}
    #main #section-branch .branch-list .branch-item .item-desc {}
    #main #section-branch .branch-list .branch-item .btn-link {display: inline-flex; align-items: center;}

    /* SUB PAGES STYLES */
    body:not(#main) .section-banner {height: 360px;}
    body:not(#main) .section-banner::after {display: none;}
    body:not(#main) .section-banner .section-inner {}
    body:not(#main) .section-banner .banner-txt {}
    body:not(#main) .section-banner .banner-txt .txt-tit {font-size: 18px;}
    body:not(#main) .section-banner .banner-txt .txt-desc {font-size: 48px; text-align: center;}
    body:not(#main) .section-sub {width: 100%; top: 0; padding-bottom: 0;}
    body:not(#main) .section-sub .section-inner {position: relative; top: -70px; width: 100%; padding: 0 15px;}
    body:not(#main) .section-sub .section-inner {}
    body:not(#main) .section-sub .breadcrumbs {justify-content: center; margin-bottom: 0; padding: 30px 0 60px; background-color: #fff;}
    body:not(#main) .section-sub .breadcrumbs > ul {}
    body:not(#main) .section-sub .breadcrumbs > ul .home {width: 15px; height: 14px;}
    body:not(#main) .section-sub .breadcrumbs > ul > li {font-size: 14px;}
    body:not(#main) .section-sub .content-head > span {font-size: 30px;}
    body:not(#main) .section-sub .content-head > span > em {}
    body:not(#main) .section-sub .content-head > span > strong {}
    body:not(#main) .section-sub .content-table .pagination .btn-first,
    body:not(#main) .section-sub .content-table .pagination .btn-prev,
    body:not(#main) .section-sub .content-table .pagination .btn-next,
    body:not(#main) .section-sub .content-table .pagination .btn-last {width: 32px; height: 32px;}
    body:not(#main) .section-sub .content-table .pagination .pages {gap: 24px; margin-inline: 18px;}
    body:not(#main) .section-sub .content-table .pagination .pages > a {font-size: 15px;}
    /* introduce */
    #introduce {}
    #introduce #section-introduce {}
    #introduce #section-introduce .section-inner {}
    #introduce #section-introduce .introduce-content {flex-direction: column; gap: 30px;}
    #introduce #section-introduce .introduce-content .content-img {width: 100%;}
    #introduce #section-introduce .introduce-content .content-img > img {}
    #introduce #section-introduce .introduce-content .content-txt {width: 100%; padding-top: 0;}
    #introduce #section-introduce .introduce-content .content-txt .txt-main {}
    #introduce #section-introduce .introduce-content .content-txt .txt-main > h2 {font-size: 20px;}
    #introduce #section-introduce .introduce-content .content-txt .txt-desc {}
    #introduce #section-introduce .introduce-content .content-txt .txt-desc > p {font-size: 16px;}
    #introduce #section-introduce .introduce-content .content-txt .txt-sign {text-align: center;}
    #introduce #section-introduce .introduce-content .content-txt .txt-sign > span {font-size: 14px;}
    #introduce #section-introduce .introduce-content .content-txt .txt-sign > span > strong {margin-left: 10px;}

    /* ideology */
    #ideology {}
    #ideology #section-ideology {}
    #ideology #section-ideology .section-inner {}
    #ideology #section-ideology .ideology-content {}
    #ideology #section-ideology .ideology-content .content-head {}
    #ideology #section-ideology .ideology-content .content-head > span {}
    #ideology #section-ideology .ideology-content .content-head > span > em {}
    #ideology #section-ideology .ideology-content .content-head > span > strong {}
    #ideology #section-ideology .ideology-content .content-items {flex-wrap: wrap; gap: 20px; margin-top: 40px;}
    #ideology #section-ideology .ideology-content .content-items .item {width: calc((100% / 2) - 10px);}
    #ideology #section-ideology .ideology-content .content-items .item:nth-child(even) {margin-top: 0;}
    #ideology #section-ideology .ideology-content .content-items .item:nth-child(odd) {position: relative; top: 40px;}
    #ideology #section-ideology .ideology-content .content-items .item .item-img {}
    #ideology #section-ideology .ideology-content .content-items .item .item-img > img {}
    #ideology #section-ideology .ideology-content .content-items .item .item-txt {bottom: 30px;}
    #ideology #section-ideology .ideology-content .content-items .item .item-txt .txt-tit {font-size: 18px;}
    #ideology #section-ideology .ideology-content .content-items .item .item-txt .txt-desc {font-size: 14px;}
    #ideology #section-ideology .ideology-content .content-txt {margin-top: 80px;}
    #ideology #section-ideology .ideology-content .content-txt .txt-desc {}
    #ideology #section-ideology .ideology-content .content-txt .txt-desc > p {font-size: 16px;}
    #ideology #section-ideology .ideology-content .content-txt .txt-desc > p > b {}

    /* history */
    #history {}
    #history #section-history {}
    #history #section-history .section-inner {}
    #history #section-history .history-content {}
    #history #section-history .history-content .content-head {}
    #history #section-history .history-content .content-head > span {}
    #history #section-history .history-content .content-head > span > em {}
    #history #section-history .history-content .content-head > span > strong {}
    #history #section-history .history-content .content-items {gap: 30px;}
    #history #section-history .history-content .content-items .item {}
    #history #section-history .history-content .content-items .item .item-img {position: relative; left: -15px; width: calc(100% + 30px); height: unset; aspect-ratio: 720 / 350 auto;}
    #history #section-history .history-content .content-items .item .item-img > img {height: 100%; object-fit: cover;}
    #history #section-history .history-content .content-items .item .item-info {position: relative; flex-direction: column; gap: 20px; margin-top: -40px; padding-inline: 0; z-index: 1;}
    #history #section-history .history-content .content-items .item .item-info .info-card {width: 210px; padding: 15px 20px 20px; transform: unset; border-radius: 0 0 0 40px;}
    #history #section-history .history-content .content-items .item:nth-child(even) .item-info {flex-direction: column;}
    #history #section-history .history-content .content-items .item:nth-child(even) .item-info .info-card {margin-left: auto; border-radius: 0 0 40px 0;}
    #history #section-history .history-content .content-items .item .item-info .info-card .card-name {font-size: 20px;}
    #history #section-history .history-content .content-items .item .item-info .info-card .card-years {margin-top: 4px; font-size: 28px;}
    #history #section-history .history-content .content-items .item .item-info .info-card .card-desc {margin-top: 4px; font-size: 14px;}
    #history #section-history .history-content .content-items .item .item-info .info-history {}
    #history #section-history .history-content .content-items .item .item-info .info-history .history-row {gap: 20px;}
    #history #section-history .history-content .content-items .item .item-info .info-history .history-row .row-tit {font-size: 18px; line-height: 1.28;}
    #history #section-history .history-content .content-items .item .item-info .info-history .history-row .row-desc {font-size: 16px;}

    /* partner */
    #partner {}
    #partner #section-partner {}
    #partner #section-partner .section-inner {}
    #partner #section-partner .partner-content {}
    #partner #section-partner .partner-content .content-head {}
    #partner #section-partner .partner-content .content-head > span {}
    #partner #section-partner .partner-content .content-head > span > em {}
    #partner #section-partner .partner-content .content-head > span > strong {}
    #partner #section-partner .partner-content .partner-list {gap: 15px 10px; margin-top: 40px;}
    #partner #section-partner .partner-content .partner-list .partner-item {width: calc((100% / 2) - 5px); height: unset; aspect-ratio: 320 / 130 auto;}
    #partner #section-partner .partner-content .partner-list .partner-item > img {max-width: 80%; max-height: 40%;}

    /* location */
    #location {}
    #location #section-location {}
    #location #section-location .section-inner {}
    #location #section-location .location-content {gap: 40px;}
    #location #section-location .location-content .branch-item {}
    #location #section-location .location-content .branch-item .item-head {}
    #location #section-location .location-content .branch-item .item-head > span {font-size: 30px;}
    #location #section-location .location-content .branch-item .item-map {margin-top: 40px;}
    #location #section-location .location-content .branch-item .item-desc {flex-wrap: wrap; gap: 10px; margin-top: 20px;}
    #location #section-location .location-content .branch-item .item-desc .contact-way {}
    #location #section-location .location-content .branch-item .item-desc .contact-way .way-icon {width: 20px;}
    #location #section-location .location-content .branch-item .item-desc .contact-way .way-icon > img {}
    #location #section-location .location-content .branch-item .item-desc .contact-way .way-desc {font-size: 15px;}

    /* product */
    #product {}
    #product #section-product {}
    #product #section-product .section-inner {}
    #product #section-product .product-content {}
    #product #section-product .product-content .content-tab {gap: 10px;}
    #product #section-product .product-content .content-tab .btn-tab {width: calc((100% / 2) - 5px); height: unset; aspect-ratio: 320 / 90 auto; font-size: 16px;}
    #product #section-product .product-content .content-table {margin-top: 30px;}
    #product #section-product .product-content .content-table .table-wrapper {overflow: auto; width: calc(100% + 30px); margin-inline: -15px; padding-inline: 15px;}
    #product #section-product .product-content .content-table .table-wrapper > table {width: 800px;}
    #product #section-product .product-content .content-table .table-wrapper > table > thead {}
    #product #section-product .product-content .content-table .table-wrapper > table > thead > tr {}
    #product #section-product .product-content .content-table .table-wrapper > table > thead > tr > th {height: 74px; font-size: 16px;}
    #product #section-product .product-content .content-table .table-wrapper > table > tbody {}
    #product #section-product .product-content .content-table .table-wrapper > table > tbody > tr {}
    #product #section-product .product-content .content-table .table-wrapper > table > tbody > tr > td {height: 74px; font-size: 16px;}

    /* news */
    #news {}
    #news #section-news {}
    #news #section-news .section-inner {}
    #news #section-news .news-content {}
    #news #section-news .news-content .content-search {height: 120px; padding-inline: 15px;}
    #news #section-news .news-content .content-search > select {height: 42px; font-size: 14px; padding-inline: 8px;}
    #news #section-news .news-content .content-search > input {height: 42px; font-size: 14px; padding-inline: 8px;}
    #news #section-news .news-content .content-search .btn-search {height: 42px; font-size: 14px;}
    #news #section-news .news-content .content-table {margin-top: 40px;}
    #news #section-news .news-content .content-table .table-wrapper {}
    #news #section-news .news-content .content-table .table-wrapper > table {}
    #news #section-news .news-content .content-table .table-wrapper > table > colgroup {}
    #news #section-news .news-content .content-table .table-wrapper > table > tbody {}
    #news #section-news .news-content .content-table .table-wrapper > table > tbody > tr {}
    #news #section-news .news-content .content-table .table-wrapper > table > tbody > tr > td {height: 90px; font-size: 16px;}
    #news #section-news .news-content .content-table .table-wrapper > table > tbody > tr > td .index {font-size: 32px;}
    #news #section-news .news-content .content-table .table-wrapper > table > tbody > tr > td .date {font-size: 14px; margin-top: 8px;}
    #news #section-news .news-content .content-table .table-wrapper > table > tbody > tr > td > a {width: 32px; height: 32px;}
    #news #section-news .news-content .content-table .table-wrapper > table > tbody > tr > td > a > img {}

    /* news_detail */
    #news_detail {}
    #news_detail #section-news_detail {}
    #news_detail #section-news_detail .section-inner {}
    #news_detail #section-news_detail .news_detail-content {}
    #news_detail #section-news_detail .news_detail-content .content-head {padding: 30px 0; gap: 12px;}
    #news_detail #section-news_detail .news_detail-content .content-head .tit {font-size: 20px;}
    #news_detail #section-news_detail .news_detail-content .content-head .date {}
    #news_detail #section-news_detail .news_detail-content .content-desc {padding: 30px 0;}
    #news_detail #section-news_detail .news_detail-content .content-desc > p {font-size: 16px;}
    #news_detail #section-news_detail .news_detail-content .content-button {margin-top: 30px;}
    #news_detail #section-news_detail .news_detail-content .content-button .btn-back {width: 60px;}
    #news_detail #section-news_detail .news_detail-content .content-button .btn-back > img {}

    /* inquiries */
    #inquiries {}
    #inquiries #section-inquiries {}
    #inquiries #section-inquiries .section-inner {}
    #inquiries #section-inquiries .inquiries-content {}
    #inquiries #section-inquiries .inquiries-content .content-term {}
    #inquiries #section-inquiries .inquiries-content .content-term .term-tit {font-size: 18px;}
    #inquiries #section-inquiries .inquiries-content .content-term .term-content {height: 150px;}
    #inquiries #section-inquiries .inquiries-content .content-term .term-content > p {font-size: 16px; line-height: 1.55;}
    #inquiries #section-inquiries .inquiries-content .content-term .term-check {}
    #inquiries #section-inquiries .inquiries-content .content-term .term-check .checkbox {justify-content: center;}
    #inquiries #section-inquiries .inquiries-content .content-term .term-check .checkbox > input {}
    #inquiries #section-inquiries .inquiries-content .content-term .term-check .checkbox > label {}
    #inquiries #section-inquiries .inquiries-content .content-term .term-check .checkbox > label > span {}
    #inquiries #section-inquiries .inquiries-content .content-form {}
    #inquiries #section-inquiries .inquiries-content .content-form .form-item {}
    #inquiries #section-inquiries .inquiries-content .content-form .form-item .item-label {width: 80px;}
    #inquiries #section-inquiries .inquiries-content .content-form .form-item .item-label > span {font-size: 16px;}
    #inquiries #section-inquiries .inquiries-content .content-form .form-item .item-element {}
    #inquiries #section-inquiries .inquiries-content .content-form .form-item .item-element > input {padding: 0 8px 4px; font-size: 14px;}
    #inquiries #section-inquiries .inquiries-content .content-form .form-item .item-element > textarea {height: 120px; padding: 12px; font-size: 14px;}
    #inquiries #section-inquiries .inquiries-content .form-button {margin-top: 30px;}
    #inquiries #section-inquiries .inquiries-content .form-button .btn-inquiry {width: 180px; height: 60px; font-size: 16px;}
}

#layer {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); opacity: 0; z-index: -1; transition: opacity 0.15s, z-index 0.15s;}
#layer.active {opacity: 1; z-index: 100;}
#popup {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 680px; max-width: 90%; background-color: #fff; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); border-radius: 12px; padding: 0 20px; opacity: 0; z-index: -1; transition: opacity 0.15s, z-index 0.15s;}
#popup.active {opacity: 1; z-index: 105;}
#popup .popup-head {display: flex; justify-content: space-between; align-items: center; padding: 20px 0;}
#popup .popup-head > span {font-size: 18px; font-weight: 700; color: #333;}
#popup .popup-head .btn-close {width: 18px;}
#popup .popup-head .btn-close > img {width: 100%;}
#popup .popup-body {height: 400px; max-height: 65vh; overflow: auto;}
#popup .popup-body .term-contents {padding: 0;}
#popup .popup-body .term-contents > p {font-size: 16px; font-weight: 400; color: #333; line-height: 1.28; white-space: pre-line;}
#popup .popup-footer {display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding: 12px 0;}
#popup .popup-footer button {display: inline-flex; justify-content: center; align-items: center; min-width: 120px; padding: 8px 12px; border: 1px solid #333; border-radius: 6px; font-size: 15px; font-weight: 500; color: #333;}
#popup .popup-footer .btn-confirm {background-color: #fff; border: 1px solid #333; color: #333;}
#popup .popup-footer .btn-cancel {background-color: #333; border: 1px solid #333; color: #fff;}

::-webkit-scrollbar {width: 4px; height: 4px;}
::-webkit-scrollbar-track {background-color: #fff;}
::-webkit-scrollbar-thumb {background: rgba(0, 0, 0, .5); border-radius: 12px;}

@media (max-width: 767px) {
}