@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css");
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");


/*
*****************************************
* CSS Variables
* ***************************************
* Site : comfy
* File : custom.css
* DATE : 2026.02.19
*
* SUMMARY :
* 1) Jupiter X Reset 
* 2) HEADER
* 3) MAIN
* 4) FOOTER
* 5) SUB
* 6) RESPONSIBILITY

* br767 - 767
* br1024 - 1024
* br1250 - 1250
* br04 - 
* br05 - 
*/

/* ************************************************
*************** Jupiter X Reset *******************
************************************************* */
/* Reset */
html{scrollbar-gutter:stable !important;}
html, body{overflow-x: hidden !important;}
.jupiterx-main-content > .container > .row{margin-right:0 !important; margin-left:0 !important;}
.jupiterx-main-content{padding:0 !important;}
.container,.jupiterx-main-content > .container > .row > [class*=col-]{padding-left:0 !important; padding-right:0 !important;}
.jupiterx-post-header{display:none !important;}
p{margin-bottom:0 !important;}
a {text-decoration: none !important;}
a:hover{text-decoration: none !important;}
svg{margin: 0 !important;}
.elementor-icon-list-text{padding-inline-start: 0px !important;}
.font, .font div,.font a,.font p,.font span,.font h1, .font h2,.font h3,.font h4,.font h5,.font h6,.font input, .font textarea,.font button, .font label{font-family: "Inter", "Pretendard Variable", "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif !important; word-break: keep-all;}
.fontKO, .fontKO div,.fontKO a,.fontKO p,.fontKO span,.fontKO h1, .fontKO h2,.fontKO h3,.fontKO h4,.fontKO h5,.fontKO h6,.fontKO input, .fontKO textarea,.fontKO button, .fontKO label{font-family: "Pretendard Variable", "Pretendard", "Inter", -apple-system, BlinkMacSystemFont, system-ui, "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif !important; word-break: keep-all;}


/* ************************************************
********************* HEADER ************************
************************************************* */
header{position: absolute !important; width: 100%;}

#header .nav-menu{-webkit-backdrop-filter: blur(17.5px); backdrop-filter: blur(17.5px);}
#header .nav-menu nav > ul{gap: 20px;}
#header .nav-menu nav > ul::after,
#header .nav-menu nav .sub-arrow{display: none;}
#header .nav-menu nav .sub-menu{min-width: 150px !important; padding: 12px;}
#header .nav-menu nav > ul > li > .sub-menu{left: 50% !important; transform: translateX(-50%);}
#header .nav-menu nav > ul > li > .sub-menu a{justify-content: center; border-inline-start: 0px solid transparent; border-radius: 8px; height: 42px;}
#header .nav-menu nav > ul > li > .sub-menu a:hover{font-weight: 500 !important;}
#header .nav-menu nav > ul > li > .sub-menu a.elementor-item-active{font-weight: 500 !important;}
#header .nav-menu nav > ul > li.current-menu-parent > a::before{opacity: 1; background-color: #6BBD44 !important;}

#header .lang .wpml-ls-current-language a{color: #fff !important;}
#header .lang .wpml-ls-current-language a::after{opacity: 1 !important; background-color: #fff !important;}
#header .lang.lang-b .wpml-ls-current-language a{color: #1F332D !important;}
#header .lang.lang-b .wpml-ls-current-language a::after{opacity: 1 !important; background-color: #1F332D !important;}


#header.on{background-color: rgba(24, 67, 55, 0.45);  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
#header.on .logo img{content: url(/wp-content/uploads/2026/02/logo-1.svg);}
#header.on .lang .wpml-ls-menu-item a{color: rgba(255, 255, 255, 0.5) !important;}
#header.on .lang .wpml-ls-current-language a{color: #fff !important;}
#header.on .lang .wpml-ls-current-language a::after{background-color: #fff !important;}


/* menu - mo */
#pop_menu .nav_btn.lang .raven-widget-wrapper{height: 26px;}

.menu_pop li.current-menu-parent > a,
.menu_pop li.current-menu-item > a{border-radius: 8px; border-bottom: none !important; background: linear-gradient(180deg, #F7F8F7 0%, #DFE9DA 100%) !important; color: #2E6016 !important;}
.menu_pop li.current-menu-parent > a .sub-arrow svg path{fill: #2E6016;}
.menu_pop li.current-menu-parent > a.highlighted .sub-arrow svg path{fill: #2E6016;}
.menu_pop li > a.highlighted .sub-arrow svg path{fill: #2E6016;}
.menu_pop li > a.highlighted .sub-arrow{transform: rotate(180deg);}

.menu_pop a.highlighted{border-bottom: 1px solid #E6E6E6 !important;}
.menu_pop a .sub-arrow{padding: 0;position: absolute; right: 12px;}
.menu_pop a .sub-arrow svg path{fill: #1F332D;}

.menu_pop ul.sub-menu li a{padding: 12px 12px !important; border-left: 0; border-bottom: 1px solid #E6E6E6 !important; font-weight: 500 !important; font-size: 15px !important; color: #1F332D !important;}
.menu_pop ul.sub-menu li a.elementor-item-active{border-radius: 0; background: #fff !important; color: #6BBD44 !important;}

/* ************************************************
********************* MAIN ************************
************************************************* */
.btn01 a{-webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);}
.btn01.btn02:hover svg path{stroke: #fff !important;}

/* sec01 */
#sec01{background:url("/wp-content/uploads/2026/02/sec01-bg.png"), linear-gradient(180deg, #143D32 0%, #35A385 100%) !important; background-position: top center !important;     background-repeat: no-repeat !important; background-size: cover !important;}
#sec01::after{content: ""; display: block; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 52.01%, #FFF 100%); position: absolute; left: 0; top: 0; z-index: 0;}

/* sec02 */
.sec02-box{-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);}
.sec02-box::after{opacity: 0; content: ""; display: block; width: 59%; height: auto; aspect-ratio: 1 / 1; border-radius: 100%; background-color: #6BBD44; -webkit-filter: blur(110px); filter: blur(110px); position: absolute; left: 50%; top: 82px; z-index: -1; transform: translateX(-50%); transition: all 0.3s;}
.sec02-box:hover::after{opacity: 1;}
.sec02-box:hover .sec02-box-txt .jet-headline__first span{color:#2E6016 !important;}

/* sec03 */
.pro-list::before{content: ""; display: block; width: 100%; height: 105%; background-color: #fff; position: absolute; left: -100%; top: -5px; z-index: 2;}
.pro-list .swiper{overflow: unset;}
.pro-list-img{aspect-ratio: 1 / 1; overflow: hidden; border-radius: 12px 12px 12px 12px;}
.pro-list-img img{width: 100%; height: 100% !important; object-fit: cover;}
.pro-list-wrap{transition: all 0.3s !important;}

.pro-list-wrap:hover .pro-list-tit h4{color: #2E6016 !important;}

/* Inquiry */
#contact input:focus, #contact textarea:focus {outline: none;}
#contact .form_input_wrap{margin-bottom: 20px; display: flex; gap: 20px;} 
#contact .form_input_wrap .form_input{display: flex; flex: 1;} 
#contact .form_input_wrap .form_input p, 
#contact .input_message p{display: flex; flex: 1; flex-wrap: wrap;} 
#contact .form_input_wrap .form_input p label, 
#contact .input_message p label{margin-bottom: 14px; width: 100%; font-weight: 500; font-size: 16px; color: #1F332D; line-height: 145%;} 
#contact .form_input_wrap .form_input p label span,
#contact .input_message p label span{margin-left: 4px; font-weight: 500; font-size: 16px; color: #377F14; line-height: 145%; vertical-align: top;} 
#contact .form_input_wrap .form_input p > span,
#contact .input_message p > span{flex: 1;}
#contact .form_input_wrap .form_input p > span > input,
#contact .input_message p > span > textarea{padding: 18px 32px; width: 100%; height: 58px; border: 0px; border-radius: 100px; font-weight: 500; font-size: 15px; color: #1F332D; line-height: 150%;}

#contact .input_message{margin-bottom: 13px;}
#contact .input_message p > span > textarea{height: 169px; border-radius: 30px;}

#contact .form_acceptance_wrap{display: flex; align-items: center; justify-content: space-between;}
#contact .form_acceptance{text-align: center;}
#contact .form_acceptance .wpcf7-list-item{margin: 0;}
#contact .form_acceptance .wpcf7-list-item label{margin: 0; display: flex; align-items: center;}
#contact .form_acceptance .wpcf7-list-item .wpcf7-list-item-label{font-weight: 500; font-size: 16px; color: #1F332D; line-height: 145%;}
#contact .form_acceptance input[type="checkbox"] {-webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0 12px 0 0; background: #fff; border-radius: 5px; cursor: pointer; width: 20px;  height: 20px; outline: 0; border: 1px solid #9BAAA6; border-radius: 4px; padding: 0;}
#contact .form_acceptance input[type="checkbox"]:checked {background: #6BBD44; border: 1px solid #6BBD44;}

#contact .form_submit p{text-align: start;} 
#contact .form_submit input{padding: 18px 56px 18px 30px; border: 0; border-radius: 8px; background-color: #6BBD44; background-image: url(/wp-content/uploads/2026/02/arrow.svg); background-repeat: no-repeat; background-position: calc(100% - 30px) center; background-size: 16px; font-weight: 500; font-size: 16px; color: rgba(255, 255, 255, 0.9); line-height: 145%; transition: all 0.3s;}
#contact .form_submit:hover input{background-color: #4E8D30;}

#contact .wpcf7-not-valid-tip{font-size: 13px !important; position: absolute; bottom: -18px; left: 0; width: 100% !important;}
#contact .input_message .wpcf7-not-valid-tip{bottom: -13px;}
#contact .wpcf7-spinner{display: none !important;}

#contact input::placeholder{opacity: 0.9; font-weight: 400; color: #7A8884;}
#contact input::-webkit-input-placeholder{opacity: 0.9; font-weight: 400; color: #7A8884;}
#contact input:-ms-input-placeholder{opacity: 0.9; font-weight: 400; color: #7A8884;}
#contact textarea::placeholder{opacity: 0.9; font-weight: 400; color: #7A8884;}
#contact textarea::-webkit-input-placeholder{opacity: 0.9; font-weight: 400; color: #7A8884;}
#contact textarea:-ms-input-placeholder{opacity: 0.9; font-weight: 400; color: #7A8884;}

/* ************************************************
********************* FOOTER **********************
************************************************* */
.home .jupiterx-footer{display: none; }
.page-id-517 .jupiterx-footer{display: none; }
.page-id-929 .jupiterx-footer{display: none; }



/* ************************************************
********************** SUB ************************
************************************************* */
/* Brand */
.Brand-bar{background: linear-gradient(90deg, rgba(255, 255, 255, 0.00) 0%, #FFF 50%, rgba(255, 255, 255, 0.00) 100%), linear-gradient(90deg, rgba(255, 255, 255, 0.00) 0%, #FFF 50%, rgba(255, 255, 255, 0.00) 100%);}

/* products */
.pro-menu nav ul{gap: 40px !important;}
.pro-menu nav ul li a{justify-content: center; padding-bottom: 12px !important; transition: all 0.3s ease-in-out !important;}
.pro-menu nav > ul::after{display: none;}

.pro-list-sub article > div{height: 100%;}
.pro-list-sub article > div .pro-list-wrap{height: 100%;}
.pro-list-sub article > div .pro-list-wrap .txt-wrap{height: 100%;}
.pro-list-desc{display: -webkit-box; text-overflow: ellipsis; overflow: hidden; white-space: normal; word-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.sixSeries-menu fieldset{display: flex; gap: 8px; padding: 8px !important; flex-wrap: wrap; justify-content: center; align-items: center;}
.sixSeries-menu .jet-filter-row{margin: 0 !important; padding: 0 !important;}
.sixSeries-menu label{margin: 0 !important;}

/* detail */
.detail-gra div{background: linear-gradient(90deg, #184337 0%, #6BBD44 50.48%, #3DA98B 100%); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;}
.detail-video .jet-video__play-button{-webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);}

/* ************************************************
***************** RESPONSIBILITY *******************
************************************************* */
@media (max-width:1250px){
    .br1250{display: none;}

    .detail-bottom-wrap{width: 80% !important;}
}
@media (max-width:1024px){
    .br1024{display: none;}

    /* sec02 */
    .sec02-box::after{width: 70.23%; top: 70px;}

    /* products */
    .pro-menu nav ul{gap: 34px !important;}
    .pro-menu nav ul li a{padding-bottom: 10px !important;}

    .detail-bottom-wrap{width: 90% !important;}
}
@media (max-width:767px){
    .br767{display: none;}

    /* sec02 */
    .sec02-box::after{width: 220px; top: 40px;}

    /* products */
    .pro-menu nav ul{gap: 16px !important;}
    .pro-menu nav ul li a{padding-bottom: 8px !important;}

    .sixSeries-menu fieldset{gap: 0px; padding: 6px !important;}

    .detail-bottom-wrap{width: 100% !important;}
}
@media (max-width:550px){
    #contact .form_input_wrap{flex-direction: column;}
    #contact .form_input_wrap .form_input p label, 
    #contact .input_message p label{margin-bottom: 6px; font-size: 15px;} 
    #contact .form_input_wrap .form_input p label span,
    #contact .input_message p label span{font-size: 15px;} 
    #contact .form_input_wrap .form_input p > span > input,
    #contact .input_message p > span > textarea{padding: 14px 20px; height: 50px; font-size: 14px;}
    #contact .input_message p > span > textarea{height: 140px;}
    #contact .form_acceptance_wrap{flex-direction: column; gap: 10px;}
    #contact .form_acceptance input[type="checkbox"]{width: 18px; height: 18px;}
    #contact .form_acceptance .wpcf7-list-item .wpcf7-list-item-label{font-size: 15px;}
    #contact .form_submit input{padding: 14px 46px 14px 20px; background-position: calc(100% - 20px) center; font-size: 15px;}

    /* products */
    .pro-menu nav ul{display: grid !important; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr;}
}