/*Pretendard 웹폰트 적용*/ @import url('https://webfontworld.github.io/pretendard/Pretendard.css'); *{margin:0;padding:0;font-family:var(--mainfont);} :root{ --mainfont: 'Pretendard'; } @media screen and (min-width:1001px){ /* ===================== Header ========================*/ /*pc 메인헤더*/ .mobile_area{display:none;} .pc_header{position:fixed;top:0;left:0;z-index:9000;width: 100%;height: 120px;background:#fff;border-bottom:1px solid #b5b5b5;transition:all 0.6s;} .pc_header1{position:fixed;top:0;left:0;z-index:9000;width: 100%;height: 120px;background:rgba(0,0,0,.3);border-bottom:1px solid #b5b5b5;transition:all 0.6s;} .pc_header1.on{background:#fff;} .pc_header1.on2{background:#fff;} .pc_header_in{width: 100%;height: 100%;max-width:1280px;margin:0 auto;box-sizing:border-box;padding:0 10px;} .pc_header_in .logo{height: 60px;display:flex;justify-content:center;align-items:center;} .pc_header_in .logo h1{} .pc_header_in .logo a{display:block;line-height:60px;} .pc_header_in .logo a img{vertical-align:middle;} .pc_header_in .pc_header_nav{height: 60px;display:flex;justify-content:space-between;} .pc_header_in .pc_header_nav .pc_btn{position:relative;width: 40px;height: 40px;cursor:pointer;} .pc_header_in .pc_header_nav .pc_btn span{display:inline-block;position:Absolute;top:50%;left:50%;transform:translate(-50%,-50%);width: 25px;height: 2px;background:#1d1d1b;transition:all 0.4s;} .pc_header_in .pc_header_nav .pc_btn span.b{top:30%} .pc_header_in .pc_header_nav .pc_btn span.t{} .pc_header_in .pc_header_nav .pc_btn span.n{top:70%;} .pc_header_in .pc_header_nav .pc_btn.on .b{transform: rotate(45deg);} .pc_header_in .pc_header_nav .pc_btn.on .t{display:none;} .pc_header_in .pc_header_nav .pc_btn.on .n{transform: rotate(-45deg);} .pc_header_in .pc_header_nav .pc_btn.on span{top:50%;left:20%;transform:translateY(-50%);} .pc_header_in .pc_header_nav .pc_menu{width:75%;height: 100%;display:flex;justify-content:center;text-align:Center; margin-left: 110px;} .pc_header_in .pc_header_nav .pc_menu>li{position:relative;width:13.5%;} .pc_header_in .pc_header_nav .pc_menu>li>a{display:block;font-size:18px;font-weight:600;width: 100%;line-height:40px;padding-bottom:20px;} .pc_header_in .pc_header_nav .pc_menu>li>.pc_sub_menu{display:none;width: 100%;position:Absolute;top:50px;left:50%;transform:translateX(-50%);z-index:1000; border-radius:10px;background:#f5cecf;padding:20px 0;} .pc_header_in .pc_header_nav .pc_menu>li>.pc_sub_menu>li>a{display:block;color:#fff;padding:10px 0;font-size:18px;font-weight:500;} .pc_header_in .pc_header_nav .pc_util{display:flex;} .pc_header_in .pc_header_nav .pc_util li a{display:inline-block;} .pc_header_in .pc_header_nav .pc_util li.pc_utilmy{position:relative;} .pc_header_in .pc_header_nav .pc_util .pc_utilmy .pc_utilmy_in{display:none;position:absolute;margin-top:10px;left:50%;transform:translateX(-50%);z-index:1000;text-align:center;border-radius:10px;background:#eee;padding:14px 0;} .pc_header_in .pc_header_nav .pc_util .pc_utilmy .pc_utilmy_in>li{width: 140px;} .pc_header_in .pc_header_nav .pc_util .pc_utilmy .pc_utilmy_in>li>a{display:block;padding:10px 0;font-size:18px;font-weight:500;} .pc_header_in .pc_header_nav .pc_util .pc_utilcart{position:relative;margin:0 5px;} .pc_header_in .pc_header_nav .pc_util .pc_utilcart span{display:inline-block;position:Absolute;right:3px;top:3px;padding-top:2px;width: 14px;height: 14px;border-radius:50%;background:#ff1a21; font-size:10px;text-align:Center;vertical-align:middle;color:#fff;} /*전체메뉴*/ .pc_allmenu{display:none;width: 100%;height: 410px;background:rgba(255,255,255,0.9);} .pc_allmenu.on{background:rgba(255,255,255,0.9);} .pc_allmenu_in{position:relative;width: 100%;max-width:1280px;height: 400px;margin:0 auto;padding:80px 40px;} .pc_allmenu_in>ul{background:orange;width: 90%;margin:0 auto;} .pc_allmenu_in>ul>li{width: 13.5%;float:left;font-size:18px;font-weight:700;text-align:center;/* background:yellow; */} .pc_allmenu_in>ul>li>a{display:block;padding-bottom:10px;} .pc_allmenu_in>ul>li>ul>li{} .pc_allmenu_in>ul>li>ul>li>a{display:block;padding:10px 0;font-weight:500;} .pc_allmenu_in>ul .m_my{margin-top:-90px;} .pc_allmenu .allmenu_close{width: 40px;height: 40px;background:#f5cecf;position:absolute;top:40px;right:40px;cursor:pointer;} /* ===================== Footer ========================*/ /*pc 푸터*/ .footer{width: 100%;height: auto;padding:50px 10px 60px;background:#fff;font-family:var(--mainfont);border-top:1px solid #b4b4b4;} .footer_in{width: 100%;max-width: 1280px;margin:0 auto;display:flex;justify-content:space-between;align-items: stretch;} .footer_in .f_left .f_logo a{display:inline-block;} .f_left{width: 50%;font-size:14px;display:flex;align-items: flex-end;} .f_left .f_num{margin-left:40px;} .f_left .f_num strong{font-size:30px;font-weight:700;} .f_left .f_num p{font-size:16px;font-weight:300;line-height:24px;margin-top:10px;} .f_right{width: 50%;font-size:16px;} .f_right .f_list{display:flex;justify-content:flex-start;width: 95%;margin:10px auto 0;} .f_right .f_list li{position:relative;} .f_right .f_list li::after{content:'';position:absolute;width: 1px;height: 100%;background:#191919;top:0;right:0} .f_right .f_list li:last-child::after{display:none;} .f_right .f_list li a{display:block;font-weight:600;padding:0 20px;} .f_right .f_list li:first-child a{text-align:left;padding-left:0px;} .f_right .f_list li a::after{} .f_right address{width: 95%;margin:24px auto 0;line-height:24px;font-weight:400;font-style:normal;} .f_right address .none2{display:none;} .footer .copy{font-size:14px;font-weight:500;text-align:center;margin-top:40px;} /*sns메뉴들*/ .sns_area{position:fixed;top:300px;right:20px;z-index:800;width:auto;} .sns_area ul{display:flex;flex-direction:column;align-items: flex-end;} .sns_area ul li{width: 60px;height: 60px;} .sns_area ul li:nth-child(2){margin:12px 0;} .sns_area ul li a{display:block;width: 100%;height: 100%;} /**/ /**/ /*.q_area ul li img{}*/ /**/ /*.q_area .q2{margin:14px 0;}*/ /*.q_area .qt{display:none;font-size:20px;font-weight:500;color:#fff;line-height:70px;}*/ /*.q_area .q_top img{width: 100%;height: 100%;}*/ /*.q_area .q_top{background:#000;border:3px solid #164a96;box-sizing:border-box;}*/ /* ===================== Index ========================*/ /**/ .visual{width: 100%;/* margin-top:120px; */position:relative;} .v_mo{display:none;} /*스와이퍼*/ .visual .mySwiper{width: 100%;height: 100%;} .visual .swiper-slide{width: 100%;} .visual .swiper-slide a{display:block;} .visual .swiper-slide img{width: 100%;} .visual .more_btn{width: 210px;height: 46px;line-height:46px;position:absolute;bottom:35%;left:16%;z-index:1234;transition:all 0.4s;border-bottom:1px solid #fff; } .visual .more_btn a{display:block;width: 100%;height: 100%;font-size:16px;padding-left:25px;color:#fff;position:Relative;background:url(/images/bg_arrow.png) no-repeat center right 25px;} .visual .more_btn .ma{position:absolute;top:50%;transform:translateY(-50%);right:5%;} .visual .more_btn .ma img{vertical-align:middle;} .visual .more_btn .ma .on{display:none;} .visual .more_btn .more_bg{position:Absolute;top:0;left:0;width: 0%;height: 100%;background:#fff;transition:all 0.4s;z-index:-4;} .visual .more_btn:hover a{color:#000;background:url(/images/bg_arrow_on.png) no-repeat center right 25px;} .visual .more_btn:hover .more_bg{width: 100%;height: 100%;} .visual .more_btn:hover .ma .on{display:block;} .visual .more_btn:hover .ma .off{display:none;} .visual .swiper-button{width:20%;height:56px;position:absolute;right:5%;bottom:5%; display:flex;align-items:center;justify-content:space-between;} .visual .swiper-pagination{width:40%;color:#fff;font-size:20px;position:static;} .visual .swiper-button-next, .visual .swiper-button-prev{margin-top:0px;} .visual .swiper-button-next::after, .visual .swiper-button-prev::after{display:none;} .visual .swiper-button-next{position:static;width: 30%;height: 100%;background:url(/images/slide_right.png) no-repeat;background-size:contain;} .visual .swiper-button-prev{position:static;width: 30%;height: 100%;background:url(/images/slide_left.png) no-repeat;background-size:contain;} .main{height:auto;padding-bottom:100px;} .section{width: 100%;height:auto;margin-top:115px;padding:0 15px;} .section_in{width: 100%;max-width:1280px;margin:0 auto;position:Relative;text-align:center;} .section_in .title{display:inline-block;margin:0 auto;font-family:var(--mainfont);font-size:32px;font-weight:500;position:relative;line-height:1;} .section_in .title::after{content:'';position:Absolute;bottom:-15px;left:50%;transform:translateX(-50%);width: 30%;height:2px;background:#f5cecf;} /*리스트페이지랑 연결*/ .section .main_more{position:absolute;top:0;right:0;width: 40px;height: 40px;background:#f5cecf;} .section .main_more a{display:block;width: 100%;height: 100%;} .section .main_more a img{ position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);} .section_lists{width: 100%;max-width:1280px;margin:80px auto 0;display:flex;flex-wrap:wrap;gap:2%;position:relative;} .section_lists .list{width: 23.5%;margin-bottom:74px;position:relative;background:#fff;} .section_lists li .item_img{position:relative;overflow:hidden;border:1px solid #eee} .section_lists li .item_img>a img{width: 100%;height: 100%;} .section_lists li .item_img .i_state{width: 120px;height:32px;background:#363636;position:absolute;top:5%;left:5%;border-radius:3px;} .section_lists li .item_img .i_state a{display:block;font-size:16px;font-weight:700;color:#fff;text-align:center;line-height:32px;} .section_lists li .item_img .bar{width: 100%;height: 55px;background:rgba(0,0,0,0.8);position:absolute;bottom:-55px;left:0;transition:all 0.6s;display:flex;justify-content:center;align-items:Center;} .section_lists li .item_img .bar .icon{width: 20%;height: 100%;} .section_lists li .item_img .bar .icon img{width: 100%;height: 100%;vertical-align:middle;} /* .category_in li .item_img .bar p img{width: 100%;} */ .section_lists li .item_img .bar p .on{display:none;} .section_lists li:hover .bar{bottom:0px;} .section_lists li .item_img .bar .like:hover .off{display:none;} .section_lists li .item_img .bar .like:hover .on{display:block;} .section_lists li .item_txt{padding:10px 5px;text-align:center;margin-left:2px;} .section_lists li .item_txt .i_title{font-size:16px;font-weight:500;color:#181818; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: keep-all; } .section_lists li .item_txt .i_title a{display:block;padding:20px 0 10px;font-size:15px;} .section_lists li .i_price{display:flex;justify-content:center;align-items: flex-end;} .section_lists li .i_price .i_price1{font-size:18px;font-weight:500;color:#b4b4b4; text-decoration: line-through;} .section_lists li .i_price .i_price2{margin-left:16px;} .section_lists li .i_price .i_price2 span{font-size:20px;color:#1e1e1e;font-weight:700;} /*프로덕트 메뉴 부분*/ .product_menu{width: 50%;margin:60px auto 0;display:flex;justify-content:space-between;} .product_menu li{width: 30%;height: 48px;line-height:48px;border:1px solid #868686;border-radius:50px;} .product_menu li a{display:block;width: 100%;height:100%;color:#868686;font-size:20px;font-weight:400} .product_menu li.active{background:#f5cecf;border:1px solid #f5cecf} .product_menu li.active a{color:#fff;} /*브랜드스토리 부분*/ .bs_in{display:flex;} .bs_in .bs_left{width: 50%;} .bs_in .bs_left img{width: 100%;} .bs_in .bs_right{width: 50%;display:flex;flex-direction:column;justify-content:center;} .bs_in .bs_right_txt{width: 75%;margin:0 auto;} .bs_in .bs_right .bs_right_txt p:first-child{font-size:32px;color:#181818;text-align:left;} .bs_in .bs_right .bs_right_txt p:last-child{font-size:24px;font-weight:500;color:#1e1e1e;text-align:left;margin-top:28px;} /*프로모션 부분*/ .section_in .title2{display:block;font-family:var(--mainfont);font-size:20px;font-weight:400;color:#868686;margin-top:40px;} .m_promotion{display:none;} .mySwiper2{padding:60px 0 100px !important;} .mySwiper2 .swiper-slide{width: 33.3%;height:auto;padding-bottom:30px;position:relative;} .mySwiper2 .swiper-slide .event{display:inline-block;width:auto;height:auto;padding:5px 12px;background:#191919;color:#fff;font-size:24px;font-weight:600; position:absolute;top:-20px;left:0;} .mySwiper2 .swiper-slide .img{} .mySwiper2 .swiper-slide .img a{display:block;width: 100%;height: 100%;} .mySwiper2 .swiper-slide .img a img{width: 100%;height: 100%;} .mySwiper2 .swiper-slide .txt{text-align:left;} .mySwiper2 .swiper-slide .txt .t{height:100px;} .mySwiper2 .swiper-slide .txt .t a{display:block;color:#191919;font-size:24px;font-weight:600;padding:25px 0 5px;width: 100%; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; } .mySwiper2 .swiper-slide .txt .c{ width: 100%; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; color:#868686; } .mySwiper2 .swiper-slide .txt .c a{display:block;width: 100%;height: 100%;color:#868686;font-size:16px;font-weight:300; line-height:22px;} /*프로모션 스와이퍼 스크롤바*/ .mySwiper2 .swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal2 { position: absolute; left: 0% !important; bottom: 20px !important; z-index: 50; height: 5px; width: 87% !important; } .swiper-scrollbar2 { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0,0,0,.1); } .mySwiper2 .swiper-scrollbar2.swiper-scrollbar-horizontal2 .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0,0,0,.5); border-radius: 10px; left: 0; top: 0; } .mySwiper2 .swiper-button-next::after,.mySwiper2 .swiper-button-prev::after{display:none;} .mySwiper2 .swiper-buttons2{width: 8%;height:auto;position:absolute;bottom:25px;right:0;background:skyblue;} .mySwiper2 .swiper-button-next, .mySwiper2 .swiper-button-prev { position: absolute; top: 50%; width:45%; height: var(--swiper-navigation-size); margin-top: calc(0px - (var(--swiper-navigation-size)/ 2)); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color,var(--swiper-theme-color)); } .mySwiper2 .swiper-button-next{right:0 !important;} .mySwiper2 .swiper-button-prev{left:0 !important;} .mySwiper2 .swiper-button-next img, .mySwiper2 .swiper-button-prev img{width: 100%;} /*리뷰 부분*/ .m_review{display:none;} .mySwiper3{padding:60px 0 100px !important;} .mySwiper3 .swiper-slide{width: 33.3%;height:auto;padding-bottom:10px;position:relative;} .mySwiper3 .swiper-slide .event{display:inline-block;width:auto;height:auto;padding:5px 12px;background:#191919;color:#fff;font-size:24px;font-weight:600; position:absolute;top:-20px;left:0;} .mySwiper3 .swiper-slide .img{} .mySwiper3 .swiper-slide .img a{display:block;width: 100%;height: 100%;} .mySwiper3 .swiper-slide .img a img{width: 100%;height: 100%;} .mySwiper3 .swiper-slide .txt{text-align:left;padding:0 10px;} .mySwiper3 .swiper-slide .txt .t{padding:20px 0 10px;} .mySwiper3 .swiper-slide .txt .t a{display:block;color:#191919;font-size:18px;font-weight:500;height:42px; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; } .mySwiper3 .swiper-slide .txt .c{ } .mySwiper3 .swiper-slide .txt .c a{display:block;width: 100%;height: 100%;color:#868686;font-size:16px;font-weight:300;padding-bottom:50px;width: 100%; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; word-break: keep-all; color:#868686; line-height:18px;height:70px;} .mySwiper3 .swiper-slide .txt .i{margin-top:10px;} .mySwiper3 .swiper-slide .txt .i .id{padding-right:20px;position:relative;} .mySwiper3 .swiper-slide .txt .i .id::after{content:'';position:absolute;right:0;width: 1px;height: 110%;background:#868686;} .mySwiper3 .swiper-slide .txt .i .date{padding-left:15px;} .mySwiper3 .swiper-slide .txt .i .id a, .mySwiper3 .swiper-slide .txt .i .date{color:#868686;font-size:14px;font-weight:400;} /*리뷰 스와이퍼 스크롤바*/ .mySwiper3 .swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal3 { position: absolute; left: 0% !important; bottom: 20px !important; z-index: 50; height: 5px; width: 87% !important; } .swiper-scrollbar2 { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0,0,0,.1); } .mySwiper3 .swiper-scrollbar3.swiper-scrollbar-horizontal3 .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0,0,0,.5); border-radius: 10px; left: 0; top: 0; } .mySwiper3 .swiper-button-next::after,.mySwiper3 .swiper-button-prev::after{display:none;} .mySwiper3 .swiper-buttons3{width: 8%;height:auto;position:absolute;bottom:25px;right:0;background:skyblue;} .mySwiper3 .swiper-button-next, .mySwiper3 .swiper-button-prev { position: absolute; top: 50%; width:45%; height: var(--swiper-navigation-size); margin-top: calc(0px - (var(--swiper-navigation-size)/ 2)); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color,var(--swiper-theme-color)); } .mySwiper3 .swiper-button-next{right:0 !important;} .mySwiper3 .swiper-button-prev{left:0 !important;} .mySwiper3 .swiper-button-next img, .mySwiper3 .swiper-button-prev img{width: 100%;} /* ===================== 각 페이지들 ========================*/ /* .sub_title_area{height: 100px;} */ /*.tw{width: 100%;}*/ /*.tw2{width: 100%;max-width:1200px;padding:0 15px;margin:100px auto 150px;}*/ /* #sct{padding:0 10px;} */ } @media screen and (min-width:1000px) and (max-width:1270px){ /*pc 푸터*/ .f_left{width: 40%;font-size:14px;} .f_left .f_num{margin-left:40px;} .f_left .f_num strong{font-size:28px;font-weight:700;} .f_left .f_num p{font-size:14px;} .f_right{width: 60%;font-size:15px;} /*브랜드스토리부분 */ .bs_in .bs_right_txt {width: 83%;} .bs_in .bs_right .bs_right_txt p:first-child{font-size:27px;} .bs_in .bs_right .bs_right_txt p:last-child{font-size:22px;margin-top:20px;} /*프로덕트 메뉴 부분*/ .product_menu{width: 55%;} } @media screen and (min-width:731px) and (max-width:1000px){ /* ===================== Header ========================*/ .pc_header{display:none;} .m_header{display:block;position:fixed;top:0;left:0;z-index:970;width: 100%;background:#fff;} .m_header_in{width: 94%;margin:0 auto;height: 80px;display:flex;align-items:center;} .m_header_in .menu_btn{width: 80px;height:80px;position:relative;} .m_header_in .menu_btn span{display: inline-block;position: Absolute;top: 50%;left: 50%;transform: translate(-50%,-50%); width: 45px;height: 3px;background: #1d1d1b;transition: all 0.4s;} .m_header_in .menu_btn span.b{top:30%;} .m_header_in .menu_btn span.t{} .m_header_in .menu_btn span.n{top:70%;} .m_header_in .menu_btn.on .b{transform: rotate(45deg);} .m_header_in .menu_btn.on .t{display:none;} .m_header_in .menu_btn.on .n{transform: rotate(-45deg);} .m_header_in .menu_btn.on span{top:50%;left:20%;transform:translateY(-50%);} .m_header_in .logo{width: 40%;margin:0 auto;} .m_header_in .logo a{display:block;width: 100%;height: 100%;padding:10px;} .m_header_in .logo a img{width: 100%;height:100%;} .m_header_in .m_my{display:flex;} .m_header_in .m_my li a{display:block;} .m_header_in .m_my li:first-child{padding-right:15px;} .m_header_in .m_my li:last-child{padding-left:15px} .m_open{position:fixed;top:80px;left:-100%;z-index:992;width: 100%;height: 100%;background:#fff;} .m_open_in{width: 94%;height:100%;margin:0 auto;position:relative;border-top:1px solid #eee} .m_util_area{width: 100%;height:auto;;z-index:1005;position:absolute;bottom:80px;padding:10px;background: #f9f9f9;} .m_util_area .m_util{width: 94%;height:100%;margin:0 auto;display:flex;justify-content:space-between;align-items:Center;} .m_util_area .m_util li a{font-size:32px;} .m_util_area .m_util .m_util_in{display: flex;flex-direction: column;align-items: center;} .m_util_area .m_util .m_util_in img{height:80px;} .m_nav{width: 100%;height:80%;background:#fff;margin-top:10px;overflow-y:scroll;padding-bottom:20px;} .m_nav { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */} .m_nav::-webkit-scrollbar {display: none; /* Chrome, Safari, Opera*/} .m_nav>li>a{display:block;font-size:34px;height:100px;line-height:84px;text-indent:10px;font-weight:500;padding:5px;border-bottom:1px solid #e7e7e7;position:Relative;} .m_nav>li .aimg{display:inline-block;position:absolute;top:50%;transform:translateY(-50%);right:10px;width:45px;height: 45px;} .m_nav>li .aimg img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:70%;vertical-align:middle;} .m_nav>li:last-child a{border-bottom:none;} .m_nav .m_sub{display:none;padding:5px 0;} .m_nav .m_sub li a{display:block;height:85px;line-height:85px;color:#4a4a4a;font-size:28px;padding:5px;text-indent:20px;border-bottom:1px solid #e7e7e7;} /* ===================== Footer ========================*/ /*모바일 푸터*/ .footer{width: 100%;height: auto;padding:20px 0px;background:#fff;font-family:var(--mainfont);border-top:1px solid #b4b4b4;} .footer_in{width:94%;margin:0 auto;/* display:flex;flex-direction:column;justify-content:space-between;align-items: stretch; */position:relative;} .f_left{width: 100%;font-size:16px;display:flex;align-items: center;padding:10px 0;} .footer_in .f_left .f_logo{height:100px;position:absolute;display:none;} .footer_in .f_left .f_logo a{display:inline-block;height: 100%;} .footer_in .f_left .f_logo a img{width: 100%;height: 100%;} .f_left .f_num{width:100%;text-align:center;} .f_left .f_num strong{font-size:28px;font-weight:700;} .f_left .f_num p{font-size:22px;font-weight:300;line-height:26px;margin-top:5px;} .f_right{width: 100%;display:flex;flex-direction:column;justify-content:center;/* align-items:center; */} .f_right address{/* margin:24px auto 0; */font-size:22px;line-height:28px;font-weight:400;font-style:normal;margin-top:30px;text-align:center;} /* .f_right address .none{display:none;} */ /* .f_right address .none2{display:none;} */ .f_right address .ss{display:inline-block;margin-left:54px;} .f_right address .line{display:none;} .f_right .f_list{display:flex;/* justify-content:flex-start;margin:10px auto 0; */order:2;margin-top:15px;justify-content: space-around} .f_right .f_list li{position:relative;text-align:center;width: 20%;} .f_right .f_list li:first-child{width: 13%;} .f_right .f_list li:nth-child(4){width: 24%;} .f_right .f_list li::after{content:'';position:absolute;width: 1px;height: 100%;background:#191919;top:0;right:0;} .f_right .f_list li:last-child::after{display:none;} .f_right .f_list li a{display:block;font-size:18px;font-weight:600;} .f_right .f_list li:first-child a{padding-left:0px;} .f_right .f_list li a::after{} .footer .copy{width: 94%;font-size:14px;font-weight:500;margin:20px auto 30px;text-align:center;} /*sns메뉴들*/ .sns_area{position:fixed;top:300px;right:20px;z-index:800;width:auto;} .sns_area ul{display:flex;flex-direction:column;align-items: flex-end;} .sns_area ul li{width: 75px;height: 75px;} .sns_area ul li:nth-child(2){margin:12px 0;} .sns_area ul li a{display:block;width: 100%;height: 100%;} .sns_area ul li img{width: 100%;} /* ===================== Index ========================*/ /**/ .visual{position:relative;width: 100%;margin-top:80px} .v_pc{display:none;} .v_mo{display:block;} .visual .mySwiperm{width: 100%;} .visual .mySwiperm .swiper-slide img{width: 100%;height: 100%;object-fit:fill;} .visual .mySwiperm .swiper-paginationm{position:absolute;z-index:33;bottom:30px;left:50%;transform:translateX(-50%);width:auto ;} .visual .mySwiperm .swiper-paginationm .swiper-pagination-bullet{background:#fff;opacity:20%;width: 16px;height: 16px;} .visual .mySwiperm .swiper-paginationm .swiper-pagination-bullet-active{width: 60px;border-radius:50px;background:#fff;opacity:100%;} .visual .more_btn{width: 230px;height: 46px;line-height:46px;position:absolute;bottom:35%;left:7%;z-index:1234;transition:all 0.4s;border-bottom:3px solid #fff;} .visual .more_btn a{display:block;width: 100%;height: 100%;font-size:16px;padding-left:25px;color:#fff;position:Relative;background:url(/images/bg_arrow.png) no-repeat center right 25px;} .visual .more_btn .ma{position:absolute;top:50%;transform:translateY(-50%);right:5%;} .visual .more_btn .ma img{vertical-align:middle;} .visual .more_btn .ma .on{display:none;} .visual .more_btn .more_bg{position:Absolute;top:0;left:0;width: 0%;height: 100%;background:#fff;transition:all 0.4s;z-index:-4;} /*Index항목들 시작 */ .main{height:auto;padding-bottom:100px;} .section{width: 100%;height:auto;margin-top:115px;padding:0 15px;} .section_in{width: 100%;margin:0 auto;position:Relative;text-align:center;} .section_in .title{display:inline-block;margin:0 auto;font-family:var(--mainfont);font-size:40px;font-weight:500;position:relative;line-height:1;} .section_in .title::after{content:'';position:Absolute;bottom:-8px;left:50%;transform:translateX(-50%);width: 30%;height:3px;background:#f5cecf;} /*리스트페이지랑 연결*/ .section .main_more{position:absolute;top:0;right:0;width: 40px;height: 40px;background:#f5cecf;} .section .main_more a{display:block;width: 100%;height: 100%;} .section .main_more a img{ position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);} .section_lists{width: 100%;margin:60px auto 0;display:flex;flex-wrap:wrap;gap:2%;justify-content:space-between;position:relative;} .section_lists .list{width: 48%;margin-bottom:74px;position:relative;background:#fff;} .section_lists .list a{display:block;width: 100%;height: 100%;} .section_lists .list .item_img{border:1px solid #eee} .section_lists .list .item_img img{width: 100%;height: 100%;} .section_lists li .item_img{position:relative;overflow:hidden;} .section_lists li .item_img>a img{width: 100%;height: 100%;} .section_lists li .item_img .i_state{width: auto;height:auto;background:#363636;position:absolute;top:5%;left:5%;border-radius:3px;} .section_lists li .item_img .i_state a{display:block;font-size:20px;font-weight:700;color:#fff;text-align:center;line-height:32px;padding:5px 25px;} .section_lists li .item_img .new, .section_lists li .item_img .best{display:inline-block;width: 90px;height: 30px;line-height:30px;border-radius:10px;color:#fff; font-size:18px;font-weight:bold;text-align:center;} .section_lists li .item_img .new{background:#71ca59;} .section_lists li .item_img .best{background:#f14040;} .section_lists li .item_img .bar{width: 100%;height: 55px;background:rgba(0,0,0,0.8);position:absolute;bottom:-55px;left:0;transition:all 0.6s;display:flex;justify-content:center;align-items:Center;} .section_lists li .item_img .bar .icon{width: 20%;height: 100%;} .section_lists li .item_img .bar .icon img{width: 100%;height: 100%;vertical-align:middle;} /* .category_in li .item_img .bar p img{width: 100%;} */ .section_lists li .item_img .bar p .on{display:none;} .section_lists li:hover .bar{bottom:0px;} .section_lists li .item_img .bar .like:hover .off{display:none;} .section_lists li .item_img .bar .like:hover .on{display:block;} .section_lists li .item_txt {padding:10px 5px;text-align:center;margin-left:2px;} .section_lists li .item_txt .i_title{font-size:22px;font-weight:500;color:#181818; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: keep-all; } .section_lists li .item_txt .i_title a{display:block;padding:20px 0 10px;} .section_lists li .i_price{display:flex;justify-content:center;align-items: flex-end;font-size:26px;} .section_lists li .i_price .i_price1{font-size:24px;font-weight:500;color:#b4b4b4; text-decoration: line-through;} .section_lists li .i_price .i_price2{margin-left:15px;} .section_lists li .i_price .i_price2 span{font-size:26px;color:#1e1e1e;font-weight:700;} /*브랜드스토리 부분*/ .bs_in{display:flex;flex-direction:column;} .bs_in .bs_left{width: 100%;} .bs_in .bs_left img{width: 100%;} .bs_in .bs_right{width: 100%;display:flex;flex-direction:column;justify-content:center;} .bs_in .bs_right_txt{width: 90%;margin:20px auto 0;} .bs_in .bs_right .bs_right_txt p:first-child{font-size:34px;color:#181818;text-align:center;} .bs_in .bs_right .bs_right_txt p:last-child{font-size:26px;font-weight:500;color:#1e1e1e;text-align:center;margin-top:15px;} /*프로덕트 메뉴 부분*/ .product_menu{width: 70%;margin:60px auto 0;display:flex;justify-content:space-between;} .product_menu li{width: 30%;height: 48px;line-height:48px;border:1px solid #868686;border-radius:50px;} .product_menu li a{display:block;width: 100%;height:100%;color:#868686;font-size:20px;font-weight:400} .product_menu li.active{background:#f5cecf;border:1px solid #f5cecf} .product_menu li.active a{color:#fff;} /*프로모션 부분*/ .pc_promotion{display:none;} .m_promotion{display:block;} .section_in .title2{display:block;font-family:var(--mainfont);font-size:26px;font-weight:400;color:#868686;margin-top:20px;} .mySwiper2m{padding:60px 0 100px !important;} .mySwiper2m .swiper-slide{width: 100%;height:auto;padding-bottom:30px;position:relative;} .mySwiper2m .swiper-slide .event{display:inline-block;width:auto;height:auto;padding:5px 12px;background:#191919;color:#fff;font-size:24px;font-weight:600; position:absolute;top:-20px;left:0;} .mySwiper2m .swiper-slide .img{} .mySwiper2m .swiper-slide .img a{display:block;width: 100%;height: 100%;} .mySwiper2m .swiper-slide .img a img{width: 100%;height: 100%;} .mySwiper2m .swiper-slide .txt{text-align:left;} .mySwiper2m .swiper-slide .txt .t{height: 126px;} .mySwiper2m .swiper-slide .txt .t a{display:block;color:#191919;font-size:32px;font-weight:600;padding:40px 0 10px;} .mySwiper2m .swiper-slide .txt .c{ width: 100%; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; color:#868686; line-height:28px; } .mySwiper2m .swiper-slide .txt .c a{display:block;width: 100%;height: 100%;color:#868686;font-size:22px;font-weight:300;} /*프로모션 스와이퍼 스크롤바*/ .mySwiper2m .swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal2 { position: absolute; left: 0% !important; bottom: 20px !important; z-index: 50; height: 5px; width: 100% !important; } .swiper-scrollbar2 { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0,0,0,.1); } .mySwiper2m .swiper-scrollbar2.swiper-scrollbar-horizontal2 .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0,0,0,.5); border-radius: 10px; left: 0; top: 0; } .mySwiper2m .swiper-button-next::after,.mySwiper2m .swiper-button-prev::after{display:none;} .mySwiper2m .swiper-button-next, .mySwiper2m .swiper-button-prev { position: absolute; top: 40%; width:50px; height: var(--swiper-navigation-size); margin-top: calc(0px - (var(--swiper-navigation-size)/ 2)); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color,var(--swiper-theme-color)); } .mySwiper2m .swiper-button-next{right:0 !important;} .mySwiper2m .swiper-button-prev{left:0 !important;} .mySwiper2m .swiper-button-next img, .mySwiper2m .swiper-button-prev img{width: 100%;} /*리뷰 부분*/ .pc_review{display:none;} .m_review{display:block;} .mySwiper3m{padding:60px 0 100px !important;} .mySwiper3m .swiper-slide{width: 33.3%;height:auto;padding-bottom:10px;position:relative;} .mySwiper3m .swiper-slide .event{display:inline-block;width:auto;height:auto;padding:5px 12px;background:#191919;color:#fff;font-size:24px;font-weight:600; position:absolute;top:-20px;left:0;} .mySwiper3m .swiper-slide .img a{display:block;width: 100%;height: 100%;} .mySwiper3m .swiper-slide .img a img{width: 100%;height: 100%;} .mySwiper3m .swiper-slide .txt{text-align:left;padding:0 10px;} .mySwiper3m .swiper-slide .txt .t{ width: 100%; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical; word-break: keep-all; color:#868686; line-height:1; padding-top:10px; } .mySwiper3m .swiper-slide .txt .t a{display:block;color:#191919;font-size:32px;font-weight:500;line-height:36px;height:72px;} .mySwiper3m .swiper-slide .txt .c{ width: 100%; padding:10px 0; } .mySwiper3m .swiper-slide .txt .c a{display:block;width: 100%;color:#868686;font-size:22px;font-weight:300;margin:0px auto;height:84px; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; word-break: keep-all; color:#868686; line-height:28px;} .mySwiper3m .swiper-slide .txt .i{padding:0px 0 0;} .mySwiper3m .swiper-slide .txt .i .id{padding-right:20px;position:relative;} .mySwiper3m .swiper-slide .txt .i .id::after{content:'';position:absolute;right:0;width: 1px;height: 110%;background:#868686;} .mySwiper3m .swiper-slide .txt .i .date{padding-left:15px;} .mySwiper3m .swiper-slide .txt .i .id a, .mySwiper3m .swiper-slide .txt .i .date{color:#868686;font-size:18px;font-weight:400;} /*리뷰 스와이퍼 스크롤바*/ .mySwiper3m .swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal3 { position: absolute; left: 0% !important; bottom: 20px !important; z-index: 50; height: 5px; width: 100% !important; } .swiper-scrollbar2 { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0,0,0,.1); } .mySwiper3m .swiper-scrollbar3.swiper-scrollbar-horizontal3 .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0,0,0,.5); border-radius: 10px; left: 0; top: 0; } .mySwiper3m .swiper-button-next::after,.mySwiper3m .swiper-button-prev::after{display:none;} .mySwiper3m .swiper-buttons3{width: 8%;height:auto;position:absolute;bottom:25px;right:0;background:skyblue;} .mySwiper3m .swiper-button-next, .mySwiper3m .swiper-button-prev { position: absolute; top: 40%; width:50px; height: var(--swiper-navigation-size); margin-top: calc(0px - (var(--swiper-navigation-size)/ 2)); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color,var(--swiper-theme-color)); } .mySwiper3m .swiper-button-next{right:0 !important;} .mySwiper3m .swiper-button-prev{left:0 !important;} .mySwiper3m .swiper-button-next img, .mySwiper3m .swiper-button-prev img{width: 100%;} } @media screen and (min-width:721px) and (max-width:730px){ /* ===================== Header ========================*/ .pc_header{display:none;} .m_header{display:block;position:fixed;top:0;left:0;z-index:970;width: 100%;background:#fff;} .m_header_in{width: 94%;margin:0 auto;height: 80px;display:flex;align-items:center;} .m_header_in .menu_btn{width: 80px;height:80px;position:relative;} .m_header_in .menu_btn span{display: inline-block;position: Absolute;top: 50%;left: 50%;transform: translate(-50%,-50%); width: 45px;height: 3px;background: #1d1d1b;transition: all 0.4s;} .m_header_in .menu_btn span.b{top:30%;} .m_header_in .menu_btn span.t{} .m_header_in .menu_btn span.n{top:70%;} .m_header_in .menu_btn.on .b{transform: rotate(45deg);} .m_header_in .menu_btn.on .t{display:none;} .m_header_in .menu_btn.on .n{transform: rotate(-45deg);} .m_header_in .menu_btn.on span{top:50%;left:20%;transform:translateY(-50%);} .m_header_in .logo{ margin:0 auto;width: 35%;} .m_header_in .logo a{display:block;width: 100%;height: 100%;} .m_header_in .logo a img{display:block;width: 100%;height: 100%;} .m_header_in .m_my{display:flex;} .m_header_in .m_my li a{display:block;} .m_header_in .m_my li:first-child{padding-right:15px;} .m_header_in .m_my li:last-child{padding-left:15px} .m_open{position:fixed;top:80px;left:-100%;z-index:992;width: 100%;height: 100%;background:#fff;} .m_open_in{width: 94%;height:100%;margin:0 auto;position:relative;border-top:1px solid #eee} .m_util_area{width: 100%;height:auto;;z-index:1005;position:absolute;bottom:80px;padding:10px;background: #f9f9f9;} .m_util_area .m_util{width: 94%;height:100%;margin:0 auto;display:flex;justify-content:space-between;align-items:Center;} .m_util_area .m_util li a{font-size:32px;} .m_util_area .m_util .m_util_in{display: flex;flex-direction: column;align-items: center;} .m_util_area .m_util .m_util_in img{height:80px;} .m_nav{width: 100%;height:80%;background:#fff;margin-top:10px;overflow-y:scroll;padding-bottom:20px;} .m_nav { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */} .m_nav::-webkit-scrollbar {display: none; /* Chrome, Safari, Opera*/} .m_nav>li>a{display:block;font-size:34px;height:100px;line-height:84px;text-indent:10px;font-weight:500;padding:5px;border-bottom:1px solid #e7e7e7;position:Relative;} .m_nav>li .aimg{display:inline-block;position:absolute;top:50%;transform:translateY(-50%);right:10px;width:45px;height: 45px;} .m_nav>li .aimg img{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:70%;vertical-align:middle;} .m_nav>li:last-child a{border-bottom:none;} .m_nav .m_sub{display:none;padding:5px 0;} .m_nav .m_sub li a{display:block;height:85px;line-height:85px;color:#4a4a4a;font-size:28px;padding:5px;text-indent:20px;border-bottom:1px solid #e7e7e7;} /* ===================== Footer ========================*/ /*모바일 푸터*/ .footer{width: 100%;height: auto;padding:20px 0px;background:#fff;font-family:var(--mainfont);border-top:1px solid #b4b4b4;} .footer_in{width:94%;margin:0 auto;display:flex;flex-direction:column;justify-content:space-between;align-items: stretch;} .f_left{width: 100%;font-size:16px;/* display:flex;align-items: center; */padding:10px 0;position:relative;} .footer_in .f_left .f_logo{height:120px;position:Absolute;display:none;} .footer_in .f_left .f_logo a{display:inline-block;height: 100%;} .footer_in .f_left .f_logo a img{width: 100%;height: 100%;} .f_left .f_num{width: auto;text-align:center;} .f_left .f_num strong{font-size:28px;font-weight:700;} .f_left .f_num p{font-size:24px;font-weight:300;line-height:30px;margin-top:5px;} .f_right{width: 100%;display:flex;flex-direction:column;justify-content:center;/* align-items:center; */} .f_right address{/* margin:24px auto 0; */font-size:24px;line-height:34px;font-weight:400;font-style:normal;margin-top:30px;text-align: center;} .f_right address .none{display:none;} .f_right address .ss{display:inline-block;margin-left:54px;} .f_right address .line{display:none;} .f_right .f_list{display:flex;/* justify-content:flex-start;margin:10px auto 0; */order:2;margin-top:15px;justify-content: space-between} .f_right .f_list li{position:relative;text-align:center;} .f_right .f_list li::after{content:'';position:absolute;width: 1px;height: 100%;background:#191919;top:0;right:-5px} .f_right .f_list li:last-child::after{display:none;} .f_right .f_list li a{display:block;font-size:22px;font-weight:600;padding:0 16px;} .f_right .f_list li:first-child a{padding-left:0px;} .f_right .f_list li a::after{} .footer .copy{width: 94%;font-size:20px;font-weight:500;margin:20px auto 30px;text-align:center;} /*sns메뉴들*/ .sns_area{position:fixed;top:300px;right:20px;z-index:800;width:auto;} .sns_area ul{display:flex;flex-direction:column;align-items: flex-end;} .sns_area ul li{width: 75px;height: 75px;} .sns_area ul li:nth-child(2){margin:12px 0;} .sns_area ul li a{display:block;width: 100%;height: 100%;} .sns_area ul li img{width: 100%;} /* ===================== Index ========================*/ /**/ .visual{position:relative;width: 100%;margin-top:80px} .v_pc{display:none;} .v_mo{display:block;} .visual .mySwiperm{width: 100%;} .visual .mySwiperm .swiper-slide img{width: 100%;height: 100%;object-fit:fill;} .visual .mySwiperm .swiper-paginationm{position:absolute;z-index:33;bottom:30px;left:50%;transform:translateX(-50%);width:auto ;} .visual .mySwiperm .swiper-paginationm .swiper-pagination-bullet{background:#fff;opacity:20%;width: 16px;height: 16px;} .visual .mySwiperm .swiper-paginationm .swiper-pagination-bullet-active{width: 60px;border-radius:50px;background:#fff;opacity:100%;} .visual .more_btn{width: 230px;height: 46px;line-height:46px;position:absolute;bottom:35%;left:7%;z-index:1234;transition:all 0.4s;border-bottom:3px solid #fff;} .visual .more_btn a{display:block;width: 100%;height: 100%;font-size:16px;padding-left:25px;color:#fff;position:Relative;background:url(/images/bg_arrow.png) no-repeat center right 25px;} .visual .more_btn .ma{position:absolute;top:50%;transform:translateY(-50%);right:5%;} .visual .more_btn .ma img{vertical-align:middle;} .visual .more_btn .ma .on{display:none;} .visual .more_btn .more_bg{position:Absolute;top:0;left:0;width: 0%;height: 100%;background:#fff;transition:all 0.4s;z-index:-4;} /*Index항목들 시작 */ .main{height:auto;padding-bottom:100px;} .section{width: 100%;height:auto;margin-top:115px;padding:0 15px;} .section_in{width: 100%;margin:0 auto;position:Relative;text-align:center;} .section_in .title{display:inline-block;margin:0 auto;font-family:var(--mainfont);font-size:40px;font-weight:500;position:relative;line-height:1;} .section_in .title::after{content:'';position:Absolute;bottom:-8px;left:50%;transform:translateX(-50%);width: 30%;height:3px;background:#f5cecf;} /*리스트페이지랑 연결*/ .section .main_more{position:absolute;top:0;right:140px;width: 40px;height: 40px;background:#f5cecf;} .section .main_more a{display:block;width: 100%;height: 100%;} .section .main_more a img{ position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);} .section_lists{width: 100%;margin:60px auto 0;display:flex;flex-wrap:wrap;gap:2%;justify-content:space-between;position:relative;} .section_lists .list{width: 48%;margin-bottom:74px;position:relative;background:#fff;} .section_lists .list a{display:block;width: 100%;height: 100%;} .section_lists .list .item_img{border:1px solid #eee} .section_lists .list .item_img img{width: 100%;height: 100%;} .section_lists li .item_img{position:relative;overflow:hidden;} .section_lists li .item_img>a img{width: 100%;height: 100%;} .section_lists li .item_img .i_state{width: auto;height:auto;background:#363636;position:absolute;top:5%;left:5%;border-radius:3px;} .section_lists li .item_img .i_state a{display:block;font-size:22px;font-weight:700;color:#fff;text-align:center;line-height:32px;padding:5px 25px;} .section_lists li .item_img .new, .section_lists li .item_img .best{display:inline-block;width: 90px;height: 30px;line-height:30px;border-radius:10px;color:#fff; font-size:18px;font-weight:bold;text-align:center;} .section_lists li .item_img .new{background:#71ca59;} .section_lists li .item_img .best{background:#f14040;} .section_lists li .item_img .bar{width: 100%;height: 55px;background:rgba(0,0,0,0.8);position:absolute;bottom:-55px;left:0;transition:all 0.6s;display:flex;justify-content:center;align-items:Center;} .section_lists li .item_img .bar .icon{width: 20%;height: 100%;} .section_lists li .item_img .bar .icon img{width: 100%;height: 100%;vertical-align:middle;} /* .category_in li .item_img .bar p img{width: 100%;} */ .section_lists li .item_img .bar p .on{display:none;} .section_lists li:hover .bar{bottom:0px;} .section_lists li .item_img .bar .like:hover .off{display:none;} .section_lists li .item_img .bar .like:hover .on{display:block;} .section_lists li .item_txt {padding:10px 5px;text-align:center;margin-left:2px;} .section_lists li .item_txt .i_title{font-size:24px;font-weight:500;color:#181818; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: keep-all; } .section_lists li .item_txt .i_title a{display:block;padding-top:20px;} .section_lists li .i_price{display:flex;justify-content:center;align-items: flex-end;font-size:26px;padding-top:10px} .section_lists li .i_price .i_price1{font-size:26px;font-weight:500;color:#b4b4b4; text-decoration: line-through;} .section_lists li .i_price .i_price2{margin-left:15px;} .section_lists li .i_price .i_price2 span{font-size:28px;color:#1e1e1e;font-weight:700;} /*브랜드스토리 부분*/ .bs_in{display:flex;flex-direction:column;} .bs_in .bs_left{width: 100%;} .bs_in .bs_left img{width: 100%;} .bs_in .bs_right{width: 100%;display:flex;flex-direction:column;justify-content:center;} .bs_in .bs_right_txt{width: 90%;margin:20px auto 0;} .bs_in .bs_right .bs_right_txt p:first-child{font-size:36px;color:#181818;text-align:left;} .bs_in .bs_right .bs_right_txt p:last-child{font-size:28px;font-weight:500;color:#1e1e1e;text-align:left;margin-top:15px;} /*프로덕트 메뉴 부분*/ .product_menu{width: 100%;margin:60px auto 0;display:flex;justify-content:space-between;} .product_menu li{width: 30%;height: 60px;line-height:60px;border:1px solid #868686;border-radius:50px;} .product_menu li a{display:block;width: 100%;height:100%;color:#868686;font-size:28px;font-weight:400} .product_menu li.active{background:#f5cecf;border:1px solid #f5cecf} .product_menu li.active a{color:#fff;} /*프로모션 부분*/ .pc_promotion{display:none;} .m_promotion{display:block;} .section_in .title2{display:block;font-family:var(--mainfont);font-size:28px;font-weight:400;color:#868686;margin-top:20px;} .mySwiper2m{padding:60px 0 100px !important;} .mySwiper2m .swiper-slide{width: 100%;height:auto;padding-bottom:30px;position:relative;} .mySwiper2m .swiper-slide .event{display:inline-block;width:auto;height:auto;padding:5px 12px;background:#191919;color:#fff;font-size:24px;font-weight:600; position:absolute;top:-20px;left:0;} .mySwiper2m .swiper-slide .img{} .mySwiper2m .swiper-slide .img a{display:block;width: 100%;height: 100%;} .mySwiper2m .swiper-slide .img a img{width: 100%;height: 100%;} .mySwiper2m .swiper-slide .txt{text-align:left;} .mySwiper2m .swiper-slide .txt .t{height: 130px;} .mySwiper2m .swiper-slide .txt .t a{display:block;color:#191919;font-size:34px;font-weight:600;padding:40px 0 10px;} .mySwiper2m .swiper-slide .txt .c{ width: 100%; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; color:#868686; line-height:28px; } .mySwiper2m .swiper-slide .txt .c a{display:block;width: 100%;height: 100%;color:#868686;font-size:24px;font-weight:300;} /*프로모션 스와이퍼 스크롤바*/ .mySwiper2m .swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal2 { position: absolute; left: 0% !important; bottom: 20px !important; z-index: 50; height: 5px; width: 100% !important; } .swiper-scrollbar2 { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0,0,0,.1); } .mySwiper2m .swiper-scrollbar2.swiper-scrollbar-horizontal2 .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0,0,0,.5); border-radius: 10px; left: 0; top: 0; } .mySwiper2m .swiper-button-next::after,.mySwiper2m .swiper-button-prev::after{display:none;} .mySwiper2m .swiper-button-next, .mySwiper2m .swiper-button-prev { position: absolute; top: 40%; width:50px; height: var(--swiper-navigation-size); margin-top: calc(0px - (var(--swiper-navigation-size)/ 2)); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color,var(--swiper-theme-color)); } .mySwiper2m .swiper-button-next{right:0 !important;} .mySwiper2m .swiper-button-prev{left:0 !important;} .mySwiper2m .swiper-button-next img, .mySwiper2m .swiper-button-prev img{width: 100%;} /*리뷰 부분*/ .pc_review{display:none;} .m_review{display:block;} .mySwiper3m{padding:60px 0 100px !important;} .mySwiper3m .swiper-slide{width: 33.3%;height:auto;padding-bottom:10px;position:relative;} .mySwiper3m .swiper-slide .event{display:inline-block;width:auto;height:auto;padding:5px 12px;background:#191919;color:#fff;font-size:24px;font-weight:600; position:absolute;top:-20px;left:0;} .mySwiper3m .swiper-slide .img a{display:block;width: 100%;height: 100%;} .mySwiper3m .swiper-slide .img a img{width: 100%;height: 100%;} .mySwiper3m .swiper-slide .txt{text-align:left;padding:0 10px;} .mySwiper3m .swiper-slide .txt .t{ width: 100%; padding-top:10px; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical; word-break: keep-all; } .mySwiper3m .swiper-slide .txt .t a{display:block;color:#191919;font-size:30px;font-weight:500; height:66px; line-height:32px;} .mySwiper3m .swiper-slide .txt .c{ width: 100%; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; word-break: keep-all; color:#868686; line-height:28px; margin:20px auto; } .mySwiper3m .swiper-slide .txt .c a{display:block;width: 100%;color:#868686;font-size:24px;font-weight:300;margin:0px auto;height:84px;;} .mySwiper3m .swiper-slide .txt .i{padding:10px 0 0;} .mySwiper3m .swiper-slide .txt .i .id{padding-right:20px;position:relative;} .mySwiper3m .swiper-slide .txt .i .id::after{content:'';position:absolute;right:0;width: 1px;height: 110%;background:#868686;} .mySwiper3m .swiper-slide .txt .i .date{padding-left:15px;} .mySwiper3m .swiper-slide .txt .i .id a, .mySwiper3m .swiper-slide .txt .i .date{color:#868686;font-size:14px;font-weight:400;} /*리뷰 스와이퍼 스크롤바*/ .mySwiper3m .swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal3 { position: absolute; left: 0% !important; bottom: 20px !important; z-index: 50; height: 5px; width: 100% !important; } .swiper-scrollbar2 { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0,0,0,.1); } .mySwiper3m .swiper-scrollbar3.swiper-scrollbar-horizontal3 .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0,0,0,.5); border-radius: 10px; left: 0; top: 0; } .mySwiper3m .swiper-button-next::after,.mySwiper3m .swiper-button-prev::after{display:none;} .mySwiper3m .swiper-buttons3{width: 8%;height:auto;position:absolute;bottom:25px;right:0;background:skyblue;} .mySwiper3m .swiper-button-next, .mySwiper3m .swiper-button-prev { position: absolute; top: 40%; width:50px; height: var(--swiper-navigation-size); margin-top: calc(0px - (var(--swiper-navigation-size)/ 2)); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color,var(--swiper-theme-color)); } .mySwiper3m .swiper-button-next{right:0 !important;} .mySwiper3m .swiper-button-prev{left:0 !important;} .mySwiper3m .swiper-button-next img, .mySwiper3m .swiper-button-prev img{width: 100%;} /* ===================== 각 페이지들 ========================*/ /* .sub_title_area{height: 80px;} */ .tw{width: 100%;} .tw2{width: 94%;margin:22vw auto 80px;} /* #sct{margin:60px auto !important;} */ } @media screen and (max-width: 720px){ .pc_header{display:none;} .m_header{display:block;position:fixed;top:0;left:0;z-index:970;width: 100%;background:#fff;} .m_header_in{width: 94%;margin:0 auto;height: 14vw;display:flex;align-items:center;position:relative;} .m_header_in .menu_btn{width: 11.1111vw;height:11.1111vw;position:relative;} .m_header_in .menu_btn span{display: inline-block;position: Absolute;top: 50%;left: 50%;transform: translate(-50%,-50%); width: 6.2500vw;height: 0.4167vw;background: #1d1d1b;transition: all 0.4s;} .m_header_in .menu_btn span.b{top:30%;} .m_header_in .menu_btn span.t{} .m_header_in .menu_btn span.n{top:70%;} .m_header_in .menu_btn.on .b{transform: rotate(45deg);} .m_header_in .menu_btn.on .t{display:none;} .m_header_in .menu_btn.on .n{transform: rotate(-45deg);} .m_header_in .menu_btn.on span{top:50%;left:20%;transform:translateY(-50%);} .m_header_in .logo{position:Absolute;left:50%;transform:translateX(-50%);width: 40%;} .m_header_in .logo a{display:block;width: 100%;height:100%;} .m_header_in .logo a img{width:100%;height:100%;} .m_header_in .m_my{display:flex;} .m_header_in .m_my li a{display:block;} .m_header_in .m_my li:first-child{padding-right:2.0833vw;} .m_header_in .m_my li:last-child{padding-left:2.0833vw} .m_open{position:fixed;top:11.1111vw;left:-100%;z-index:992;width: 100%;height: 100%;background:#fff;border-top:1px solid #eee;; } .m_open_in{width: 94%;height:100%;margin:0 auto;position:relative;} .m_util_area{width: 100%;height:auto;position:absolute;z-index:1005;background:#fff;bottom:11vw;padding:2vw 1vw;background:#f9f9f9;} .m_util_area .m_util{width: 94%;height:auto;margin:0 auto;display:flex;justify-content:space-between;align-items:Center;} .m_util_area .m_util li a{font-size:4.4444vw;} .m_util_area .m_util .m_util_in{display: flex;flex-direction: column;align-items: center;} .m_util_area .m_util .m_util_in img{height:8.5vw;} .m_nav{width: 100%;height:80%;margin-top:1.3889vw;overflow-y:scroll;padding-bottom:2.0833vw;} .m_nav { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */} .m_nav::-webkit-scrollbar {display: none; /* Chrome, Safari, Opera*/} .m_nav>li>a{display:block;font-size:4.7222vw;height:13.8889vw;line-height:11.6667vw;font-weight:500;text-indent:1.3889vw;padding:0.6944vw;border-bottom:0.1389vw solid #999;background:#fff;position:relative;} .m_nav>li .aimg{display:inline-block;position:absolute;top:50%;transform:translateY(-50%);right:1.3889vw;width:6.2500vw;height: 6.2500vw;} .m_nav>li .aimg img{width: 70%;vertical-align:middle;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);} .m_nav>li:last-child a{border-bottom:none;} .m_nav .m_sub{display:none;padding:0.6944vw 0;background:#f9f9f9;border-bottom:0.1389vw solid #ccc;} .m_nav .m_sub li a{display:block;height:11.8056vw;line-height:11.8056vw;color:#4a4a4a;font-size:4.4444vw;padding:0.6944vw;text-indent:2.7778vw;border-bottom:0.1389vw solid #ccc;} .m_nav .m_sub li:last-child a{border-bottom:none;} /* ===================== Footer ========================*/ /*모바일 푸터*/ .footer{width: 100%;height: auto;padding:5vw 0.0000vw;background:#fff;font-family:var(--mainfont);border-top:0.1389vw solid #b4b4b4;} .footer_in{width:94%;margin:0 auto;position:relative;} .f_left{width: 100%;font-size:2.2222vw;display:flex;align-items: center;padding:1.3889vw 0;} .footer_in .f_left .f_logo{height:13.8889vw;position:Absolute;display:none;} .footer_in .f_left .f_logo a{display:inline-block;height: 100%;} .footer_in .f_left .f_logo a img{width: 100%;height: 100%;} .f_left .f_num{/* margin-left:5.5556vw; */width:100%;text-align:center;} .f_left .f_num strong{font-size:3.8889vw;font-weight:700;} .f_left .f_num p{font-size:3.3333vw;font-weight:300;line-height:4.1667vw;margin-top:0.6944vw;} .f_right{width: 100%;display:flex;flex-direction:column;justify-content:center;/* align-items:center; */} .f_right address{/* margin:3.3333vw auto 0; */font-size:3.3333vw;line-height:4.7222vw;font-weight:400;font-style:normal;margin-top:4.1667vw;text-align:center;} .f_right address .none{display:none;} .f_right address .ss{display:inline-block;margin-left:7.5000vw;} .f_right address .line{display:none;} .f_right .f_list{display:flex;/* justify-content:flex-start;margin:1.3889vw auto 0; */order:2;margin-top:2.0833vw;justify-content: space-between} .f_right .f_list li{position:relative;text-align:center;} .f_right .f_list li::after{content:'';position:absolute;width: 0.1389vw;height: 100%;background:#191919;top:0;right:-0.6944vw;} .f_right .f_list li:last-child::after{display:none;} .f_right .f_list li a{display:block;font-size:3.0556vw;font-weight:600;padding:0 2.2222vw;} .f_right .f_list li:first-child a{padding-left:0.0000vw;} .f_right .f_list li a::after{} .footer .copy{width: 94%;font-size:2.7778vw;font-weight:400;margin:2.7778vw auto 4.1667vw;text-align:center;} /*sns메뉴들*/ .sns_area{position:fixed;bottom:20vw;right:2.7778vw;z-index:800;width:auto;} .sns_area ul{display:flex;flex-direction:column;align-items: flex-end;} .sns_area ul li{width:10.4167vw;height:10.4167vw;} .sns_area ul li:nth-child(2){margin:2vw 0;} .sns_area ul li a{display:block;width: 100%;height: 100%;} .sns_area ul li a img{width: 100%;} .visual{position:relative;margin-top:11.1111vw;} .visual .mySwiper{width: 100%;} .visual .mySwiper .swiper-slide img{width: 100%;height: 100%;} /* ===================== Index ========================*/ /**/ .visual{position:relative;width: 100%;margin-top:11.1111vw} .v_pc{display:none;} .v_mo{display:block;} .visual .mySwiperm{width: 100%;} .visual .mySwiperm .swiper-slide img{width: 100%;height: 100%;object-fit:fill;} .visual .mySwiperm .swiper-paginationm{position:absolute;z-index:33;bottom:4.1667vw;left:50%;transform:translateX(-50%);width:auto ;} .visual .mySwiperm .swiper-paginationm .swiper-pagination-bullet{background:#fff;opacity:20%;width: 2.2222vw;height: 2.2222vw;} .visual .mySwiperm .swiper-paginationm .swiper-pagination-bullet-active{width: 8.3333vw;border-radius:6.9444vw;background:#fff;opacity:100%;} .visual .more_btn{width: 31.9444vw;height: 6.3889vw;line-height:6.3889vw;position:absolute;bottom:37%;left:11%;z-index:1234;transition:all 0.4s;border-bottom:0.4167vw solid #fff;} .visual .more_btn a{display:block;width: 100%;height: 100%;font-size:3.33vw;padding-left:3.4722vw;color:#fff;position:Relative;background:url(/images/bg_arrow.png) no-repeat center right 2vw;} .visual .more_btn .ma{position:absolute;top:50%;transform:translateY(-50%);right:5%;} .visual .more_btn .ma img{vertical-align:middle;} .visual .more_btn .ma .on{display:none;} .visual .more_btn .more_bg{position:Absolute;top:0;left:0;width: 0%;height: 100%;background:#fff;transition:all 0.4s;z-index:-4;} /*Index항목들 시작 */ .main{height:auto;padding-bottom:13.8889vw;} .section{width: 100%;height:auto;margin-top:15.9722vw;padding:0 2.0833vw;} .section_in{width: 100%;margin:0 auto;position:Relative;text-align:center;} .section_in .title{display:inline-block;margin:0 auto;font-family:var(--mainfont);font-size:5.5556vw;font-weight:500;position:relative;line-height:1;} .section_in .title::after{content:'';position:Absolute;bottom:-1.1111vw;left:50%;transform:translateX(-50%);width: 30%;height:0.4167vw;background:#f5cecf;} /*리스트페이지랑 연결*/ .section .main_more{position:absolute;top:0;right:19.4444vw;width: 5.5556vw;height: 5.5556vw;background:#f5cecf;} .section .main_more a{display:block;width: 100%;height: 100%;} .section .main_more a img{ position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);} .section_lists{width: 100%;margin:8.3333vw auto 0;display:flex;flex-wrap:wrap;gap:2%;justify-content:space-between;position:relative;} .section_lists .list{width: 48%;margin-bottom:10.2778vw;position:relative;background:#fff;} .section_lists .list a{display:block;width: 100%;height: 100%;} .section_lists .list .item_img{border:0.1389vw solid #eee} .section_lists .list .item_img img{width: 100%;height: 100%;} .section_lists li .item_img{position:relative;overflow:hidden;} .section_lists li .item_img>a img{width: 100%;height: 100%;} .section_lists li .item_img .i_state{width: auto;height:auto;background:#363636;position:absolute;top:5%;left:5%;border-radius:0.4167vw;} .section_lists li .item_img .i_state a{display:block;font-size:3.0556vw;font-weight:700;color:#fff;text-align:center;line-height:4.4444vw;padding:0.6944vw 3.4722vw;} .section_lists li .item_img .new, .section_lists li .item_img .best{display:inline-block;width: 12.5000vw;height: 4.1667vw;line-height:4.1667vw;border-radius:1.3889vw;color:#fff; font-size:2.5000vw;font-weight:bold;text-align:center;} .section_lists li .item_img .new{background:#71ca59;} .section_lists li .item_img .best{background:#f14040;} .section_lists li .item_img .bar{width: 100%;height: 7.6389vw;background:rgba(0,0,0,0.8);position:absolute;bottom:-7.6389vw;left:0;transition:all 0.6s;display:flex;justify-content:center;align-items:Center;} .section_lists li .item_img .bar .icon{width: 20%;height: 100%;} .section_lists li .item_img .bar .icon img{width: 100%;height: 100%;vertical-align:middle;} /* .category_in li .item_img .bar p img{width: 100%;} */ .section_lists li .item_img .bar p .on{display:none;} .section_lists li:hover .bar{bottom:0.0000vw;} .section_lists li .item_img .bar .like:hover .off{display:none;} .section_lists li .item_img .bar .like:hover .on{display:block;} .section_lists li .item_txt {padding:1.3889vw 0.6944vw;text-align:center;margin-left:0.2778vw;} .section_lists li .item_txt .i_title{font-size:3.3333vw;font-weight:500;color:#181818; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: keep-all; } .section_lists li .item_txt .i_title a{display:block;padding:2.7778vw 0 0vw;} .section_lists li .i_price{display:flex;justify-content:center;align-items: flex-end;font-size:3.6111vw;padding-top:1vw;} .section_lists li .i_price .i_price1{font-size:3.6111vw;font-weight:500;color:#b4b4b4; text-decoration: line-through;} .section_lists li .i_price .i_price2{margin-left:2.0833vw;} .section_lists li .i_price .i_price2 span{font-size:3.8889vw;color:#1e1e1e;font-weight:700;} /*브랜드스토리 부분*/ .bs_in{display:flex;flex-direction:column;} .bs_in .bs_left{width: 100%;} .bs_in .bs_left img{width: 100%;} .bs_in .bs_right{width: 100%;display:flex;flex-direction:column;justify-content:center;} .bs_in .bs_right_txt{width: 95%;margin:4vw auto 0;} .bs_in .bs_right .bs_right_txt p:first-child{font-size:5.0000vw;color:#181818;text-align:left;} .bs_in .bs_right .bs_right_txt p:last-child{font-size:3.8889vw;font-weight:500;color:#1e1e1e;text-align:left;margin-top:2.0833vw;} /*프로덕트 메뉴 부분*/ .product_menu{width: 100%;margin:8.3333vw auto 0;display:flex;justify-content:space-between;} .product_menu li{width: 30%;height: 8.3333vw;line-height:8.3333vw;border:0.1389vw solid #868686;border-radius:6.9444vw;} .product_menu li a{display:block;width: 100%;height:100%;color:#868686;font-size:3.8889vw;font-weight:400} .product_menu li.active{background:#f5cecf;border:0.1389vw solid #f5cecf} .product_menu li.active a{color:#fff;} /*프로모션 부분*/ .pc_promotion{display:none;} .m_promotion{display:block;} .section_in .title2{display:block;font-family:var(--mainfont);font-size:3.8889vw;font-weight:400;color:#868686;margin-top:2.7778vw;} .mySwiper2m{padding:8.3333vw 0 13.8889vw !important;} .mySwiper2m .swiper-slide{width: 100%;height:auto;padding-bottom:4.1667vw;position:relative;} .mySwiper2m .swiper-slide .event{display:inline-block;width:auto;height:auto;padding:0.6944vw 1.6667vw;background:#191919;color:#fff;font-size:3.3333vw;font-weight:600; position:absolute;top:-2.7778vw;left:0;} .mySwiper2m .swiper-slide .img{} .mySwiper2m .swiper-slide .img a{display:block;width: 100%;height: 100%;} .mySwiper2m .swiper-slide .img a img{width: 100%;height: 100%;} .mySwiper2m .swiper-slide .txt{text-align:left;} .mySwiper2m .swiper-slide .txt .t{height: 17.8082vw;} .mySwiper2m .swiper-slide .txt .t a{display:block;color:#191919;font-size:4.7222vw;font-weight:600;padding:5.5556vw 0 1.3889vw;} .mySwiper2m .swiper-slide .txt .c{ width: 100%; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: keep-all; color:#868686; line-height:3.8889vw; } .mySwiper2m .swiper-slide .txt .c a{display:block;width: 100%;height: 100%;color:#868686;font-size:3.3333vw;font-weight:300;} /*프로모션 스와이퍼 스크롤바*/ .mySwiper2m .swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal2 { position: absolute; left: 0% !important; bottom: 2.7778vw !important; z-index: 50; height: 0.6944vw; width: 100% !important; } .swiper-scrollbar2 { border-radius: 1.3889vw; position: relative; -ms-touch-action: none; background: rgba(0,0,0,.1); } .mySwiper2m .swiper-scrollbar2.swiper-scrollbar-horizontal2 .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0,0,0,.5); border-radius: 1.3889vw; left: 0; top: 0; } .mySwiper2m .swiper-button-next::after,.mySwiper2m .swiper-button-prev::after{display:none;} .mySwiper2m .swiper-buttons2{width: 8%;height:auto;position:absolute;bottom:3.4722vw;right:0;background:skyblue;} .mySwiper2m .swiper-button-next, .mySwiper2m .swiper-button-prev { position: absolute; top: 40%; width:6.9444vw; height: var(--swiper-navigation-size); margin-top: calc(0.0000vw - (var(--swiper-navigation-size)/ 2)); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color,var(--swiper-theme-color)); } .mySwiper2m .swiper-button-next{right:0 !important;} .mySwiper2m .swiper-button-prev{left:0 !important;} .mySwiper2m .swiper-button-next img, .mySwiper2m .swiper-button-prev img{width: 100%;} /*리뷰 부분*/ .pc_review{display:none;} .m_review{display:block;} .mySwiper3m{padding:8.3333vw 0 13.8889vw !important;} .mySwiper3m .swiper-slide{width: 33.3%;height:auto;padding-bottom:1.3889vw;position:relative;/* border-bottom:0.1389vw solid #868686 */} .mySwiper3m .swiper-slide .event{display:inline-block;width:auto;height:auto;padding:0.6944vw 1.6667vw;background:#191919;color:#fff;font-size:3.3333vw;font-weight:600; position:absolute;top:-2.7778vw;left:0;} .mySwiper3m .swiper-slide .img a{display:block;width: 100%;height: 100%;} .mySwiper3m .swiper-slide .img a img{width: 100%;height: 100%;} .mySwiper3m .swiper-slide .txt{text-align:left;padding:0 1.3889vw;} .mySwiper3m .swiper-slide .txt .t{ width: 100%; padding-top:1.3699vw; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical; word-break: keep-all; } .mySwiper3m .swiper-slide .txt .t a{display:block;color:#191919;font-size:4.1096vw;font-weight:500; height:9.0411vw; line-height:4.3836vw;} .mySwiper3m .swiper-slide .txt .c{ width: 100%; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; word-break: keep-all; color:#868686; line-height:3.8356vw; margin:2.7397vw auto; } .mySwiper3m .swiper-slide .txt .c a{display:block;width: 100%;color:#868686;font-size:3.2877vw;font-weight:300;margin:0.0000vw auto;height:11.5068vw;;} .mySwiper3m .swiper-slide .txt .i{padding:1.3699vw 0 0;} .mySwiper3m .swiper-slide .txt .i .id{padding-right:2.7397vw;position:relative;} .mySwiper3m .swiper-slide .txt .i .id::after{content:'';position:absolute;right:0;width: 0.1370vw;height: 110%;background:#868686;} .mySwiper3m .swiper-slide .txt .i .date{padding-left:2.0548vw;} .mySwiper3m .swiper-slide .txt .i .id a, .mySwiper3m .swiper-slide .txt .i .date{color:#868686;font-size:1.9178vw;font-weight:400;} /* .mySwiper3m .swiper-slide .txt .t{*/ /* width: 100%;*/ /* overflow: hidden;*/ /* white-space: normal;*/ /* text-overflow: ellipsis;*/ /* display: -webkit-box;*/ /* -webkit-line-clamp:2;*/ /* -webkit-box-orient: vertical;*/ /* word-break: keep-all; */ /* color:#868686;*/ /* line-height:1;*/ /* padding-top:1.3889vw;*/ /* }*/ /**/ /* .mySwiper3m .swiper-slide .txt .t a{display:block;color:#191919;font-size:4.7222vw;font-weight:500;}*/ /* .mySwiper3m .swiper-slide .txt .c{*/ /* width: 100%;*/ /* */ /* overflow: hidden;*/ /* white-space: normal;*/ /* text-overflow: ellipsis;*/ /* display: -webkit-box;*/ /* -webkit-line-clamp:3;*/ /* -webkit-box-orient: vertical;*/ /* word-break: keep-all; */ /* color:#868686;*/ /* line-height:3.8889vw;*/ /* }*/ /* .mySwiper3m .swiper-slide .txt .c a{display:block;width: 100%;color:#868686;font-size:3.3333vw;font-weight:300;margin:2.7778vw auto;}*/ /**/ /* .mySwiper3m .swiper-slide .txt .i{padding:1.3889vw 0 0;}*/ /* .mySwiper3m .swiper-slide .txt .i .id{padding-right:2.7778vw;position:relative;}*/ /* .mySwiper3m .swiper-slide .txt .i .id::after{content:'';position:absolute;right:0;width: 0.1389vw;height: 110%;background:#868686;}*/ /* .mySwiper3m .swiper-slide .txt .i .date{padding-left:2.0833vw;}*/ /* .mySwiper3m .swiper-slide .txt .i .id a, .mySwiper3m .swiper-slide .txt .i .date{color:#868686;font-size:1.9444vw;font-weight:400;}*/ /*리뷰 스와이퍼 스크롤바*/ .mySwiper3m .swiper-horizontal>.swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal3 { position: absolute; left: 0% !important; bottom: 2.7778vw !important; z-index: 50; height: 0.6944vw; width: 100% !important; } .swiper-scrollbar2 { border-radius: 1.3889vw; position: relative; -ms-touch-action: none; background: rgba(0,0,0,.1); } .mySwiper3m .swiper-scrollbar3.swiper-scrollbar-horizontal3 .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0,0,0,.5); border-radius: 1.3889vw; left: 0; top: 0; } .mySwiper3m .swiper-button-next::after,.mySwiper3m .swiper-button-prev::after{display:none;} .mySwiper3m .swiper-buttons3{width: 8%;height:auto;position:absolute;bottom:3.4722vw;right:0;background:skyblue;} .mySwiper3m .swiper-button-next, .mySwiper3m .swiper-button-prev { position: absolute; top: 40%; width:6.9444vw; height: var(--swiper-navigation-size); margin-top: calc(0.0000vw - (var(--swiper-navigation-size)/ 2)); z-index: 10; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--swiper-navigation-color,var(--swiper-theme-color)); } .mySwiper3m .swiper-button-next{right:0 !important;} .mySwiper3m .swiper-button-prev{left:0 !important;} .mySwiper3m .swiper-button-next img, .mySwiper3m .swiper-button-prev img{width: 100%;} /* ===================== 각 페이지들 ========================*/ /* .sub_title_area{height: 11.1111vw;margin-top:30px;} */ /* .sub_title{margin-top:30px;} */ .tw{width: 100%;} .tw2{width: 94%;margin:22vw auto 11.1111vw;} /* #sct{margin:8.1191vw auto !important;} */ }