@charset "utf-8";
/* CSS Document */
/*공통*/
[id^="sect_0"] {
    padding: 0 0 var(--sec_pd); 
}
.full{ width: 100%;}
.half {
    width: 49% !important;
}
/* 공통 섹션 타이틀 */
[id^="sect_0"] .sect_tit {
    line-height: 1;
    height: 316px; /* ★ 공통 */
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: cover;
}
    /* 공통 전체보기 버튼 */
    .seeAllbtn{
        border: 1px solid var(--gray_2);
        background-image: none;
        box-sizing: border-box;
        color: var(--gray_2);
    }
    .seeAllbtn:hover{
        transition: 100ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
        border: var(--op_white);
        background-image: var(--gradientR); 
        color: var(--white);
    }
/* 공통 콘텐츠 타이틀 */
[id^="sect_0"] .sect_cont > div:first-child{padding-left: 1rem;}
[id^="sect_0"] .sect_cont p:has(.tit_dot) {position: relative;}
[id^="sect_0"] .sect_cont .tit_dot { 
        position: absolute;
        top:0; left: 0;
        transform: translate(-90%, -90%);
        background-color: var(--point);
        border-radius: 3px;
        display: inline-block;
        width: 12px;
        aspect-ratio: 1/1;
    }

.sect_cont .grow{max-width: 1270px;}

/* 카드 디자인 */
.sect_cont .card{border: 1px solid transparent; border-radius:calc(var(--br_s) * 1.5); flex: 1 1 45%;}
.sect_cont .card:hover {border: 1pt solid var(--point); box-shadow: 0 3px 5px #ed6c2b33;}
.sect_cont .card .img_box{aspect-ratio: 1 / 1!important; display: flex; justify-content: center; align-items: center; overflow: hidden; border-radius:calc(var(--br_s) * 1.5); width: 55%; }
.sect_cont .card .img_box img{ display: block; aspect-ratio: 1 / 1!important; width: 100%; height: 100%; max-width: 345px; display:block; object-fit: scale-down;}

/* 아이콘 */
.icon span{ border: 1px solid transparent; padding: 0.25rem 0.5rem; border-radius:var(--br_c); margin-right: 0.25rem; box-sizing: border-box;}
    .icon .ice{color: #00b8eb; border-color:#00b8eb;}
    .icon .cold{color: #4395ff; border-color:#4395ff;}
    .icon .hot{color: #ff4343; border-color:#ff4343;}
    .icon .clean{color: #10bc2a; border-color:#10bc2a;}
/* 가격OFF */
span.off{position: relative; padding: 0.125rem;}
    span.off::after{content: "";  width: 100%;  height: 100%;  position: absolute;  top: 0;  left: 0;  background: linear-gradient(to top left, transparent calc(50% - 1px), #ff4343, transparent calc(50% + 1px)); }
/* 섹션 */
#sect_01 {
    padding-top: calc(var(--sec_pd) / 1.75);
}
/* 섹션 타이틀 이미지 */
    #sect_01 .sect_tit { 
        background-image: url(../images/sect1/sect_tit.png);
    }
    #sect_02 .sect_tit { 
        background-image: url(../images/sect2/sect_tit.png);
    }
    #sect_03 .sect_tit { 
        background-image: url(../images/sect3/sect_tit.png);
    }
    #sect_04 .sect_tit { 
        background-image: url(../images/sect4/sect_tit.png);
    }
    #sect_05 .sect_tit { 
        background-image: url(../images/sect5/sect_tit.png);
    }
    
/* ==================== 해상도 1380px 이상 ==================== */

@media (max-width: 1380px) {
/* 공통 섹션 타이틀 */
[id^="sect_0"] .sect_tit {
    height: 210px; /* ★ 공통 */
    background-position: bottom right;
    background-size: contain;
}
#sect_01{padding-top: 0;}
/* 섹션 타이틀 이미지 */
    #sect_01 .sect_tit { 
        background-image: url(../images/sect1/sect_tit_m.png), linear-gradient(to right, #e3f3ff, #c5def1);
    }
    #sect_02 .sect_tit { 
        background-image: url(../images/sect2/sect_tit_m.png), linear-gradient(to right, #e2ffe2, #c6f2c6);
    }
    #sect_03 .sect_tit { 
        background-image: url(../images/sect3/sect_tit_m.png), linear-gradient(to right, #e3f9ff, #c8eaf3);
    }
    #sect_04 .sect_tit { 
        background-image: url(../images/sect4/sect_tit_m.png), linear-gradient(to right, #fff1e2, #f2dec6);
    }
    #sect_05 .sect_tit { 
        background-image: url(../images/sect5/sect_tit_m.png), linear-gradient(to right, #eae3ff, #d0c5f1);
    }
.sect_tit > .wrap > .half { width:49%!important;}
    .sect_cont .grow{max-width: 100%!important;}

		
}
/* ==================== 모바일 레이아웃 ==================== */
@media (max-width: 1280px) {
/* 공통 섹션 타이틀 */
[id^="sect_0"] .sect_tit {
    height: 180px; /* ★ 공통 */
    align-items: center;
    padding-bottom: 0rem;
}
    .card.p_ver {
        display: none !important;
    }

    img.m_ver {
        display: block !important;
        margin: 0 auto !important;
    }

    .half {
        width: 100% !important;
    }
    .sect_cont .card .img_box img{ width: 85%; height: 85%;}
}

@media (max-width: 900px) {
/* 공통 섹션 타이틀 */
[id^="sect_0"] .sect_tit {
    height: 120px; /* ★ 공통 */
}
	.sect_tit > .wrap > .half { padding-right: 0;}
	.icon{margin-top: 0.85rem}
	.card_wrap{gap:1rem}
    .sect_cont .card {flex:1 1 45%; align-items: center;}
    .sect_cont .card, 
    .txt_box{padding: 1rem;}
    .sect_cont .card .img_box {width:100%; height: 50%;}
/*    .sect_cont .card .img_box img{ width: 70%; height: 70%;}*/
    .sect_cont .card .txt_box{width:100%;}
	.txt_box .fs_20 {font-size: 14px;}
}

@media (max-width: 600px) {
/* 공통 섹션 타이틀 */
[id^="sect_0"] .sect_tit {
    height: 100px; /* ★ 공통 */
}
}

@media ( max-width: 400px ) {
}