/* 
Theme Name: GoyoMinimal
Author: Goyo
Author URI: https://goyofunk.com
Description: 건축가, 디자이너, 문화, 예술 관련 업종을 위한 미니멀리즘 홈페이지 테마 
Version: 2.0
*/

@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");
* { margin: 0; padding: 0; box-sizing: border-box; } 

body { margin:0 auto; overflow:auto; overflow-x:hidden; position:relative; width:100%; -ms-overflow-style:none; } 
body,button,input,select,optgroup,textarea { 
    font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
    font-size: clamp(16px, 2.2vw, 18px); line-height:1.6; color:#000} 
h1, h2 { font-size:clamp(22px, 2.5vw, 28px) } 
h3 {font-size: 24px;}
h4 { font-size:20px; } 

a { display: inline-block; color:inherit; text-decoration:none; transition:all 0.2s; } 
a:hover,a:focus,a:active { text-decoration:none; } 
a:focus { outline:0; } 
a:hover,a:active { outline:0; } 
a:not([href]) { cursor: text;}
img, svg { max-width: 100%; } 
li { display: inline-block; list-style: none; } 
ul.dot li { list-style: disc; } 
ul.dot li::marker { color: #5ba6e4; } 
input[type="file"]::file-selector-button {background-color: #fff; color: #000; border: 1px solid #ddd;padding: 8px 15px;cursor: pointer;}
input[type="file"]::file-selector-button:hover { background-color: #fff;}
.alignleft {float: left;margin-right: 1.5em;}
.alignright {float: right;margin-left: 1.5em;}
.aligncenter {display: block;margin-left: auto;margin-right: auto;}
.displaynone {display: none !important;}

/* common  */
#wrap { position: relative; width: 100%; min-height: 100vh; } 
.container { margin:auto; padding-right: 10px; padding-left: 10px; position:relative; width:100%; max-width:1100px; } 
.post-content::after { clear: both;  content: '';  display: block;}
.container .row{ margin-right:-20px; margin-left:-20px; display: flex; flex-wrap: wrap;position:relative;}
.textNoMobile{display: block;}
.site-main {  position: relative; min-height:100vh; margin-bottom:0px;width: 100%;} 


/* 패턴  */
.pt-title{font-size: 30px; font-weight: 700; line-height: 1.4;letter-spacing: -0.5px;}
.bzCardGrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px 40px; } 
.bzCard{padding: 0px;  overflow: hidden;} 
.bzCard .wp-block-image{width: 100%;; overflow: hidden; display: flex; align-items: center; justify-content: center;}
.bzCard .wp-block-image img {min-height: 100%; min-width: 100%; max-width: 100%;object-fit: cover;}
.bzCard h4{margin: 20px 20px !important;padding-bottom: 0; font-size: 20px; font-weight: 500;  line-height: 1.4;}
.bzCard p{margin: 0px 30px 50px 30px !important; font-size: 16px; line-height: 1.5;}

.bzCardGrid2 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px 40px; } 
.bzCardGrid2 .bzCard h4{margin: 30px 0px 18px 0px !important;padding-bottom: 0; font-size: 22px; font-weight: 600;  line-height: 1.4;}
.bzCardGrid2 .bzCard p{margin: 0px 0px 50px 0px !important; font-size: 16px; line-height: 1.5;}

.pt-col-left h4{font-size: 24px; font-weight:500;  line-height: 1.4;}
.pt-col-left p{font-size: 17px; line-height: 1.5; }
.bzinfo_col{border: 1px solid #aaaaaa80; box-shadow: 0px 4px 5px rgba(0,0,0,0.05); border-radius: 12px; padding: 15px 20px; display: grid !important ;
    grid-template-columns: 120px auto; gap: 0;}
.bzinfo_col h4{font-size: 20px; font-weight: 600; margin-bottom: 10px;}
.bzinfo_col p{font-size: 17px; letter-spacing: -0.5px; line-height: 1.4; margin-top: 0;}

.faq-accordion { margin: 0 auto; max-width:780px;border-top: 1px solid #ddd; }
.faq-item { border-bottom: 1px solid #ddd; padding: 10px 0; margin-top: 0;}
.faq-question {  display: flex;  padding: 10px 0 10px 30px;font-size: 24px; font-weight: 500;align-items: center; cursor: pointer; position: relative;}
.faq-question::before { content: "\F64D"; font-family: "bootstrap-icons";  position: absolute;  left: 0; font-size: 22px;opacity: 0.6;}
.faq-answer {  display: none; margin-top: 10px; font-size: 18px;padding:10px 0 20px 30px; color: #555; line-height: 1.6;}
.serviceBoxWrap{ position: relative; width: 100%;margin-top:-20px !important }
.mainService-wrap { gap: 40px;padding:100px 0 !important; width: 100%;display: flex;flex-direction: column;}
.mainprodwrap{padding: 30px 0;}

/* 슬라이더 패턴 */
.metaslider .flex-control-nav{bottom: -5px !important;}
.metaslider .flexslider{margin: 0 0 10px !important;}
.flex-control-paging li a{width: 7px !important; height: 7px !important;}
.metaslider.ms-theme-default-base .flexslider .flex-direction-nav li a{background: transparent !important;  background-image: none !important;}
.metaslider.ms-theme-default-base .flexslider .flex-direction-nav li a:focus{outline: none !important;}
.metaslider.ms-theme-default-base .flexslider .flex-direction-nav li a.flex-next:after { mask-image: url(assets/images/sl-right.svg) !important;}
.metaslider.ms-theme-default-base .flexslider .flex-direction-nav li a.flex-prev:after { mask-image: url(assets/images/sl-left.svg) !important;}
.metaslider.ms-theme-default-base .flexslider .flex-direction-nav li a:after, 
.metaslider.ms-theme-default-base .flexslider .flex-direction-nav li a:before{mask-size: 30px auto !important;}
.metaslider.ms-theme-default-base .flexslider .flex-control-nav li a:focus {outline: none !important;}
body.darkmode .metaslider.ms-theme-default-base .flexslider .flex-control-nav li a.flex-active { background: rgb(255 255 255 / 90%) !important; }
body.darkmode .metaslider.ms-theme-default-base .flexslider .flex-control-nav li a:not(.flex-active) {background: rgb(255 255 255 / 29%) !important; }

.wp-block-embed-youtube > div { position: relative; width: 100%;padding-bottom: 56.25%; height: 0; overflow: hidden; margin: 40px 0;}
.wp-block-embed-youtube > div iframe { position: absolute;top: 0; left: 0; width: 100%; height: 100%; max-width: 100%;}

/* popup */
#jt_popup_playground > article {border-radius: 1rem; overflow: hidden;}
#jt_popup_container.pc .jt_popup_notoday:after {display:none !important;}
#jt_popup_container.pc .jt_popup_notoday { font-size: 14px !important; color: rgba(255, 255, 255, 0.85) !important; } 
#jt_popup_container #jt_popup_overlay{display: none !important;}
#jt_popup_playground article{box-shadow: 10px 10px 20px rgba(0,0,0,0.1) !important;}
/* 카테고리 */
.category .page-header { padding-top: 100px; }
.cate-info { padding: 0; display: flex; align-items: center; justify-content: space-between; position: relative; font-size: 15px; margin-bottom: 20px; margin-top: -20px; }
.category-btwrap { display: flex; align-items: center; justify-content: center;  padding: 40px 0 !important; }
.category-bt-search { display: flex; justify-content: start; }
.category-search-form { display: flex; align-items: center; gap: 3px; width: 350px; max-width: 100%; }
.category-search-select { height: 44px; padding: 0 10px; border: 1px solid #ddd; border-radius: 4px 0 0 4px; background: #fff; font-size: 15px; min-width: 100px; outline: none; }
.category-search-input { flex: 1; height: 44px; border: 1px solid #ddd; width: 200px; border-radius: 0; padding: 0 10px; font-size: 15px; background: #fff; color: #222; outline: none; }
.category-search-input::placeholder { color: #a4a4a4; }
.category-search-btn { height: 44px; margin-left: -3px; min-width: 44px; border: 1px solid #ddd; border-left: none; border-radius: 0 4px 4px 0; background: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.category-search-btn i { font-size: 18px; color: #5a5a5a; background-color: #fff; }
.category-searchwrap { position: relative; cursor: pointer; }
.category-searchwrap .search-trigger { font-size: 18px; }
.category-searchwrap .top-search {position: absolute;bottom: 0;right: -20px; width: 370px;
    opacity: 0;visibility: hidden;transition: all 0.3s ease-out; z-index: 1000; }
.category-searchwrap .top-search.active { opacity: 1; visibility: visible;  }
/* Search Box Styles - header.css로 이동됨 */ 
.search_back { margin: 40px 0; padding: 8px 25px; border: 1px solid #ccc; background-color: #fcfcfc; cursor: pointer;} 
.result-count { margin-left: 15px; font-size: 18px; font-weight: 400; } 
.no-results.not-found { position: relative; } 
.search-results .row.photo4 .entry-info{display: none;}

/* single */
.single-layout { margin: 0 auto; width: 100% } 
.post-content { margin-right: auto; margin-left: auto; width: 100%; line-height: 1.8; font-size: clamp(16px, 1.6vw, 18px); padding: 0 20px;} 
.single .post-content h2{font-size: clamp(22px, 1.8vw, 32px)}
.single .post-header { margin-bottom: clamp(25px, 3vw, 50px); padding: clamp(18px, 2vw, 40px) 0; border-bottom: 1px solid #aaaaaa6e; text-align: center; } 
.single .post-title { margin: 30px 0 10px 0; font-size: clamp(20px, 2.5vw, 30px); font-weight: 500; line-height: 1.4; } 
.single .post-date { opacity: 0.6; } 
.single .info { display: flex; justify-content: center; font-size: 13px; } 
.single .post-tags { margin-left: 30px; } 
.single .post-tags span { padding: 4px 8px; background-color: rgba(0,0,0,0.03); color: #666; border-radius: 8px; } 
.category-link { display: flex;align-items: center;justify-content: center; margin: 60px auto;}
.category-link a { display: flex;align-items: center;justify-content: center; min-width: 200px;
     font-size: 16px; font-weight: 500; color: #555; white-space: nowrap; border: 1px solid #848484ad; border-radius: 8px; padding: 8px 20px; }



/* 관리자페이지 내 템플릿  */
.post-content li { display: list-item; margin-left: 20px; list-style: inherit; } 
.post-content .wp-block-query-title, .wp-block-quote { padding-left: 10px; border-left: 5px solid #b6ebeb; box-sizing: border-box; } 
.elementor-editor-active .post-title { margin-bottom: 40px; padding-bottom: 10px; border-bottom: 1px solid #ccc; font-size: 20px; text-align: left; } 
.elementor-editor-active .site-main { margin:15px !important } 
.elementor-editor-active header, .elementor-editor-active footer, 
.single.elementor-editor-active .post-header, 
.single.elementor-editor-active .related-section { display: none !important; } 
.single.elementor-editor-active .post-content { width: inherit !important; }

/* 서브페이지 네비 */
.subBanner { padding: 70px 0 0px 0; position: relative; width: 100%; height:260px;  display: flex; align-items: center; justify-content: center;} 
.category .subbox{padding-top: 4%; padding-bottom: 50px;}
.subBanner>div {display: flex; flex-direction: column;  align-items: center;  justify-content: center;  gap:20px;  position: relative;  width: 100%; height: 100%;color: #333;} 
.subBanner .pageTitle {margin-bottom: 0; font-size: 26px; font-weight: 400; line-height: 1; color: #555;  } 
.subBanner .pageTitle>span:first-child{display: none;}
.subBanner .subtitle { font-size: 16px; line-height: 1.4; color: #333; } 
.subBanner .page-excerpt { font-size: 18px; line-height: 1.5; color: #333; } 

.subNav { display: flex;  position: relative; height: 100%; gap: 1px; margin-bottom: -10px;} 
.subNav li { height: 100%; } 
.subNav li:last-child a{border-right: 0;}
.subNav a { display: flex; align-items: center; justify-content: center; padding: 0 40px; background-color: rgba(255,255,255,0.9); height: 52px; font-size: 17px; font-weight: 500; color: #555; white-space: nowrap; } 
.subNav li:last-child a{border-radius: 0 6px 6px 0;}
.subNav li:first-child a{border-radius: 6px 0 0 6px;}
.subNav a.active { background-color: #2862be; color: #fff;  } 
.subbox { padding-top:4%} 
.page .subbox {  width: 100%; } 
.pageTitle { margin-bottom: 40px; font-size: 32px; font-weight: 600; } 
.page .site-main { margin-bottom: 5%; } 
.page-col-2 { margin: 0 auto; margin-bottom: 70px !important;} 
.page-col-2 .elementor img { object-fit: cover !important; } 
.page-col-2-img { width: 550px !important; } 

.page-contact .content{width: 100%;margin-left: auto;  margin-right: auto;}


@keyframes fadebanner {0% { opacity:0; transform:translateY(20px); } 
100% { opacity:1; transform: translateY(0px); } 
}
.animate__movetop { animation: movetop 0.5s ease-in-out; } 
@keyframes movetop {0% { opacity:0; } 
20% { opacity:0; transform: translateY(20px); } 
100% { opacity:1; transform: translateY(0px); } 
}



/* ==========================================================================
   Dynamic Styles using CSS Variables
   ========================================================================== */

   body, button, input, select, optgroup, textarea, option {
    color: var(--body-text-color);
    background-color: var(--body-bg-color);
}
.single .post-categories a:hover {
    border-color: var(--primary-color);
}
.subBanner {
    background-color: var(--subpage-header-bg);
    height: var(--subpage-header-height);
}
.subBanner .pageTitle {
    font-size: var(--subtitle-fontsize);
    font-weight: var(--subtitle-fontweight);
}
.marker {
    background-color: var(--top-menu-line-color);
}
.front-page .marker {
    background-color: var(--main-menu-line-color);
}
.container {
    max-width: var(--container-width);
}
.category-searchwrap .top-search, .category-search-select, .category-search-input, .category-search-btn, .category-search-btn i {
    background: var(--body-bg-color);
}


@media screen and (max-width:1320px) {
    .container{max-width: 100%;}
    .bzCardGrid{gap: 40px 20px;}
    .container.subbox{max-width: var(--container-width);}
}
@media screen and (max-width:1200px) {
    .content-box { width:100%; } 
    .container.subbox { padding-right: 20px; padding-left: 20px; } 
    
 }

@media screen and (max-width:1024px) { 
    .site-main{min-height: inherit;}
    .serviceBox{width:90%;}
    .serviceBox a img{height: inherit !important;}
    .subBanner{height: 220px !important;    padding: 40px 0 0 0;}
    .subBanner>div{gap: 20px;}
 }

@media screen and (max-width:820px) {
        
    html { margin-top: 0px !important;}
    .graybox_add { height: inherit; } 
    .single .site-main{margin: 60px 0 20px 0;}
    .subNavWrap { overflow-x: auto; left: 0; overflow-y: hidden; } 
    .subNav { padding-left: 20px; min-width: max-content; margin-bottom: 0; margin-top: 10px;} 
    .subNav a { padding: 0 20px; font-size: 16px; height: 45px; } 
 
    .maintitle { justify-content: space-between; flex-direction: row; margin-bottom: 20px; padding-bottom: 0; } 
    .page-col-2-img { width: 40% !important; } 
    .page-col-2 { margin-bottom: 40px !important; width: 100% !important; } 
    .post-content { width: 100%; font-size: 16px; } 
    .container { padding:0 15px; } 

   
    .subBanner { margin-bottom: 0; padding: 0; height:150px !important; } 

    .page .subbox, .container.subbox { padding:40px 20px 20px 20px; } 
    .site-main { margin-bottom: 40px; margin-top: 60px;} 
    .admin-bar .site-main{margin-top: 106px; margin-bottom: 40px;}
    .front-page .site-main{margin-top: 0 !important; margin-bottom: 0 !important;}
    .page .site-main{margin-bottom: 40px;}
    .page-home .site-main {margin-top: 0;margin-bottom: 0 !important;}
    .subBanner>div { gap: 5px; padding: 0 20px; } 
    .subBanner .pageTitle { font-size: 24px !important; margin-bottom: 0;} 
    .wp-block-button__link{padding: 8px 20px !important;}


    .col-3repeat{ gap: 20px; font-size: 15px; margin-bottom: 40px;}
    .col-3repeat h3{ font-size: 22px; }
    .col-3repeat h4{ font-size: 20px; margin-bottom: 10px !important;}

    /* 패턴  */
    .pt-title{font-size: 24px;}
    .bzCardGrid{gap: 20px;}
    .bzCardRow { margin-bottom: 20px !important; height: max-content;}
    .bzCardRow h4 { margin: 40px 20px 18px 20px !important;font-size: 22px;}
    .bzCardRow p { margin: 0px 20px 40px 20px !important; font-size: 15px;}
    .bzCardGrid .bzCard h4 { margin: 10px !important;font-size: 18px;}
    .bzCardGrid .bzCard p {margin: 0px 20px 30px 20px !important;font-size: 15px;}
    .bzCardGrid2 .bzCard h4{ font-size: 20px;}
    .bzCardGrid2 .bzCard p{ font-size: 15px;margin:0px 0px 30px 0px !important}
    .pt-col-left h4{font-size: 22px;}
    .bzinfo_col{grid-template-columns: 100px auto;}
    .bzinfo_col h4{font-size: 18px;}
    .bzinfo_col p{font-size: 15px;}
    .ptTable-wrap{width: 100%; overflow-x: auto; }
    .ptTable{width: max-content; min-width: 100%;}
    .ptTable td, .ptTable th{font-size: 16px; }


    .faq-accordion{max-width: inherit;}
    .home2-title.bold h2{font-size: 30px !important;}
    .serviceBox{gap: 20px !important; width: 85%; margin-bottom: 20px !important;}
    .serviceBox h4{font-size: 20px !important;left: 30px;top: 10px;}
    .mainService-wrap { gap: 0px;padding: 40px 0 !important;}
   
    .faq-question{font-size: 20px !important;}
    .faq-question::before{font-size: 18px;}
    .faq-answer{font-size: 16px !important;}
    .faq-item{padding: 7px 0;}

 }
 @media screen and (max-width: 600px) {
    #wpadminbar { position: fixed;}
}

@media screen and (max-width:520px) { 

    body, button, input, select, optgroup, textarea { font-size: 16px; }
    html, body { overflow: auto !important; height: auto !important; }
    #wpadminbar {  position: fixed;}
    .textNoMobile { display: none; }
    .admin-bar .site-main{margin-top: 106px; margin-bottom: 20px;}
    .page .subbox { padding: 30px 20px 20px 20px; }
    .page .site-main { margin-bottom: 20px; }
    .page-col-2-img { width: 100% !important; }
    
    .category-searchwrap .search-trigger{font-size: 16px;}

    .page .subbox, .container.subbox { padding:30px 15px 0px 15px }
    .subbox { padding: 10px; min-height: inherit; }
    .subBanner { margin-bottom: 0px; height: max-content !important; }
    .subBanner h1 { font-size: 26px; }
    .subBanner .subtitle { font-size: 14px; }
    .subBanner>div { gap: 10px; padding: 25px 0 0 20px; height: 100%; flex-direction: column; align-items: start; justify-content: center; min-height: 90px; }
    .subBanner .page-excerpt { font-size: 16px; line-height: 1.4; }
    .subBanner .pageTitle { font-size: 21px !important; font-weight: 600; word-break: keep-all; margin-bottom: 0; }
    
    .pageTitle { margin-bottom: 20px; font-size: 24px; }
    .pageTitle h4 { font-size: 22px !important; margin-top: 0 !important; }
    
    .subNavWrap { margin-top: 10px; width: 100%; overflow-x: auto; }
    .subNav { padding-left: 0; min-width: max-content; height: 40px;margin-top: 0; }
    .subNav a { padding: 3px 20px; height: 40px; font-size: 16px; }
    .subNav li:first-child a { border-radius: 6px 0 0 0px; }
    .subNav li:last-child a { border-radius: 0 6px 0 0px; }
    
    .site-main { margin: 60px 0 20px 0; padding-bottom: 20px;}
    .single .site-main{margin: 60px 0 0 0;}
    section.post-list-wrap { padding: 0px; width: 100%; border-radius: 0; }
    .map .root_daum_roughmap { height: 300px !important; overflow: hidden !important; width: 100% !important; }
    .root_daum_roughmap .cont { display: none !important; }
  
    .single .post-header { margin-bottom: 20px; padding-top: 0px; padding-bottom: 15px; }
    .single .info, .single .post-categories a { font-size: 13px; }

    .single .post-tags { margin-left: 10px; }
    
    .post-content { font-size: 15px; }

    
    .wp-block-spacer { height: 7px !important; }
    .wp-block-button a { padding-top: 10px !important; padding-bottom: 10px !important; }
    .wp-block-column { font-size: 15px; }
    
    .col-3366 hr, .col-6633 hr, .col-3repeat hr { margin: inherit; }
    .col-3 .entry-title { font-size: 16px; }
    .col-3 .entry-text-wrap p { font-size: 14px; -webkit-line-clamp: 2; }
    .col-3 { width: 100%; }
    .col-3 .card-thumbnail img { margin-bottom: 5px; }
    .col-2 { padding: 0 20px 30px 20px; width: 100%; }
    .col-2 .card-thumbnail { height: 200px; max-height: 200px; }
    .col-2 .entry-title { font-size: 14px; }
    .col-fleximg img { height: auto !important; max-height: 300px; }
    
    .category .subbox { padding: 20px; }
    .cate-info { margin-top: 0; padding: 0; }
    .category-btwrap { flex-direction: column; gap: 20px; }
    .page-address .col-3366 { flex-direction: column-reverse; gap: 20px; }
    .page-contact .col-3366 { flex-direction: column-reverse; gap: 0px; }
   
    .pt-title { font-size: 22px; }
    .pt-col-left p { font-size: 15px; }
    
    .bzCardGrid, .bzCardGrid2 { grid-template-columns: 1fr !important; gap: 20px 15px !important; }
    .bzCardGrid .bzCard .wp-block-image {  width: 100%; height: inherit; aspect-ratio: 1 / 1; min-height: inherit;}
    .bzCardGrid .bzCard p { font-size: 14px; margin: 0px 20px 20px 20px !important; }
    .bzCardGrid .bzCard h4 { margin: 10px 0 !important; font-size: 16px; }
    .bzCardGrid2 .bzCard h4 { margin: 20px 0px 10px 0px !important; font-size: 20px; }
    .bzCardGrid2 .bzCard p { font-size: 14px; margin: 0px 0px 20px 0px !important; }
    
    .ptTable td, .ptTable th { font-size: 15px; }
    
    .bzinfo_col { grid-template-columns: 50px auto; gap: 10px !important; }
    .bzinfo_col figure { padding: 5px; }
    
    .subpageBdBox { padding: 15px !important; }
    .category-search-input{width: 170px;}
    .category-search-form{width: 320px;}
    .category-searchwrap .top-search{width: 340px;bottom: -10px;}
    #jt_popup_container.pc .jt_popup_item.primary { max-width: 300px !important; }
}


/* ==========================================================================
   header n footer
   ========================================================================== */

/* header  */

.site-header { margin-top: 0; }
body.admin-bar .site-header { margin-top: 32px; }

header { position: fixed; top: 0; left: 0; z-index: 100; width: 100%; height: 80px; transition: all 0.2s; border-bottom: 1px solid rgba(0,0,0,0) !important;} 
header.scActive { border-bottom: 1px solid var(--border-color) !important; height: 60px; background-color: var(--body-bg-color) !important; } 
header .container { display: flex; align-items: center; justify-content: space-between;  height: 100%; max-width: calc(100% - 60px)  } 

.logobox a { display: flex; } 
.gnb { display: flex; gap:0; align-items: center; } 
.menu { display: inline-block; position: relative;} 
.menu-item { position: relative; } 


.logoBlack{display: block;}
.logoWhite{display: none;}
.site-header.scActive .logoWhite{display: none;}
.site-header.scActive .logoBlack{display: block;}

body.darkmode .logoBlack{display: none;}
body.darkmode .logoWhite{display: block;}
body.darkmode .site-header.scActive .logoWhite{display: block; }
body.darkmode .site-header.scActive .logoBlack{display: none;}


/* front-page header  */
.front-page header{ border-bottom: none !important;  }
.front-page header.scActive{height: 80px; border-bottom: none !important; }
.front-page header a{color: var(--menu-top-color);}
.front-page .site-header.scActive .logoBlack{display: none;}
.front-page .site-header.scActive .logoWhite{display: block;}
.front-page .site-header.scActive{ background-color: rgba(0,0,0,0) !important; border-bottom: 0 !important  ;}
.front-page .logoBlack{display: none;}
.front-page .logoWhite{display: block;}
.front-page header .container {max-width: calc(100% - 60px) } 
.front-page .site-header .menu > .menu-item > a, 
.front-page .site-header.scActive .menu > .menu-item > a, 
.front-page .site-header ul.sns a, 
.front-page .site-header.scActive ul.sns a{color: var(--menu-top-color); } 
.front-page .site-main { display: flex; flex-direction: column; margin-bottom: 0px !important; } 


.navWrap{display: flex;gap: 0;align-items: center;}

.marker{position: absolute; width: 0px;left: 0; height: 2px;  bottom: 15px; background-color: var(--top-menu-line-color); transition: 0.5s; border-radius: 2px;}
.nomarker .marker, .page-personal .marker, .page-contact .marker{display: none !important;}
.site-header.scActive .marker{display: none;}

.menu-item > a { display: flex; color: var(--menu-top-color-sub); align-items: center; justify-content: center;padding: 0 18px;position: relative;height: 80px;
    font-size: clamp(18px, 1.2vw, 21px);font-weight: 500; } 
.menu-item > a > span:nth-child(2){display: none;}
.site-header.scActive ul.menu>li.menu-item > a { height: 60px; } 

.sub-menu { display: none; display:block; flex-direction: column; box-shadow: 0 3px 10px rgba(0,0,0,0.18); overflow: hidden; position: absolute; top: 65px; left: 50%; z-index: 101; width: 150px; visibility: hidden; background-color: var(--submenu-bg-color); transition: all 0.3s;; transform: translateX(-50%) translateY(5px); opacity: 0; border-radius: 8px; } 
.menu-item:hover .sub-menu { display: block; visibility: visible; opacity: 1; transform: translateX(-50%) translateY(0); } 
.sub-menu .menu-item { width: 100%; transition: all 0.2s;} 
.sub-menu .menu-item.prod-totalmenu{display: none !important;}
.sub-menu .menu-item a { padding: 8px 10px; border-bottom: 1px solid var(--border-color); width: 100%; height: 100%; font-size: 15px; text-align: center; color: var(--submenu-text-color);} 
.sub-menu .menu-item:last-child a{border-bottom: 0 !important;}
ul.sns { display: flex; gap: 0; } 
ul.sns a { color: rgba(0,0,0,0.5); padding: 4px 0; line-height:1; font-size: 20px; } 
ul.sns li{margin-left: 20px;}

/* 검색 박스 스타일 */
.search-box { position: relative; display: inline-block; }
.search-toggle { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; font-size: 20px; margin-left: 16px; line-height: 1; border: 0; background-color: transparent; cursor: pointer; }
.search-toggle i { width: 24px; height: 24px; color: var(--menu-top-color-sub); }
.search-form { position: absolute; right: 0; bottom: 0; transform: translateY(65px); display: flex; align-items: center; opacity: 0; visibility: hidden; transition: all 0.3s ease; background: var(--body-bg-color); padding-left: 20px; border-radius: 40px; box-shadow: 0 2px 5px rgba(0,0,0,0.15); }
.search-form.active { opacity: 1; visibility: visible; }
.search-submit { background: none; border: none; padding: 0; cursor: pointer; width: 50px; height: 50px; }
.search-field { flex: 1; border: 0; outline: none; width: 160px; background-color: transparent; font-size: 16px; color: var(--body-text-color); border-radius: 30px; height: 50px; }
.search-field:focus { border: 0; background-color: var(--body-bg-color); }
.search-field::placeholder { color: #8697a6; }

/* 모바일 gnb */
.menu-container { position:fixed; top:0; right:0; z-index:9; -webkit-transition:.2s; transition:.2s; -moz-transition:.2s; -ms-transition:.2s; -o-transition:.2s; pointer-events:none } 
.menu-container.active { visibility:visible; pointer-events:auto; opacity:1 } 
.menu-container.active .more-navigation { top:0; right:0px; } 
.menu-container .more-navigation { padding:80px 20px 50px 20px; overflow-y:scroll; position:absolute; right:-100px; z-index:1000; width:100%; max-width:320px; background:var(--body-bg-color); -webkit-transition:right .3s ease-in-out; transition:right .3s ease-in-out; -moz-transition:right .3s ease-in-out; -ms-transition:right .3s ease-in-out; -o-transition:right .3s ease-in-out } 
.menu-container .more-navigation .toggle-btn { display:block; position:absolute; top:5px; right:0px; z-index:1; width:48px; height:48px; background:url(assets/images/icon-arrow-down.svg) center/24px no-repeat; background-size: 18px; transition:.3s; transform:rotate(0); } 
.menu-container .more-navigation .toggle-btn.show { transition: 0.3s; transform: rotate(180deg); } 
.menu-container .more-navigation .button.menu-item { margin-left: 0; } 
.menu-container .more-navigation li { position: relative; } 
.menu-container .more-navigation li :last-child { margin-bottom: 0; } 
.menu-container .more-navigation li a { display:block; padding:14px 0; border-bottom: 1px solid var(--border-color); position:relative; height: inherit; font-size:20px; line-height:1; color:var(--body-text-color); text-align:left; } 
.menu-container .more-navigation li.button { display:block; margin-top:80px; margin-bottom:40px; padding:0; border:none; height:auto; line-height:auto; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; -ms-border-radius:8px } 
.menu-container .more-navigation li.button a { padding: 12px; font-size: 20px; font-weight: normal; color: #fff; text-align: center; } 
.menu-container .more-navigation li .sub-menu { display: none; margin-left: 0; padding:1rem; background-color: rgba(0,0,0,0.05); } 
.menu-container .more-navigation li .sub-menu li { border-bottom: none; } 
.menu-container .more-navigation li .sub-menu li.current-menu-item > a , 
.menu-container .more-navigation li.current-menu-parent > a { background-color: inherit !important; color: inherit !important; } 
.menu-container .more-navigation li .sub-menu a { padding: 8px 0; border: 0; font-size: 18px; } 
.menu-container .more-navigation li.show .sub-menu { display:block!important; border:0; border-top:1px solid var(--border-color); box-shadow:none; position:relative; top:inherit; left:inherit; width:100%; visibility:inherit; transform:none; opacity:inherit } 
.menu-container .active .more-navigation .current-page-item a { opacity: 1; } 
.menu-btn { display: none; } 
.menu-container,
.menu-container .overlay { width:100%; height:100%; visibility:hidden; opacity:0 } 
.menu-container .overlay.active { display: block; visibility:visible; -webkit-transition:.2s; transition:.2s; -moz-transition:.2s; -ms-transition:.2s; -o-transition:.2s; opacity:1; } 
.menu-container .overlay { display: none; position:absolute; z-index:51; background:rgba(0,0,0,.85); pointer-events: auto; } 

.menu-item > a,
.subBanner .pageTitle, ul.sns a,
.search-toggle i,
.menu-btn .menu-icon::before {
    color: var(--menu-top-color-sub);
}
.site-header.scActive {
    background-color: var(--body-bg-color);
}
.sub-menu, .subNav a {
    background-color: var(--submenu-bg-color);
}
.sub-menu .menu-item a, .subNav a {
    color: var(--submenu-text-color);
}
.sub-menu .menu-item:not(.current-menu-item) a:hover, .subNav a:not(.active):hover {
    color: var(--submenu-hover-text-color);
    background-color: var(--submenu-hover-bg-color);
}
.mainNew .content li .title,
.menu-container .more-navigation li.current-post-ancestor > a,
.menu-container .more-navigation li.current-menu-parent > a,
.menu-container .more-navigation li .sub-menu li.current-menu-item > a,
.sub-menu .current-menu-item a, .subNav a.active {
    background-color: var(--primary-color);
    color: #fff;
}

.front-page .site-header .menu > .menu-item > a,
.page-home .site-header.scActive .menu > .menu-item > a,
.front-page .site-header ul.sns a,
.page-home .site-header.scActive ul.sns a,
.front-page .search-toggle i,
.front-page .menu-icon::before {
    color: var(--menu-top-color);
}

/* footer */
footer {padding: 70px 0 75px 0; position: relative; background-color: var(--copyright-bg-color); color: #b1b1b1; } 
footer .container { display: flex; margin: 0 auto; width: 100%; max-width:calc(100% - 60px) } 
footer a { color: #666; } 
.footer-nav li a{ padding: 12px 24px 15px 0; font-size: 16px;font-weight: 500;  white-space: nowrap; word-break: keep-all;color: #fff; height: inherit;}
.footText > p {font-size: 16px; color: #9c9c9c; margin-bottom: 4px;}
.footText > p > span{color: #d4d4d4; margin-right: 3px; margin-left: 10px;}
.footText > p > span:first-child{margin-left: 0;}

.footText br.onlymobile{display: none;}
footer .elementor-button { padding: 12px 0 !important; background: transparent; font-size: 16px; font-weight: 500; white-space: nowrap; word-break: keep-all; } 

.floatRight { display: flex; gap: 10px; flex-direction: column; position: fixed; right: 20px; bottom:30px; z-index: 51; width: 45px; height: max-content; } 
.gotoTop { display: flex; align-items: center; justify-content: center; box-shadow: 0 0 5px rgba(0,0,0,0.2); width: 45px; height: 45px; border-radius: 8px; font-size: 24px; overflow: hidden; position: relative; background-color: var(--body-bg-color); color: var(--body-text-color);} 
.gotoTop i {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;opacity: 1; }
.kakaochat { box-shadow: 0 0 5px rgba(0,0,0,0.2); width: 45px; height: 45px; background-color: #ebe00a; color: #333; border-radius: 8px; } 
.kakaochat a, .navertalk a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; } 
.kakaochat i { font-size: 24px; color: rgb(47, 39, 12); } 
.navertalk { box-shadow: 0 0 5px rgba(0,0,0,0.2); width: 45px; height: 45px; background-color: #1ce43a; background-image: url(assets/images/naver_talk.jpg); background-size: cover; color: #333; border-radius: 8px; } 
.navertalk i { font-size: 0; } 


@media screen and (max-width:1450px){
    header .container{max-width: 98%;}
}

@media screen and (max-width:1200px) {
    .gnb { display: none; } 
    .menu-container.active .gnb { display: block; width: 100%; } 
    header, .front-page header.scActive{height: 60px;}
    .front-page header .container { max-width: 97%;}
    .menu-btn { display: block; position: absolute; top: 10px; right: 10px; z-index: 9999; width: 40px; height: 40px; cursor: pointer; } 
    .menu-btn .menu-icon{ width: 32px;height: 32px; position: relative;}
    .menu-btn .menu-icon::before { color: var(--menu-top-color-sub); width: 32px;height: 32px; position: absolute; display: inline-block; font-family: "bootstrap-icons";
        content: '\F479';  font-weight: 400; font-size: 32px;line-height: 1; top: 6px; left: 0; } 
    .front-page .menu-icon::before { color:var(--menu-top-color); }
    .menu-btn.active .menu-icon::before { color:var(--body-text-color); content: "\F659";   } 
    .menu-container .more-navigation li { display: block; } 
    .menu-container .more-navigation { height: 100vh; } 
    .menu-container .more-navigation > div { display: flex; align-items: start; justify-content: start; flex-direction: column; } 
    .menu-container .sns li a { border-bottom: 0; color: var(--body-text-color) !important; } 

    .menu-container .sub-menu .current-menu-item a, 
    .menu-container .subNav a.active, 
    .menu-container .more-navigation li .sub-menu li.current-menu-item > a , 
    .menu-container .more-navigation li.current-menu-parent > a { background-color: inherit !important; color: inherit !important; } 

    .menu-container .more-navigation li.current-menu-parent > a, 
    .menu-container .sns li:first-child{margin-left: 0;}
    .menu-container .sns { margin-top: 30px; margin-left: 0;} 
    header .container { padding: 0 20px; } 
    .search-box{position: absolute; top: 17px; right: 60px;}
    .search-form{transform: translateY(70px) translateX(50px);}
    footer .container{max-width: 100%; padding:0 25px;}


}
@media screen and (max-width:1024px) {
    footer {padding:40px 0;}
    .footText > p{font-size: 14px;}
}

@media screen and (max-width:820px) {
    header { height: 60px; background-color: var(--body-bg-color); } 
    .front-page header{background-color: transparent;}
    .logobox { width: 200px; } 
    .logoBlack{display: block;}
    .logoWhite{display: none;}

    footer{padding: 40px 0;}
    .footText > p > span{margin-left: 0;}
    .footText br.onlymobile{display: block;}
}
@media screen and (max-width:782px) {
 
    body.admin-bar .site-header { margin-top: 46px;} 
}

@media screen and (max-width:520px) { 
    header .container { padding: 0 15px;max-width: 100%;}
    .logobox { height: 40px;display: flex;align-items: center;justify-content: start;}
    .logobox img{object-fit: contain;}
    .logobox a { max-height: 30px; max-width: 160px; }
    .site-header { margin-top: 0px; }
    .menu-btn { top: 10px; right: 0px; }
    .search-box { position: absolute; top: 17px; right: 50px; }
    .search-form { transform: translateY(60px) translateX(50px); }


    footer { margin: 0; padding: 30px 0; border-radius: 0; }
    footer .container {   line-height: 1.4; }
    footer .footText { width: 100%; }
    .footText > p { font-size: 13px; }
    .edit_footer_address > br{display: block;}
    .footText span:nth-child(2) { display: inline-block; }
    .footer-nav li a { font-size: 14px; padding-right: 12px; }
    .site-main{min-height: 65vh}
    .subNav li{min-width: calc(33% - 7px);}
}


/* ==========================================================================
   main page
   ========================================================================== */

/* fullpage */
.fp-watermark{display: none !important;}
#fullpage .imgbox{display: flex; height: 100vh; width: 100%;  padding: 0; margin: 0; min-height: 100vh;}
#fullpage .imgbox img {width: 100%; height: auto; object-fit: cover;min-height: 100vh;}
#fullpage .textbox{position: absolute; bottom: 60px; left: calc(50% + 30px); transform: translateX(-50%); width: 100%; max-width: 1450px; padding: 3px 10px; color: rgba(255,255,255,0.7); font-size: 16px;}
#fullpage .textbox a {display: inline-block; }
#fp-nav ul li a span, .fp-slidesNav ul li a span{width: 12px !important; height: 12px !important; background: rgba(255,255,255,0); margin: 0 0 5px 0 !important; border: 1px solid #ffffffbf}
#fp-nav ul li, .fp-slidesNav ul li{width: 12px !important; height: 20px !important; margin: 0 20px 0 0 !important;}
#fp-nav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li a.active span, .fp-slidesNav ul li:hover a.active span{background: rgba(255,255,255,1);}
#fp-nav { display: var(--fp-nav-display) !important;}
.bigImg{ position: relative; overflow: hidden; height: 100vh;}

/* main  */
.front-page .marker{ background-color: #7ee1ff;}
.front-page .search-toggle i{color: #fff;}
.front-page ul.sns li a img { filter: invert(0%) sepia(100%) saturate(0%) hue-rotate(0deg) brightness(300%) contrast(200%); width: 23px; height: auto; } 
.front-page footer{display: none;}
.front-page .gotoTop{display: none !important;}

.edit_main_tel{ position: fixed; font-size: 20px;color: #fff; bottom: 38px; right: 100px; z-index: 50;  min-width: 300px; width: max-content; height: 30px;text-align: right; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);} 
.edit_main_tel i {margin-right: 10px;}

/* 메인 슬로건  */
.front-page .mainslogen{ position: fixed; width: max-content;max-width: calc(100% - 60px); height: max-content;bottom: 100px; left: 50px; transform: translate(0%, 0%); z-index: 50;}
.mainslogen_text{font-weight: 800; color: #fff; margin-bottom: 10px; line-height: 1.3; text-shadow: 0 0 5px rgba(0, 0, 0, 0.5); animation:fadebanner 0.7s ease-in-out forwards; animation-delay: 0.4s; opacity: 0;}
.mainslogen_text{font-size: clamp(34px, 1.9vw, 40px)}
.mainslogen_subtext{font-size: clamp(15px, 1.2vw, 18px); font-weight:300; color: rgba(255,255,255,1); margin-bottom: 15px; text-shadow: 0 0 5px rgba(0, 0, 0, 0.3); animation:fadebanner 0.7s ease-in-out forwards; animation-delay: 0.7s; opacity: 0;}
.mainslogen_subtext br.onlymobile, .mainslogen br.onlymobile{display: none;}
.mainslogen .mainbtn{display: inline-block; padding: 12px 45px; background-color: #0e85e3; color: #fff; font-size: 15px; font-weight: 400; 
    text-decoration: none; border-radius: 30px; transition: all 0.3s ease;width: max-content; animation:fadebanner 0.7s ease-in-out forwards; animation-delay: 0.9s; opacity: 0;
position: relative; text-align: center;margin-bottom: 0px;min-width: 170px;}
.mainslogen .mainbtn i{position: absolute;right: 0;top: calc( 50% + 1px); transform: translateY(-50%); opacity: 0; transition: all 0.2s; font-size: 18px; }
.mainslogen .mainbtn span{transition: all 0.2s; transform: translateX(0px); display: inline-block;}
.mainslogen .mainbtn:hover i {right: 20px; opacity: 1;}
.mainslogen .mainbtn:hover span{ transform: translateX(-20px);}
.mainslogen_text { font-weight: var(--mainslogen-fontweight); text-shadow: var(--text-shadow);}
.mainslogen_subtext { text-shadow: var(--sub-text-shadow);}
.mainslogen .mainbtn { background-color: var(--main-button-color);}
/* 지연 로딩 이미지 스타일 */
.lazy-image {  opacity: 0; transition: opacity 0.3s ease-in-out;}
.lazy-image.loaded { opacity: 1;}
.section:first-child .imgbox img { opacity: 1;}

@media screen and (max-width:1024px) {
    .mainslogen .mainbtn{font-size: 15px;padding: 10px 45px; min-width: 180px;}
    .mainslogen_text, .mainslogen_subtext{margin-bottom: 15px;}
    .mainslogen_text{font-size: 30px;}
    #fp-nav.fp-right{right: 3px;}
}

@media screen and (max-width:820px) {
    .front-page .mainslogen{ pointer-events: none;}
    .mainslogen .mainbtn{pointer-events: all;}
    .mainslogen .mainbtn:hover i {right: inherit; opacity:0;}
    .mainslogen .mainbtn:hover span{ transform: inherit;}
}

/* 카카오챗팅과 네이버톡이 둘 다 공백일 때 edit_main_tel 위치 조정 (520px 이상에서만 적용) */
@media screen and (min-width: 521px) {
    .edit_main_tel.no-chat-buttons { right: 50px; }
}

@media screen and (max-width:520px) {
    #fp-nav ul li, .fp-slidesNav ul li { height: 20px !important; }
    #fp-nav ul li a span, .fp-slidesNav ul li a span { width: 10px !important; height: 10px !important; }
    .front-page .site-main { margin: 0; }
    .front-page .site-main { gap: 0; margin-bottom: 0; padding-bottom: 0;}
    .front-page .mainslogen{ pointer-events: none; left: 30px; }
    .front-page .mainslogen_text{ font-size: 24px !important; }
    .mainslogen_subtext { font-size: 15px !important; pointer-events: none; line-height: 1.5; }
    .mainslogen_subtext br.onlymobile, .mainslogen br.onlymobile { display: block; }
    .mainslogen .mainbtn { padding: 8px 45px; font-size: 15px; pointer-events: all; margin-bottom: 0; min-width: inherit; }
    .edit_main_tel { text-align: left; right: inherit; left: 30px; }

    .category-btwrap{padding: 20px 0 !important;}

}