@charset "utf-8";
/* Desktop */
@media screen and (max-width: 1600px) {
	.main_floatings {
		bottom: 16px;
	}
	.copy_admin {
		padding-bottom: 180px;
	}
}
@media screen and (max-width: 1440px) {
	/* ## 메인 ## */
	/*슬라이드 영역*/
	.slick-prev {
		left: -36px;
	}
	.slick-next {
		right: -36px; 
	}		
}
@media screen and (max-width: 1280px) {
    /* ###### Layout CSS ###### */
    .inner {
        width: calc(100% - 20px);
    }
    /* ###### Common CSS ###### */
    /* 헤더/푸터 영역 */
    /* 헤더 */
    .gnb {
        display: none;
    }

    /* 버거메뉴 */
    label[for=trigger] {
        width: 24px;
        height: 16px;
        display: block;
        position: absolute;
        cursor: pointer;
        right: 20px;
        top: 50%;
        transform: translateY(-50%);
        transition: 0.3s;
    }
    label[for=trigger] span {
        position: absolute;
        height: 2px;
        background-color: #000;
        width: 100%;
        left: 0;
        transition: 0.3s;
    }
    label[for=trigger] span:nth-child(1) {
        top: 0;
    }
    label[for=trigger] span:nth-child(2) {
        top: 50%;
    }
    label[for=trigger] span:nth-child(3) {
        top: 100%;
    }
    .mobile_menu {
        background-color: #fff;
        border-top: 1px solid var(--bt);
        border-left: 1px solid var(--bt);
        /* box-shadow: 0 8px 10px #00000012; */
        width: 300px;
        height: 100vh;
        position: fixed;
        z-index: 999;
        /* right: 0; */
        right: -300px;
        transition: 0.3s;
    }
    input[id=trigger]:checked + label[for=trigger] span:nth-child(1) {
        top: 50%;
        transform: rotate(45deg);
    }
    input[id=trigger]:checked + label[for=trigger] span:nth-child(2) {
        opacity: 0;
    }
    input[id=trigger]:checked + label[for=trigger] span:nth-child(3) {
        top: 50%;
        transform: rotate(-45deg);
    }
    input[id=trigger]:checked ~ .mobile_menu {
        right: 0;
    }
    input[id=trigger]:checked ~ .mobile_menu::after {
        display: block;
    }
    input[id=trigger]:checked + label[for=trigger] {
        right: 20px;
    }
    /* 모바일 메뉴 */
    .mobile_menu {
        display: block;
        overflow: auto;
    }
    .menu_list_up a {
        display: block;
        padding: 16px;
        text-align: left;
    }
    .sub-category {
        display: none;
        background-color: var(--bgs);
    }
    .sub-category a {
        border-bottom: 1px solid var(--bt);
    }
    .sub-category a:hover {
        color: var(--pc02);
        background-color: #DCFCE7;
    }
    .menu_list {
        border-bottom: 1px solid var(--bt);
    }
    .menu_list:hover {
        color: var(--pc);
        border-bottom: 1px solid var(--pc);
        font-weight: 800;
    }
    .menu_list > em {
        width: 30px;
        height: 30px;
        background: url(../img/keyboard_arrow_up.png) no-repeat center center;
        background-size: 16px;
        float: right;
    }
    .menu_list:hover em {
        background: url(../img/keyboard_arrow_up_active.png) no-repeat center center;
        background-size: 16px;
    }
    /* ###### 서브: 제품리스트 ###### */
    .subSec {
        padding-top: 80px;
    }
    .subLeft_wrap {
        top: 80px;
    }
        
        /* ## 메인 ## */
	/*슬라이드 영역*/
	.visual .inner {
		width: calc(100% - 88px); 
	}
	.slick-prev {
		left: -36px;
	}
	.slick-next {
		right: -36px; 
	}	
    


}
@media screen and (max-width: 1180px) {
    /* 서브: 우측 */
    .product_list {
        gap: 12px;
    }
    .product_list li {
        width: calc(33% - 6px);
    }
    .main .floatings {
        flex-direction: row;
        transform: translateY(0);
        bottom: 16px;
    }
    /* ## 메인 ## */
    /*슬라이드 영역*/
    .visual {
        height: 100vh;
        padding-top: 0;
    }
    .slideTxt {
        float: none;
        width: 100%;
        align-items: center;
        height: 50vh;
        text-align: center;
        padding-top: 100px; 
        gap: 12px;
    }
    .sm_txt {
        font-size: 2vh;
        word-break: keep-all;
    }
    .lg_txt {
        font-size: 3.6vh;
        word-break: keep-all;
        margin-top: 2px;
        margin-bottom: 8px;
    }
    .md_txt {
        font-size: 2.4vh;
        word-break: keep-all;
    }
    .product_shortcut {
        font-size: 2vh;
    }
    .slideImg {
        float: none;
        width: 100%;
        height: calc(50vh - 90px);
    }
    .slideImg img {
        width: inherit;
        height: inherit;
        object-fit: contain;
    }
	
    /* 메인 플로팅 */
    /* 왼쪽 배너 */
    .main_floatings {
        bottom: 16px;
    }
    .inquiry_info_wrap h4 {
        border-bottom-right-radius: 6px;
        border-bottom-left-radius: 6px;
        padding: 16px;
    }
    .inquiry_info_wrap h4 span {
        display: none;
    }
    .inquiry_info_wrap h4 img {
        width: 24px;
        height: 24px;
    }
    .main_floatings.active .inquiry_info_wrap h4 img {
        width: 16px;
        height: 16px;
    }
    .main_floatings.active .inquiry_info_wrap h4 {
        padding:8px;
    }
    .main_floatings.active .inquiry_info_wrap h4 span {
        display: block;
    }
    .main_contact_us {
        transition: 0.3s;
        display: none;
    }
    .main_floatings.active .main_contact_us {
        display: block;
    }
    .main_floatings.active .inquiry_info_wrap h4 {
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }
    /* 메인: mainsec01 */
    .mainSec01 .inner {
        gap: 24px;
    }
    .mainSec01 .inner .right_slogans {
        width: calc(80% - 24px);
    }
    
    .copy_admin {
		padding-bottom: 100px;
	}
}

@media screen and (max-width: 1024px) {
    /* 푸터 */
    .copy_admin {
        padding-bottom: 100px;
    }
    /* ###### 서브: 제품리스트 ###### */
    .subSec .inner {
        flex-direction: column;
        width: 100%;
    }
    .subLeft {
        width: 100%;
        height: auto;
    }
    .subRight {
        width: 100%;
        padding: 16px;
    }
    /* 서브: 좌측 사이드바 */
    .snb_wrap {
        background-color: var(--bgs);
        padding: 8px 16px;
        width: 100%;
        overflow: auto;
    }
    .snb {
        display: flex;
        gap: 24px;
    }
    .sub_menu_wrap {
        width: 100%;
        overflow: auto;
    }
    .sub_menu {
        position: absolute;
        width: 100%;
        left: 0;
        top: 100%;
        background-color: var(--bgt);
    }
    .sub_menu li {
        font-size: 1.6rem;
        padding: 0 0;
    }
    .sub_menu li a {
        padding: 16px;
        color: var(--bgf);
    }
    .sub_menu li a:hover {
        background-color: var(--bgt);
        font-weight: 800;
    }
    .subLeft_wrap {
        /* position: fixed;
        background-color: #fff;
        width: calc(100% - 20px); */
        display: flex;
        flex-direction: column;
    }
    .subLeft_wrap > div {
        margin-bottom: 0;
    }
    .subLeft_01 {
        order: 2;
        padding: 0 0;
    }
    .subLeft_01 h3 {
        text-align: center;
    }
    .subLeft_02 {
        order: 1;
        display: flex;
        justify-content: space-between;
        gap: 12px;
        padding: 0 16px;
    }
    .subLeft_wrap > div:nth-of-type(1),
    .subLeft_wrap > div:nth-of-type(2) {
        border: none;
        border-radius: 0;
        overflow: visible;
    }
    .inquiry_info {
        /* width: 50%; */
        position: relative;
        width: 100%;
    }
    .inquiry_info h4 {
        border-radius: 8px;
        text-align: center;
    }
    .contact_us {
        background-color: #fff;
        width: 100%;
        position: absolute;
        border-radius: 8px;
        box-shadow: 0 0 10px #00000024;
        display: none;
    }
    .inquiry_info .call_info p {
        font-size: 1.6rem;
    }
    .inquiry_info .email_info p {
        font-size: 1.6rem;
        word-break: break-all;
    }
    .inquiry_kakao {
        width: 50%;
        border-radius: 8px;
    }
    /* 선택한 상품 모달창*/
    .subLeft_03 {
        display: none;
        position: fixed;
        top: 0;
        z-index: 200;
        width: 100%;
        height: 100%;
        background-color: #00000080; 
        border: none;
    }
    .subLeft_03.active {
        display: block;
    }
    .order_list {
        background-color: #fff;
        position: absolute;
        top: calc(50%);
        left: 50%;
        transform: translate(-50%, -50%);
        overflow: auto;
        max-height: calc(80vh - 120px);
        width: calc(100% - 20px);
    }
    .order_list_title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        position: sticky;
        top: -1px;
    }
    .order_list_title button.delete_btn {
        display: block;
        width: 32px;
        height: 32px;
        background: transparent url(../img/delete_02.png) no-repeat center center;
        background-size: 24px;
    }
    .order_write {
        position: sticky;
        bottom: -1px;
    }
    .floatings {
        flex-direction: row;
        transform: translateY(0);
        bottom: 16px;
    }
    .orderList_open_wrap {
        display: block;
    }
    .estimate_wrap {
        height: 60px;
        padding: 4px;
    }
    /* 서브: noticeBoard */
    .board_list tbody td.t-title {
	text-align: left;
	}
	.board_list tbody td.t-title a {
		text-align: center;
	}
    /* 메인: mainsec01 */
    .mainSec01 .inner .left_bg {
        min-height: 460px;
    }
    .slogan h2 {
        font-size: 4rem;
    }
    .adv_item p {
        font-size: 1.8rem;
    }
    .bg_txt h1 {
        font-size: 5.6rem;
    }
    .mainSec02_content {
        flex-direction: column;
    }
    .mainTitle h1 {
        font-size: 2.4rem;
    }
    .map_section {
        width: 100%;
    }
    
    /* ## 메인 ## */
	/*슬라이드 영역*/
    .visual .inner {
   		width: calc(100% - 36px);
    }
    .slick-prev,
	.slick-next {
	    /*display: none !important;*/
	    height: 24px; 
	    width: 24px;
	}
	.slick-prev {
		left: -8px;
	}
	.slick-next {
		right: -8px; 
	}
	    
    
    
    
}

/* Tablet */
@media screen and (max-width: 768px) {
    /* ###### Common CSS ###### */
    /* 헤더 */
    .header_top .logo {
        width: 140px;
    }
    /* 푸터 */
    .fnb {
        gap: 12px;
        justify-content: center;
    } 
    .footer_bottom .logo {
        padding: 8px 0;
    }
    .footer_bottom .logo img {
        width: 140px;
    }
    .footer_bottom {
        text-align: center;
    }
    .footer_bottom ul {
        flex-direction: column;
        font-size: 1.2rem;
        gap: 4px;
    }
    .footer_bottom ul + ul {
        margin-top: 0px;
    }
    .footer_bottom ul.location_info {
        margin-top: 12px;
    }
    ul.location_info li {
        flex-direction: column;
        gap: 2px;
    }
    ul.location_info li > div {
        flex-direction: column;
    }
    ul.location_info li .dot {
        display: none;
    }
    .copy_admin {
        flex-direction: column;
        gap: 12px;
    }
    .copyright {
        font-size: 1.2rem;
    }
    /* ###### 서브: 제품리스트 ###### */
    .subSec {
        padding-top: 70px;
    }
    /* 서브: 좌측 사이드바 */
    .inquiry_kakao {
        padding: 0;
    }
    /* 서브: 우측 */
    .product_list {
        gap: 12px;
    }
    .product_list li {
        width: calc(50% - 6px);
    }
    /* 서브: productDetail */
    .product_features .name h1 {
        font-size: 1.8rem;
    }
    
    .productDetail .subRight_01 {
        flex-wrap: wrap;
    }
    .product_imgs {
        width: 100%;
    }
    .product_features {
        width: 100%;
        padding-left: 0;
        padding-top: 16px;
        gap: 24px;
    }
    .action_btns button {
    	font-size: 2rem;
    }
    
    /* 서브: noticeBoard */
    .board_list .t-title {
        width: 70%;
    }
    .board_list .t-user {
        width: 15%;
    }
    .board_list .t-date {
        width: 15%;
    }
	.noticeBoard .board_list .t-num,
    .orderHistory .board_list .t-num {
		display: none;
	}
	.board_list .t-file {
		display: none;
	}
	.board_list .t-hit {
		display: none;
	}
    /* 서브: orderWrite */
    .process_wrap {
        flex-wrap: wrap;
        gap: 12px;
    }
    .process {
        flex-basis: calc(50% - 12px);
    }
    .process .box_arrow {
        display: none;
    }

    /* form_field */
    .field {
        flex-wrap: wrap;
    } 
    .field_02 {
        flex-basis: 100%; 
    }
    .field_02:nth-of-type(1) {
        border-bottom: 1px solid var(--bt);
    }
    .field:has(.check_boxes) > label {
        width: 100%;
        text-align: center;
    }
    .form_btns {
        justify-content: center;
        gap: 8px;
    }
    .form_btns button {
        flex: 1;
        min-width: auto;
    }
    /* 개인정보 수집 이용 동의 모달 */
    .orderWrite .modal_content {
        width: calc(100% - 32px);
    }
    .orderWrite .modal_btn button {
        width: 100%;
    }
    /* 서브: orderCheck */
    .orderCheck .form_btns > div {
        width: 50%;
        display: flex;
        gap: 8px;
    }
    .orderCheck .form_btns > div button {
        flex: 1;
    }
    /* 서브: shopList */
    .shopList .board_list th {
    	font-size: 1.4rem;
    }
    /* ## 메인 ## */
    /*슬라이드 영역*/
    .slideTxt {
        gap: 2px;
    }
    /* 메인: mainsec01 */
    .mainSec01 {
        padding: 60px 0;
    }
    .mainSec01 .inner {
        flex-direction: column;
    }
    .mainSec01 .inner .left_bg {
        width: 100%;
        min-height: 100px;
    }
    .mainSec01 .inner .right_slogans {
        width: 100%;
        text-align: center;
    }
    .slogan h2 {
        font-size: 3.2rem;
    }
    .bg_txt {
        position: static;
    }
    .adv_item {
        width: 25%;
    }
    .adv_item p {
        font-size: 1.4rem;
        margin-top: 8px;
    }
    /* 서브: noticeDetail */
    .field.answer label {
        width: 100%;
        justify-content: center;
    }
    /* 서브: noticeDetail */
    .file_field {
        flex-wrap: wrap;
    }
    .file_field label {
        width: 100%;
        padding: 8px;
        justify-content: center;
    }

}

/* Mobile */
@media screen and (max-width: 480px) {
    /* 토탈 검색박스 CSS */
    .total_search_box {
        flex-wrap: wrap;
        gap: 8px;
    }
    .search_box {
        width: 100%;
    }
    .search_box select {
        width: 30%
    }
    .search_box span {
        width: 70%;
    }
    /* 서브: productDetail */
    .action_things {
        flex-wrap: wrap;
    }
    .action_things .input_wrapper {
        width: 100%;
    }
    .action_things .input_wrapper input {
        padding: 12px;
    }
    .action_btns {
        width: 100%;
    }
    .tabs li {
        font-size: 1.6rem;
    }
    .guide h4 {
        font-size: 1.6rem;
    }
    .guide_04 ul {
        flex-direction: column;
        margin-top: 12px;
    }
    /* 서브: orderWrite */
    .orderWrite .board_list th,
    .orderWrite .board_list td {
        font-size: 1.4rem;
    }
    .orderWrite .t-num {
        width: 15%;
    }
    .orderWrite .t-quantity {
        width: 28%;
    }
    .process .box_txt h1 {
        font-size: 1.6rem;
    }

    /* form_field */
    .field_02 {
        flex-direction: column;
    }
    .check_boxes {
        flex-wrap: wrap;
    }
    .field label {
        flex-basis: 100%;
        font-size: 1.4rem;
        padding: 8px;
    }
    .field select {
        width: 100%;
    }
    .form_btns {
        justify-content: center;
        gap: 8px;
    }
    .form_btns button {
        flex: 1;
        min-width: auto;
    }
    .form_btns button {
        flex: 1;
        min-width: auto;
        font-size: 1.4rem;
    }

    /* 개인정보 수집 이용 동의 모달 */
    #modal_03 .modal_btn button {
        width: 100%;
    }
    /* 서브: orderCheck */
    .orderCheck .form_btns {
        flex-wrap: wrap;
    }
    .orderCheck .form_btns > div {
        width: 100%;
    }
    .orderCheck .form_btns > div button {
        flex: 1;
    }
    /* 서브: shopList */
    .shopList .subRight_02 {
    	overflow: auto; 
    }
    .shopList .board_list {
    	width: 768px;
    }
	.shopList .total_search_box {
		flex-wrap: wrap; 
	}
	.shopList .search_box select {
		width: 100%;
	}
	
	
	

    /* 메인: mainsec01 */
    .mainSec01 {
        padding: 50px 0;
    }
    .adv_items {
        margin-top: 24px;
    }
    .slogan {
    	justify-content: center;
    }
    .en_slogan {
        font-size: 1.4rem;
    }
    .slogan h2 {
        font-size: 2.8rem;
    }
    .mark_wrap {
    	width: 100%;
    	justify-content: center;
    	padding: 16px 0;
    }
    .mark_wrap img {
		width: 56px;  
	}
    
    .bg_txt h1 {
        font-size: 2.6rem;
        text-align: center;
        white-space: wrap;
        margin-top: 24px;
    }

    /* 메인: mainsec02 */
    .mainSec02 {
        padding: 50px 0;
    }



}
@media screen and (max-width: 430px) {
 
    /* 서브: orderWrite */
    .agree_btns {
        flex-direction: column;
    }
    .agree_btns a {
        min-width: 100%;
        padding: 6px;
        border-radius: 4px;
    }
    /* 서브: shopList */
	.shopList .search_box #sido {
		margin-right: 0; 
	}
	/* ## 메인 ## */
	.map_section_header em {
		font-size: 1.6rem;
	}
}

@media screen and (max-width: 375px) {
    /* ###### Common CSS ###### */
    /* 푸터 */
    .fnb {
        padding: 8px 0;
    }
    .fnb li a {
        padding: 4px;
    }


    /* 토탈 검색박스 CSS */
    .search_box {
        flex-wrap: wrap;
        gap: 4px;
    }
    .search_box select {
        width: 100%;
        margin-right: 0;
    }
    .search_box span {
        width: 100%;

    }
    .inquiry_kakao img {
        display: none;
    }
    /* 서브: 우측 */
    .product_list {
        gap: 12px;
    }
    .product_list li {
        width: 100%;
    }
    
    /* 메인: mainsec01 */
    .adv_item {
	    width: 20%;
	}
    
}

@media screen and (max-width: 360px) {
    /* 서브: noticeBoard */
    .noticeBoard .board_list .t-title,
    .orderHistory .board_list .t-title {
        width: 100%;
    }
	.board_list .t-user {
		display: none;
	}
    .board_list .t-date {
		display: none;
	}
	.bo-date-hit-box {
		display: block;
		color: var(--tdis);
        font-size: 1.4rem;
        font-size: 400;
	}
}

@media screen and (max-width: 320px) {
    
}
