/* BASIC css start */
/* visual css */
.visual{margin:0 auto 65px;overflow:hidden;}
.visual .swiper-slide{text-align:left;position:relative}
.visual .swiper-slide a{display:block;margin:0;outline:none;width:100%;}
.visual .swiper-slide img{margin:0 auto;width:100%;height:auto}

.visual .swiper-pagination{bottom:25px !important;line-height:10px;font-size:12px}
.visual .swiper-pagination-bullet{background:#eee;color:#eee;height:0;border-radius:0;opacity:1}
.visual .swiper-pagination-bullet.swiper-pagination-bullet-active{height:2px;font-size:0}
.visual .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{margin:0 6px}

.visual .swiper-slide .col3{display:flex;}
.visual .swiper-slide .col3 .img_box{position:relative; width:33.33%;}
.visual .swiper-slide .col3 .img_box img{width:100%;}
.visual .swiper-slide .col3 .img_box .txt_box{position:absolute; top:50%; left:50%; width:100%; transform:translate(-50%,-50%); text-align:center;}
.visual .swiper-slide .col3 .img_box .txt_box h2{font-size:32px; font-weight:700; color:#fff; margin-bottom:5px;}
.visual .swiper-slide .col3 .img_box .txt_box p{font-size:17px; font-weight:400; color:#fff;}

.visual .swiper-button-next,
.visual .swiper-button-prev{background:none;width:auto;height:auto;font-size:42px;color:#999;margin-top:0px;transform:translateY(-50%); opacity:.4; width:64px; height:64px; display: flex; align-items: center; justify-content: center; color:#fff;  }
.visual .swiper-button-prev:hover, .visual .swiper-button-next:hover{background-color: rgba(0, 0, 0, .4); opacity:1; border-radius:12px; }


/* banner css */
.and .layout-max.banner{max-width:1270px}
.banner:after{content:'';clear:both;display:block}
.banner li{float:left;width:32.25%}
.banner li + li{margin-left:1.625%}
.banner li > a{font-size:0}
.banner li > a > img{max-width:100%;height:auto;transition:all 0.5s}
.banner li:hover > a > img{opacity:0.7}
.banner li p{text-align:left}
.banner li p.bnn_tit{font-size:14px;margin-top:25px;color:#555}
.banner li p.bnn_txt{font-size:13px;color:#999;margin-top:15px;line-height:1.6}


/* tab_product css */
.tab_product .layout-max{margin:100px auto 50px;padding-bottom:50px}
.tab_product{position:relative}
.tab_product:before{content:"";background:#fcfbf7;width:100%;height:40%;position:absolute;bottom:0;left:0;right:0}
.tab_product .title{margin-bottom:10px}
.tab_product .none{display:none}

.tab_product .swiper-pagination{max-width:70%;margin:0 auto;position:static;display: grid;grid-template-rows: auto;gap:5px;grid-template-columns: repeat(8, 1fr);padding-bottom:20px}
.tab_product .swiper-pagination .swiper-pagination-bullet{margin:0;width:auto;height:auto;background:none;display:inline-block;border-radius:5px;border:1px solid #eee;color:#9C9C9C;background:#fff;padding:10px;font-size:12px;cursor:pointer;opacity:1}
.tab_product .swiper-pagination .swiper-pagination-bullet a{color:#9C9C9C;}
.tab_product .swiper-pagination .swiper-pagination-bullet:before{content:"#"}
.tab_product .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{color:#fff;background:var(--main-color);border-color:var(--main-color);}
.tab_product .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active a{color:inherit}

.and .over_product .list_over{display:grid;grid-template-rows: 1fr 1fr;grid-template-columns: 2.07fr 1fr 1fr 1fr;gap: 20px;}
body.and .over_product .list_over > li{position:relative;margin:0;}
.and .over_product .list_over > li:first-child{grid-column: 1 / span 1;grid-row: 1 / span 3;}
.and .over_product .list_over > li:first-child:hover .over{opacity:1}
.and .over_product .thumb .img img{max-width:287px}
.and .over_product .list_over > li:first-child .thumb .img img{max-width:582px}
.and .over_product .list_over > li .over .opt > li.display상품간략설명{max-width:280px}
.and .over_product .list_over > li:nth-child(n+2) .over .txtWrap{display:none}
.and .over_product .list_over > li .over span span.price{display:inline-block; margin-left:5px;}


/* instagram css */
.instagram .profile{font-size:22px;font-weight:600;text-align:center;margin-bottom:15px}
.instagram .profile i{margin-right:10px;color:#fff;background:linear-gradient(-45deg,rgba(203,57,165,1),rgba(255,94,64,1),rgba(255,213,84,1));border-radius:5px;padding:1px}




#pooky_main_slide_popup{position: fixed;z-index: 1000;position: fixed;z-index: 1000;top:185px;left:66%;}
#pooky_main_slide_popup .pop_wrap{
    position: relative; 
    width: 500px;
    height: 543px;
    overflow: hidden;
   
}
#pooky_main_slide_popup .pop_wrap .swiper-slide{}
#pooky_main_slide_popup .pop_wrap .swiper-slide a{display:block;}
#pooky_main_slide_popup .pop_wrap .swiper-slide a img{max-width:100%;}
#pooky_main_slide_popup  .bottom_btn_area{background: #fff;display: flex;align-items: center;justify-content: end;padding: 10px  0;grid-gap: 10px;}
#pooky_main_slide_popup  .bottom_btn_area >div{}
#pooky_main_slide_popup  .bottom_btn_area >div label{
    color: #959595;
    font-size: 12px;
}
#pooky_main_slide_popup  .bottom_btn_area >div label input{}
#pooky_main_slide_popup .bottom_btn_area >div button{}
#pooky_main_slide_popup .bottom_btn_area >div button img{
    vertical-align: middle;
}

#pooky_main_slide_popup .swiper-button-next{
cursor:pointer;
       background: url(/design/ninnananna/img/241118_pop_arrow02.png) no-repeat center;
    height: 40px;
}
#pooky_main_slide_popup .swiper-button-prev{
cursor:pointer;
    background: url(/design/ninnananna/img/241118_pop_arrow01.png) no-repeat center;
    height: 40px;
}

#pooky_main_slide_popup .pagination{
    position: absolute;
    width: 100%;
    bottom: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 0;
    grid-gap: 2px;
}
#pooky_main_slide_popup .pagination .swiper-pagination-switch{
    background: #888;
    border-color: #888;
    width: 5px;
    height: 5px;
}
#pooky_main_slide_popup .pagination .swiper-pagination-switch.swiper-active-switch{
    background: #000;
    border-color: #000;
}
/* BASIC css end */

