@charset "utf-8";
.artist_top {}
.artist_top h4 {margin-bottom:0}
.artist_list {
    text-align: right;
    margin-bottom: 4rem;
    border-bottom: 1px solid #222;
}
.artist_list .select_box {
    border: 1px solid #ddd;
    display: inline-block;
    width: 200px;
    margin-bottom: 1rem;
    position: relative;
    z-index: 1;
    }
.artist_list .select_box > a {text-align:left;width: 100%;height: 100%;display: block;padding: 5px 20px;}
.artist_list .select_box i {position:absolute; right:0; margin-right:20px}
.artist_list .select {position:absolute;top: 35px;width: 100%;background-color: #fff;border: 1px solid #ddd;padding: 5px 0;}
.artist_list .select.off {display:none}
.artist_list .select li {
    text-align: left;
}
.artist_list .select li a {display:block;width:100%;padding: 2px 20px;font-size: 18px;}
.artist_list .select li a.on {background-color: #f0f8ff;color:var(--color-main);font-weight: 600;}
.artist_list .select li a:hover {color:var(--color-main);}
.artist_art {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 3rem 2rem;
    grid-auto-rows: minmax(100px, auto);
    width: 100%;
}
.artist_art li {/* width: 25%; */}
.artist_art li a {height:100%; width:100%; display:block}
.artist_art .thumbnail {height: 300px;}
.artist_art li img {width:100%;height: 100%;object-fit:contain}
.artist_art li p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: center;
    margin-top: 1rem;
    height: 30px;
}
.pg_wrap {
    text-align: center;
    margin-top: 3rem;
    padding-top: 3rem;
    border-top: 1px solid #222;
}
.pg_wrap .pg {display:flex;justify-content: center;gap: 5px;}
.pg_wrap .pg a {width:40px; height:40px}
.pg_wrap .pg_current {width:40px;height:40px;display: inline-flex;justify-content: center;}

/* 아트갤러리 뷰 (artgallery_view)*/
.view_title {
    /* background-color: #f0f8ff; */
    margin-bottom: 3rem;
}
.view_title h4 {font-size: 26px;text-align: center;color: var(--color-main);}
.title_btn {text-align:right}
.title_btn a {
    border: 1px solid #ddd;
    display: inline-block;
    text-align: right;
    color: #333;
    padding: .6rem 3rem;
    border-radius: 2rem;
    font-size: 18px;
}
.view_conts {text-align: center;margin-bottom: 2rem;width: 100%;}
.view_conts img {max-width: 80%;}
.conts_text {margin-top: 3rem;border-top: 1px solid #222;border-bottom: 1px solid #ccc;}
.conts_text p, .conts_text span {font-size: 18px !important;font-family: 'SUITE' !important;}
.view_bottom {
    margin-bottom: var(--sub_pd);
    text-align: right;
}
.view_bottom a {background-color:var(--color-main);color: #fff;display: inline-block;padding: .6rem 3rem;border-radius: 2rem;font-size: 18px;}
.view_bottom a i {margin-right: .5rem;}

/* PC */ 
@media only screen and (min-width:1025px) and (max-width: 1500px)  {
    
}

/* 테블릿 가로, 테블릿 세로 (해상도 768px ~ 1024px)*/ 
@media all and (max-width:1024px) {
   .artist_art {grid-template-columns: repeat(2, 1fr);}
}

/* 모바일 가로, 모바일 세로 (해상도 480px ~ 767px)*/ 
@media all and (max-width:767px) {
    .artist_list .select_box {margin-top:1rem;width: 120px;}
    .artist_list .select li a {font-size:16px}
    .artist_art {grid-template-columns: repeat(1, 1fr);grid-gap: 2rem;}
    .artist_art .thumbnail {height: auto;}
    .title_btn {display:none}

}