/* 공통 */ .swiper .mo_ver{display: none;} /* slide */ .swiper-slide{position: relative;overflow: hidden} .slide_text_box{position: absolute;z-index: 9;top: 50%; left: 100px;transform: translateY(-50%);} .slide img{display: block;} .slide{background: #f9f9f9;} /* sec01 */ .sec01{background: #fff;} .sec01 ul {display: flex;} .sec01 ul li{width: calc(100% / 5); text-align: center;position: relative; border-radius: .4em; overflow: hidden; border: 1px solid #eee;} .sec01 ul li > div{cursor: pointer;} .sec01 ul li + li{margin-left: .8em;} .sec01 ul li i{display: block; width: 3em;height: 3em; margin:0 auto; } .sec01 ul li i img{display: block; width: 100%;height: 100%;} .sec01 ul li p{display: block; font-weight: 600; font-size: 0.9em;/* position: absolute;left:50%; top:50%; transform: translate(-50%,-50%); */color: #333; margin-top: .2em;} /* sec01 */ .main_slide.product_list .thumbnail{padding-bottom: 100%; border-radius: 0; cursor: pointer;} .main_slide .text_box{ position: absolute;bottom:1.2em;left:0; width:100%; padding:0 1.2em; color: #fff;} .main_slide .text_box > p, .main_slide .text_box > div{display: none;} .main_slide .text_box > .title{display: flex; font-size: 1.3em;} .main_slide.product_list .review p, .main_slide.product_list .review span, .main_slide.product_list .state, .main_slide.product_list .state span, .main_slide.product_list .txt{color: inherit; border-color:#fff;} .main_slide.product_list .state {font-size: 0.8em; margin-bottom: 0.6em;} .main_slide.product_list .tit {font-size:1.2em;} .main_slide.product_list .txt {font-size:0.9em;} .main_slide.product_list .price {font-size:1.2em;} .category_wrap__cl > li {} .adver_banner_wrap {width: 100%; height: 10em; overflow: hidden; position: relative;} .adver_banner_wrap > img {width: 100%; height: 100%;} .teacher_filter {overflow-x: auto; white-space: nowrap; } .category_wrap__th { display: inline-flex; /* 가로 정렬을 위한 flexbox */ padding: 0; margin: 0; list-style: none;} /* .category_wrap__th li {flex: 0 0 auto; margin-right: 10px; cursor: pointer;} */ .sec01 ul.category_wrap__th {gap: .8em; margin-top: 1em;} .sec01 ul.category_wrap__th li {border: 0; margin-top: 1em 333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333 ;} .sec01 ul.category_wrap__th li > p {font-size: .8em; border: 1px solid #eee; background-color: #f7f7f7; margin-top: 0;} .sec01 ul.category_wrap__th li + li {margin-left: 0; border: 0;} .category_wrap__th li {cursor: pointer;} .category_wrap__th li.on p {background-color: #2A4186; color: #fff;} .category_wrap__th li p { margin: 0; /* 불필요한 여백 제거 */ padding: .5em; /* 클릭 영역 확대 */ color: #555;} .sec01 ul li.cate_02 {height: fit-content; border: 1px solid #eee; overflow: hidden; border-radius: .4em;} .sec01 ul li.cate_02 i {width: 2.2em; height: 2.2em; position: relative; margin-top: .5em;} .sec01 ul li.cate_02 i img {object-fit: contain;} .sec01 ul.category_wrap__th li.cate_02 + li.cate_02 {margin-left: 0; border: 1px solid #eee;} .sec02 .sec_title {margin-top: .6em;} .index_wrap .filter_Swiper.swiper {padding: .8em 0;} /* ********************************************* * * 1400px max * ********************************************* */ @media (max-width:1400px){ } /* ********************************************* * * 960px max * ********************************************* */ @media (max-width:960px){ .index_wrap > i{width: 100%;} } /* ********************************************* * * 789px max * ********************************************* */ @media (max-width:789px){ } /* ********************************************* * * 640px max * ********************************************* */ @media (max-width:640px){ .index_wrap > i{width: 140%;} } /* ********************************************* * * 500px max * ********************************************* */ @media (max-width:500px){ }