/* BASIC css start */
#header { position: fixed; z-index: 99; background-color: transparent; left: 0; right: 0; } 
#footer { margin-top:0 !important } 
#header .head_bottom .swiper ul li a{color:#fff !important;}

.section :is(*) { box-sizing:border-box } 
/* ¸ÞÀÎ ¼½¼Ç °øÅë */
.sec_inner { padding:0 5% } 
.sec_inner.padding0 { padding:0 } 
.sec_inner.padding0 .item_list .info { padding: 17px 11px; } 
.sec_inner.padding0 .sec_cate {padding:0 5%;} 
.section .sec_cate {margin-bottom: 19px;display: flex;justify-content: space-between;flex-wrap:wrap;flex-direction:column;gap: 23px;} 
.section h2 {font-size: 26px; color: #000; font-weight: 600; } 
.section h2.mb10 {} 
.section .sec_cate ul { display:flex; justify-content:left; gap: 20px; } 
.section .sec_cate ul li { } 
.section .sec_cate ul li a { display:block; width:100%; color:#aaaaaa; font-size: 14px; font-weight:500; letter-spacing: -.3px; transition: all .3s; position:relative; display:block; } 
.section .sec_cate ul li.on>a { color: #000 !important; border-bottom: 1px solid #000; padding-bottom: 1px; } 
.section .sec_prd>div { display: none; position:relative; } 
.section .sec_prd>div.show { display: block; } 
.section .prd_more_btn { text-align:center; margin-top:40px; } 
.section .prd_more_btn>a { display:inline-block; border:1px solid #000; padding:10px 0px; width:80%; background: #000; } 
.section .prd_more_btn>a button.btn_moreGray { background-color: #000 !important; color: #fff; font-size:15px; font-weight:400; width:100%; } 
.section .prd_more_btn>a button.btn_moreGray img { display: inline-block; vertical-align: middle; } 
.txt_area p.sub {color: #fff;line-height: 1.6;font-weight: 400;transition: all .4s;} 
.txt_area p.big {color: #fff;font-weight: 500;line-height: 1.3;transition: all .5s;} 
.txt_area a.more { width:auto; display: inline-block; transition: all .4s; border: 1px solid #fff; color: #fff; margin-top: 8px; font-weight: 400; padding: 12px 25px; line-height: 1; box-sizing: border-box; } 


/* sec1 */
#sec1 {margin-bottom: 35px;} 
#sec1 .swiper { } 
#sec1 .swiper ul { } 
#sec1 .swiper ul li { } 
#sec1 .swiper ul li>a { display: block; width: 100%; } 
#sec1 .swiper ul li>a>img { width: 100%; } 
#sec1 .swiper ul li .txt_area {overflow: visible;position: absolute;left: 23px;bottom: 87px;max-width: 100%;} 
#sec1 .swiper ul li .txt_area p { opacity: 0; } 
#sec1 .swiper ul li.swiper-slide-active .txt_area p {transform: translateY(25px);opacity: 1;} 
#sec1 .swiper ul li.swiper-slide-active .txt_area a.more { transform: translateY(35px); opacity: 1; } 
#sec1 .swiper ul li .txt_area p.sub {font-size: 17px;font-weight: 300;transition: all .4s;transition-delay: .25s;} 
#sec1 .swiper ul li .txt_area p.big {font-size: 28px;font-weight: 700;transition: all .5s;transition-delay: .42s;margin-bottom: 18px;} 
#sec1 .swiper ul li .txt_area a.more { opacity: 0; transition-delay: .58s; font-size: 17px; } 
#sec1 .swiper-pagination {bottom: 14px;top: unset;left: 50%;transform: translateX(-50%);width: 89%;height:2px;} 
#sec1 .swiper-pagination-progressbar { background-color:rgb(0 0 0 / 29%); } 
#sec1 .swiper-pagination-progressbar-fill { background-color: #fff; } 


/* ¾ÆÀÌÄÜ ¿µ¿ª */
.ico_wrap { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px 10px; width: 59%; margin: 45px auto 50px; } 
.ico_wrap a { display: flex; width: 30%; text-align: center; flex-direction: column; align-items: center; gap: 12px; } 
.ico_wrap a:nth-child(3) p:after { content:''; width: 6px; height: 6px; background: #ff5b00; border-radius: 100%; position: absolute; top: -4px; right: -7px; } 
.ico_wrap a img { width: 100%; } 
.ico_wrap a p { position: relative; font-size: 12px; font-weight: 500; color: #000; line-height: 1; } 


/* sec2 */
#sec2 { margin-bottom:77px; } 
#sec2 .swiper { padding-bottom: 0; } 
#sec2 .swiper-pagination { bottom: 0px; top: unset; left:14%; width:72%; height:1px; } 
#sec2 .swiper-pagination-progressbar-fill { background-color: #000; } 


/* ¼­ºê¹è³Ê */
.sub_bnr_wrap { position: relative; display: flex; flex-direction: column; align-items: center; margin-bottom:65px; } 
.sub_bnr_wrap a { display: block; width: 100%; } 
.sub_bnr_wrap a img { width: 100%; } 


/* sec3 */
#sec3 { margin-bottom:77px; } 


/* sec5 */
#sec5 { margin-bottom: 50px; } 
#sec5 .sec_inner { } 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap { } 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap>ul { margin-top:15px; opacity:0; transition:all .3s } 
#sec5 .sec_inner .swiper .sec5_prd>div.swiper-slide-active .sec5_wrap>ul { opacity:1 } 
#sec5 .sec_inner .swiper { } 
#sec5 .sec_inner .swiper .sec5_prd>div { width: 90%; } 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap .sec5_ban { } 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap .sec5_ban { } 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap .sec5_ban ul { } 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap .sec5_ban ul li { position:relative; border-radius: 7px; overflow: hidden; } 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap .sec5_ban ul li>a { display: block; width: 100%; } 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap .sec5_ban ul li>a img { width: 100%; } 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap .sec5_ban ul li .txt_area {overflow: visible;position: absolute;left: 0%;bottom: 0px;padding-left: 30px;max-width: 90%;} 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap .sec5_ban ul li .txt_area p { opacity: 0 } 
#sec5 .sec_inner .swiper .sec5_prd>div.swiper-slide-active .sec5_wrap .sec5_ban ul li .txt_area p {transform: translateY(-25px);opacity: 1;} 
#sec5 .sec_inner .swiper .sec5_prd>div.swiper-slide-active .sec5_wrap .sec5_ban ul li .txt_area a.more { transform: translateY(-35px); opacity: 1; } 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap .sec5_ban ul li .txt_area p.big {font-size: 31px;font-weight: 700;transition-delay: .25s;white-space: pre;letter-spacing: -.25px;} 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap .sec5_ban ul li .txt_area p.sub {font-size: 16px;font-weight: 300;margin-bottom: 30px;transition-delay: .46s;} 
#sec5 .sec_inner .swiper .sec5_prd>div .sec5_wrap .sec5_ban ul li .txt_area a.more {transition-delay: .6s;font-size: 11px;padding: 7px 11px;opacity: 0} 
#sec5 .item_list { border-bottom: 1px solid #e8e8e8; display: flex; padding: 8px 0; } 
#sec5 .item_list .thumb { width: 20%; } 
#sec5 .item_list .info {width: 80%;display: flex;flex-direction: column;justify-content: center;padding: 0 15px;} 
#sec5 .item_list .info .price {font-size:15px;font-weight:500;margin-bottom: 0;} 


/* sec10 */
#sec10 { } 
#sec10 .sec_inner { } 
#sec10 .sec_inner ul { display: flex; flex-wrap: wrap; gap: 20px; flex-direction: column; align-items: center; } 
#sec10 .sec_inner ul li { position: relative; /* flex-grow: 1; */ } 
#sec10 .sec_inner ul li>a { display: block; width: 100%; } 
#sec10 .sec_inner ul li>a>img { width: 100%; } 
#sec10 .sec_inner ul li .txt_area { position: absolute; top: 56%; transform: translateY(-50%); left: 40px; max-width: 85%; } 
#sec10 .sec_inner ul li .txt_area p { opacity: 0; } 
#sec10 .sec_inner ul li .txt_area p.big { font-size: 24px; font-weight: 600; margin-bottom: 11px; transition-delay: .1s; line-height: 1.25; } 
#sec10 .sec_inner ul li .txt_area p.sub { font-size: 15px; margin-bottom: 15px; transition-delay: .37s; line-height: 1.35; } 
#sec10 .sec_inner ul li .txt_area a.more { font-size: 11.5px; opacity: 0; transition-delay: .58s; } 
#sec10.act .sec_inner ul li .txt_area p {transform: translateY(-15px);opacity: 1;letter-spacing: -.50px;} 
#sec10.act .sec_inner ul li .txt_area a.more { transform: translateY(-25px); opacity: 1; } 


.dn{display:none !important;}




/* BASIC css end */