@charset "utf-8";
/* =========================================================================
   ARMYPIA - RESPONSIVE CSS
   ========================================================================= */




/* =========================================================================
   max-width : 999px
   ========================================================================= */
@media screen and (max-width: 999px) {

	/* ----- 02. HEADER ----------------------------------------------------
	   -------------------------------------------------------------------- */

	body #header-outer[data-padding] {
		padding-top: 20px;
		padding-bottom: 20px;
	}
	#top .mobile-search {
		display: none !important;
	}

	/* ----- 02-2. 모바일 오프캔버스 메뉴 -----------------------------------

	   -------------------------------------------------------------------- */
	body #slide-out-widget-area.slide-out-from-right-hover {
		width: 320px;
		max-width: 100%;
		padding: 61px 0 0;
	}

	body #slide-out-widget-area.slide-out-from-right-hover .inner-wrap,
	body #slide-out-widget-area.slide-out-from-right-hover[data-dropdown-func] .inner-wrap > .inner,
	body #slide-out-widget-area.slide-out-from-right-hover[data-dropdown-func] .inner-wrap > .inner > div.off-canvas-menu-container {
		display: block;
		margin: 0;
	}

	body #slide-out-widget-area.slide-out-from-right-hover[data-dropdown-func] .slide_out_area_close {
		display: none;
	}

	body #slide-out-widget-area.slide-out-from-right-hover .inner-wrap > .inner .off-canvas-menu-container li {
		margin: 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	}
	body #slide-out-widget-area.slide-out-from-right-hover .inner-wrap > .inner .off-canvas-menu-container li:first-child {
		border-top: 1px solid rgba(255, 255, 255, 0.08);
	}
	body #slide-out-widget-area.slide-out-from-right-hover[data-dropdown-func] .inner-wrap > .inner .off-canvas-menu-container li a {
		display: block;
		padding: 12px 20px;
		font-size: 15px;
		font-weight: 400;
		line-height: 24px;
		color: rgba(255, 255, 255, 0.6);
	}

/* =========================================================================
   05. 섹션 제목 공통  (.sec_title_en / .sec_title_ko)
   ========================================================================= */	

	.sec_title_en > *,
	.sec_title_en p {
		padding-bottom: 5px !important;
	}


	/* ----- 04. MAIN PAGE - CATEGORY --------------------------
	   -------------------------------------------------------------------- */
	#main_category_wrap .row_col_wrap_12_inner {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		row-gap: 25px;
	}

	#main_category_wrap .row_col_wrap_12_inner::after {
		display: none;
	}

	#main_category_wrap .row_col_wrap_12_inner > .wpb_column {
		margin-bottom: 0;
	}

	/* #main_category_wrap .row_col_wrap_12_inner > .wpb_column {
		width: 100%;
	} */

	/* ----- 03. MAIN PAGE - BLOG(베스트 제품)  -----------------
	   -------------------------------------------------------------------- */
	body.home #main_product_wrap .posts-container {
		display: grid !important;
		grid-template-columns: repeat(2, 1fr);
		column-gap: 20px;
		row-gap: 20px;
		height: auto !important;
	}
	/* 제목 아래 30px 은 테두리 없는 빈 공간이라 비웁니다 (army.css 의 뉴스 영역과 동일 처리) */
	body.home #main_product_wrap .post-content.classic .content-inner {
		padding-bottom: 0;
		margin-bottom: 0;
	}
	body.home #main_product_wrap .masonry-blog-item {
		position: static !important;
		width: 100% !important;
		left: auto !important;
		top: auto !important;
		transform: none !important;
		margin: 0 !important;
	}

	/* ----- 09. FOOTER ----------------------------------------------------
	   -------------------------------------------------------------------- */
	#footer-outer .ft_sns {
		position: static;
		transform: none;
		justify-content: flex-start;
		margin-top: 15px;
	}

	/* ----- 10. ABOUT US ---------------------------------------------------
	   -------------------------------------------------------------------- */
	#about_greeting_inner.about_greeting_inner {
		padding-left: 30px !important;
		padding-right: 30px !important;
	}
	/* #about_greeting_inner.about_greeting_inner h3 {
		margin-bottom: 20px;
	} */
	 #about_greeting_inner.about_greeting_inner .txt_body p {
		font-size: 16px;
	 }

	/* =========================================================================
	   SUB-제품소개 페이지
	   ========================================================================= */	
	   .sub_product_wrap .nectar-post-grid-filters {
		max-width: 100%;
		padding: 0;
	   }
    	/* Filter 버튼 숨기기 */
    	.sub_product_wrap .nectar-post-grid-filters > h4 {
    	    display: none !important;
    	}

    	/* 카테고리 목록 항상 표시 + 4개씩 */
    	.sub_product_wrap .nectar-post-grid-filters > div {
    	    display: grid !important;
    	    grid-template-columns: repeat(4, minmax(0, 1fr));

    	    width: 100%;
    	    gap: 1px;
    	    padding: 1px;
    	    box-sizing: border-box;

    	    /* 버튼 사이/외곽 1px 라인 */
    	    background-color: #e3e3e3;

    	    /* Salient 모바일 필터 기능 무력화 */
    	    opacity: 1 !important;
    	    visibility: visible !important;
    	    height: auto !important;
    	    max-height: none !important;
    	    overflow: visible !important;
    	    transform: none !important;
    	    pointer-events: auto !important;
    	}

    	/* 카테고리 버튼 */
    	.sub_product_wrap .nectar-post-grid-filters > div > a {
    	    display: flex !important;
    	    align-items: center;
    	    justify-content: center;

    	    width: 100%;
    	    min-width: 0;
    	    box-sizing: border-box;

    	    background-color: #ebebeb;
    	    border: 0 !important;

    	    padding: 10px 12px !important;

    	    text-align: center;
    	    transition: background-color .4s;
			font-size: 12px !important;
    	}

    	.sub_product_wrap .nectar-post-grid-filters > div > a:hover {
    	    background-color: #dedede;
    	}

    	.sub_product_wrap .nectar-post-grid {
    	    margin-top: 0;
    	}
		.sub_product_wrap .nectar-post-grid-wrap .load-more-wrap {
			margin: 20px 0 !important;
		}

		.sub_product_wrap .nectar-post-grid .item-main h3 {
			font-size: 15px;
		}
		.sub_product_wrap .nectar-post-grid .item-main .meta-excerpt {
			font-size: 13px;
		}

	/* =========================================================================
	   SUB-오시는길 페이지
	   ========================================================================= */		
		.contact_info_wrap .contact_box {
			margin-bottom: 0 !important;
		}
		#contact_info_wrap .contact_box h3 {
			font-size: 18px;
		}
		#contact_info_wrap .contact_box .wpb_text_column p {
			font-size: 14px;
		}

	/* =========================================================================
	   SUB-공지사항 페이지
	   ========================================================================= */		
		.sub_news_wrap .nectar-post-grid .item-main h3 {
			font-size: 18px;
		}
		.sub_news_wrap .nectar-post-grid .meta-date {
			padding-bottom: 10px;
		}
		.sub_news_wrap .nectar-post-grid .nectar-cta .link_text, .sub_news_wrap .nectar-post-grid .nectar-cta .link_text * {
			font-size: 13px !important;
		}
		.nectar-post-grid-wrap:not([data-style=content_overlaid]) .nectar-post-grid .nectar-post-grid-item .content {
			padding: 15px 0 !important;
		}


}


/* =========================================================================
   min-width : 768px  ~  max-width : 999px
   ========================================================================= */
@media screen and (min-width: 768px) and (max-width: 999px) {
	#about_business_list .vc_col-sm-4 {
		width: 33.3333%;
	}
	#about_benefits_list .vc_col-sm-6 {
		width: 50%;
	}
}


/* =========================================================================
   max-width : 767px  (포트폴리오 영역 좌우 여백)
   ========================================================================= */
@media screen and (max-width: 767px) {

	/* body.home #main_category_wrap .row_col_wrap_12_inner {
		margin-left: calc(50% - 50vw + 18px);
		margin-right: calc(50% - 50vw + 18px);
	} */
}


/* =========================================================================
   max-width : 767px
   ========================================================================= */
@media screen and (max-width: 767px) {

	#footer-outer .ft_menu,
	#footer-outer .ft_info,
	#footer-outer .ft_copy {
		text-align: center;
	}
	#footer-outer .ft_sns {
		justify-content: center;
	}
	#footer-outer .ft_menu {
		font-size: 0;      
	}
	#footer-outer .ft .ft_menu a {
		font-size: 13px;
		padding: 0 6px;
	}
	#footer-outer .ft .ft_menu a:first-child {
		padding-left: 6px;
	}
	#footer-outer .ft .ft_menu a:last-child {
		padding-right: 6px;
	}

	#footer-outer .ft_info li {
		display: block;
		font-size: 13px;
		border-right: 0 !important;
		padding-right: 0 !important;
	}
	#footer-outer .ft_copy {
		margin-top: 18px;
	}

	/* ----- 06. MAIN PAGE - ADVANTAGE ------------------------------------
	   -------------------------------------------------------------------- */
	body.home #ajax-content-wrap .nectar_section[class*="height_desktop_"] {
		height: auto;
		padding-top: 70px !important;     
		padding-bottom: 100px !important;  
	}

	/* ----- 06. MAIN PAGE - ADVANTAGE 아이콘 -------------------------------
	   -------------------------------------------------------------------- */
	body.home #adv_icon .show_767 .hover-wrap-inner {
		max-width: 473px;
	}

	/* ----- 10. ABOUT US ----- */
	#ajax-content-wrap #about_greeting_inner > .row_col_wrap_12 {
		padding-left: 0;
		padding-right: 0;
	}
	#about_greeting_inner.about_greeting_inner {
		padding: 20px !important;
	}
	/* 혜택 2열이 1열로 쌓이면 컬럼별 좌우 여백(15/5, 5/15)이 어긋나므로 맞춥니다 */
	/* #about_benefits_list .vc_col-sm-6 > .vc_column-inner {
		padding-left: 10px;
		padding-right: 10px;
	} */
	#about_business_list.about_business_list .about_business_item h2,
	#about_business_list.about_business_list .about_business_item h3,
	#about_benefits_list.about_benefits_list .about_benefit_item h2,
	#about_benefits_list.about_benefits_list .about_benefit_item h3 {
		font-size: 19px;
		margin-top: 15px;
	}


}


/* =========================================================================
   max-width : 480px
   ========================================================================= */
@media screen and (max-width: 480px) {

	/* ----- 콘텐츠 폭 ----- */
	body.home .container-wrap > .container,
	body.page-id-12 .container-wrap > .container,
	body.home #main_advantage_wrap.main_advantage_wrap,
	body.home #adv_icon.adv_icon {
		width: 96.5%;
	}

	/* ----- 05. 섹션 제목 ----- */
	.sec_title_ko > *,
	.sec_title_ko p {
		font-size: 18px;
	}
	/* #main_advantage_wrap .sec_title_ko > *,
	#main_advantage_wrap .sec_title_ko p {
		font-size: 16px;
	} */

	/* ----- MAIN PAGE - NEWS  ----- */
	body.home #main_news_wrap h2.title,
	body.home #main_news_wrap h2.title a {
		font-size: 18px;
	}

	body.home #ajax-content-wrap .nectar_section[class*="height_desktop_"],
	body.home #main_category_wrap.main_category_wrap,
	body.home #main_news_wrap.main_news_wrap {
		padding-top: 50px !important;
		padding-bottom: 50px !important;
	}

	/* =========================================================================
	   SUB-제품소개 페이지
	   ========================================================================= */
    .sub_product_wrap .nectar-post-grid-filters > div {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
	/* =========================================================================
	   SUB-공지사항 페이지
	   ========================================================================= */	
	.sub_news_wrap .nectar-post-grid-item__excerpt-wrap .meta-excerpt {
	    width: 280px;


	}	

}


/* =========================================================================
   max-width : 400px
   ========================================================================= */
@media screen and (max-width: 400px) {

	body.home .container-wrap > .container,
	body.page-id-12 .container-wrap > .container,
	body.home #main_advantage_wrap.main_advantage_wrap,
	body.home #adv_icon.adv_icon {
		width: 98%;
	}
}
