@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+KR:wght@300;400&family=Nanum+Gothic+Coding&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Mukta:wght@200;800&display=swap');

.inner_itemDetail > div {                
    /* 좌측 정보 전체 박스 위치 */
    float:left;
}

#left_itemDetail {
    /*좌상 박스 전체 크기 설정 (폭) */
    width:602px;
    margin-right:5px;/*박스 오른쪽 공간 5px 띄우기*/
}    

.maininfo_header {    
    /*좌상 박스 헤더 : <제품 기본정보> */   
    margin-bottom:5px;     
    font-size: 15px;
    color: gray;   
    line-height:40px;
    text-indent:10px;      
    background:white;
    border:1px solid #eae9e9;
    box-shadow: 0px 0px 2px #eae9e9;
    overflow:hidden;
}

.leftBox {         
    /*좌상 박스 헤더 하단 정보 : <제품 기본정보> */
    margin-bottom:5px;    
    border:1px solid #eae9e9;
    box-shadow: 0px 0px 2px #eae9e9;
    overflow:hidden;
    background:white;
}

/* 제품 아트워크 이미지 설정 */

.coverArt, 
.coverArt_w, 
.coverArt_l {
    /* 제품 이미지 설정 (공통) */
    float:left;
    position:relative;
    width:200px;
    height:200px;
    margin:9px 9px 5px 9px;    
    overflow:hidden;
}

.coverArt {
    /*일반*/
    width:200px;
    height:200px;
    box-shadow: 1px 1px 3px 1px darkgray;
}

.coverArt_w {    
    /*와이드*/
    width:200px;
    height:180px;
    box-shadow: 1px 1px 3px 1px darkgray;
}

.coverArt_l {
    /* DVD 및 박스셋 */
    width:200px;
    height:200px;        
    border:0;
}

.coverArt img,
.coverArt_l img
 {
    width: 200px;
    height: 200px;
}
.coverArt_w img {
    width: 200px;
    height: 180px;
}

/* 이미지 하단 <Extra image> 버튼 */

.imageSelector {        
    float:left;
    position:relative;
    width:200px;
    height:30px;                
    line-height:30px;
    margin-left: 10px;
    text-align:center;    
}

/* <Extra image> 설정 */

#extra_image {
    font-size:10px;
    font-family :'Century Gothic', Verdana, 'Nanum Gothic', sans-serif;    
    cursor:pointer;
    letter-spacing: 1px;
    color: rgba(65, 64, 66, 0.7);
}
    #extra_image:hover {
        color: rgba(65, 64, 66, 1);
    }

/* <제품 기본정보> : 세부 텍스트 */

.mainInfo {        
    /* 이미지 오른쪽 박스 : 290px + 보더 2px*/
    position:relative;    
    float:right;
    width:370px;
    min-height:300px;
    padding:5px 0px 10px 0;                  
    margin-right: 0px;
    overflow:hidden;
}

.item_title {
    /* 상품 타이틀 1*/
    font-size:17px;
    padding-bottom:5px;
}

.item_title2 {
    /* 상품 타이틀 2 (글자수 많을 때)*/
    font-size:16px;    
    padding-bottom:5px;            
    margin-top:3px;
}

.artist_name {
    /*아티스트 이름 */
    position:relative;
    font-size:14px;
    color:gray;   
    top:1px;
    font-family: 'Nanum Gothic', 'Malgun Gothic', sans-serif;
}

.artist_item {
    /* 아티스트 페이지 (링크) */
    position:relative;
    top:2px;   
    display:inline-block;
    padding: 5px 0 2px 0;     
    font-size:13px;        
    cursor:pointer;            
}
    .artist_item:hover {
        text-decoration:underline;        
    }
  
.mainInfo .mainInfo_sub {        
    /*아티스트 이름 박스*/
    margin-bottom:10px;
}

.mainInfo .mainInfo_content {
    /*전체 세부 콘텐츠 정보 박스*/
    width:370px;
    margin-bottom:15px;
    min-height:130px;  
} 

.mainInfo_content ._left {
    /*제품 상제 정보 : Label, release 등 (왼쪽)*/
    display:inline-block;
    width: 60px;
    height: 24px;
    line-height: 24px;
    padding:0px 2px;
    border-bottom:1px dotted #e6e2e2;
    letter-spacing: 1px;    
    color: gray;
    font-size: 11.5px;
}

.mainInfo_content ._right {
    /*제품 상제 정보 : Label, release 등 (오른쪽)*/
    display:inline-block;
    width: 280px;
    height: 24px;
    line-height: 24px;
    padding: 0px 2px;
    border-bottom:1px dotted #e6e2e2;
    letter-spacing: 0.75px;
    font-size: 11.5px;
}

.mainInfo_content .list_maker {
    cursor:pointer;
}
    .mainInfo_content .list_maker:hover {
        color:red;
    }

/* 각종 버튼/링크 설정 */

.mainInfo .mainInfo_button {
    /* 구매 위시리스트 버튼 입력 공간*/
    padding:0;
    margin:0;    
}

.item_condition {
     /* 제품상태 물음표 */
    cursor:help;
}
    .item_condition:hover{
        color: red;
    }

.event_check{
    /*이벤트 제품 체크*/
    color:steelblue;
    font-weight:bold;
}

#condition_popup {
    /* 상태 팝업창 설정 */
    display: none;
    position: absolute;
    top: 120px;
    right: 10px;
    text-shadow: none;        
    background: white;
    width: 450px;
    box-shadow: 1px 1px 6px 1px lightgray;            
    border-radius:3px;
    z-index: 9999;
}
    #condition_popup > div {
        padding: 4px 10px;
    }
    #condition_popup > div:first-child {
        border-radius:3px 5px 0 0;
        background:slategray;
        padding: 7px 10px;
        font-size: 13px;        
        color:white;         
    }
        #condition_popup > div > span:first-child {
            display:inline-block;
            font-size:12px;
            font-family:Verdana,Tahoma,'Century Gothic';
        }
        #condition_popup > div.description > div {
            padding:5px 0;
        }

.self_close, #self_close {    
    /*팝업창 닫기 버튼*/
    display: inline-block;  
    position:absolute;
    float:right;
    right:5px;
    top:5px;
    cursor:pointer;
    background-image:url("/img/icon/close.png");
    background-repeat: no-repeat;
    width:20px;
    height:20px;
}

#dispatch_popup {
    /* 발송 관련 팝업 레이어 */
    display: none;
    position: absolute;
    top: 190px;
    right: 120px;
    text-shadow: none;    
    width: 400px;
    background: white;
    box-shadow: 1px 1px 6px 1px lightgray;            
    border-radius:3px;
    z-index: 9999;
}
    #dispatch_popup > div {
        padding: 4px 10px;
    }
    #dispatch_popup > div:first-child {
        border-radius:3px 3px 0 0;
        background:slategray;
        padding: 7px 10px;
        font-size: 13px;
        color:white;    
    }
    #dispatch_popup > div > span:first-child {
        display:inline-block;
        width:100px;                
        font-size:12px;
        font-family:Verdana,Tahoma,'Century Gothic';
    }
    #dispatch_popup > div > p {            
        padding:5px 0;
    }
        #dispatch_popup > div > p:first-child {
            border-top:0;
        }

#popup_msg {
    /*팝업창 - 텍스트*/
    position: relative;
    top:-2px;
    text-align:right;
    color:white;
}

#popup_check {
    /* 팝업창 - 체크박스 */
    position:relative;
    top:3px;
}

 
/* 2 Tracks 정보 */

.header_track {
    /* 섹션 타이틀 : 트랙 */     
     line-height:30px;
     text-indent:10px;          
     color:white;    
     font-size:13px;
     font-family: 'Century Gothic', 'Nanum Gothic', sans-serif;
     letter-spacing:1px;
     box-shadow:0px 0px 1px gray;
     background: gray;
}

.trackList {      
    /*섹션 콘텐츠 : 트랙리스트*/
    width:570px;
    height:520px;
    padding:5px 15px;
    margin-right:5px;
    margin-bottom:5px;
    text-transform:capitalize;
    font-size: 12px;
    font-family: 'Century Gothic', 'Malgun Gothic', sans-serif;
    line-height: 1.7em;
    border:1px solid #eae9e9;
    box-shadow: 0px 0px 2px #eae9e9;
    overflow:auto;
    background:white;
}
    .trackList b {    
        text-transform: uppercase;
        margin-bottom: 3px;
    }

/* 3 앨범 리뷰 */

.header_review {    
    /* 섹션 타이틀 : 리뷰 */     
     line-height:30px;
     text-indent:10px;
     box-shadow:1px 1px 2px gray;
     color:white;     
     letter-spacing:1px;
     font-size:13px;
     font-family: 'Century Gothic', sans-serif;
     letter-spacing:1px;
     box-shadow:0px 0px 1px gray;
     background: gray;     
}

.itemReview {                
    /*섹션 콘텐츠 : 리뷰*/
    width:570px;
    height:609px; 
    padding:5px 15px;        
    margin-right:3px;   
    margin-bottom:5px;        
    overflow:auto;                    
    text-align:justify;       
    line-height:1.8em;    
    font-size: 13px;        
    border:1px solid #eae9e9;
    box-shadow: 0px 0px 2px #eae9e9;
    background:white;
}  

.cus_review {
    /* 이 음반의 첫번째... 메시지 */
    position:relative;       
    width:100%;        
    height:30px;
    line-height:30px;
    padding: 5px 0px;          
    border-bottom:3px solid lightgray;          
    font-size: 13px;    
}

.recom_btn, .recom_done {
    /* 추천 버튼 */
    display: inline-block;
    position: relative;
    float:right;
    left:-10px;        
    height:30px;
    line-height:30px;
    text-align:center;                
    margin:0;        
    cursor:pointer;
    font-size:12px;
}
    .recom_btn:hover {            
        color:yellow;
    }

.recom_done {
    /* 이미 추천됨 */    
    color:lightblue;
    cursor:default;
}

/*구매 버튼, 위시리스트 버튼, 솔드아웃 버튼, */

.buyButton, 
.buyButton_b,
.wishlistButton, 
.soldoutButton, 
._wl_btn,
._wl_btn_b,
.in_cart {
    clear:both;
    display:inline-block;
    position:relative;
    margin-left:0px;
    width:170px;
    height:50px;
    background:red;
    transition: background-color 0.5s ease-in-out;
    box-shadow: 0px 0px 2px #888888;
    border-radius: 4px;
    color:white;
    text-align:center;
    font-family: 'Century Gothic', 'Malgun Gothic', Tahoma, sans-serif;
    letter-spacing:1px;
    cursor:pointer;
    line-height:50px;
}
    .buyButton_b:hover,
    .buyButton:hover {
        background:orange;
    }
.wishlistButton, 
._wl_btn_b,
._wl_btn {     
    background:midnightblue;
}
    .wishlistButton:hover,     
    ._wl_btn_b:hover,
    ._wl_btn:hover{
        background:steelblue;
    }

.soldoutButton {
    cursor:default;
    background:gray;
}

.in_cart{
    background:green;
}
.in_cart:hover{
    background:darkgreen;
}

/* 각종 버튼/링크 설정 (끝) */

.event_box {
    /*이벤트 박스*/
    display: inline-block;
    position:absolute;
    bottom:10px;
    right:10px;
    width:50px;                
    padding:3px;
    text-align:center;
    border-right:1px solid crimson;
    border-bottom:1px solid crimson;
    background:#5559a0;
    color: white;        
    font-size: 11px;
    font-family: Verdana, 'Century Gothic', Tahoma, 'Malgun Gothic', 'Nanum Gothic', sans-serif ;
    z-index:99;                  
    cursor:pointer;
}






.dvd_info {
    /*추가 DVD 정보 */
    display:inline-block;
    width:98%;
    padding:2px 5px;
    margin:0 auto;
    margin-bottom:5px;
    border-bottom:1px solid lightgray;                   
    letter-spacing:1px;                   
    color:gray;
    text-transform: uppercase;
    font-size: 12px !important;
}

.add_fav {
    display:none;
}

.msg_box {
    position:absolute;
    bottom: 10px;
    left: 5px;
    padding: 3px;
    width: 96%;
    color:gray;
}

.msg_importNotice {
    position: relative;    
    left:10px;
    bottom:25px;
    font-size:12px;
    display:inline-block;        
    padding: 5px;    
    width: 190px;
    height:30px;
    text-align:justify;    
    color:black;
    background:white;    
}

.tag_box{  
    display: inline-block;
    width:100%;     
    color: gray;
    border-bottom: 1px solid lightgray;
    letter-spacing: 1px;
    padding: 5px 0;
    padding-left: 5px;    
    margin-bottom: 5px;
    font-size: 11px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 
    font-weight: bold;
}

.tag_box2{  
    color: white;
    letter-spacing: 1px;
    padding: 1px 2px 1px 3px;
    font-size: 10px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; 
    font-weight: bold;
    background: orange;
    border-radius: 2px;
}

/*컬렉터스 아이템*/
.collectorsItem1 {
    /*일반 커버*/
    clear: both;
    position: absolute;
    height: 20px;
    width: 220px;
    text-align: center;    
    top:234px;
    left: 0;
}
.collectorsItem2 {
    /*넓은 커버*/
    clear: both;
    position: absolute;
    height: 20px;
    width: 220px;
    text-align: center;    
    top:214px;
}

.collector {
    display: inline-block;
    width: 200px;
    height: 24px;
    line-height: 24px;
    background:crimson;
    opacity:0.8;
    color:white;
    font-size: 10px;
    font-family: Tahoma, 'Malgun Gothic', Verdana, 'Century Gothic', sans-serif;
    text-align: center;
    letter-spacing: 2px;
}

.cart_check{
    display:inline-block;
    position:absolute;
    width:169px; 
    bottom:12px;
    text-align: center;
    font-size: 10px;
    letter-spacing: 2px;
    color: yellow;
}

.cart_check > img{
    position:relative;
    top:3px;    
    height:14px;
}

/* 기타 : 상품 데코레이션 */

.ribbon_top1 {
    /*히트 상품*/
    position:absolute;
    left:5px;
    top:50px;
    z-index:9;
    width:60px;
    height:60px;
    background:url('/img/icon/icon_top.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;        
}

.ribbon_top2 {
    /*히트 상품*/
    position:absolute;
    left:20px;
    top:50px;
    z-index:9;
    width:60px;
    height:60px;
    background:url('/img/icon/icon_top.png');
    background-size: cover;        
}

.ribbon_hit1 {
    /*히트 상품*/
    position:absolute;
    left:5px;
    top:50px;
    z-index:9;
    width:60px;
    height:60px;
    background:url('/img/icon/icon_best.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;        
}

.ribbon_hit2 {
    /*히트 상품*/
    position:absolute;
    left:20px;
    top:50px;
    z-index:9;
    width:60px;
    height:60px;
    background:url('/img/icon/icon_best.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;        
}

.ribbon_sale1 {
    /*세일 상품*/
    position:absolute;
    left:6px;
    top:51px;
    z-index:9;
    width:70px;
    height:70px;
    background:url('/img/icon/ribbon_sale_left_top.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;        
}

.ribbon_sale2 {
    /*세일 상품*/
    position:absolute;
    left:26px;
    top:51px;
    z-index:9;
    width:70px;
    height:70px;
    background:url('/img/icon/ribbon_sale_left_top.png');
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;        
}

.ribbon_master1 {
    /*히트 상품*/
    position:absolute;
    left:300px;
    top:50px;
    z-index:9;
    width:70px;
    height:52px;
    background:url('/img/icon_master.png');
    background-size: cover;        
}


.item_level{
    background:crimson;
    color:white;
    padding:2px 2px 2px 4px;
    font-size:10px;
    font-family: Tahoma, 'Malgun Gothic', Verdana, 'Century Gothic', sans-serif;
    letter-spacing:1px;
    text-transform:uppercase;

    background: red;
}
.txt_gray{
    color:gray;
    font-size:12px;
}

.sub_title{
    color:white;
    font-size:10px;
    font-family: 'Malgun Gothic', Verdana, 'Century Gothic', sans-serif;
    letter-spacing: 2px;
    text-transform:uppercase;
    /* background:darkgray;
    color:white; */
    padding:2px 3px 3px 4px;
}

.content_font{
    margin-top:10px;        
    font-family: 'IBM Plex Sans KR', 'Nanum Gothic', sans-serif;    
}

.content_font > span {
    /*위 아래 줄*/
    display: inline-block;
    padding: 0px 2px 0px 3px;
    border-top: 1px solid gray;
    border-bottom: 1px solid gray;
    margin-bottom: 10px;    
    color: gray;
    letter-spacing: 1.5px;    
}

._sale {
    position: relative;            
    bottom:1px;
    font-size:9px;
    font-family: 'IBM Plex Sans KR', 'Nanum Gothic', sans-serif;    
    color:white;
    padding:1px 3px 2px 3px;
    border-radius: 2px;
    background:crimson;
}
.sale_note1 {
    /*이벤트배너*/
    position: absolute;
    bottom:5px;
}
.btn_zoom{
    display:inline-block;
    position:absolute;
    right:5px;
    top:5px;
    padding: 0;
    margin:0;
    font-size: 12px;
    cursor: pointer;
}

.cur_stock{    
    background: darkgray;
    color:white;
    font-weight: normal;
    font-size: 11px;
    padding: 1px 3px;
    border-radius: 2px;
}

.maininfo_header {
    font-size: 14px;
}

.maininfo_header > span {
    display:inline-block;
    position:relative;
    bottom: 1px;
    right:8px;    
    letter-spacing:2px;
    text-transform:uppercase;    
    font-family: 'IBM Plex Sans KR', 'Nanum Gothic', sans-serif;    
}

.import_msg {
    font-size:12px;
    background:orangered;
    color:white;
    padding: 2px 4px 2px 3px;
    margin-top:5px;
    line-height: 20px;
    border-radius: 2px;    
}

/*추가, 이동 (2023. 06. 02 from 출처 : _ItemDetail_ins.asp, Line 1070) */

    .add-cart-popup,
    .add-wl-popup{
        /*모달 박스 */
        display: none;
        position:fixed;
        top:40%;
        left:40%;
        padding: 20px 30px !important;        
        border-radius: 5px;
        box-shadow: 1px 1px 3px 1px #0000004f;
        color: white;
        font-size: 12px;
        font-weight: normal !important;
        font-family:'Malgun Gothic', 'Century Gothic', Tahoma, sans-serif;
        line-height: 2em;
        letter-spacing: 1px;
        z-index: 99999;
    }
    .add-cart-popup div span, 
    .add-wl-popup div span {
        /*모달 박스 내 버튼 */
        position: relative;
        display: inline-block;
        width:100px;
        border: 1px solid #b3a9a98c;
        border-radius: 3px;
        padding:2px 0;
        margin: 10px 5px 5px 0;
        text-align: center;
        cursor: pointer;
        transition: background-color 0.5s ease-in-out;
    }

    .add-wl-popup div span {
        /*모달 박스 내 버튼 */
        background: rgba(30, 50, 80, 0.85);
    }
    

    .add-cart-popup div span:hover,
    .add-wl-popup div span:hover{
        border: 1px solid #d3d3d38c;
        background:transparent !important;
    }

    #mask {  
        display:none;
        background: #000;        
        width: 100%;
        height: 100%;
        position: fixed;
        top:0;
        overflow: hidden;
        z-index: 10000;
        opacity: 0.7;
    } 

 /*이동 (7/14)*/
    
.s_relate{
    position: relative;
    top:10px;        
    font-family: 'Century Gothic', Tahoma, Verdana, sans-serif;    
    color:gray;
    line-height: 175%;
}

.tag-list{
    font-size: 11px;
}

/*기타 설정*/
/*일반 효과 설정*/

.condition4 {
    margin-bottom:10px;color:gray;font-style:italic;line-height:1.8em;    
    font-family:'Malgun Gothic', 'Nanum Gothic', sans-serif;
}

.condition-title{
    width:16px;height:16px;position:relative;top:4px;
}
.condition-sealed{
    color:blueviolet;font-family:Tahoma, 'Nanum Gothic', Verdana, sans-serif;
}
.condition-grade{
    display:inline-block;width:30px;text-align:center;
}
.condition-popup{
    background:darkgray;border-radius:0 0 5px 5px;height:20px;margin:0;padding:0;padding-bottom:3px;
}
.dispatch-01, .dispatch-02 {
    color:red;font-weight:bold;border-top:none;
} 

._strike {
    text-decoration:line-through;
}
._boxShadow_2px {
    box-shadow: 1px 1px 2px #888888;   
}
._boxShadow_4px {
    box-shadow: 2px 2px 4px #888888;   
}
.listStyle {
    list-style:none;
    padding:5px 0px;
}

._pointer {
    cursor:pointer;
}

.ft_red {
    color:red;
}