/* index.css */ /* ===================================================================== main */ #wrap main {} /* ======================================================================= fab */ #wrap main #fab_wrap { position: fixed; right: 32px; bottom: 40px; z-index: 888; } #wrap main #fab_wrap a {display: block; width: 54px;} #wrap main #fab_wrap .top_btn { opacity: 0; transform: translateY(20px); border-radius: 50%; transition: 0.3s; } #wrap main #fab_wrap .top_btn.show {opacity: 1; transform: translateY(0);}/* 스크롤을 해서 나타난 상태 */ #wrap main #fab_wrap .chat_btn:hover, #wrap main #fab_wrap .top_btn.show:hover {/* hover 디자인 */ box-shadow: 0 0 10px rgba(0, 0, 0, 0.6); } #wrap main #fab_wrap .top_btn img, #wrap main #fab_wrap .chat_btn img {display: block;} #wrap main #fab_wrap .top_btn img {width: 100%;} #wrap main #fab_wrap .chat_btn {margin-top: 12px; border-radius: 50%; transition: 0.3s;} #wrap main #fab_wrap .chat_btn img {width: 100%;} /* =============================================================== 히어로배너 */ #wrap main #hero_bnr_wrap {} #wrap main #hero_bnr_wrap .hero_bnr_swiper {} #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper {} /* --------------------------- 공통 swiper-slide */ #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper .swiper-slide {} #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper .swiper-slide a { display: block; height: 85vh; position: relative; background-position: right; background-size: cover; } #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper .swiper-slide a .bnr_txt {position: absolute; top: 50%; left: 230px; transform: translateY(-50%);} #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper .swiper-slide a .bnr_txt .title {margin-bottom: 28px;} #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper .swiper-slide a .bnr_txt .title > * {font-size: 2.63rem;} #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper .swiper-slide a .bnr_txt .title p {margin-bottom: 16px;} #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper .swiper-slide a .bnr_txt .title h1 {font-weight: 700;} #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper .swiper-slide a .bnr_txt .title span {font-weight: 700;} #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper .swiper-slide a .bnr_txt > .detail {font-size: 1.5rem; line-height: 1.5;} /* --------------------------- 개별 slide */ #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper .slide1 a {background-image: url(../images/main/hero_bnr1.jpg);} #wrap main #hero_bnr_wrap .hero_bnr_swiper .swiper-wrapper .slide2 a {background-image: url(../images/main/hero_bnr2.jpg);} /* --------------------------- swiper-pagination */ #wrap main #hero_bnr_wrap .hero_bnr_swiper .bar { width: 80%; height: 3px; top: auto; bottom: 34px; left: 50%; transform: translateX(-50%); background: rgba(255, 255, 255, 0.8); } #wrap main #hero_bnr_wrap .hero_bnr_swiper .bar .swiper-pagination-progressbar-fill {background: #6B32D2;} /* ======================================================================================== 베스트 */ #wrap main #best_wrap {margin: 100px auto 200px;} #wrap main #best_wrap h1 {margin-bottom: 50px;} #wrap main #best_wrap .best_list {display: flex; gap: 18px;} /* --------------------------------------- 베스트 상품 공통 */ #wrap main #best_wrap .best_list .best_product {} /* --------------------------------------- 베스트 상품 공통 - 이미지박스 */ #wrap main #best_wrap .best_list .best_product .photo_box {position: relative; margin-bottom: 18px;} #wrap main #best_wrap .best_list .best_product .photo_box:hover .like_cart {opacity: 1; transform: translate(-50%, 0);} #wrap main #best_wrap .best_list .best_product .photo_box:hover .photo .prod_hover {opacity: 1;} #wrap main #best_wrap .best_list .best_product .photo_box .photo {display: block;} #wrap main #best_wrap .best_list .best_product .photo_box .photo img {width: 100%;} #wrap main #best_wrap .best_list .best_product .photo_box .photo img.prod {} #wrap main #best_wrap .best_list .best_product .photo_box .photo img.prod_hover { position: absolute; top: 0; left: 0; opacity: 0; transition: 0.5s; } /* --------------------------------------------- 이미지에 호버 했을 때 보이는 아이콘 */ #wrap main #best_wrap .best_list .best_product .photo_box .like_cart { position: absolute; bottom: 20px; left: 50%; transform: translate(-50%, 10px); z-index: 777; opacity: 0; transition: 0.3s; } #wrap main #best_wrap .best_list .best_product .photo_box .like_cart a {display: inline-block; padding: 10px; background: rgba(255, 255, 255, 0.6); border-radius: 50%;} #wrap main #best_wrap .best_list .best_product .photo_box .like_cart a.like {margin-right: 20px;} #wrap main #best_wrap .best_list .best_product .photo_box .like_cart a img {width: 24px; display: block;} /* --------------------------------------- 베스트 상품 공통 - 텍스트박스 */ #wrap main #best_wrap .best_list .best_product .txt_box {} #wrap main #best_wrap .best_list .best_product .txt_box > a {} #wrap main #best_wrap .best_list .best_product .txt_box > a h2, #wrap main #best_wrap .best_list .best_product .txt_box > a h2 span {font-size: 1.06rem; font-weight: 500;} #wrap main #best_wrap .best_list .best_product .txt_box > a .price {margin: 12px 0;} #wrap main #best_wrap .best_list .best_product .txt_box > a .price .discount {font-size: 1.19rem; font-weight: 600; color: #6B32D2;} #wrap main #best_wrap .best_list .best_product .txt_box > a .price em {font-size: 1.19rem; font-weight: 600; margin: 4px;} #wrap main #best_wrap .best_list .best_product .txt_box > a .price del {font-size: 0.94rem; font-weight: 400; color: #bbb;} #wrap main #best_wrap .best_list .best_product .txt_box .review {display: flex; align-items: center;} #wrap main #best_wrap .best_list .best_product .txt_box .review img {} #wrap main #best_wrap .best_list .best_product .txt_box .review span {font-size: 0.81rem; transform: translateY(3px);} #wrap main #best_wrap .best_list .best_product .txt_box .review .rating {margin:0 10px 0 4px;} #wrap main #best_wrap .best_list .best_product .txt_box .review .review_count {} /* ================================================================================= 신제품 영역 */ #wrap main #new_wrap {margin: 0 auto 200px;} /* --------------------------------------- 제목 + 탭 */ #wrap main #new_wrap .new_title_tab {display: flex; justify-content: space-between; margin-bottom: 32px;} #wrap main #new_wrap .new_title_tab h1 {font-size: 1.44rem; font-weight: 600;} #wrap main #new_wrap .new_title_tab .tab {} #wrap main #new_wrap .new_title_tab .tab a {padding: 8px 24px; background: #e9e9e9; border-radius: 999px; margin-right: 12px;} #wrap main #new_wrap .new_title_tab .tab a:last-child {margin: 0;} #wrap main #new_wrap .new_title_tab .tab a.active {background: #6B32D2; color: #fff;} /* --------------------------------------- 탭 안 내용 공통 */ #wrap main #new_wrap .new_product {display: flex; justify-content: space-between; align-items: center;} /* --------------------------------------- 탭 안 내용 공통 - 텍스트 박스 */ #wrap main #new_wrap .new_product .new_txt_box {min-width: 358px; margin-right: 20px;} #wrap main #new_wrap .new_product .new_txt_box > * {margin-bottom: 40px;} #wrap main #new_wrap .new_product .new_txt_box:last-child {} #wrap main #new_wrap .new_product .new_txt_box h1 {font-size: 1.88rem; font-weight: 600; margin-bottom: 50px;} #wrap main #new_wrap .new_product .new_txt_box .detail {} #wrap main #new_wrap .new_product .new_txt_box .detail span {display: block; font-size: 0.94rem; line-height: 1.7;} #wrap main #new_wrap .new_product .new_txt_box .price {} #wrap main #new_wrap .new_product .new_txt_box .price del {font-size: 0.94rem; font-weight: 400; color: #bbb;} #wrap main #new_wrap .new_product .new_txt_box .price .discount { font-size: 1.44rem; font-weight: 600; color: #6B32D2; margin: 4px; } #wrap main #new_wrap .new_product .new_txt_box .price em {font-size: 1.44rem; font-weight: 600;} #wrap main #new_wrap .new_product .new_txt_box .more { display: flex; justify-content: space-between; align-items: center; margin: 0; } #wrap main #new_wrap .new_product .new_txt_box .more .more_btn { padding: 12px 24px; background-color: #f1f1f1; border-radius: 999px; transition: 0.3s; } #wrap main #new_wrap .new_product .new_txt_box .more .more_btn:hover {background-color: #6B32D2;} #wrap main #new_wrap .new_product .new_txt_box .more .more_btn:hover span {color: #fff;} #wrap main #new_wrap .new_product .new_txt_box .more .more_btn:hover img {transform: translateY(3px) rotate(90deg); filter: brightness(0) invert(1);} #wrap main #new_wrap .new_product .new_txt_box .more .more_btn span {margin-right: 10px;} #wrap main #new_wrap .new_product .new_txt_box .more .more_btn img {transform: translateY(3px); transition: 0.3s;} #wrap main #new_wrap .new_product .new_txt_box .more .like_cart {} #wrap main #new_wrap .new_product .new_txt_box .more .like_cart a {display: inline-block; width: 24px;} #wrap main #new_wrap .new_product .new_txt_box .more .like_cart a.like {margin-right: 16px;} #wrap main #new_wrap .new_product .new_txt_box .more .like_cart a img {width: 100%;} /* --------------------------------------- 탭 안 내용 공통 - 스와이퍼 */ #wrap main #new_wrap .new_product .new_swiper {width:60%;margin: 0;} #wrap main #new_wrap .new_product .new_swiper .swiper-wrapper {} #wrap main #new_wrap .new_product .new_swiper .swiper-wrapper .swiper-slide {} #wrap main #new_wrap .new_product .new_swiper .swiper-wrapper .swiper-slide img {width: 100%;} /* --------------------------------------- 탭 안 내용 개별 - 스와이퍼 */ #wrap main #new_wrap .new_product .new_swiper .swiper-wrapper .slide1 {} #wrap main #new_wrap .new_product .new_swiper .swiper-wrapper .slide2 {} #wrap main #new_wrap .new_product .new_swiper .swiper-wrapper .slide3 {} /* --------------------------------------- 탭 안 내용 개별 - 클리어 */ #wrap main #new_wrap .clear_container {} /* --------------------------------------- 탭 안 내용 개별 - 컴포트 */ #wrap main #new_wrap .comfort_container {display: none;} /* ================================================================================= 상품추천 영역 */ #wrap main #recommendation_wrap { margin: 0 auto 200px; display: flex; justify-content: space-between; } #wrap main #recommendation_wrap .recommendation_left {} #wrap main #recommendation_wrap .recommendation_left h1 {line-height: 1.5; margin-bottom: 32px;} #wrap main #recommendation_wrap .recommendation_left h1 span {display: block;} #wrap main #recommendation_wrap .recommendation_left .tab {} #wrap main #recommendation_wrap .recommendation_left .tab a { display: block; width: max-content; font-weight: 500; text-align: center; padding: 12px 24px; background: #e9e9e9; border-radius: 999px; margin-bottom: 16px; } #wrap main #recommendation_wrap .recommendation_left .tab a.active {background: #6B32D2; color: #fff;} #wrap main #recommendation_wrap .recommendation_right {width: 80%;} /* ------------------------------------------------ swiper 공통 */ #wrap main #recommendation_wrap .recommendation_right .swiper {display: none;} #wrap main #recommendation_wrap .recommendation_right .active {display: block;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper {} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide {} /* ------------------------------------------------ 공통 이미지 영역 */ #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .photo_box {position: relative; margin-bottom: 18px;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .photo_box:hover .like_cart { opacity: 1; transform: translate(-50%, 0); } #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .photo_box:hover .photo .prod_hover {opacity: 1;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .photo_box .photo {max-width: 350px;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .photo_box .photo img {width: 100%;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .photo_box .photo .prod_hover { position: absolute; top: 0; left: 0; opacity: 0; transition: 0.5s; } #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .photo_box .like_cart { position: absolute; bottom: 20px; left: 50%; transform: translate(-50%, 10px); z-index: 777; opacity: 0; transition: 0.3s; } #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .photo_box .like_cart a { display: inline-block; padding: 10px; background: rgba(255, 255, 255, 0.6); border-radius: 50%; } #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .photo_box .like_cart a.like {margin-right: 20px;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .photo_box .like_cart a img {width: 24px; display: block;} /* ------------------------------------------------ 공통 텍스트 영역 */ #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box {} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box a {} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box a h2 {font-size: 1.06rem; font-weight: 500;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box a h2 span {font-size: 1.06rem; font-weight: 500;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box a .price {margin: 12px 0;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box a .price .discount {font-size: 1.19rem; font-weight: 600; color: #6B32D2;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box a .price em {font-size: 1.19rem; font-weight: 600; margin: 4px;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box a .price del {font-size: 0.88rem; color: #bbb;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box .review {display: flex; align-items: center;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box .review > * {font-size: 0.81rem;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box .review img {} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box .review span {transform: translateY(3px);} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box .review .rating {margin: 0 10px 0 4px;} #wrap main #recommendation_wrap .recommendation_right .swiper .swiper-wrapper .swiper-slide .txt_box .review .review_count {} /* ================================================================================= 멤버십 배너 영역 */ #wrap main #membership_bnr_wrap {margin-bottom: 200px;} #wrap main #membership_bnr_wrap .membership_bnr { display: block; padding: 100px 300px; background-position: right; background-size: cover; background-image: url(../images/main/membership_bnr.jpg); }/* bg */ #wrap main #membership_bnr_wrap .membership_bnr .member_txt_box {} #wrap main #membership_bnr_wrap .membership_bnr .member_txt_box p {font-size: 1.25rem; font-weight: 500;} #wrap main #membership_bnr_wrap .membership_bnr .member_txt_box h1 {font-size: 1.69rem; font-weight: 600; margin: 16px 0;} #wrap main #membership_bnr_wrap .membership_bnr .member_txt_box h1+p {} #wrap main #membership_bnr_wrap .membership_bnr .member_txt_box h1+p span {} /* ================================================================================= 베스트 리뷰 영역 */ #wrap main #best_review_wrap {margin-bottom: 200px;} #wrap main #best_review_wrap .review_title_btn { display: flex; justify-content: space-between; align-items: center; max-width: 1440px; margin: 0 auto; } #wrap main #best_review_wrap .review_title_btn h1 {} /* ------------------------------------------------------------ swiper 버튼 */ #wrap main #best_review_wrap .review_title_btn .btn_box {position: relative;} #wrap main #best_review_wrap .review_title_btn .btn_box .prev, #wrap main #best_review_wrap .review_title_btn .btn_box .next {width: 40px; height: 40px; border-radius: 50%; transition: 0.3s;} #wrap main #best_review_wrap .review_title_btn .btn_box .prev {right: 48px; left: auto;} #wrap main #best_review_wrap .review_title_btn .btn_box .next {right: 0;} #wrap main #best_review_wrap .review_title_btn .btn_box .prev svg, #wrap main #best_review_wrap .review_title_btn .btn_box .next svg {color: #000; width: 20px; height: 20px; transition: 0.3s;} /* ------------------------------------------------------hover 디자인 */ #wrap main #best_review_wrap .review_title_btn .btn_box .prev:hover, #wrap main #best_review_wrap .review_title_btn .btn_box .next:hover {background-color: #6B32D2;} #wrap main #best_review_wrap .review_title_btn .btn_box .prev:hover svg, #wrap main #best_review_wrap .review_title_btn .btn_box .next:hover svg {color: #fff;} #wrap main #best_review_wrap .review_swiper_wrap {margin: 50px 0;} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper {width: 100%;} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper {} /* ----------------------------------------------------------- swiper-slide 공통 디자인 */ #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide {} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_photo_box { display: block; background-position: center; background-size: cover; height: 400px; position: relative; margin-bottom: 20px; } #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_photo_box .review_txt { background: rgba(255, 255, 255, 0.4); position: absolute; bottom: 0; width: 100%; padding: 20px 12px; } #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_photo_box .review_txt span {display: block; font-size: 0.94rem; line-height: 1.7;} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product { display: flex; align-items: center; justify-content: space-between; } #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product .product {display: flex; align-items: center;} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product .product .p_photo {width: 80px;} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product .product .p_photo img {width: 100%;} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product .product .p_txt {margin-left: 20px;} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product .product .p_txt h2 {margin-bottom: 8px; font-weight: 500;} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product .product .p_txt .price {} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product .product .p_txt .price .discount { font-size: 0.94rem; font-weight: 600; color: #6B32D2; } #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product .product .p_txt .price em { font-size: 0.94rem; font-weight: 600; margin: 4px; } #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product .product .p_txt .price del {font-size: 0.69rem; color: #bbb;} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product .like {width: 24px; margin-right: 22px;} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .swiper-slide .review_product .like img {width: 100%;} /* ----------------------------------------------------------- swiper-slide 개별 디자인 */ #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .slide1 .review_photo_box {background-image: url(../images/main/review1.jpg);} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .slide2 .review_photo_box {background-image: url(../images/main/review2.jpg);} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .slide3 .review_photo_box {background-image: url(../images/main/review3.jpg);} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .slide4 .review_photo_box {background-image: url(../images/main/review4.jpg);} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .slide5 .review_photo_box {background-image: url(../images/main/review5.jpg);} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .slide6 .review_photo_box {background-image: url(../images/main/review6.jpg);} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .slide7 .review_photo_box {background-image: url(../images/main/review7.jpg);} #wrap main #best_review_wrap .review_swiper_wrap .review_swiper .swiper-wrapper .slide8 .review_photo_box {background-image: url(../images/main/review8.jpg);} /* ----------------------------------------------------------- viewmore 버튼 */ #wrap main #best_review_wrap .more_btn { padding: 12px 24px; background-color: #f1f1f1; border-radius: 999px; display: block; width: max-content; transition: 0.3s; margin: 0 auto; } #wrap main #best_review_wrap .more_btn span {margin-right: 10px;} #wrap main #best_review_wrap .more_btn img {transform: translateY(3px); transition: 0.3s;} #wrap main #best_review_wrap .more_btn:hover {background-color: #6B32D2;} #wrap main #best_review_wrap .more_btn:hover span {color: #fff;} #wrap main #best_review_wrap .more_btn:hover img {transform: translateY(3px) rotate(90deg); filter: brightness(0) invert(1);} /* ================================================================================= 매거진 영역 */ #wrap main #magazine_wrap {margin-bottom: 200px;} #wrap main #magazine_wrap h1 {max-width: 1440px; margin: 0 auto; margin-bottom: 50px;} #wrap main #magazine_wrap .magazine_swiper {} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper {} /* ----------------------------------------------------------- swiper-slide 공통 디자인 */ #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .swiper-slide {} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .swiper-slide a { display: block; height: 600px; position: relative; background-position: center; background-size: cover; } #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .swiper-slide a dl {position: absolute; bottom: 0; left: 0; padding: 24px;} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .swiper-slide a dl dt, #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .swiper-slide a dl dt span {font-size: 1.19rem; font-weight: 600; margin-bottom: 12px;} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .swiper-slide a dl dt span {display: block;} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .swiper-slide a dl dd {font-size: 0.94rem;} /* ----------------------------------------------------------- swiper-slide 개별 디자인 */ #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .slide1 a {background-image: url(../images/main/magazine1.jpg);} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .slide2 a {background-image: url(../images/main/magazine2.jpg);} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .slide3 a {background-image: url(../images/main/magazine3.jpg);} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .slide4 a {background-image: url(../images/main/magazine4.jpg);} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .slide5 a {background-image: url(../images/main/magazine5.jpg);} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .slide6 a {background-image: url(../images/main/magazine6.jpg);} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .slide7 a {background-image: url(../images/main/magazine7.jpg);} #wrap main #magazine_wrap .magazine_swiper .swiper-wrapper .slide8 a {background-image: url(../images/main/magazine8.jpg);} /* ================================================================================= 브랜드 영역 */ #wrap main #brand_wrap {background-image: url(../images/main/brand.jpg); background-position: center; background-size: cover;}/* bg */ #wrap main #brand_wrap .brand {display: block; width: 100%; padding: 100px 0;} #wrap main #brand_wrap .brand .brand_txt {text-align: center;} #wrap main #brand_wrap .brand .brand_txt h1 {font-family: 'prata',serif; font-size: 1.63rem; font-weight: 400;} #wrap main #brand_wrap .brand .brand_txt h1+p {margin: 24px 0;} #wrap main #brand_wrap .brand .brand_txt p {line-height: 1.7;}