@charset "utf-8";

img {border: 0px;}
h1,h2,h3,h4,h5,h6,p,button{padding: 0; margin: 0; border: 0;}
ul,ol,li{list-style:none; margin: 0; padding: 0;}

.music_dvd_main_wrap {width: 1030px; margin: 15px auto 70px auto; position: relative;}
.music_dvd_main_wrap h3 {font-size: 22px; color: #333; letter-spacing: -0.5px; font-family: 'Noto Sans KR', sans-serif; line-height: 1.4; margin-bottom: 15px;}
.music_dvd_main_wrap h3 > a {color: #000;}
.music_dvd_main_wrap h3 > a:hover {text-decoration: none; color: #000;}
.music_dvd_main_wrap h3 > a::after {content: ''; display: inline-block; width: 7px; height: 15px;  background: url(//image.aladin.co.kr/img/welcome/arrow-right.svg) no-repeat center / 7px auto; margin-left: 10px;}
.main_top_section {display: flex; gap: 35px; align-items: flex-start; margin-bottom: 50px;}
.main_top_section .left_menu_box {width: 190px; padding: 10px 0 20px 0; border-bottom: 1px solid #f1f1f1; font-family: 'Noto Sans KR', sans-serif;}
.main_top_section .left_menu_box > div .tit {font-size: 15px; font-weight: bold; margin-bottom: 5px;}
.main_top_section .left_menu_box > div ~ div {margin-top: 25px;}
.main_top_section .left_menu_box ul.menu > li {position: relative;}
.main_top_section .left_menu_box ul.menu > li > a {display: block; font-size: 15px; padding: 4.5px 0; color: #333;}
.main_top_section .left_menu_box ul.menu > li > a:hover {color: #333;}
.main_top_section .left_menu_box .left_menu_layer {width: 238px; padding: 10px; background-color: #fff; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.1); border: solid 1px rgba(0, 0, 0, 0.5); position: absolute; left: 95px; top: 0; z-index: 10; box-sizing: border-box; display: none; z-index: 20;}
.main_top_section .left_menu_box .left_menu_layer ul li a {display: block; padding: 4px 0; font-size: 13px; color: #333;}
.main_top_section .left_menu_box .left_menu_layer ul li a:hover {background-color: #f8f9fa; text-decoration: none; color: #333;}

.main_top_section .right_box {width: 805px;}
.main_top_section .right_box .main_slide_banner { border-radius: 6px;}
.main_top_section .right_box .main_slide_banner ~ .main_top_book {margin-top: 35px;}
.main_top_section .right_box .main_slide_banner .swiper-slide a {display: block;}
.main_top_section .right_box .main_slide_banner .swiper-slide a img {display: block;}
.main_top_section .right_box .main_slide_banner .swiper-slide a:focus {outline-offset: -5px;}
.main_top_section .right_box .main_slide_banner .swiper-button-next, .main_top_section .right_box .main_slide_banner .swiper-button-prev {color: #fff; --swiper-navigation-size: 32px; opacity: 0;}
.main_top_section .right_box .main_slide_banner:hover .swiper-button-next, .main_top_section .right_box .main_slide_banner:hover .swiper-button-prev {opacity: 1;}
.main_top_section .right_box .main_slide_banner .swiper-button-next:focus, .main_top_section .right_box .main_slide_banner .swiper-button-prev:focus {opacity: 1;} 
.main_top_section .right_box .main_slide_banner .swiper-button-next {right: 15px;}
.main_top_section .right_box .main_slide_banner .swiper-button-prev {left: 15px;}
.main_top_section .right_box .main_slide_banner .swiper-pagination {display: inline-block; width: auto; position: absolute; bottom: auto; left: auto; right: 38px; top: 10px; color: #fff;}
.main_top_section .right_box .main_slide_banner .swiper-pagination .swiper-pagination-current {font-weight: bold;}
.main_top_section .right_box .main_slide_banner .swiper_pause_btn {width: 27px; height: 27px; font-size: 0; background: url("//image.aladin.co.kr/img/main/img_dvd/i-stop.png") no-repeat center; position: absolute; right: 10px; top: 6px; z-index: 10;}
.main_top_section .right_box .main_slide_banner .swiper_pause_btn.stop {background: url("//image.aladin.co.kr/img/main/img_dvd/i-play.png") no-repeat center;}
.main_top_book {position: relative;}
.main_section {position: relative; margin-bottom: 60px;}

.white_circle_next, .white_circle_prev {width: 40px; height: 40px; box-shadow: 0px 3px 6px #0000000F; border: 1px solid #E9E9E9; border-radius: 50%; position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; cursor: pointer; background-color: #fff;}
.white_circle_next {right: -20px;}
.white_circle_prev {left: -20px;}
.white_circle_next::after,.white_circle_prev::after {position: absolute; left: 0; right: 0; top: 0; bottom: 0; opacity: 0.6;}
.white_circle_next:hover:after,.white_circle_prev:hover::after {opacity: 1;}
.white_circle_next::after {content: ''; background: url(//image.aladin.co.kr/img/welcome/arrow-right.svg) no-repeat center / 8px 14px;}
.white_circle_prev::after {content: ''; background: url(//image.aladin.co.kr/img/welcome/arrow-left.svg) no-repeat center / 8px 14px;}
.white_circle_prev.loop {opacity: 0;}
.white_circle_prev.active {opacity: 1;}

.dvd_list_type .swiper-wrapper {align-items: flex-end; height: auto;}
.dvd_list_type .swiper-slide {width: 170px;}
.dvd_list_type ul {display: flex; flex-wrap: wrap; align-items: flex-end; height: auto; gap: 40px;}
.dvd_list_type ul li {width: 170px;}
.dvd_list_type a {color: #333; display: block;}
.dvd_list_type a:hover {text-decoration: none; color: #333;}
.dvd_list_type a:hover .tit {text-decoration: underline;}
.dvd_list_type .cover {margin-bottom: 10px;}
.dvd_list_type .text.type1 {height: 72px;}
.dvd_list_type .text .tit {max-height: 46px; font-size: 15px; font-weight: bold; box-sizing: border-box; letter-spacing: -0.5px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow:hidden; line-height: 1.4;}
.dvd_list_type .text .sub {height: 23px; font-size: 15px; color: #3b499f; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow:hidden; margin-top: 10px;}
.dvd_list_type .text .price {font-size: 16px; color: #333; font-weight: bold; margin-top: 10px;}
.dvd_list_type .text .price .discount {color: #dd2483;}

.music_list_type .swiper-wrapper {align-items: flex-end; height: auto;}
.music_list_type .swiper-slide {width: 227px;}
.music_list_type ul {display: flex; flex-wrap: wrap; align-items: flex-end; height: auto; gap: 40px;}
.music_list_type ul li {width: 227px;}
.music_list_type a {color: #333; display: block;}
.music_list_type a:hover {text-decoration: none; color: #333;}
.music_list_type a:hover .tit {text-decoration: underline;}
.music_list_type .cover {margin-bottom: 10px;}
.music_list_type .text.type1 {height: 72px;}
.music_list_type .text.type2 {height: 42px;}
.music_list_type .text .tit {max-height: 46px; font-size: 15px; font-weight: bold; box-sizing: border-box; letter-spacing: -0.5px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow:hidden; line-height: 1.4;}
.music_list_type .text .sub {height: 23px; font-size: 15px; color: #3b499f; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow:hidden; margin-top: 10px;}

/* dvd 작은배너 */
.main_small_banner {display: flex; gap: 20px; margin-bottom: 60px;}
.main_small_banner a {display: block; height: 115px; border-radius: 58px; overflow: hidden;}
.main_small_banner a img {height: 100%;}

/* 탭 */
.main_tab_box {display: flex; gap: 10px; margin-bottom: 25px;}
.main_tab_box button[role="tab"] {min-width: 100px; height: 50px; line-height: 48px; border-radius: 25px; border: 1px solid #ddd; background-color: #fff; padding: 0 18px; box-sizing: border-box; font-family: 'Noto Sans KR', sans-serif; font-size: 17px; cursor: pointer;}
.main_tab_box button[role="tab"][aria-selected="true"] {background-color: #000; color: #fff; font-weight: bold; border: 1px solid #000;}
[role="tabpanel"].is-hidden {display: none;}

/* 음반 배너 */
.music_banner_area {display: flex; gap: 20px; margin-bottom: 60px;}
.music_banner_area .hotone_box {display: flex; gap: 20px;}
.music_banner_area .hotone_box .hotone_bn a {display: flex; justify-content: space-between; width: 370px; height: 130px; border-radius: 6px; background-color: #f0f2f5; font-family: 'Noto Sans KR', sans-serif; padding: 15px 15px 15px 24px; box-sizing: border-box; color: #333;}
.music_banner_area .hotone_box .hotone_bn a:hover {text-decoration: none;}
.music_banner_area .hotone_box .hotone_bn a .txt {padding: 10px 0;}
.music_banner_area .hotone_box .hotone_bn a .txt .txt1 {font-size: 17px; font-weight: bold; line-height: 1.4; margin-bottom: 4px;}
.music_banner_area .hotone_box .hotone_bn a .txt .txt2 {font-size: 15px; font-weight: bold; color: #dd2483; line-height: 1.4;}
.music_banner_area .hotone_box .hotone_bn a .cover {width: 100px; height: 100px; border-radius: 50%; overflow: hidden; flex-shrink: 0; margin-left: 10px;}
.music_banner_area .hotone_box .hotone_bn a .cover img {width: 100%;}
.music_banner_area .usedshop_bn {border-radius: 6px; overflow: hidden;}
.music_banner_area .usedshop_bn a {display: block;}
.music_banner_area .usedshop_bn a img {display: block;}