/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.4.1749798527
Updated: 2025-06-13 07:08:47

*/

/* gnb */
.gnb 
{position: fixed; top: 40%; transform: translateX(-50%); left: 8rem; z-index: 10;}
.gnb ul .dot-wrap a .dot-btn
{display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem;}
.gnb ul .dot-wrap a .dot-btn p
{font-size: 1.4rem; font-weight: 600; color: #c3c4c7;}
.gnb ul .dot-wrap a.active .dot-btn p
{color: var(--main-color);}
.gnb ul .dot-wrap a .dot-btn .dot
{display: block; width: 10px; height: 10px; border-radius: 50%; background-color: #fff; border: 1px solid var(--main-color); transition: all 0.3s ease;}

.gnb ul .dot-wrap a.active .dot-btn .dot
{background-color: var(--main-color);}
.gnb ul .dot-wrap a .bar
{margin-left: 0.35rem; display: block; width: 1px; height: 0; margin-bottom: 0; background-color: var(--main-color); transition: all 0.3s ease;}
.gnb ul .dot-wrap a.active .bar
{height: 14rem; margin-bottom: 2rem;}

/* visualCon */
.visual-container
{position: relative;}
.visual-slide01, .visual-slide02, .visual-slide03
{width: 100%; height: 80rem; background-repeat: no-repeat; background-position: center;}

.visual-container .txt-wrap
{position: absolute; transform: translateY(64rem); width: 100%; z-index: 3;}
.visual-container .txt-wrap h2 
{display: inline-block; padding: 2rem 0 1.5rem; font-size: 4.2rem; font-weight: 400; line-height: 1.4; letter-spacing: -0.8px; color: #fff;}

.visual-container .txt-wrap h2 .font {font-size: 4.2rem; font-weight: 400;}
/* .visual-container .txt-wrap h2 .font.blue {color: #00c2ff;} */
.visual-container .txt-wrap h2 .font.red {color: var(--main-color); font-weight: 700;}


/* 반응형 비주얼 이미지 안보임 현상 */
.slick-slider .slick-track, .slick-slider .slick-list 
{height: 100%;}
.elementor-element-2341cb1,
.elementor-element-2341cb1 .elementor-widget-container,
.elementor-element-2341cb1 .elementor-widget-container .visual-container, 
.elementor-element-2341cb1 .elementor-widget-container .visual-container .slick-slider
{height: 100%; min-height: 35rem;}
.elementor-element-2341cb1 .elementor-widget-container .visual-container .slick-slider .slick-slide img 
{height: 100%; object-fit: cover; min-height: 35rem;}

/* scroll down */
.scroll-down-wrap a
{position: absolute; right: 0; bottom: 0; display: flex; gap: 1rem;}
.scroll-down-wrap p
{font-size: 1.4rem; font-weight: 400; color: #fff;}
.scroll-down-wrap .down-arrow-wrap
{width: 1.5rem; height: 1.5rem;display: inline-block; animation: rotation 1.5s infinite;}
.scroll-down-wrap .down-arrow-wrap i
{color: #fff; font-size: 2rem;}
@keyframes rotation {
  0% {transform: translateY(-1rem); opacity: 1;}
  100% {transform: translateY(1rem); opacity: 0;}
}

/* 페이지네이션 버튼 */
.main-visual-controls
{position: absolute; top: 0; left: 0;}
.main-visual-controls .visual-pagination ul
{width: 100%; display: flex;}
.main-visual-controls .visual-pagination .dot-wrap .dot
{width: 1rem; height: 1rem; border: 1px solid #fff; border-radius: 50%; margin-right: 1rem; display: flex; align-items: center; cursor: pointer;}
.main-visual-controls .visual-pagination .dot-wrap.active .dot
{background-color: #fff;}
.main-visual-controls .visual-pagination .dot-wrap
{display: flex; align-items: center;}

/* 페이지네이션 바 */
.main-visual-controls .visual-pagination .dot-wrap .bar
{display: block; width: 0; height: 1px; background-color: #ffffff30; margin-left: 0; transition: all 0.3s ease;}
.main-visual-controls .visual-pagination .dot-wrap.active .bar
{display: block; width: 14rem; height: 1px; background-color: #ffffff30; margin-right: 2rem;}

/* 페이지네이션 게이지 */
.main-visual-controls .visual-pagination .dot-wrap .bar .bar-fill
{display: block; width: 0px; height: 1px; background-color: #ffffff; transition: none;}
.main-visual-controls .visual-pagination .dot-wrap.active .bar .bar-fill
{display: block; width: 100%; height: 1px; background-color: #ffffff; animation: bar-fill-ani 2.7s linear forwards;}

@keyframes bar-fill-ani 
{from {width: 0%;} to{width: 100%;}}

/* point sec01 */
.point-container 
{display: flex; align-items: center; height: 100vh;}
.point-wrap
{display: flex; justify-content: space-between; align-items: flex-end;}
.point-wrap .left-wrap 
{position: relative; padding-left: 4rem;}
.title-wrap
{padding: 6.5rem 0 2rem;}
.title-wrap h2
{font-size: 10rem; font-weight: 600; color: var(--txt-color); position: relative; z-index: 2;}
.title-wrap p
{position: absolute; top: 1.5rem; left: 0; font-size: 10rem; font-weight: 400; color: #dedede; z-index: 1;}
.about-wrap ul .item 
{display: flex; align-items: center; padding: 2.5rem 0; border-bottom: 1px solid #eeeeee; transition: all 0.3s ease;}
.about-wrap ul .item dt
{padding-right: 6rem; font-size: 2rem; font-weight: 500; color: #818181; white-space: nowrap; transition: all 0.3s ease;}
.about-wrap ul .item dt span
{font-size: 2.4rem; font-weight: 600;}
.about-wrap ul .item dd
{font-size: 2rem; font-weight: 400; line-height: 1.3; letter-spacing: -0.05rem; color: #818181; transition: all 0.3s ease;}
.about-wrap ul .item dd .red
{font-size: 2rem; font-weight: 700; transition: opacity 0.3s ease;}

/* hover */
.about-wrap ul .item:hover dt
{color: var(--main-color);}
.about-wrap ul .item:hover dd
{color: var(--txt-color);}

/* quick */
.quick-container
{display: flex; align-items: center; height: 100vh;}
.quick-wrap
{display: flex; justify-content: space-between;}
.quick-wrap .right-wrap
{position: relative; padding-right: 4rem;}
.quick-wrap .right-wrap .title-wrap
{padding-top: 8rem;}
.quick-wrap .right-wrap .title-wrap h2,.quick-wrap .right-wrap .title-wrap p
{font-size: 9.6rem; letter-spacing: -0.15rem;}
.quick-wrap .title-after
{left: auto; right: 0; top: 3rem;}
.quick-wrap .about-wrap ul .item
{justify-content: flex-end;}
.quick-wrap .about-wrap ul .item a
{display: flex; gap: 2rem; flex-direction: column; align-items: flex-end; transition: all 0.3s ease;}
.quick-wrap .about-wrap ul .item a .arrow
{display: inline-block; width: 0; height: 1.6rem; margin-left: 0; transition: all 0.3s ease;}
.quick-wrap .about-wrap ul .item a:hover .arrow
{width: 2.5rem; margin-left: 2rem; background: url(/wp-content/uploads/2025/06/more.png);}
.quick-wrap .about-wrap ul .item dt
{padding: 0; font-size: 2.4rem; color: var(--txt-color); font-weight: 600; transition: all 0.3s ease;}
.quick-wrap .about-wrap ul .item a:hover dt
{color: var(--main-color); font-weight: 700;}

/* contact */
#ContactCon {height: 100vh;}
.contact-container
{height: calc(100vh - 16.3rem); display: flex; align-items: center; background: url(/wp-content/uploads/2025/06/sec03-bg.jpg) no-repeat center /cover}
.contact-wrap
{display: flex; justify-content: space-between; align-items: center;}
.contact-wrap .left-wrap h2
{font-size: 7rem; color: #fff; font-weight: 700; margin-bottom: 5rem;}
.contact-wrap .left-wrap p,.contact-wrap .left-wrap p b
{font-size: 2rem; color: #fff; font-weight: 400; line-height: 1.6; letter-spacing: -0.05rem;}
.contact-wrap .left-wrap p b
{font-weight: 600;}
.contact-wrap .quick-btn
{width: 40rem;  border-top: 1px solid #fff; border-bottom: 1px solid #fff;}
.contact-wrap .quick-btn li a
{display: flex; justify-content: space-between; align-items: center; padding: 3rem 1rem; transition: all 0.3s ease;}
.contact-wrap .quick-btn li:nth-of-type(2)
{border-top: 1px solid #fff; border-bottom: 1px solid #fff;}
.contact-wrap .quick-btn li a p
{font-size: 2.4rem; color: #fff; font-weight: 700;}
.contact-wrap .quick-btn li a .arrow
{display: inline-block; width: 2.5rem; height: 1.6rem; filter: brightness(0) invert(1); background: url(/wp-content/uploads/2025/06/more.png); transition: all 0.3s ease;}
.contact-wrap .quick-btn li a:hover .arrow
{filter:none;}
.contact-wrap .quick-btn li a:hover
{transform: translateX(-2rem);}

@media screen and (max-width: 1300px) {
.scroll-down-wrap a {right: 6rem;}
.main-visual-controls {left: auto;}
.main-visual-controls .middle-container {padding: 0;}
.visual-container .txt-wrap {padding: 0 6rem; transform: translateY(60rem);}
.visual-container .txt-wrap h2,.visual-container .txt-wrap h2 .font {font-size: 3.8rem;}

.gnb ul .dot-wrap a .dot-btn p {display: none;}
.gnb {left: 2rem;}

.point-container .middle-container {padding: 0 4rem;}
.point-wrap {flex-flow: row wrap; align-items: center;}
.point-wrap .left-wrap,.point-wrap .right-wrap {width: 48%;}
.title-wrap h2 {font-size: 6rem;}
.title-wrap p {top: 3.5rem; font-size: 6rem;}
.about-wrap ul .item {padding: 2rem 0;}
.about-wrap ul .item dt {font-size: 1.8rem; padding-right: 3rem;}
.about-wrap ul .item dt span {font-size: 2rem;}
.about-wrap ul .item dd {font-size: 1.8rem; text-align: end;}
.about-wrap ul .item dd .red {font-size: 1.8rem;}

.quick-container .middle-container {padding: 0 4rem;}
.quick-wrap {flex-flow: row wrap;}
.quick-wrap .right-wrap, .quick-wrap .left-wrap {width: 48%;}
.quick-wrap .right-wrap {padding: 0;}
.quick-wrap .right-wrap .title-wrap h2, .quick-wrap .right-wrap .title-wrap p {font-size: 6rem; text-align: end;}
.quick-wrap .title-after {top: 5rem;}
.quick-wrap .about-wrap ul .item dt {font-size: 2.2rem;}
.quick-wrap .about-wrap ul .item a {gap: 1rem;}

.contact-container .middle-container {padding: 0 4rem;}
.contact-wrap {flex-flow: row wrap; gap:4rem;}
.contact-wrap .left-wrap h2 {font-size: 5rem; font-weight: 600; margin-bottom: 2rem;}
.contact-wrap .left-wrap p, .contact-wrap .left-wrap p b {font-size: 1.8rem; font-weight: 300;}
.contact-wrap .quick-btn li a p {font-size: 2.2rem;}
}
@media screen and (max-width: 1240px) {
.visual-container .txt-wrap h2, .visual-container .txt-wrap h2 .font {font-size: 3.4rem;}
.point-wrap .left-wrap {width: 63%;}
.point-wrap .right-wrap {width: 35%;}

.quick-wrap {align-items: center;}
.quick-wrap .left-wrap {width: 38%;}
.quick-wrap .right-wrap {width: 60%;}
.quick-wrap .right-wrap .title-wrap {padding-top: 0;}
.quick-wrap .title-after {top: -3rem;}
.quick-wrap .right-wrap .title-wrap h2, .quick-wrap .right-wrap .title-wrap p {font-size: 5rem;}

.contact-wrap .quick-btn li a p {font-size: 2rem; font-weight: 600;}
.contact-wrap .quick-btn li a {padding: 2.5rem 1rem}
.contact-container {height: 100dvh;}
.contact-wrap {padding-bottom: 14rem;}
#footer.main {position: absolute; bottom: 0;}
}
@media screen and (max-width: 1024px) {
*{word-break: keep-all;} .pc-br {display: none;}

.visual-container .txt-wrap {transform: translateY(0); left: 0; bottom: 10%;}
.visual-container .txt-wrap h2, .visual-container .txt-wrap h2 .font {font-size: 2.8rem;}
.main-visual-controls .visual-pagination .dot-wrap.active .bar {width: 10rem;}

.title-wrap {padding: 1rem 0;}
.title-wrap h2 {font-size: 4.5rem;}
.title-wrap p {font-size: 4.5rem; top: -2rem;}

.point-wrap .left-wrap {padding-left: 2rem;}
.point-wrap .about-wrap ul .item dd,.about-wrap ul .item dd .red {text-align: left; font-size: 1.6rem;}
.about-wrap ul .item dt,.about-wrap ul .item dt span {font-size: 1.7rem;}

.quick-wrap .right-wrap {padding-right: 2rem;}
.quick-wrap .right-wrap .title-wrap h2, .quick-wrap .right-wrap .title-wrap p {font-size: 4.5rem;}
.quick-wrap .about-wrap ul .item dt {font-size: 1.8rem;}
.about-wrap ul .item dd {font-size: 1.6rem;}

.contact-wrap {padding-bottom: 0;}
.contact-wrap .left-wrap h2 {font-size: 4.5rem;}
.contact-wrap .left-wrap p, .contact-wrap .left-wrap p b {font-size: 1.6rem;}
.contact-wrap .quick-btn li a p {font-size: 1.8rem;}

#footer.main {display: none;}

.fp-tableCell {display: block !important; height: auto !important;}
.point-container,.quick-container,.contact-container {height: auto; padding: 6rem 0; overflow: hidden;}
.fp-section.fp-table, .fp-slide.fp-table {height: auto !important;}


}
@media screen and (max-width: 767px) { 
.gnb {display: none;}
.visual-container .txt-wrap {padding: 0 2rem;}
.visual-container .txt-wrap h2, .visual-container .txt-wrap h2 .font {font-size: 2.4rem;}
.scroll-down-wrap a {right: 4rem;}

.point-wrap .left-wrap {padding-left: 0; width: 100%;}
.point-wrap .right-wrap {display: none;}
.point-container .middle-container {padding: 0 2rem;}
.about-wrap ul .item dt {padding-right: 2rem;}

.quick-container .middle-container {padding: 0 2rem;}
.quick-wrap .right-wrap {padding-right: 0;}
.title-wrap h2,.title-wrap p, .quick-wrap .right-wrap .title-wrap h2, .quick-wrap .right-wrap .title-wrap p {font-size: 3.5rem;}
.title-wrap p {top: -1rem;}
.quick-wrap .title-after {top: -2rem;}

.contact-wrap {justify-content: flex-start;}
.contact-wrap .left-wrap h2 {font-size: 3.5rem;}
.contact-wrap .right-wrap {width: 100%;}
.contact-wrap .quick-btn {width: 100%;}
.contact-wrap .quick-btn li a {padding: 2rem 1rem;}
.contact-wrap .quick-btn li a p {font-size: 1.6rem;}
}
@media screen and (max-width: 650px) { 
.point-container, .quick-container, .contact-container {padding: 5rem 0;}

.visual-container .txt-wrap h2 {padding: 3rem 0;}
.scroll-down-wrap a {right: 2rem;}
.visual-container .txt-wrap h2, .visual-container .txt-wrap h2 .font {font-size: 2.1rem;}
.scroll-down-wrap .down-arrow-wrap i {font-size: 1.7rem;}
.main-visual-controls .visual-pagination .dot-wrap.active .bar {width: 6rem; margin-right: 1rem;}

.title-wrap h2, .title-wrap p, .quick-wrap .right-wrap .title-wrap h2, .quick-wrap .right-wrap .title-wrap p {font-size: 2.8em;}
.title-wrap {padding: 0; padding-bottom: 1rem;}
.title-wrap p {top: -1.5rem;}
.point-container .about-wrap ul .item {flex-direction:column; align-items: flex-start; gap: 1rem;}

.quick-wrap .left-wrap {display: none;}
.quick-wrap .right-wrap {width: 100%;}

.contact-wrap {gap: 2rem;}
.contact-wrap .left-wrap h2 {font-size: 2.4rem; margin-bottom: 1rem;}
.contact-container .middle-container {padding: 0 2rem;}
 }