/* index.css */
/*----------------------------------------------------------------  공통 */

/* --------------------------------------------------------------- 1. hero banner */
#wrap main {width: 100vw;}
#wrap main .hero_bnr {width: 100vw;}
#wrap main .hero_bnr .hero {height: 90vh; position: relative;}
#wrap main .hero_bnr .hero .swiper-wrapper {}
#wrap main .hero_bnr .hero .swiper-wrapper .swiper-slide {background-size: cover; background-position: right center;}
#wrap main .hero_bnr .hero .swiper-wrapper .swiper-slide .slide_txt{
    max-width: 1400px; width: 100%;
    position: absolute; top: 50%; left: 15vw;
    transform: translateY(-50%); transform-origin: center;
}
#wrap main .hero_bnr .hero .swiper-wrapper .swiper-slide .slide_txt h1 {
    font-size: 2.50rem; font-weight: 600; line-height: 1.2;
    margin-bottom: 20px;
    color: #fff;
}
#wrap main .hero_bnr .hero .swiper-wrapper .swiper-slide .slide_txt .more_btn {display: flex; align-items: center; gap: 8px;}
#wrap main .hero_bnr .hero .swiper-wrapper .swiper-slide .slide_txt .more_btn span {color: #fff; font-size: 1.13rem;}
#wrap main .hero_bnr .hero .swiper-wrapper .swiper-slide .slide_txt .more_btn img {}
#wrap main .hero_bnr .hero .swiper-wrapper .slide1 {background-image: url(../images/product/hero_bnr_01.jpg);}
#wrap main .hero_bnr .hero .swiper-wrapper .slide2 {background-image: url(../images/product/hero_bnr_01.jpg);}
#wrap main .hero_bnr .hero .swiper-wrapper .slide3 {background-image: url(../images/product/hero_bnr_01.jpg);}
#wrap main .hero_bnr .hero .prev,
#wrap main .hero_bnr .hero .next {color:#fff; background-image: url(../images/common/prev_next.svg);
    background-size: contain; background-repeat: no-repeat;
}
#wrap main .hero_bnr .hero .prev {position: absolute; top: 60%; left: 160px; transform: translateY(-60%) scale(0.6);}
#wrap main .hero_bnr .hero .next {position: absolute; top: 60%; right: 160px; transform: translateY(-60%) scale(-0.6);}
#wrap main .hero_bnr .hero .prev svg {display: none;}
#wrap main .hero_bnr .hero .next svg {display: none;}
#wrap main .hero_bnr .hero .page_scroll {
    position: absolute;
    width: 670px; height: 100px;
    top: auto;  bottom: 0;  left: 50%; right: auto;
    transform: translateX(-50%);
    z-index: 999; 
    display: flex; align-items: center;
}
#wrap main .hero_bnr .hero .page_scroll .scroll {
    background-color: aqua;
    width: 600px; height: 2px;
    left: 0; bottom: auto;
    background: rgba(255, 255, 255, 0.3);
}
#wrap main .hero_bnr .hero .page_scroll .scroll .swiper-scrollbar-drag {background: rgba(255, 255, 255, 1);}
#wrap main .hero_bnr .hero .page_scroll .page {
    display: flex; width: max-content;
    bottom: auto; left: auto; top: auto; right: 0;
    gap: 8px; align-items: center;
}
#wrap main .hero_bnr .hero .page_scroll .page .swiper-pagination-current {color: rgba(255,255,255,1); font-size: 0.88rem; font-weight: 600;}
#wrap main .hero_bnr .hero .page_scroll .page .swiper-pagination-total {color: rgba(255,255,255,0.3); font-size: 0.88rem; font-weight: 600;}
#wrap main .hero_bnr .hero .page_scroll .page span:nth-child(2) {display: inline-block; background-color: #eee; width: 1px; height: 10px;}
/* ---------------------------------------------------------- 2.artist */
#wrap main .artist {
    width: calc(100vw - 160px);
    margin: 80px auto;
}
#wrap main .artist .artist_left {
    display: flex; flex-flow: column nowrap;
    justify-content: space-between;
}
#wrap main .artist .artist_left .title {}
#wrap main .artist .artist_left .title p {}
#wrap main .artist .artist_left .title h1 {}
#wrap main .artist .artist_left .more_btn {}
#wrap main .artist .artist_left .more_btn a {
    display: flex; flex-flow: row nowrap; 
    align-items: center; justify-content: space-between; 
    height: 64px; width: 100%;
    padding: 10px; border-bottom: 1px solid #1e1e1e;
}
#wrap main .artist .artist_left .more_btn a .btn_txt {}
#wrap main .artist .artist_left .more_btn a img {}
#wrap main .artist .artist_right{display: flex; flex-flow: row nowrap; gap: 20px;}
#wrap main .artist .artist_right a {display: block; width: 100%;}
#wrap main .artist .artist_right a img {width: 100%;}

/* -------------------------------------------------- 3. add bnr 1st */
#wrap main .add_bnr_product {
    height: 200px; width: 100vw;
    background-image: url(../images/product/add_bnr_01.png);
    background-position: center;
    background-size: cover;
    position: relative;
}
#wrap main .add_bnr_product .add_contents {
    display: block;
    position: absolute; left: 200px; top: 50%; transform: translateY(-50%);
}
#wrap main .add_bnr_product .add_contents h1 {
    margin-bottom: 10px; 
    font-size: 2.50rem; font-weight: 600;
    color: #fff;
}
#wrap main .add_bnr_product .add_contents .more_btn {
    display: flex; flex-flow: row nowrap; align-items: center; gap: 8px;
}
#wrap main .add_bnr_product .add_contents .more_btn img {}
#wrap main .add_bnr_product .add_contents .more_btn p {color: #fff; font-size: 1.50rem;}
/* ---------------------------------------------------4.best */
#wrap main .best {
    display: flex; flex-flow: row nowrap;
    padding: 160px 0 160px 80px; 
    width: 100%;
}
#wrap main .best .best_left {}
#wrap main .best .best_left .contents_wrap {
    display: flex; flex-flow: column nowrap;
    justify-content: space-between; height: 100%;
}
#wrap main .best .best_left .contents_wrap .title {}
#wrap main .best .best_left .contents_wrap .title h1 {}
#wrap main .best .best_left .contents_wrap .title p {}
#wrap main .best .best_left .contents_wrap .tab_menu {}
#wrap main .best .best_left .contents_wrap .tab_menu li {}
#wrap main .best .best_left .contents_wrap .tab_menu .active {}
#wrap main .best .best_left .contents_wrap .tab_menu li a {width: 100%;}
#wrap main .best .best_left .contents_wrap .tab_menu li a .tab {}
#wrap main .best .best_left .contents_wrap .tab_menu li .active {border-bottom: 1px solid #1C4797;}
#wrap main .best .best_left .contents_wrap .tab_menu li .active .tab {color: #1C4797;}
#wrap main .best .best_left .contents_wrap .tab_menu li .active img {display: block;}
#wrap main .best .best_left .contents_wrap .tab_menu li a img {}
#wrap main .best .best_right {flex: 1; min-width: 0;}
#wrap main .best .best_right .best_swiper {display: none;}
#wrap main .best .best_right .active {display: block;}
#wrap main .best .best_right .best_swiper .swiper-wrapper {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .slide1 {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .slide2 {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .slide3 {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .slide4 {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .slide5 {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .slide6 {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_list {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_list .item_img {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_list .item_img img {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_list .rank {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_list .like {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_list .like img {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_info {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_info .artist_name {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_info .artist_name,
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_info .info h1,
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_info .info .price {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_info .info h1 {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_info .info .price {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_info .info .badge {}
#wrap main .best .best_right .best_swiper .swiper-wrapper .swiper-slide .item_info .info .badge span {}
/* -------------------------------------------------------------------------------------------- 5. comingsoon */
#wrap main .coming_container {
    display: flex;
    width: 100%; margin: 0 80px 160px 0; height: 940px; gap: 40px;
    justify-content: start;
}
#wrap main .coming_container .coming_left {
    background-image: url(../images/product/come_all_item.jpg); flex: 1;
    background-repeat: no-repeat; background-size: cover; background-position: center;
}
#wrap main .coming_container .coming_left img {width: 100%; height: 100%;}
#wrap main .coming_container .coming_right {
    display: flex; flex-flow: column nowrap;
    justify-content: center;
    align-items: center; gap: 80px;
    width: 860px;
}
#wrap main .coming_container .coming_right .title {text-align: center;}
#wrap main .coming_container .coming_right .title h1 {}
#wrap main .coming_container .coming_right .title p {font-size: 1.25rem; color: #555;}
#wrap main .coming_container .coming_right .title p span {font-weight: 700;color: #555;}
#wrap main .coming_container .coming_right .title p span:last-child {color: #1C4797;}
#wrap main .coming_container .coming_right .coming_wrap {
    position: relative; margin-bottom: 0; overflow: hidden;
    width:100%; padding: 0 80px 80px;
}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper {width: 100%; height: 100%; margin-bottom: 10px;}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .slide1 {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .slide2 {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .slide3 {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .slide4 {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_list .item_img {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_list .item_img img {width: 100%;}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_list .noti {position: absolute; top: 16px; right: 16px;}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_list .noti img {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info .artist_name {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info .info{}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info .artist_name,
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info .info h1,
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info .info p {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info .info h1 {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info .info p {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info .info .badge {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info .info .badge span {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info .info .badge span:first-child {}
#wrap main .coming_container .coming_right .coming_wrap .coming_swiper .swiper-wrapper .swiper-slide .item_info .info .badge span:last-child {}
#wrap main .coming_container .coming_right .coming_wrap .prev,
#wrap main .coming_container .coming_right .coming_wrap .next {position: absolute; top: 40%; background-image: url(../images/common/prev_next_b.svg);}
#wrap main .coming_container .coming_right .coming_wrap .prev {left: 16px;}
#wrap main .coming_container .coming_right .coming_wrap .next {right: 16px; transform: scale(-1);}
#wrap main .coming_container .coming_right .coming_wrap .prev svg,
#wrap main .coming_container .coming_right .coming_wrap .next svg {display: none;}
#wrap main .coming_container .coming_right .coming_wrap .page_scroll {
    position: absolute; width: 460px; height: 80px; z-index: 999;
    left: 50%; right: auto; top: auto; bottom: auto; transform: translateX(-50%);
    display: flex; align-items: center;
}
#wrap main .coming_container .coming_right .coming_wrap .page_scroll .page {
    display: flex; align-items: center; width: max-content;
    bottom: auto; left: auto; top: auto; right: 0;
    gap: 8px;
}
#wrap main .coming_container .coming_right .coming_wrap .page_scroll .page .swiper-pagination-current,
#wrap main .coming_container .coming_right .coming_wrap .page_scroll .page .swiper-pagination-total {font-weight: 600; font-size: 0.88rem;}
#wrap main .coming_container .coming_right .coming_wrap .page_scroll .page .swiper-pagination-current {color: #1C4797;}
#wrap main .coming_container .coming_right .coming_wrap .page_scroll .page span:nth-child(2) {display: inline-block; background-color:#aaa; width: 1px; height: 10px;}
#wrap main .coming_container .coming_right .coming_wrap .page_scroll .page .swiper-pagination-total {color: #aaa;}
#wrap main .coming_container .coming_right .coming_wrap .page_scroll .scroll {
    left: auto; right: auto; top: auto; bottom: auto;
    width: 400px; height:2px; background: #eee;
}
#wrap main .coming_container .coming_right .coming_wrap .page_scroll .scroll .swiper-scrollbar-drag {background: #1C4797;}
#wrap main .coming_container .coming_right .noti_btn {
    display: flex; flex-flow: column nowrap; align-items: center; gap: 24px;
}
#wrap main .coming_container .coming_right .noti_btn > p {
    display: inline-block; background-color: #F5F8FF; padding: 4px;
    font-size: 0.88rem; color: #555; width: 100%; text-align: center;
}
#wrap main .coming_container .coming_right .noti_btn .more_btn {}
#wrap main .coming_container .coming_right .noti_btn .more_btn a {
    display: flex; flex-flow: row nowrap;
    align-items: center; justify-content: space-between;
    height: 64px; width: 380px;
    padding: 10px 20px; border: 1px solid #ddd;
}
#wrap main .coming_container .coming_right .noti_btn .more_btn a .btn_txt {}
#wrap main .coming_container .coming_right .noti_btn .more_btn a .btn_txt img {}
/* ----------------------------------------------------------6. new */
#wrap main .new_container {
    width: 100%; 
    background-color: #1e1e1e; padding: 120px 80px;
}
#wrap main .new_container .contents {flex: auto; width: 100%;}
#wrap main .new_container .contents .title {
    display: flex; flex-flow: row nowrap;
    align-items: end; justify-content: space-between;
    margin-bottom: 80px;
}
#wrap main .new_container .contents .title .title_left {}
#wrap main .new_container .contents .title .title_left h1 {color: #fff;}
#wrap main .new_container .contents .title .title_left p {}
#wrap main .new_container .contents .add_btn:hover img {animation: add 1s ease}
@keyframes add {0% {rotate:0;} 100% {rotate:360deg;}}

#wrap main .new_container .contents .add_btn img {}
#wrap main .new_container .contents .new_wrap {position: relative; margin-bottom: 160px ; max-width: 1760px; width: 100%; margin: 0 auto;}
#wrap main .new_container .contents .new_wrap .new_swiper {margin-bottom: 40px;}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .slide1 {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .slide2 {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .slide3 {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .slide4 {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .slide5 {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .slide6 {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_list {
    margin-bottom: 20px; position: relative;
}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_list .item_img {display: block; }
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_list .item_img img {width: 100%;}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_list .like {position: absolute; top: 16px; right: 16px;}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_list .like img {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_list .badge {
    display: flex; flex-flow: row nowrap;
    position: absolute; left: 0; bottom: 3px;
}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_list .badge p {padding: 8px; color: #fff; font-weight: 500;}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_list .badge p:first-child {background-color: #000;}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_list .badge p:last-child {background-color: #1C4797;}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_info {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_info .artist_name {
    display: inline-block; 
    margin-bottom: 8px; color: #aaa; 
    font-weight: 700; font-size: 0.88em;
}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_info .info {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_info .info h1,
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_info .info .price {
    color: #fff; 
    font-weight: 600; font-size: 0.88em; 
    margin-bottom: 8px;
}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_info .info h1 {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_info .info .price {}
#wrap main .new_container .contents .new_wrap .new_swiper .swiper-wrapper .swiper-slide .item_info .info .price del {color: #555; font-size: 0.75rem;}
#wrap main .new_container .contents .new_wrap .page_scroll {
    position: absolute;
    left: 50%; right: auto; top: auto; bottom: auto;
    transform: translateX(-50%);
    width: 670px; height: 80px;
    display: flex; align-items: center;
}
#wrap main .new_container .contents .new_wrap .page_scroll .page {
    left: auto; right: 0; top: auto; bottom: auto;
    display: flex; width: max-content; gap: 8px; align-items: center;
}
#wrap main .new_container .contents .new_wrap .page_scroll .page .swiper-pagination-current,
#wrap main .new_container .contents .new_wrap .page_scroll .page .swiper-pagination-total {font-weight: 600; font-size: 0.88rem;}
#wrap main .new_container .contents .new_wrap .page_scroll .page .swiper-pagination-current {color: rgba(255,255,255,1);}
#wrap main .new_container .contents .new_wrap .page_scroll .page .swiper-pagination-total {color: rgba(255,255,255,0.6);}
#wrap main .new_container .contents .new_wrap .page_scroll .page span:nth-child(2) {display: inline-block; background-color: rgba(255,255,255,0.6); width: 1px; height: 10px;}
#wrap main .new_container .contents .new_wrap .page_scroll .scroll {
    left: 0; right: auto; top: auto; bottom: auto;
    background: rgba(255, 255, 255, 0.3);
    width: 600px; height: 2px;
}
#wrap main .new_container .contents .new_wrap .page_scroll .scroll .swiper-scrollbar-drag {background: rgba(255,255,255,1);}
/* -------------------------------------------------------------------------------- 7.product */
#wrap main .product {
    display: flex; flex-flow: row nowrap;
    padding: 160px 0 160px 80px; height: 100%;
    overflow: hidden;
}
#wrap main .product .product_left {}
#wrap main .product .product_left .contents_wrap {
    display: flex; flex-flow: column nowrap;
    gap: 40px;
}
#wrap main .product .product_left .contents_wrap .title {}
#wrap main .product .product_left .contents_wrap .title h1 {}
#wrap main .product .product_left .contents_wrap .title p {}
#wrap main .product .product_left .contents_wrap .tab_menu {}
#wrap main .product .product_left .contents_wrap .tab_menu li {}
#wrap main .product .product_left .contents_wrap .tab_menu li a {}
#wrap main .product .product_left .contents_wrap .tab_menu li a .tab {}
#wrap main .product .product_left .contents_wrap .tab_menu li .active {border-bottom: 1px solid #1C4797;}
#wrap main .product .product_left .contents_wrap .tab_menu li .active .tab {color: #1C4797;}
#wrap main .product .product_left .contents_wrap .tab_menu li .active img {display: block;}
#wrap main .product .product_left .tab_menu li a img {}
#wrap main .product .product_left .tab_menu li:first-child a img {}
#wrap main .product .product_left .more_btn {}
#wrap main .product .product_left .more_btn a {}
#wrap main .product .product_right {}
#wrap main .product .product_right .product_list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 40px 20px ;
}
#wrap main .product .product_right .product_list .list {}
#wrap main .product .product_right .product_list .list1 {}
#wrap main .product .product_right .product_list .list2 {}
#wrap main .product .product_right .product_list .list3 {}
#wrap main .product .product_right .product_list .list4 {}
#wrap main .product .product_right .product_list .list5 {}
#wrap main .product .product_right .product_list .list6 {}
#wrap main .product .product_right .product_list .list7 {}
#wrap main .product .product_right .product_list .list8 {}
#wrap main .product .product_right .product_list .list .item_list{margin-bottom: 20px;}
#wrap main .product .product_right .product_list .list .item_list .item_img {
    display: block;
    width: 100%; position: relative;
    background-size: cover;
}
#wrap main .product .product_right .product_list .list .item_list .item_img img {width: 100%}
#wrap main .product .product_right .product_list .list .item_list .like {
    position: absolute; top: 16px; right: 16px;
}
#wrap main .product .product_right .product_list .list .item_list .like img {}
#wrap main .product .product_right .product_list .list .item_info {}
#wrap main .product .product_right .product_list .list .item_info .artist_name {display: block; font-weight: 700; color: #555;}
#wrap main .product .product_right .product_list .list .item_info .info {}
#wrap main .product .product_right .product_list .list .item_info .artist_name,
#wrap main .product .product_right .product_list .list .item_info .info h1,
#wrap main .product .product_right .product_list .list .item_info .info .price {font-size: 0.88rem; margin-bottom: 8px; font-weight: 600;}
#wrap main .product .product_right .product_list .list .item_info .info h1 {color: #555;}
#wrap main .product .product_right .product_list .list .item_info .info .price {}
#wrap main .product .product_right .product_list .list .item_info .info .badge {}
#wrap main .product .product_right .product_list .list .item_info .info .badge span{
    display: inline-block; padding: 4px;
    font-size: 0.88rem; font-size: 0.69rem;
    color: #fff; background-color: #1e1e1e;
}
#wrap main .product .product_right .product_list .list .item_info .info .badge span:last-child {background-color: #1C4797; margin-left: 8px;}
/* -------------------------------------------------------------------------------------------------------------8.add_bnr_pay */
#wrap main .add_bnr_pay {
    height: 200px; width: 100%;
    background-image: url(../images/product/add_bnr_02.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}
#wrap main .add_bnr_pay .add_contents {
    display: block;
    position: absolute;
    left: 50%; top: 50%; transform: translate(-50%, -50%);
    text-align: center;
    width: 100%;
}
#wrap main .add_bnr_pay .add_contents .logo {margin-bottom: 16px;}
#wrap main .add_bnr_pay .add_contents .logo img {}
#wrap main .add_bnr_pay .add_contents h1 {
    color: #fff; font-size: 2.50rem; font-weight: 600; margin-bottom: 16px;
}
#wrap main .add_bnr_pay .add_contents h1 br {display: none;}
#wrap main .add_bnr_pay .add_contents p {
    color: rgba(255,255,255,0.6);
    font-weight: 600; font-size: 1.13rem;
    text-decoration: underline;
}
/* -------------------------------------------------------------------------- 9. md pick */
#wrap main .mdpick {
    display: flex; flex-flow: row nowrap;
    padding: 160px 0 160px 80px; 
    width: 100%;
}
#wrap main .mdpick .mdpick_left {}
#wrap main .mdpick .mdpick_left .contents_wrap {
    display: flex; flex-flow: column nowrap; justify-content: space-between; height: 100%;
}
#wrap main .mdpick .mdpick_left .contents_wrap .title {}
#wrap main .mdpick .mdpick_left .contents_wrap .title h1 {}
#wrap main .mdpick .mdpick_left .contents_wrap .title p {}
#wrap main .mdpick .mdpick_left .contents_wrap .tab_menu {}
#wrap main .mdpick .mdpick_left .contents_wrap .tab_menu li {}
#wrap main .mdpick .mdpick_left .contents_wrap .tab_menu li a {width: 100%;}
#wrap main .mdpick .mdpick_left .contents_wrap .tab_menu li a .tab {}
#wrap main .mdpick .mdpick_left .contents_wrap .tab_menu li .active {border-bottom: 1px solid #1C4797;}
#wrap main .mdpick .mdpick_left .contents_wrap .tab_menu li .active .tab {color: #1C4797;}
#wrap main .mdpick .mdpick_left .contents_wrap .tab_menu li .active img {display: block;}
#wrap main .mdpick .mdpick_left .more_btn {}
#wrap main .mdpick .mdpick_left .more_btn a {}
#wrap main .mdpick .mdpick_left .more_btn .tab {}
#wrap main .mdpick .mdpick_left .more_btn .tab img {}
#wrap main .mdpick .mdpick_right {flex: 1; min-width: 0;}
#wrap main .mdpick .mdpick_right .mdpick_swiper {display: none;}
#wrap main .mdpick .mdpick_right .active {display: block;}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_list {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_list .item_img {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_list .item_img img {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_list .like {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_list .like img {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .slide1 {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .slide2 {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .slide3 {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .slide4 {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .slide5 {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .slide6 {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_info {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_info .artist_name {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_info .artist_name,
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_info .info h1,
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_info .info .price {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_info .info {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_info .info h1 {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_info .info p {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_info .info .price {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_info .info .badge {}
#wrap main .mdpick .mdpick_right .mdpick_swiper .swiper-wrapper .swiper-slide .item_info .info .badge span {
}
/* -------------------------------------------------------------------------------------10.event */
#wrap main .event {width: 100%;}
#wrap main .event .contents {flex: 1;}
#wrap main .event .contents .title {
    padding: 0 80px 80px;
    display: flex; flex-flow: row nowrap;
    justify-content: space-between; align-items: end;
    margin:0;
}
#wrap main .event .contents .title .title_left h1 {}
#wrap main .event .contents .title .title_left p {}
#wrap main .event .contents .add_btn {}
#wrap main .event .contents .add_btn img {}
#wrap main .event .contents .event_swiper {
    display: flex; flex-flow: row nowrap; height: 960px; width: 100%;
}
#wrap main .event .contents .event_swiper swiper-wrapper {}
#wrap main .event .contents .event_swiper swiper-wrapper > a {}
#wrap main .event .contents .event_swiper .slide1 {background-image: url(../images/product/event_2.jpg);}
#wrap main .event .contents .event_swiper .slide2 {background-image: url(../images/product/event_1.jpg);}
#wrap main .event .contents .event_swiper .slide3 {background-image: url(../images/product/event_3.jpg);}
#wrap main .event .contents .event_swiper .slide2 > a * {color: #fff;}
#wrap main .event .contents .event_swiper .swiper-slide {background-repeat: no-repeat; background-size: cover;text-align: center;padding-top: 80px;} 
#wrap main .event .contents .event_swiper .swiper-slide a { }
#wrap main .event .contents .event_swiper .swiper-slide a p {}
#wrap main .event .contents .event_swiper .swiper-slide a img {}
#wrap main .event .contents .event_swiper .slide3 a > img {width: 200px; margin: 16px 0;}
#wrap main .event .contents .event_swiper .swiper-slide a h1 {font-size: 2.50rem; font-weight: 600; margin-bottom: 20px;}
#wrap main .event .contents .event_swiper .swiper-slide a .more_btn {
    display: flex; flex-flow: row nowrap;
    justify-content: space-between; align-items: center;
    border: 1px solid #1e1e1e; padding: 10px;
    width: 120px; height: 40px; margin: 0 auto;
}
#wrap main .event .contents .event_swiper .slide2 a .more_btn {border: 1px solid #fff;}
#wrap main .event .contents .event_swiper .swiper-slide a .more_btn span {line-height: 40px;}
#wrap main .event .contents .event_swiper .swiper-slide a .more_btn img {}
/* -------------------------------------------------------------------------------------------footer */
#wrap footer {
    padding: 80px; background-color: #1e1e1e;
    display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: start;
    position: relative; width: 100vw;
}
#wrap footer * {color: #fff;}
#wrap footer .footer_left {}
#wrap footer .footer_left .fnb {margin-bottom: 20px;}
#wrap footer .footer_left .fnb a {font-size: 0.88rem; font-weight: 600; margin-right: 20px;}
#wrap footer .footer_left .brand_info {}
#wrap footer .footer_left .brand_info p {margin-bottom: 20px;}
#wrap footer .footer_left .brand_info p span {font-weight: 600;}
#wrap footer .footer_left .brand_info address {font-size: 0.88rem; line-height: 1.6;}
#wrap footer .footer_left .brand_info address span {font-weight: 600;}
#wrap footer .footer_right {}
#wrap footer .footer_right .family_site {}
#wrap footer .footer_right .family_site > a {
    width: 140px; height: 32px;
    display: flex; flex-flow: row nowrap; align-items: center; justify-content: space-between;
    padding: 8px 8px; border: 1px solid #fff; text-align: center; font-size: 0.88rem;
}
#wrap footer .footer_right .family_site > a span {margin-right: 8px;}
#wrap footer .footer_right .family_site .depth_1 {display: none;}
#wrap footer .footer_right .family_site .depth_1 li {}
#wrap footer .footer_right .family_site .depth_1 li a {
    width: 140px; height: 32px;
    text-align: center; display: inline-block;font-size: 0.88rem;
    padding: 8px 8px; text-align: center; background-color: #555; 
}
#wrap footer .footer_right .logo {position: absolute; bottom: 80px; right: 80px;}
#wrap footer .footer_right .logo img {width: 100%;}