@charset "utf-8";
/* Pretendard font */
@font-face { 
    font-family: 'ptd'; 
    font-style: normal; 
    font-weight: 500; 
    src: url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-Medium.woff2") format('woff2'),
        url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-Medium.woff") format('woff'),
        url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-Medium.otf") format('opentype'),
        url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-Medium.eot?#iefix") format('embedded-opentype');
}
@font-face { 
    font-family: 'ptd'; 
    font-style: normal; 
    font-weight: 600; 
    src: url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-SemiBold.woff2") format('woff2'),
        url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-SemiBold.woff") format('woff'),
        url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-SemiBold.otf") format('opentype'),
        url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-SemiBold.eot?#iefix") format('embedded-opentype');
}
@font-face { 
    font-family: 'ptd'; 
    font-style: normal; 
    font-weight: 700; 
    src: url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-Bold.woff2") format('woff2'),
        url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-Bold.woff") format('woff'),
        url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-Bold.otf") format('opentype'),
        url("//tkfile.yes24.com/entimg/font/Ptd/Pretendard-Bold.eot?#iefix") format('embedded-opentype');
}
/* CSS Document */
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select {margin:0;padding:0;-webkit-text-size-adjust:none;list-style: none;}
a{text-decoration: none;font-size: inherit;color: #101010;}
/* 오픈 전 공연 */
.listWrap10,
.perfWrap10{display: none !important;} 
/* 자라섬, 로버트 글래스퍼, 핑크 스웨츠 */
.evt_festival_wrap::after{
    position:absolute; width:0; height:0; overflow:hidden; z-index:-1;
    content:
    url('//tkfile.yes24.com/img/event/2025/0714/evt_festival_hd.jpg')
    url('//tkfile.yes24.com/img/event/2025/0714/evt_fstv_bg01.jpg')
    url('//tkfile.yes24.com/img/event/2025/0714/evt_fstv_bg02.jpg')
    url('//tkfile.yes24.com/img/event/2025/0714/evt_fstv_bg03.jpg')
    url('//tkfile.yes24.com/img/event/2025/0714/evt_fstv_bg04.jpg')
    url('//tkfile.yes24.com/img/event/2025/0714/evt_fstv_bg05.jpg')
    url('//tkfile.yes24.com/img/event/2025/0714/evt_fstv_bg06.jpg')
    url('//tkfile.yes24.com/img/event/2025/0714/evt_fstv_bg07.jpg')
    url('//tkfile.yes24.com/img/event/2025/0714/evt_fstv_bg08.jpg')
    url('//tkfile.yes24.com/img/event/2025/0714/evt_fstv_bg09.jpg')
    url('//tkfile.yes24.com/img/event/2025/0714/evt_fstv_bg10.jpg');
}
.evt_festival_m img{width: 100%;}
.evt_festival_wrap *{font-family: 'ptd', sans-serif;padding: 0;margin: 0;}
.evt_festival_wrap{
    background-image: url('//tkfile.yes24.com/img/event/2025/0714/evt_festival_hd.jpg');
    /* background-color: #fcf466; */
    transition: background-color 0.8s ease-in-out, background-image 0.8s ease-in-out;
    transition-delay: .5s;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 250%;
}
/* .evt_festival_wrap.evt_festival_m{background-image: none;} */
.evt_festival_wrap .titArea,
.evt_festival_wrap .fixArea{max-width: 750px;margin: 0 auto;}
/* -- pc -- */
.evt_festival_pc{min-width: 1300px;overflow: hidden;}
.evt_festival_pc.evt_festival_wrap{background-size: 100%;}
.evt_festival_wrap .topArea{
    /* max-width: 750px; */
    margin: 0 auto;
    position: relative;z-index: 9;
}
.evt_festival_m .listArea{
    max-width: 750px;
    margin: 0 auto;
    padding: 0 40px 104px;
    box-sizing: border-box;
}
/* 상단 영역 */
.topArea .titArea{
    border-bottom: 1px solid rgba(0,0,0,.15);
    margin: 0px 40px;
    position: relative;
    padding: 60px 0 24px;
    cursor: pointer;
    margin: 0 auto;
    max-width: 670px;
}
.topArea .titArea{display: none;}
.evt_festival_pc .topArea .titArea{margin: 40px auto 0;padding: 0px 0 24px;display: none;}
.topArea .titArea h1,.topArea .titArea,.topArea .titArea .icon{transition: all .3s linear;transition-delay: .3s;}
.topArea .titArea h1{font-size: 27px;font-weight: 600;color: #101010;letter-spacing: -0.03em;line-height: 1;}
.bgBkk .topArea .titArea h1{color: #fff;}
.bgBkk .topArea .titArea{border-bottom: 1px solid rgb(255 255 255 / 15%);transition: border-bottom .3s linear;transition-delay: .3s;}
.bgBkk .topArea .titArea .icon{filter: invert(1);}
.topArea .titArea .icon{
    display: inline-block;
    position: absolute;right: 0px;top: 4px;
}
/* 상단 공연 정보 */
.tabListArea{
    text-align: center;
    position: relative;
}
.tabListArea .perfWrap{
    position: absolute;
    top: 0;left: 0;
    width: 100%;
}
.tabListArea .controller.hide{
    margin-top: -160px;
    visibility: hidden;
    opacity: 0;
    transition: none;
}
.tabListArea .controller{
    margin-top: 0px;
    visibility: visible;
    opacity: 1;
    transition: opacity .5s linear, margin-top 0.3s linear;
    transition-delay: .3s, 0s;
}
/* video */
.videoArea .videoWrap{position: absolute;z-index: 5;width: 100%;height: 890px;overflow: hidden;display: none;}
.videoArea .videoWrap::after{
    content: '';position: absolute;top: 0;left: 0;z-index: 9;width: 100%;height: 100%;
    background-image: url('//tkfile.yes24.com/img/event/2025/0714/evt_festival_dim.png');
    background-size: cover;background-position: center top;background-repeat: no-repeat;
}
.evt_festival_pc::before{
    /*content: '';*/position: absolute;top: 0;left: 0;z-index: 4;min-width: 1300px;width: 100%;height: 1460px;
    background-image: url('//tkfile.yes24.com/img/event/2025/0714/evt_festival_dim.png');
    background-size: cover;background-position: center top;background-repeat: no-repeat;
}
.videoArea video{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 950px;
    object-fit: cover;
    background-color: #fff;
    /* width: 1152px;height: auto; */
}
.videoArea .dim{
    width: 100%;height: 200px;position: absolute;top: 690px;z-index: 5;
    background-image: linear-gradient(180deg, rgb(255 255 255 / 0%) 10%, rgba(255, 255, 255, .90) 85%, rgba(255, 255, 255, 1) 100%);
}
/* default 화면 */
.tabListArea .perfWrapD{
    opacity: 1;
    transition: opacity .5s linear;
    transition-delay: .3s;
    left: 0;
}
.tabListArea .perfWrapD.hide{
    opacity: 0;
    position: absolute;
    width: 100%;
    left: -9999px;
}
/* 상단 공연 정보 */
.tabListArea .perfWrap{
    visibility: hidden;
}
.tabListArea .perfWrap.hide{
    visibility: visible;
}
.tabListArea .perfWrap > a.thumnail,
.tabListArea .perfWrap > div{
    opacity: 0;
    visibility: hidden;
    /* left: -9999px; */
}
.tabListArea .perfWrap.hide > a.thumnail{opacity: 1;visibility: visible;}
.tabListArea .perfWrap.hide > div{
    opacity: 1;
    visibility: visible;
    left: 0;
}
.tabListArea .perfWrap .gobtn{
    visibility: hidden;
    transition: visibility .5s linear;
    transition-delay: .3s;
}
.tabListArea .perfWrap.hide .gobtn{
    visibility: visible;opacity: 1;
}
.tabListArea .perfWrap .pfInfo{position: relative;}
.tabListArea div[class*='perfWrap'] .thumnail,
.tabListArea div[class*='perfWrap'] .pfInfo{
    transition: all .5s linear;
    transition-delay: 0.3s;
}
.tabListArea div[class*='perfWrap'] .thumnail{
    padding: 30px 0 20px;
    margin: 0 auto;
    position: relative;
    z-index: 3;
    overflow: hidden;
    width: 450px;
    cursor: pointer;
}
.tabListArea div.perfWrapD .thumnail{width: auto;}
.tabListArea div[class*='perfWrap'] .thumnail.typo{
    padding: 0;width: auto;overflow: unset;cursor: default;
    opacity: 0;transform: scale(1.2);
    animation: fade .4s cubic-bezier(0.7, 0.5, 0, 0);animation-delay: .1s;animation-fill-mode: forwards;
}
@keyframes fade{
    0%{opacity: 0;transform: scale(1.2);}
    30%{opacity: 1;}
    100%{opacity: 1;transform: scale(1);}
}
.tabListArea div[class*='perfWrap'] .thumnail img,
.listArea .listWrap .poster img{width: 100%;}
.tabListArea div[class*='perfWrap'] .thumnail.typo img{width: auto; margin-top: -30px;}
.tabListArea div[class*='perfWrap'] .thumnail::after{
    /* content: ''; */
    position: absolute;
    bottom: -10px;
    left: 0;
    width: 100%;
    height: 104px;
    background: url('//tkfile.yes24.com/img/event/2025/0318/evt_fstv_thum_shadow.png') no-repeat center;
    background-size: contain;
    z-index: -1;
}
.perfWrap .pfInfo, .perfWrapD .pfTxt{cursor: default;}
.perfWrapD .pfTxt p{
    font-size: 36px;
    font-weight: 700;
    line-height: 50px;
    letter-spacing: -0.03em;
    color: #101010;
}
.perfWrapD .pfTxt .txt02{
    color: #ef4c2e;
}
.perfWrapD .pfTxt .txt03{
    font-size: 27px;
}
.perfWrapD .pfTxt .sub{
    font-size: 26px;line-height: 60px;letter-spacing: -0.02em;
    color: #101010;
    opacity: .8;
}
.evt_festival_wrap .kr{font-size: 14px;line-height: 20px;color: #f83a3a;border: 1px solid #f83a3a;display: inline-block;padding: 0 5px; margin: 0 0 2px 0;}
.evt_festival_wrap .ptit .kr{font-size: 22px;line-height: 32px;margin: 0 15px 5px 0;vertical-align: middle;}
.evt_festival_wrap .listWrap .kr{margin-right:5px;vertical-align: bottom;}
.tabListArea .thumnail .kr{font-size: 24px;line-height: 30px;}
.tabListArea .pfInfo .ptit{
    font-size: 36px;
    line-height: 50px;
    letter-spacing: -0.03em;
    color: #101010;
    font-weight: 700;
    padding: 0 50px;
}
.tabListArea .pfInfo .pdate{
    font-size: 24px;
    line-height: 40px;
    letter-spacing: -0.02em;
    color: #101010;opacity: .8;
    font-weight: 500;
}
.perfWrap{position: relative;}
.perfWrap .gobtn{
    position: absolute;
    bottom: -129px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
}
/* controller */
.fixArea .playbar{padding: 15px 0 20px;}
/* 재생, 예매 버튼 */
.navWrap{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 66px;
}
.navWrap > div{display: inline-block;}
.navWrap .icon{width: 55px;height: 32px;cursor: pointer;}
.navWrap .icon.next img{transform: rotate(180deg);}
.navWrap .gobtn{opacity: 0;z-index: 1;visibility: hidden;}
.tabListArea .hide .gobtn{opacity: 0;}
.tabListArea .gobtn{
    opacity: 1;
    width: 200px;
    border-radius: 40px;
    background-color: #ba1f11;
    font-size: 36px;
    font-weight: 600;
    color: #fff;
    height: 78px;
    line-height: 78px;
    display: inline-block;
    text-align: center;
}
/* 할인쿠폰 버튼 */
.btnArea{
    display: flex;
    justify-content: center;
    gap: 20px;
    padding: 55px 40px 60px;
    text-align: left;
}
.evt_festival_pc .btnArea{padding:  40px 40px 60px;}
.btnArea a{
    background-color: rgba(255,255,255,.8);
    border: 1px solid rgba(16,16,16,.5);
    border-radius: 6px;
    display: inline-block;
    width: 50%;
    padding: 18px 26px;
    position: relative;
}
.btnArea a.active{background-color: rgba(255,255,255,.6);border: 2px solid rgba(16,16,16,.6);}
.btnArea a > span{display: inline-block;font-weight: 600;font-size: 25px;line-height: 32px;color: #101010;}
.btnArea a .icon{
    width: 26px;
    position: absolute;top: 32px;right: 26px;
}
/* 하단 공연 리스트 */
.listArea{padding-bottom: 104px;position: relative;z-index: 5;}
.listArea .listWrap{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 30px;
    position: relative;
    padding: 14px 0px 14px 14px;
    border-bottom: 2px solid rgb(0 0 0 / 10%);
    transition: background-color .3s linear;
    cursor: pointer;
}
.evt_festival_pc .listAreaWrap{overflow-x: auto;position: relative;}
.evt_festival_pc .shadow{
    display: none;
    /* content: ''; */
    position: absolute;width: 20px;height: 480px;z-index: 6;
    left: 1533px;top: 0;
    background-image: linear-gradient(90deg, rgb(255 255 255 / 0%) 10%, rgba(255, 255, 255, .90) 70%, rgba(255, 255, 255, 1) 100%);
}
.evt_festival_pc ::-webkit-scrollbar{display: none;}
.evt_festival_pc .listArea{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 20px;
    position: relative;z-index: 5;
    padding: 0 20px 104px;
    max-width: 1200px;
    margin: 0 auto;
}
.evt_festival_pc .listArea .listWrap{
    display: inline-block;
    width: 190px;
    height: 350px;
    border: none;
    padding: 0;
    vertical-align: top;
    text-align: center;
    transition: all .3s linear;
    /* user-select: none; */
}
.evt_festival_m .listArea .listWrap.listWrap1{
    border-top: 2px solid rgb(0 0 0 / 10%);
}
.evt_festival_pc .listArea .listWrap:hover{background-color: rgba(0,0,0,0.1);}
.listArea .listWrap.active{
    background-color: rgba(0,0,0,0.1);
    border: none;
}
.listArea .listWrap .poster{
    width: 100px;height: 100px;
    overflow: hidden;
}
.evt_festival_pc .listArea .listWrap .poster{width: 100%;height: 190px;}
.listArea .listWrap .liInfo{width: calc(100% - 100px - 30px - 40px);}
.evt_festival_pc .listArea .listWrap .liInfo{width: 100%;}
.evt_festival_m div[class*='tit']{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    -webkit-line-clamp: 1;
}
.evt_festival_pc div[class*='tit']{
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: keep-all;
    display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
}
.evt_festival_pc .perfArea .ptit{-webkit-line-clamp: 1;}
.evt_festival_pc .listArea .listWrap .liInfo .ltit{line-height: 25px;margin: 25px 10px 10px;word-break: keep-all;}
.evt_festival_pc .listArea .listWrap .liInfo .ldate{line-height: 21px;}
.listArea .listWrap .liInfo .ltit{
    font-size: 18px;
    line-height: 23px;
    letter-spacing: -0.03em;
    color: #3b3b3b;
    padding-bottom: 0px;
    margin: 0px 0 14px;
    font-weight: 600;
}
.listArea .listWrap .liInfo .ldate{
    font-size: 16px;
    line-height: 1;
    letter-spacing: -0.02em;
    color: #101010;
    font-weight: 500;
    opacity: .7;
    white-space: normal;
}
/* -- mobile -- */
.evt_festival_m a.thumnail{display: inline-block;}
@media screen and (max-width: 750px) {
    .videoArea .videoWrap, .videoArea video{height: 106.67vw;height: 96.00vw;}
    .videoArea .dim{top: 42.67vw;height: 53.33vw;}
    .evt_festival_wrap.evt_festival_m{padding: 0 20px;background-size: 180%;}
    /* 상단 영역 */
    .evt_festival_m .topArea .titArea{border-bottom: 1px solid rgba(0,0,0,.15);padding: 30px 0 12px;margin: 0;}
    .evt_festival_m.bgBkk .topArea .titArea{border-bottom: 1px solid rgb(255 255 255 / 15%);}
    .evt_festival_m .topArea .titArea h1{font-size: 17px;}
    .evt_festival_m .topArea .titArea .icon{width: 17px;right: 0px;top: 30px;}
    /* 상단 공연 정보 */
    .evt_festival_m .tabListArea div[class*='perfWrap'] .thumnail{padding: 25px 50px 15px;height: auto;margin-bottom: 0;width: auto;}
    .evt_festival_m .topArea .tabListArea .perfWrapD .thumnail{padding: 15px 0px 0px;}
    .evt_festival_m .tabListArea div[class*='perfWrap'] .thumnail img{width: 100%;}
    .evt_festival_m .tabListArea div[class*='perfWrap'] .thumnail::after{bottom: -5px;left: 0;height: 52px;}
    .evt_festival_m .tabListArea .pfInfo .ptit{font-size: 19px;line-height: 30px;padding: 0;}
    .evt_festival_m .tabListArea .pfInfo .pdate{font-size: 14px;line-height: 22px;}
    .evt_festival_m .tabListArea .controller.hide{margin-top: -80px;}
    .evt_festival_m .perfWrapD .pfTxt p{font-size: 19px;line-height: 25px;}
    .evt_festival_m .perfWrapD .pfTxt .txt03{font-size: 15px;}
    .evt_festival_m .perfWrapD .pfTxt .sub{font-size: 13px;line-height: 30px;}
    /* 버튼 */
    .evt_festival_m .fixArea .playbar{padding: 6px 0 10px;}
    .evt_festival_m .navWrap{gap: 33px;}
    .evt_festival_m .navWrap .icon{width: 37px;height: 40px;display: flex;align-items: center;}
    .evt_festival_m .tabListArea .gobtn{width: 100px;font-size: 18px;padding: 0;bottom: -75px;line-height: 39px;height: 39px;}
    .evt_festival_m .btnArea{gap: 10px;padding: 20px 0px 30px;}
    .evt_festival_m .btnArea a{padding: 9px 13px;border-width: 1px;}
    .evt_festival_m .btnArea a > span{font-size: 16px;line-height: 20px;}
    .evt_festival_m .btnArea a .icon{width: 13px;top: 20px;right: 13px;}
    /* 하단 공연 리스트 */
    .evt_festival_m .listArea{padding: 0 0 52px;}
    .evt_festival_m .listArea .listWrap{gap: 15px;padding: 7px 0px 7px 7px;border-bottom: 1px solid rgb(0 0 0 / 10%);}
    .evt_festival_m .listArea .listWrap.listWrap1{border-top: 1px solid rgb(0 0 0 / 10%);}
    .evt_festival_m .listArea .listWrap.active{border: none;}
    .evt_festival_m .listArea .listWrap .poster{width: 50px;height: 50px;}
    .evt_festival_m .listArea .listWrap .liInfo{width: calc(100% - 50px - 15px - 20px);}
    .evt_festival_m div[class*='tit']{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-line-clamp: 1;}
    .evt_festival_m .kr{padding: 0 4px;}
    .evt_festival_m .tabListArea .kr{font-size: 16px;line-height: 23px;margin: 0 5px 1px 0;}
    .evt_festival_m .listWrap .kr{font-size: 12px;line-height: 16px;margin-right: 5px;border-width: 1px;margin: 0 3px 0px 0;}
    .evt_festival_m .listArea .listWrap .liInfo .ltit{font-size: 16px;letter-spacing: -0.03em;line-height: 18px;margin: 0px 0 4px;}
    .evt_festival_m .listArea .listWrap .liInfo .ldate{font-size: 12px;line-height: 1;}
}
@media screen and (min-width: 751px) {
    .evt_festival_m img{width: auto;}
    .evt_festival_m .topArea .titArea .icon{top: 64px;}
    .evt_festival_m .listWrap .kr{margin: 0 5px 0px 0;}
}
@media screen and (min-width: 860px) {
    .evt_festival_wrap{background-size: 185%;}
    .evt_festival_m .tabListArea .pfInfo .ptit{padding: 0 175px;}
}
@media screen and (min-width: 1100px) {
    .evt_festival_wrap{background-size: 140%;}
    .evt_festival_m .tabListArea div.perfWrapD .thumnail img{width: auto;}
}
@media screen and (min-width: 1500px) {
    .evt_festival_wrap{background-size: 100%;}
}