/* BASIC css start */
#contentWrap { width:1300px; margin:0 auto }
/* class-list */
#productClass .cate-wrap { overflow:hidden }
#productClass .cate-wrap .bcate { font-family: 'Jost','Noto Sans KR', sans-serif;padding:70px 0 40px;  font-size:32px; color:#222222; font-weight:500; text-align:center; }
#productClass .cate-wrap .class-list ul { text-align:center}
#productClass .cate-wrap .class-list ul:after { display:block; clear:both; content:'' }
#productClass .cate-wrap .class-list ul li { margin: 5px; display:inline-block; }
#productClass .cate-wrap .class-list ul li a { font-family: 'Jost','Noto Sans KR', sans-serif;display:block; font-size:15px; color:#999999; background-color:#f9f9f9; padding:13px 30px; border-radius:30px ; transition:all .2s}
#productClass .cate-wrap .class-list ul li a:hover,#productClass .cate-wrap .class-list ul li.sel a{background-color:#fff; color:#000; box-shadow:0 0 4px 1px rgba(0,0,0,.1)}
/* best-item */


#productClass .best-item { padding-top: 20px; padding-bottom: 10px; border-top: 2px solid #5c5c5c; border-bottom: 2px solid #5c5c5c; background-color: #f8f8f8; }

.best_sec{margin-bottom:60px; padding:100px 0 30px; }

.best_sec_inner{ margin:0 auto;position:relative; }
.best_sec .swiper{padding-bottom:40px;}
.best_sec .swiper .swiper-pagination-progressbar{bottom: 0; top: unset; height:3px; background-color: rgba(0,0,0,.09);}
.best_sec .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background-color: #dc3737;}



/* 메인 배너 */
#mainSpot { position:relative; margin-bottom:10px; } 
#mainSpot .swiper>ul>li>a { display:block; width:100%; overflow:hidden; border-radius:25px; } 
#mainSpot .swiper>ul>li>a>img { width: 100%; } 
#mainSpot .swiper .btn_wrap { position: absolute; z-index: 4; bottom: 21px; left: 50%; transform: translateX(-50%); display: none; width:86px; } 
#mainSpot .swiper .btn_wrap .swiper-pagination { background-color: rgba(0,0,0,0.5); border-radius: 25px; width: 82px; height: 36px; color: #fff; position:static; margin-right:10px; font-size: 0; } 
.swiper-pagination .swiper-pagination-total,
.swiper-pagination::before { opacity: 0.5; font-size:14px; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); } 
.swiper-pagination .swiper-pagination-current { opacity: 1; font-size:14px; position: absolute; top: 50%; left: 20px; transform: translateY(-50%); } 
.swiper-pagination .swiper-pagination-current::after { content: '/'; opacity: 0.5; /* '/' 기호의 투명도 */ margin: 0 7px; /* 위치 조정 필요 시 */ font-size: 14px; } 
#mainSpot .swiper .btn_wrap .control_btn { position:relative; } 
#mainSpot .swiper .btn_wrap .control { position:absolute; left:0; top:0; display:none; } 
#mainSpot .swiper .btn_wrap .control.on { display:block; } 
#mainSpot .swiper .btn_wrap .control a { cursor: pointer; display: flex; transition: all .1s; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background-color: rgb(0 0 0 / 50%); } 
#mainSpot .swiper .btn_wrap .control a img { width:10px; } 
#mainSpot .swiper .btn_wrap .pause_btn.control a img { width:8px; } 
#mainSpot .swiper ul li.swiper-slide-active .txt_area p { transform: translateY(0px); opacity: 1; } 
#mainSpot .swiper ul li.swiper-slide-active .txt_area a.more { transform: translateY(0px); opacity: 1; } 
#mainSpot .swiper ul li .txt_area { overflow: visible; position: absolute; top: 50%; transform: translateY(-50%); width: 100%; left:0; padding-left:6%; max-width:95% } 
#mainSpot .swiper ul li .txt_area>* { transform: translateY(-25px); } 
#mainSpot .swiper ul li .txt_area p { opacity: 0; line-height: 1.3; } 
#mainSpot .swiper ul li .txt_area p.big { transition: all .6s; transition-delay: .1s; margin-bottom: 8px; } 
#mainSpot .swiper ul li .txt_area p.sub { font-weight: 500; transition: all .6s; margin-bottom: 17px; transition-delay: .37s; } 
#mainSpot .swiper ul li .txt_area a.more { opacity: 0; transition-delay: .6s; } 
#mainSpot .swiper-button-next {right: 15.6% !important;opacity: 0.8;} 
#mainSpot .swiper-button-prev {left: 15.6% !important;opacity: 0.8;} 

/* BASIC css end */