@charset "utf-8";
body.fixed {overflow: hidden}
.wrap {min-width: 100%; overflow: hidden}
.inner {max-width: 1230px; margin:0 auto; width: 100%; padding:0 15px; position: relative;}
.pcOnly {display: block !important;}
.moOnly {display: none !important;}
.font-gb {font-family: 'GongGothicBold', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; }

/*header*/
.header-wrap {width: 100%; margin:0 auto; z-index: 4; position: relative; background: #440099; position: fixed; max-width: 100%; box-shadow:0px 3px 10px rgba(0,0,0,0.1); }

.header-wrap.on .header h1 { background-size: contain; margin-top: 0; overflow: hidden}
.header-wrap.on .header h1 a img {max-height: 70px;}
.header-wrap.on .header .gnb > li .gnb-dep2 {top:70px;}
.header-wrap.on .header .gnb > li.on > a:after {bottom: 0px; }
.header-wrap.on .top-search{top:70px;}
.header-wrap.on .top-search-open { margin-top: 15px;}
.header-top {text-align: right; padding:9px 30px; border-bottom: 1px solid rgba(255,255,255,0.1);}
.header-top > div {display: inline-block; vertical-align: middle;}
.header-top .nav-social a {padding:0 10px; vertical-align: middle;}
.header-top .nav-lang {margin-left: 20px; overflow: hidden}
.header-top .nav-lang a {background: #fff; font-size: 1.3rem; width: 45px; height: 30px; border-radius: 2px 0 0 2px; float: left; text-align: center; line-height: 30px;}
.header-top .nav-lang a:last-of-type {border-radius: 0 2px 2px 0;}
.header-top .nav-lang a.on {background: #000; color:#fff;}

.header {padding:0 30px;  height:75px; margin: 0 auto; z-index: 3; position: relative; }
.header h1 {display: flex; align-items: center; padding-top: 13px}
.header h1 a {display: inline-block; position: relative; }
.header h1 a:nth-of-type(2) {margin: 0 10px 0 20px; animation: platAni 2.5s infinite; opacity: 1; }
.header h1 a:nth-of-type(3) { animation: platAni 2.5s 1s infinite; opacity: 1; }
@keyframes platAni {
	0% {opacity: 1;}
	10% {opacity: 0;}
	20% {opacity: 1;}
	100% {opacity: 1;}
}


/*gnb*/
.header .gnb { display: block; text-align: right; position: absolute; top:0; right: 13px;}
.header .gnb > li {text-align: center; display: inline-block; vertical-align: middle; position: relative; }
.header .gnb > li > a { font-size:1.5rem; color: #fff; padding: 0px 20px; line-height: 75px; position: relative; font-weight: 400;  }
.header .gnb > li.on > a {color:#f230f2; }
.header .gnb > li a.active {color:#f230f2}
.header .gnb > li .gnb-dep2 {width: 100%; z-index: 2; position: absolute; top: 100px; left: 0; display: none; text-align: center; overflow: hidden; border-bottom: 1px solid #ddd; box-shadow:0px 3px 7px rgba(0,0,0,0.2)}
.header .gnb > li .gnb-dep2.on {display: block; background: #fff; }
.header .gnb .gnb-dep2 > ul {width: 100%; display: inline-block;  text-align: left; padding:20px 10px;}
.header .gnb .gnb-dep2 > ul > li {display: block; vertical-align: top; position: relative; padding:5px 10px;}
.header .gnb .gnb-dep2 > ul > li > a {font-size: 1.6rem; color: #000; font-weight:500; display: block; line-height: 1.5;}
.header .gnb .gnb-dep2 > ul > li > a:hover {text-decoration: underline; color:#005b9e;}
.header .gnb .gnb-dep3 { margin-bottom: 20px;}
.header .gnb .gnb-dep3 > li > a {font-size: 1.7rem; color: #333; margin-bottom: 12px; display: block;}
.header .gnb .gnb-dep3 > li > a:hover {text-decoration: underline; color:#005b9e;}

/*mobile gnb*/
.mo-btn {display: none; width: 30px; height: 20px; background: #000;}
.header .mobile-gnb  {position: fixed; top:0px; left: 0; width: 100%; height: 100%; background: #440099; z-index: 10; display: none; padding:60px 0 0 0;}
.header .mobile-gnb > ul > li {text-align: left; position: relative; background: #440099; border-bottom: 1px solid rgba(255,255,255,0.1)}
.header .mobile-gnb > ul > li:first-of-type {border-top: 1px solid rgba(255,255,255,0.1)}
.header .mobile-gnb > ul > li > a { font-size:2.2rem; color: #fff; display: block; padding:20px; position: relative;}
.header .mobile-gnb > ul > li > a:after {content: ''; display: block; width:10px; height: 10px; border-top:2px solid #fff; border-right: 2px solid #fff; position: absolute; top:50%; right: 25px; transform: translateY(-50%) rotate(45deg); opacity: 1;}
.header .mobile-gnb > ul > li.on > a:after {top:50%; transform: translateY(-50%) rotate(-45deg); }
.header .mobile-gnb > ul > li .gnb-dep2 {width: 100%; z-index: 2; display: none; background: #fff;}
.header .mobile-gnb .gnb-dep2.on {display: block !important;}
.header .mobile-gnb .gnb-dep2 > ul > li > a {font-size: 1.8rem; color: #000; font-weight:500; padding:18px 10px 18px 30px;; border-bottom: 1px solid #ccc; display: block; background: #efefef; position: relative;}
.header .mobile-gnb .gnb-dep2 > ul > li > a.on:after {content: ''; position: absolute; top:50%; right:20px; width: 20px; height: 20px; background: url(../img/common/ico-plus-grey.png) no-repeat 50% 50%; transform: translateY(-50%);  opacity: 1;}
.header .mobile-gnb .gnb-dep2 > ul > li.on > a:after {background: url(../img/common/ico-del-grey.png) no-repeat 50% 50%; }
.header .mobile-gnb .gnb-dep3 {display: none;}
.header .mobile-gnb .gnb-dep3.on {display: block;}
.header .mobile-gnb .gnb-dep3 > li > a {font-size: 1.6rem; color: #333; padding:16px 30px; border-bottom: 1px solid #ccc; display: block;}
.header .mobile-gnb .gnb-dep3 > li > a:before {content: '-'; display: inline-block; margin-right: 10px;}
.header .gnb-open {display: none; position: absolute; top:50%; right: 15px; background:url(../img/common/btn-allmenu.png) no-repeat 50% 50%; width: 30px; height: 30px; transform: translateY(-50%)}
.header .gnb-close {display: none; position: absolute; top:-25px; right: 15px; background:url(../img/common/ico-close.png) no-repeat 50% 50%; z-index: 99999; width: 30px; height: 30px;background-size: 25px; display: none;}


/*top search*/
.top-search-open {float: left; margin-top: 28px;}
.top-search-open .top-search-btn { width: 40px; height: 40px; background: url(../img/common/ico-search-dark.png) no-repeat 50% 50%; text-indent: -99999px; text-align: left;}
.top-search-open .top-search-btn.on {background: url(../img/common/ico-close-b.png) no-repeat 50% 50%;}
.top-search {background:#fff; position: absolute; top:100px; left: 0; width: 100%; text-align: center; padding:0 15px; display: none; border-bottom: 1px solid #ddd; border-top: 1px solid #ddd;}
.top-search .search-box {overflow: hidden;  display: inline-block; vertical-align: middle; width: 100%; max-width: 700px; display: inline-block; position: relative; overflow: hidden; padding:30px 0;}
.top-search .search-box select {float: left; width: 25%; height: 50px; border:3px solid #999; }
.top-search .search-box input[type="text"] {background: transparent; height: 60px; border:0; width: 100%; border:3px solid #005b9e; padding-right: 60px; font-size: 1.8rem;}
.top-search .search-box .btn-search {width: 55px; height: 55px; background:url(../img/common/ico-search-blue.png) no-repeat 50% 54%; color:#fff; text-indent: -9999px; position: absolute; top:48%; right: 0; transform: translateY(-50%); }


/*footer*/
.footer-wrap {background: #171333; padding:29px 0; text-align: center;}
.footer-wrap p {color:#fff; font-size: 1.3rem; }



/*tab inpage*/
.tabInpage-con > div {display: none; font-size: 1.7rem; line-height: 1.5;}
.tabInpage-con > div.on {display: block;}
.tabInpage-con .section {margin-bottom: 70px;}
.tabInpage-con ul.list {margin-bottom: 30px;}
.tabInpage-con ul.list li {margin-bottom: 7px; }
.tabInpage-con .rule-list strong {text-decoration: underline; display: inline;}
.tabInpage-con .rule-list > strong {font-weight: 500; margin-bottom: 10px; text-decoration: none;}
.tabInpage-con .rule-list > ul {margin-bottom: 30px;}
.tabInpage-con .rule-list > ul > li {margin-bottom: 10px; padding-left: 25px; position: relative; font-size: 1.7rem;}
.tabInpage-con .rule-list > ul > li .num {position: absolute; top:0; left: 0;}
.tabInpage-con .rule-list ul.depth2 {margin-top:5px;}
.tabInpage-con .rule-list ul.depth2 li { margin-bottom: 5px;}
.tabInpage-con .rule-list ul.depth3 {margin:5px 0 10px 18px;}
.tabInpage-con .bg-txt {background: #eee; border:1px solid #ddd; padding:25px; margin:20px 0; font-size: 1.8rem; color:#000; font-weight: 500;}
.tabInpage-con .bg-txt a {color:#005b9e}
.tabInpage-con .bg-txt span{font-size: 1.8rem; font-weight: 400; position: relative; padding-left: 12px;}
.tabInpage-con .bg-txt span:before{content: ""; display: inline-block; width: 6px; height: 2px; background: #747474; position: absolute; top: 12px; left: 0;}

/*table*/
.table-scroll {overflow-x: auto;}
.table-scroll .table {min-width: 700px; }
.table-set {margin:0px 0 30px; position: relative;}
.table-set .tb-info {margin-top:10px; }
.table-set .tb-info span {font-size: 1.5rem; display: block;}
.table {width:99.99%; border-collapse: collapse; position: relative; background: #fff;}
.table thead:before {content: ''; display: block; width: 100%; height: 2px; background: #000; position: absolute; top:0; left: 0;}
.table tr td,
.table tr th {border:1px solid #ddd; border-right: 0; padding:15px 10px; vertical-align: middle; text-align: center; line-height: 1.5;}
.table tr th { text-align: center; color:#000; font-weight: 500; font-size: 1.7rem;}
.table thead tr th {background: #eee; font-size: 1.7rem;}
.table tr td:nth-of-type(1),
.table tr th:nth-of-type(1) {border-left: 0;}
.table tr td {font-size: 1.6rem;}
.table tr td p {font-size: 1.6rem; margin-bottom: 0;}
.table tr td ul {margin-top: 10px;}
.table tr td ul li {margin-bottom: 10px;}
.table tr td ul li:last-of-type {margin-bottom: 0;}
.table tr td .title {text-align: left; width: 100%; display: block;}
.table tr td .title:hover {text-decoration: underline; color:#000; }
.table tr td .ico-new {margin-left: 10px; }
table.list {margin-bottom: 40px;}
table.list .list tr th,
table.list tr td {text-align: left; line-height: 1.5; padding:5px 0; font-size: 1.8rem;}
table.list tr th {width: 35%; font-weight: 500;}
table.list tr th:before {content: '·'; margin-right: 10px; }
table.list tr th small {font-size: 1.5rem; margin-left: 15px;}
.table tr.notice-bg td {background: #e2f3ff;}
.table tr.notice-bg .notice-txt {font-weight: 500; color:#005b9e}

/*privacy*/
.privacy-txt h4{font-size: 1.9rem; font-weight: 500; margin-bottom: 10px; line-height: 1.5}
.privacy-txt strong {font-size: 1.7rem;}
.privacy-txt em {font-style: normal; font-weight: 500; color:#000}
.privacy-txt p {margin-bottom: 15px;}
.privacy-txt ul, .privacy-txt ol{margin-bottom: 30px;}
.privacy-txt ul > li{position: relative; margin-bottom: 10px;  line-height: 1.5}
.privacy-txt ol > li{margin-top: 10px;  line-height: 1.5; position: relative; padding-left: 25px;}
.privacy-txt ol > li span{position: absolute; top: 0; left: 0;}
.privacy-txt .privacy_download{background: #1075bd; padding: 15px 2%; display: inline-block; margin-bottom: 30px; line-height: 1.4;}
.privacy-txt .privacy_download a{color: #fff;}
.privacy-btn {font-size: 1.6rem; margin-left:10px; color:#005b9e; position: relative; top:-1px;}
.privacy-nav {text-align: left; margin-bottom:25px;}
.privacy-nav a {margin-right: 20px; font-weight: 500; padding:5px 0}
.privacy-nav a:hover {text-decoration: underline;}

/*gallery*/
.gallery-slide.slick-slider .slick-prev, .gallery-slide.slick-slider .slick-next {width: 100px; height: 100px;}
.gallery-slide.slick-slider .slick-prev {background: url(../img/common/ico-prev-l.png) no-repeat 50% 50%; left: 2%;}
.gallery-slide.slick-slider .slick-next {background: url(../img/common/ico-next-l.png) no-repeat 50% 50%; right: 2%;}
.gallery-list ul {overflow: hidden}
.gallery-list ul li {float: left; width: 23%; margin-right: 2.6%; margin-bottom: 2.6%;  position: relative; padding-top: 20%; overflow: hidden; cursor: pointer; }
.gallery-list ul li:nth-of-type(4n) {margin-right: 0;}
.gallery-list ul li img {position: absolute; top:50%; left: 50%; transform: translate(-50%,-50%); height: 100%; width: auto; max-width: none;}
.gallery-list ul li p {position: absolute; bottom: 2vw; left: 2vw; z-index: 2; font-size: 1.8rem; color:#fff; display: block; transition: all .3s ease; opacity: 0;}
.gallery-list ul li:before {content: ''; display: block; width: 100%; height: 100%; position: absolute; top:0; left: 0; z-index: 2; background: rgba(0,0,0,0.5); transition: all .3s ease; opacity: 0;}
.gallery-list ul li:after {content: ''; display: block; width: 35px; height: 35px; position: absolute; top:2vw; right: 2vw; z-index: 2; background: url(../img/common/ico-plus-w.png) no-repeat 50% 50%; transition: all .3s ease; opacity: 0;}
.gallery-list ul li:hover p,
.gallery-list ul li:hover:before,
.gallery-list ul li:hover:after {opacity: 1;}


#galleryPopup .popup-inner {max-width: 1400px; width: 100%; height: 100%; background: none; }
#galleryPopup .img-box {position: relative; overflow: hidden;}
#galleryPopup .img-box p {position: absolute; bottom: 2vw; right: 2vw;}



/*quick*/
.quick-nav {position: fixed; bottom:1vw; right: 12px; z-index: 3; text-align: right; }
.quick-nav li {margin-bottom: 5px; -wekit-transform: scale(1); transform: scale(1); -webkit-transition: all .4s ease; transition: all .4s ease; }
.quick-nav li a {display: block; width: 150px; height: 150px; border-radius: 100px; position: relative; background: #440099 url(../img/quick-bg1.png)no-repeat 50% 50%;  top:0}
.quick-nav li:last-of-type a {background: #f230f2 url(../img/quick-bg2.png)no-repeat 50% 50%; }
.quick-nav li span {position: absolute; top:50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); opacity: 1; color:#fff; font-size: 1.4rem; text-align: center; width: 100%; -webkit-animation: quickNav 3s 1s infinite; animation: quickNav 3s 1s infinite;}
.quick-nav li:last-of-type span {-webkit-animation: quickNav 3s 1.5s infinite; animation: quickNav 3s 1.5s infinite;}
.quick-nav li:hover{  -wekit-transform: scale(0.9); transform: scale(0.9);}
@keyframes quickNav {
	0% {opacity: 1;}
	10% {opacity: 0;}
	20% {opacity: 1;}
	100% {opacity: 1;}
}
@-webkit-keyframes quickNav {
	0% {opacity: 1;}
	10% {opacity: 0;}
	20% {opacity: 1;}
	100% {opacity: 1;}
}

/*main*/

.main-visual {background: url(../img/main-visual1.jpg) no-repeat 50% 50%; background-size: cover; position: relative; height: 100vh; }
.main-visual.yt-video {padding-top: 56.25%; height: auto;}
.main-visual iframe {position: absolute; top:0; left: 0; width: 100%; height: 100%; }
.main-visual .video-box {position: relative; height: 100vh;}
.main-visual .video-box.type-link:before {content: ''; display: block; width: 100%; height: 100%; position: absolute; top:0; left: 0; background: rgba(0,0,0,0.5); z-index: 1 }
.main-visual .video-box iframe {position: absolute; top:0; left: 0; width: 100%;  height: 100%; object-fit: cover}
.main-visual .video-box video {position: absolute; top:0; left: 0; width: 100%;  height: 100%; object-fit: cover}
.main-visual .video-box .video-btn {position: absolute; top:55%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); z-index: 2}
.main-visual .txt-box {position: absolute; top:50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); text-align: center; width: 80%}
.main-visual .txt-box img {opacity: 0; -webkit-transform: scale(0.8); transform: scale(0.8); -webkit-animation: mainVisual 2s forwards; animation: mainVisual 2s forwards;}
.main-visual .txt-box p {font-size: 2rem; color:#fff; text-align: center; font-weight: 100; line-height: 1.7; letter-spacing: 0; }
.main-visual .txt-box p strong {color:#fff; font-weight: bold}
@keyframes mainVisual {
	0% {opacity: 0; -webkit-transform: scale(0.8); transform: scale(0.8);}
	100% {opacity: 1;  -webkit-transform: scale(1); transform: scale(1);}
}

.main-content .inner {padding:100px 15px; overflow: hidden}
.main-content .tit-box {text-align: center; margin-bottom: 70px; padding:0 15px;}
.main-content .tit-box p {font-size: 1.9rem; color:#888888;}
.main-content .title {color:#010101; font-size: 3rem; font-family: 'GongGothicLight', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; margin-bottom: 10px;}
.main-content .title strong {font-size: 4.9rem; color:#440099; font-family: 'GongGothicBold', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; line-height: 1.2;}
.main-intro {text-align: center; position: relative; overflow: hidden; height: 100vh}
.main-intro .inner {opacity: 0; position: absolute; top:60%; left: 0; right: 0; margin:0 auto; transform: translateY(-50%)}
.main-intro .txt-box p {max-width: 940px; margin:0 auto; color:#333; line-height: 1.9; font-weight: bold}
.main-intro .box {width: 20vw; height: 30vw;  position: absolute; transform: rotate(45deg)}
.main-intro .box1 { top:0; left:-7vw; }
.main-intro .box1 .bar1 { position: absolute; top:0; left: 0; width: 0; height: 2px; background: #7847b5; }
.main-intro .box1 .bar2 {content: ''; position: absolute; top:0; right: 0; width: 2px; height: 0vw; background: #7847b5;}
.main-intro .box2 { bottom:0; right: -12vw; }
.main-intro .box2 .bar1 { position: absolute; top:0; left: 0; width: 2px; height: 0vw; background: #7847b5; }
.main-intro .box2 .bar2 { position: absolute; bottom:0; left: 0; width: 0vw; height: 2px; background: #7847b5; }
.main-intro .progress-bar {width:1px; background: #000; height: 170vh; margin-top:-70vh; opacity: 0;}

/*
.main-intro .box1.ani_view:after { animation: boxH 2s 1s forwards} 
.main-intro .box1.ani_view:before {animation: boxW 1s forwards}
.main-intro .box2.ani_view:before {animation: boxH 2s forwards}
.main-intro .box2.ani_view:after {animation: boxW 1.5s 1.8s forwards}
@keyframes boxW {
	0% {width: 0; height: 0;}
	100% {width: 20vw; height: 2px}
}
@keyframes boxH {
	0% {height: 0; }
	100% {height: 30vw; }
}
*/
.main-number {background: url(../img/main-num-bg.jpg) no-repeat 50% 50%; background-size: cover;}
.main-number .title strong {font-size: 4.5rem}
.main-number ul {display: flex; justify-content: space-between; }
.main-number ul li {text-align: center; position: relative}
.main-number ul li:after {content: ''; display: block; width: 1px; height: 35px; background: rgba(255,255,255,0.3); position: absolute; top:50%; right: -13px; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%)}
.main-number ul li:last-of-type:after {display: none;}
.main-number ul li strong {font-size: 3.5rem; color:#c8f42f; font-family: 'GongGothicBold', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; line-height: 1.2; min-width: 185px; }
.main-number ul li span {display: block; text-align: center; font-size: 1.7rem; color:#fff; opacity: 0.6;}

.main-lineup {text-align: center}
.main-lineup ul {display: flex; flex-wrap: wrap; margin:0 -13px;}
.main-lineup ul li {width: 20%; padding:0 13px; margin-bottom: 26px; opacity: 0; top:-10px; position: relative;}
.main-lineup ul li a {display: block; position: relative; padding-top: 127%; overflow: hidden}
.main-lineup ul li a:hover img {transform: translate(-50%,-50%) scale(1.2) ; -webkit-transform: translate(-50%,-50%) scale(1.2) ;}
.main-lineup ul li img {position: absolute; top:50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); width: 100%; height: 100%; -webkit-transition: all 1s ease; transition: all 1s ease; transform-origin: center; object-fit: cover}
.main-lineup ul li .txt-box { position: absolute; bottom: 0; left: 0; width: 100%; background: rgba(0,0,0,0.6); min-height: 90px; text-align: right; padding:10px 20px;}
.main-lineup ul li .txt-box p {font-weight: bold; font-size: 2rem;  color:#fff; text-align: left}
.main-lineup ul li .txt-box small {font-size: 1.4rem; color:#fc4b6d; display: block; text-align: left}
.main-lineup ul li .txt-box .more-ico {width: 15px; height: 15px; background: url(../img/ico-more.png) no-repeat 50% 50%}

.main-footer {position: relative; height:400px; overflow: hidden;}
.main-footer .img img {position: absolute; top:0; left: 50%; width: 100%; height: auto; max-width: inherit; -webkit-transform:translateX(-50%); transform:translateX(-50%)}
.main-footer .tit-box {position: absolute; top:50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); z-index: 2; width: 80%}

/*sub content*/
.sub-content {padding: 70px 0 200px; position: relative; min-height: 700px}
.sub-content .title-bar {font-size: 2rem; font-weight: 600; color:#f230f2; border-left: 5px solid #f230f2; padding-left: 10px; line-height: 1; text-transform: uppercase; margin-bottom: 30px;}

.sub-bg {position: absolute; z-index: -1}
.sub-bg img {height: 100%; width: auto; max-width: inherit;}
.sub-bg-l {top:0; left: 0;}
.sub-bg-r {bottom:-76px; right: 0;}

/*sub title*/
.sub-title {height: 250px; text-align: center; position: relative; max-width: 100%; margin:0 auto;  overflow: hidden; } 
.sub-title:before {content: ''; display: block; background: url(../img/sub-top-bg.jpg) no-repeat 50% 50%; background-size: cover; position: absolute; top:0; left: 0; width: 100%; height: 100%; -wekit-transform: scale(1.2); transform: scale(1.2); -webkit-animation:subTitleBg 4s forwards; animation:subTitleBg 4s forwards }
.sub-title, .musician-slide {margin-top: 124px; }

.sub-title.sb-showcase:before {background-image: url(../img/sb_showcase.jpg)}
.sub-title.sb-conference:before {background-image: url(../img/sb_conference.jpg)}
.sub-title.sb-business:before {background-image: url(../img/sb_business.jpg)}
.sub-title.sb-musictech:before {background-image: url(../img/sb_musictech.jpg)}
.sub-title.sb-news:before {background-image: url(../img/sb_news.jpg)}
.sub-title.sb-notice:before {background-image: url(../img/sb_notice.jpg)}
.sub-title.sb-delegate:before {background-image: url(../img/sb_delegate.jpg)}
.sub-title.sb-login:before {background-image: url(../img/sb_login.jpg)}

.sub-title .txt-box {position: absolute; top:48%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); color:#ccc;  }
.sub-title .txt-box h2 {font-size: 4.5rem; color:#c8f42f; margin-bottom: 5px; font-family: 'GongGothicBold', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; opacity: 0; -webkit-animation: fadeInDown 1s forwards; animation: fadeInDown 1s forwards}
.sub-title .txt-box p {font-size: 1.5rem; max-width: 970px; opacity: 0; -webkit-animation: fadeInDown 1s .5s forwards; animation: fadeInDown 1s .5s forwards}
.sub-title.align-left .txt-box {top:48%; left: 0; transform: translateY(-50%); -webkit-transform: translateY(-50%); text-align: left; position: relative;}
.sub-title.align-left .txt-box h2 {font-size: 3.5rem;}
.sub-title.align-left .txt-box p {font-size: 1.8rem; }
@keyframes subTitleBg {
	0% {-wekit-transform: scale(1.2); transform: scale(1.2);}
	100% {-wekit-transform: scale(1); transform: scale(1);}
}


/*sub tab*/
.sub-tab {border-bottom: 1px solid #ccc; text-align: center}
.sub-tab:after {content: ''; display: block; clear: both;}
.sub-tab li {display: inline-block; height: 105px; position: relative; vertical-align: middle; margin:0 40px;}
.sub-tab li a {display: block; font-size: 2.6rem; text-align: center; color:#b7b7b7; font-family: 'GongGothicBold', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; padding:0 10px;  position: relative; top:51%; left: 50%; transform: translate(-50%,-50%); line-height: 1;}
.sub-tab li a small {font-size: 1.8rem; display: block; font-family: 'GongGothicLight', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; line-height: 1; position: relative; left: 0; text-align: center; width: 100%; margin-top:5px;}
.sub-tab li a img {max-width: 200px;}
.sub-tab li.on a img {max-width: 290px;}
.sub-tab li:after {content: ''; display: block; width: 100%; height:3px; background: #f230f2; position: absolute; bottom: -1px; left: 0; display: block; opacity: 0;}
.sub-tab li:before {content: ''; display: block; border:7px solid transparent; border-top:7px solid #f230f2; position: absolute; bottom: -14px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); opacity: 0;}
.sub-tab li.on a {color:#f230f2; }
.sub-tab li.on:after, 
.sub-tab li.on:before {opacity: 1;}


/*showcase*/
.schedule-list h3 {margin-bottom: 20px;}
.schedule-list h3 strong {font-family: 'GongGothicBold', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; font-size: 3.2rem; color:#f230f2;}
.schedule-list h3 span { font-family: 'GongGothicLight', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; font-size: 2.4rem; color:#f230f2; margin-left: 30px;}
.schedule-list {display: flex; justify-content: space-between; margin:0 -25px}
.schedule-list li { width: 33.3%; padding:25px;}
.schedule-list table {border-top:3px solid #000}
.schedule-list table thead {border-bottom: 1px solid #000; }
.schedule-list table tbody tr:nth-of-type(1) td {padding-top: 15px;}
.schedule-list table tr th {padding:15px 0; font-size: 2rem; font-weight: bold; color:#000;}
.schedule-list table tr td {padding:15px 0; border-bottom: 1px solid #ddd; font-size: 2rem;  cursor: pointer}
.schedule-list table tr.active td,
.schedule-list table tr:hover td {background: #fcd6fc }

.pg-musician .search-box {border-bottom: 3px solid #f230f2; max-width: 580px; margin:0 auto; padding:10px; display: flex; align-items: center; justify-content: space-between}
.pg-musician .search-box span {color:#333; padding-right: 10px; width: 20%; line-height: 1; border-right: 1px solid #ddd; font-weight: bold;}
.pg-musician .search-box input[type="text"] {border:0; height: 50px; width: 100%; margin:0 20px;}
.pg-musician .search-box .submit-btn {width: 35px; height: 30px; background: url(../img/ico-search.png) no-repeat 50% 50%;}
.pg-musician .filter {text-align: center; margin:35px 0 60px;}
.pg-musician .filter button {width:30px; height: 30px; line-height: 30px; text-align: center; background: #888; border-radius: 2px; color:#fff; font-family: 'GongGothicLight', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; font-size: 1.5rem; margin-bottom: 10px; }
.pg-musician .filter button.on {background: #f230f2}

.musician-list {display: flex; flex-wrap: wrap; margin:0 -12px}
.musician-list li {width: 33.3%; padding:12px;}
.musician-list li a {display: block; position: relative; border:1px solid #ebebeb;}
.musician-list li .img-box {position: relative; padding-top: 100%; overflow: hidden}
.musician-list li .img-box img {position: absolute; top:50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); width: 100%; height: 100%; object-fit: cover}
.musician-list li .txt-box {padding:15px 20px; background: #fff;}
.musician-list li .txt-box small {font-size: 1.3rem; color:#f230f2; margin-bottom: 7px;display: block; }
.musician-list li .txt-box p {font-size: 1.8rem; color:#000; }
.musician-list li .txt-box span {font-size: 1.5rem; color:#555555;}
.musician-list li:hover .hover {opacity: 1;}
.musician-list li .hover {position: absolute; top:0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); opacity: 0; transition: all .3s ease; -webkit-transition: all .4s ease;}
.musician-list li .hover span {position: absolute; top:50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); color:#fff; padding-top: 50px; background: url(../img/ico-more2.png) no-repeat 50% 0; font-size: 1.4rem;}

.musician-slide-wrap {position: relative;}
.musician-slide-wrap .txt-box {position: absolute; top:70%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); width: 100%; z-index: 2}
.musician-slide-wrap .txt-box p {font-size: 3.5rem; font-family: 'GongGothicBold', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; color:#c8f42f; text-transform: uppercase; margin-bottom: 20px; max-width: 450px; line-height: 1.3; text-shadow: 0 0 10px rgb(0 0 0 / 30%)}
.musician-slide-wrap .txt-box span {font-size: 1.8rem; color:#fff;text-shadow: 0 0 10px rgb(0 0 0 / 30%) }
.musician-slide .slide {position: relative; height: 540px; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; }
.musician-slide .slick-dots {max-width: 1230px; padding:0 15px; margin:0 auto; right: 0;  text-align: left; bottom: 2vw;}
.musician-slide .slick-dots li button {background: #fff;border:0; box-shadow: 0 0 10px rgb(0 0 0 / 30%)}
.musician-slide .slick-dots li.slick-active button {width: 30px}
.musician-social {border-bottom: 1px solid #ccc; padding:30px 0;}
.musician-social a {background: #e9e9e9; border-radius: 100px; width: 40px; height: 40px; text-align: center; padding-top: 10px; margin-right: 10px;}

.musician-info section {margin:60px 0}
.musician-info .section1 {display: flex; justify-content: space-between; align-items: center;}
.musician-info .section1 > div {width: 46%;}
.musician-info .section1 .video-box {position: relative; padding-top: 25%}
.musician-info .section1 .video-box iframe {position: absolute; top:0; left: 0; width: 100%; height: 100%;}
.musician-info .section1 .txt-box h2 {font-size: 3rem; font-weight: 600; color:#000; padding-bottom: 30px; border-bottom: 1px solid #000; margin-bottom: 35px; display: inline-block}
.musician-info .section1 .txt-box ul li {display: flex; margin-bottom: 20px; align-items: center; line-height: 1;}
.musician-info .section1 .txt-box ul li strong {width: 40%; line-height: 1;}
.musician-info .section1 .txt-box ul li span {width: 60%; border-left: 1px solid #ddd; padding-left: 20px; line-height: 1;}
.musician-info .section3 {display: flex; background: #e7e7f1; padding:35px; margin-top: 100px;}
.musician-info .section3 .play-list {width: 35%}
.musician-info .section3 .txt-box {width: 60%; margin-left: 5%; position: relative;}
.musician-info .section3 .txt-box span {display: block; margin-bottom: 10px; font-size: 1.8rem}
.musician-info .section3 .txt-box a {color:#fff; padding:3px 35px 4px 15px; border-radius: 4px; font-size: 1.5rem; background:#000 url(../img/ico-arr.png) no-repeat 95% 50%; margin-bottom: 10px;}
.musician-info .section3 .txt-box .spotify {position: absolute; bottom: 0; left: 0; }
.musician-info .section3 .txt-box .spotify span {font-size: 1.5rem; margin: 0 8px 3px 0px; white-space: nowrap; display: inline-block}
.musician-info .section3 .txt-box .spotify p {font-size: 1.5rem; }

/*business*/
.platform {text-align: center; max-width: 890px; margin:0 auto;}
.platform p {display: inline-block; font-size: 3rem; color:#440099; font-family: 'GongGothicBold', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; margin-bottom: 80px}
.platform .video-box { width: 100%; display: inline-block; padding-top: 56%; position: relative;}
.platform .video-box iframe {width: 100%; height: 100%; position: absolute; top:0; left: 0;}

.lounge-list p {display: inline-block; font-size: 2.2rem; color:#440099; font-family: 'GongGothicBold', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; margin-bottom: 80px; text-align: center; width: 100%}
.lounge-list h2 {font-family: 'GongGothicBold', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; color:#440099; font-size: 3.6rem; margin-bottom: 40px; text-align: center; }
.lounge-list h2 span {width: 40px; height: 40px; line-height: 42px; background: #f130f2; border-radius: 100px; color:#fff; vertical-align: middle;}
.lounge-list h3 {text-align: center; font-size: 2rem; color:#000; margin-bottom: 30px;}
.company-list {display: flex; flex-wrap: wrap}
.company-list a {width: 25%; padding:30px; display: block; }
.company-list a .img-box {border-radius:300px; overflow: hidden; position: relative; padding-top: 100%; border:1px solid #ddd; background: #fff}
.company-list a .img-box img {position: absolute; top:50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); width: 100%; height: auto;}
.company-list a .txt-box {text-align: center; margin-top: 10px;}
.company-list a .txt-box small {font-size: 1.4rem; color:#f130f2; display: inline-block}
.company-list a .txt-box p {font-size: 2rem; color:#000;}

/*acc 리스트*/
.acc-list { line-height: 1.5; overflow-anchor: none;}
.acc-list li {position: relative; margin-bottom: 10px; }
.acc-list li .acc-open-btn {font-weight: 500; padding:12px 10px; display:inline-block; width:100%; text-align: left; position: relative; line-height: 1.5; background: #440099; color:#fff; text-align: center; border-radius: 6px;}
.acc-list li .acc-open-btn span {display: inline-block; vertical-align: top;}
.acc-list li .acc-open-btn .title {overflow: hidden; font-size: 1.8rem;}
.acc-list li .acc-open-btn:hover .title{text-decoration: underline;}
.acc-list li .acc-open-btn:before {content: ''; display: block; position: absolute; top:17%; right:27px;  width: 12px; height: 12px; border-top:4px solid #c8f42f; border-right: 4px solid #c8f42f; transform: rotate(135deg) translateY(-50%); transform-origin: center center; }
.acc-list li .acc-open-btn.on:before { transform: rotate(-45deg) translateY(-50%); top:50%; right: 18px; border-color:#f130f2;}
.acc-list li .acc-open-btn .category {color:#fff; background: #ddd; border-radius: 100px; margin-right: 20px; padding:0px 13px; height: 30px; line-height: 30px; font-size: 1.6rem;}
.acc-list li .acc-content {display: block; padding:30px 15px; color:#666; border-top:1px solid #ddd;  background:rgba(255,255,255,0.5) }

.company-view .section1 {display: flex; align-items: center; border-bottom: 1px solid #e5e5e5; margin-bottom: 50px; padding-bottom: 50px; justify-content: space-between}
.company-view .section1 > div {width: 46%;}
.company-view .section1 .company-logo { padding-right: 5%}
.company-view .section1 .txt-box {display: flex; align-items: center;}
.company-view .section1 .txt-box .img{position: relative; padding-top: 22%; overflow: hidden; width: 22%; margin-right: 7%}
.company-view .section1 .txt-box .img img {position: absolute; top:50%; left: 50%; transform: translate(-50%,-50%); width: 100%; height: auto;}
.company-view .section1 .txt-box .txt .name {font-size: 1.7rem; color:#000; margin-bottom: 15px; text-transform: uppercase; font-weight: bold}
.company-view .section1 .txt-box .txt .name span {font-size: 1.5rem; color:#666; margin-left: 10px; font-weight: normal}
.company-view .section1 .txt-box .txt ul li {margin-bottom: 3px;}
.company-view .section1 .txt-box .txt ul li strong {color:#f230f2; width:60px}
.company-view .section2 .title-bar {font-size: 1.7rem; margin-bottom: 10px;}
.company-view .section2 ul {display: flex; justify-content: space-between; flex-wrap: wrap}
.company-view .section2 ul li {width: 46%; margin-bottom: 50px;}
.company-view .section2 ul li .video-box { position: relative; padding-top: 56%;}
.company-view .section2 ul li .video-box iframe {position: absolute; top:0; left: 0; width: 100%; height: 100%; }
.company-view .section2 ul li .video-col-wrap {display: flex; justify-content: space-between;}
.company-view .section2 ul li .video-col-wrap .video-box {width: 48%; padding-top:27%;}

/*conference*/
.pg-conference .section1 .tit {display: flex; align-items: center; margin-bottom: 10px;}
.pg-conference .section1 .tit strong {font-family: 'GongGothicLight', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif; font-size: 3.2rem; color:#000; font-weight: bold}
.pg-conference .section1 .tit span {font-size: 2.4rem; color:#000; margin:0 20px;}
.conf-list {display: flex; flex-wrap: wrap; margin:0 -12px; margin-top: 50px;}
.conf-list li {width: 33.3%; padding:12px;}
.conf-list li a {display: block; border:1px solid #ddd; background: #fff; padding:40px 15px; position: relative; min-height: 420px; cursor: default}
.conf-list li .img-box {border-radius: 300px; overflow: hidden; position: relative; padding-top: 50%; max-width: 50%; margin:0 auto;}
.conf-list li .img-box img {position: absolute; top:50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); border-radius: 100px; width: 100%; height: 100%; object-fit: cover;}
.conf-list li .txt-box {margin:25px 0; text-align: center;}
.conf-list li .txt-box p {font-size:1.8rem; color:#000; margin-bottom: 7px;}
.conf-list li .txt-box span  {font-size:1.5rem;}
.conf-list li .txt-box button,
.conf-list li .txt-box small {position: absolute; bottom: 30px; left: 0; color:#f230f2; width: 100%; text-align: center; font-size: 1.4rem;}

.conf-list li .hover {position: absolute; top:0; left: 0; width: 100%; height: 100%; background: rgba(68,0,153,0.9); display: none; opacity: 0; transition: all .4s ease; -webkit-transition: all .4s ease;}
.conf-list li .hover.on {display: block; -webkit-animation: confListHover .5s forwards; animation: confListHover .5s forwards;}
.conf-list li .hover .txt-box {color:#fff; text-align: left; padding:30px;}
.conf-list li .hover .txt-box p {color:#fff; font-size: 2rem; margin-bottom: 30px;}
.conf-list li .hover .txt-box span {font-size: 1.6rem; color:#fffefe; font-weight: lighter;}
.conf-list li .txt-box .close-btn {width: 100%; height: 100%; bottom: 0;}
.conf-list li .txt-box .close-btn span {position: absolute; bottom: 30px; left: 0; text-align: center; width: 100%; color:#f230f2; width: 100%; text-align: center; font-size: 1.4rem;}

@keyframes confListHover {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
/*music tech*/
.musictech-list {display: flex; margin:0 -15px; flex-wrap: wrap}
.musictech-list li {width: 33.3%; padding:15px}
.musictech-list li a {display:flex; border:1px solid #eaeaea; position: relative; height: 150px; align-items: center; text-align: center; background: #fff; overflow: hidden}
.musictech-list li a img {margin:0 auto; width: 70%}
.musictech-list li a:hover:before,
.musictech-list li a:hover:after {opacity: 1;}
.musictech-list li a:after {content: 'VIEW MORE'; display: block; position: absolute; top:50%; left: 50%; -wekbit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); color:#fff; font-size: 1.4rem; padding-top: 50px; background: url(../img/ico-more2.png) no-repeat 50% 0; width: 100%; text-align: center; z-index: 2; opacity: 0; -webkit-transition: all .3s ease; transition: all .3s ease;}
.musictech-list li a:before {content: ''; background: rgba(68,0,153,0.9); width: 100%; height: 100%; position: absolute; top:50%; left: 50%; -wekbit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); opacity: 0; -webkit-transition: all .3s ease; transition: all .3s ease;}

.pg-delegate .txt-box {margin-bottom: 60px;}
.pg-delegate .txt-box h3 {font-size: 3rem; color:#440099; margin-bottom: 20px; font-family: 'GongGothicBold', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif;}


/*upload*/
.upload_set {overflow: hidden;}

/*search*/
.ui-widget-content {border:1px solid #ddd; }
.ui-menu .ui-menu-item {padding:10px; color:#666; font-size: 1.4rem;}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active {
	font-weight: normal;
	margin: 0px;
}
.ui-menu .ui-menu-item.ui-state-focus {border:0 !important; background: #f230f2; color:#fff; }

.coming-txt {text-align: center; padding-top: 7%}
.coming-txt p {text-align: center; display: block; font-size: 3rem; color:#333; margin-bottom: 20px; font-weight: bold; margin-top: 20px;}

@media all and (max-width:1500px){
	.header {padding:0 15px}
	.header h1.type2 {width: 450px; padding-top:22px}
}
@media all and (max-width:1400px){
	.quick-nav li a {width: 100px; height: 100px}
	.quick-nav li span {font-size:12px;}
	.main-footer .img img {width: auto;}
}

@media all and (max-width:1240px){ 
	.header h1.type1 {width: 300px; padding-top:23px}
	.header h1.type2 {width: 450px; padding-top:11px}
	
	.header .gnb > li > a {padding:0 13px;}
	.main-number ul li strong {min-width: inherit}
	
	.header {height: 55px;}
	.header h1.type1 {width: 300px; padding-top:11px}
	.header .gnb {display: none;}
	.header .gnb-open {display: block;}
	.header-top {padding:6px 15px}
	.header-top .nav-lang a {height: 27px; line-height: 26px; width:40px}
	.header-top .nav-lang {margin-left: 10px;}
}
@media all and (max-width:1000px){ 
	
	.main-visual.yt-video {margin-top: 95px;}
	.main-content .inner {padding:70px 15px;}
	.main-number ul {flex-wrap: wrap}
	.main-number ul li {width: 50%; margin-top:40px;}
	.main-number ul li:after {display: none;}
	.main-number ul li strong {font-size: 3rem;}
	
	.main-intro {height: auto;}
	.main-intro .inner {opacity: 1; padding:130px 20px; position: relative; transform: none; top:0; left: 0;}
	.main-intro .box1 .bar1 { width: 100% !important;}
	.main-intro .box1 .bar2 {height: 100% !important;}
	.main-intro .box2 .bar1 {height: 100% !important;}
	.main-intro .box2 .bar2 { width: 100% !important;}
    .main-intro .progress-bar  {display: none}
	
	.main-lineup ul li {width: 33.3%}
	
	.sub-content {padding:50px 0 100px}
	.sub-title, .musician-slide {margin-top: 94px; }
	.sub-tab li {height: 60px;}
	.sub-tab li a {font-size: 2rem;}
	.sub-tab li:after {height: 2px;}	
	.sub-tab li a img {max-width: 150px}
	.sub-tab li.on a img {max-width: 180px}
	.sub-tab li a small {font-size: 1.3rem; }
	.sub-title .txt-box h2 {font-size:4rem }
	.sub-content .title-bar {margin-bottom: 20px;}
	
	.musician-info .section1 {display: block}
	.musician-info .section1 > div {width: 100%}
	.musician-info .section1 .video-box {padding-top: 56%; margin-bottom: 40px;}
	.musician-info .section1 .txt-box h2 {display: block; font-size: 2.7rem; margin-bottom: 20px; padding-bottom: 10px;}
	.musician-info .section3 {margin-top: 50px;}
	
	.musictech-list {margin:0;}
	.musictech-list li {width: 33.3%; padding:1.5%}
	.pg-delegate .txt-box {margin-bottom: 50px;}
	.pg-delegate .txt-box h3 {font-size: 2.7rem; margin-bottom: 15px;}
	
	.platform p {font-size: 2.5rem; margin-bottom: 40px;}
	
	.lounge-list h2 {font-size: 2.7rem;}
	.company-list a {padding:2%; width: 33.3%}
	
}
@media all and (max-width:768px){ 
	.pcOnly {display: none !important;}
	.moOnly {display: block !important;}
	.header h1.type2 img {width: 100px;}
	.header h1.type2 .moOnly {width: 70px;}
	.main-content .title strong {font-size: 4rem;}
	.main-content .title {font-size: 2.5rem;}
	.main-content .tit-box {margin-bottom: 30px;}
	.main-content .tit-box p {font-size: 1.6rem}
	.main-lineup ul {margin:0 -10px}
	.main-lineup ul li {width: 50%; padding:0 5px; margin-bottom: 10px;}
	.main-footer {height: 300px;}
	
	.sub-content {min-height: 400px;}
	.sub-title .txt-box h2 {font-size: 3rem;}
	.sub-title .txt-box {width: 90%}
	.musician-list {margin:0;}
	.musician-list li {width: 50%; padding:1.5%}
	.musician-list li .txt-box {padding:15px;}
	.pg-musician .filter {margin:35px 0 40px}
	
	.schedule-list {display: block;}
	.schedule-list li {width: 100%}
	.schedule-list h3 strong {font-size: 3rem;}
	
	.company-view .section1 {display: block;}
	.company-view .section1 > div {width: 100%;}
	.company-view .section1 .compoany-logo {margin-bottom: 40px; max-width: 300px;}
	.company-view .section1 .txt-box .img {width: 27%; padding-top: 27%}
	
	.conf-list {margin:40px -0.8% 0 -0.8%;}
	.conf-list li {width: 50%; padding:1.5%}
	.conf-list li a {min-height: 350px;}
	.conf-list li .hover .txt-box {padding:20px}
	.lounge-list h2 span {margin:5px auto; display: block;}
	.musician-info .section3 {display: block; padding:20px;}
	.musician-info .section3 .play-list {width: 100%;}
	.musician-info .section3 .txt-box {width: 100%; margin-left: 0; margin-top: 20px;}
	.musician-info .section3 .txt-box .spotify {position: relative; margin-top:20px;}
	.musictech-list li a {height: 100px;}
}
@media all and (max-width:600px){ 
	.quick-nav li a {width: 80px; height: 80px; font-size: 10px}
	.main-content .tit-box p br {display: none;}
	
	.sub-tab li {margin:0 10px;}
	.pg-musician .search-box .submit-btn {width: 55px;}
	.pg-musician .search-box input[type="text"] {margin:0 10px;}
	
	.musician-slide-wrap .txt-box p {font-size: 2.7rem; margin-bottom: 10px}
	.musician-slide .slick-dots {bottom: 20px}
	.musician-slide .slide {height: 350px;}
	
	.musician-info section {margin:40px 0;}
	.musictech-list li {width: 50%; padding:1.5%}
	.company-view .section2 ul li {width: 100%; margin-bottom: 40px}
	
	.conf-list li {width: 100%;}
	.conf-list li a {min-height: auto;}
	
	.pg-conference .section1 .tit {flex-wrap: wrap}
	.pg-conference .section1 .tit strong {width: 100%; margin-bottom: 5px;}
	.pg-conference .section1 .tit span {margin:0; margin-right: 10px}
	.acc-list li .acc-content {padding:20px 5px}
	.company-list a {width: 50%}
}
@media all and (max-width:450px){ 
	.sub-tab li {margin:0 10px}
	.sub-tab li.on a img {max-width: 40vw}
	.sub-tab li a img {max-width: 30vw}
	.coming-txt img {width:100px;}
}
@media all and (max-width:400px){ 
	.header h1.type1 {width: 245px; padding-top: 14px}
	.header h1.type2 {padding-top: 12px;}
	.header h1.type2 img {width: 90px;}
	.header h1.type2 .moOnly {width: 66px;}
	.header h1.type2 a:nth-of-type(2){margin-left: 10px}
	
	.main-content .title strong {font-size: 3.5rem}
	.main-lineup ul li .txt-box {padding:10px;}
	.main-lineup ul li .txt-box p {font-size: 1.5rem;}
	.main-visual .txt-box {width:70%}
	.main-intro .inner {padding:80px 20px}
	
	.sub-title {height: 350px;}
	
	.musician-social {text-align: center; padding:15px 0} 
	.musician-social a {margin-right: 5px;}
	
	.company-view .section2 ul li .video-col-wrap {display: block;}
	.company-view .section2 ul li .video-col-wrap .video-box {width: 100%; padding-top: 56%; margin-bottom: 5px;}
	
	
}

