@charset "utf-8";
/*
	국립심포니오케스트라 MAIN STYLE
    WRITER : Kim Cheonhyun
	Last Modify Date : 2022. 11. 10.
*/

/* layout */
#wrap { /*padding-top:6.25rem;*/ font-family:'Pretendard'; }
br { font-family:dotum; }
.visual {overflow:hidden;position:relative;height:800px;}
.contentWrap,
.boardWrap { max-width:1280px; margin:0 auto; padding:0 4%; }
.contentWrap::before,
.contentWrap::after { content:''; clear:both; display:block; }
.boardWrap { position:relative; margin-top:7.5rem; margin-bottom:5.375rem; }

/* main layer popup */
.topLayerWrap { position:relative; }
.layerPopup { display:none; position:relative; text-align:center; background:#fff center no-repeat; background-size:cover; box-sizing:border-box; z-index:2; }
.layerPopup .layerCon { width:100%; height:100%; text-align:center; }
.layerPopup .layerCon a {display: block; width: 100%; height: 100%;}
.layerPopup .layerCon .item img { display:inline-block; }
.topLayer .slick-dots { position:absolute; left:0; bottom:0; width:100%; text-align:center; }
.topLayer .slick-dots li { display:inline-block; }
.topLayer .slick-dots li button { width:12px; height:12px; margin:.2em; background:#6a54f4; border:1px solid #6A54F4; border-radius:50%; text-indent:-999px; overflow:hidden; }
.topLayer .slick-dots li.slick-active button { border-radius:0; }
.topLayerWrap .navi { position:absolute; right:1%; bottom:5px; width:180px; padding:3px 2px 5px; background:rgba(0,0,0,0.5); border-radius:6px; overflow:hidden;text-align:center; z-index:2; }
.topLayerWrap .navi * { vertical-align:middle; }
.topLayerWrap .navi label { font-size:12px; color:#fff; }
.topLayerWrap .navi input[type='checkbox']:checked + label:before { width:10px; height:10px; background:#fff; background-size:10px auto; margin-top:1px;}
.topLayerWrap .navi input[type='checkbox'] + label span { font-size: 12px;;}
.topLayerWrap .navi input[type='checkbox'] + label:before { width:10px; height: 10px; margin-left:-5px; margin-right:4px; }
.topLayerWrap .navi input[type='checkbox']:focus + label:before {outline: 1px dashed #ffff00;}
.topLayerWrap .navi .popClose { display:inline-block; line-height:16px; margin-left:10px; padding:0 4px; border:0; text-align:center; color:#fff; border:1px solid #000; background:#333; font-size:12px; }
@media only screen and (max-width:1023px) {
    .layerPopup { padding:0; z-index:auto; }
	.layerPopup .layerCon { padding:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; }
}

/* visual */
.visual .swiper-container{height:100%}
.visual .swiper-wrapper{-webkit-transform-style:preserve-3d;-webkit-transform:translateZ(0);}
.visual .swiper-slide{height:100%;overflow:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden;-webkit-transform:translate3d(0, 0, 0);-moz-transform:translate3d(0, 0, 0);-ms-transform:translate3d(0, 0, 0);-o-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0); }
.billboard-hero__inner{position:absolute;width:100%;height:100%;left:0;top:0;background:rgba(0,0,0,0) center center no-repeat;-webkit-background-size:cover;background-size:cover; transition:all .4s;}
.visual .video__iframe{width:100%;height:100%;object-fit:cover}
.visual .slide-controls{position:absolute;right:0;left:0;bottom:20px;z-index:5;opacity:0;text-align:center; }
.visual .slide-controls .slide-fraction{width:50px;margin:0 auto;line-height:23px;background-color:rgba(255,255,255,.3);-webkit-border-radius:13px;-moz-border-radius:13px;border-radius:13px}
.visual .slide-controls .slide-fraction .text-inner{font-weight:500}
.visual .slide-controls .slide-scrollbar{display:none}
.visual .slideBtn { display:none; position:absolute; top:0; width:7rem; height:100%; z-index:5; }
.visual .slideBtn[tabindex] { display:block; }
.visual .slideBtn.btn-prev { left:0; text-align:right; }
.visual .slideBtn.btn-next { right:0; text-align:left; }
.visual .slideBtn span { display:block; border-bottom:1px solid #fff; color:#fff; font-size:.9375rem; }
.visual .billboard-hero__inner video,
.visual .billboard-hero__inner iframe { display:block; position:absolute; top:50%; left:0; width:100%; min-height:800px; transform:translateY(-50%); object-fit:cover; }

/* contentWrap */
.schduleWrap { float:left; width:62.5%;/*800/1280*/ margin-top:5.875em; }
.schduleWrap h3 { margin-bottom:1.125rem; font-size:1.875rem; }
.schduleWrap .dateLine { display:flex; justify-content:space-between; align-items:center; padding:.5625rem 0; border-top:1px solid #000; border-bottom:1px solid #e5e5e5; }
.schduleWrap .dateLine h4 { flex-grow:0; flex-shrink:0; color:#143228; font-size:1.375rem; font-weight:500; letter-spacing:-.025em; }
.schduleWrap .dateLine ul { display:flex; justify-content:space-between; align-items:center; flex-grow:1; flex-shrink:1; max-width:27.5rem; margin:0 auto; padding:0 1em; }
.schduleWrap .dateLine li {}
.schduleWrap .dateLine li button,
.schduleWrap .dateLine li p { width:3.25rem; height:3.25rem; border-radius:50%; text-align:center;  }
.schduleWrap .dateLine li p { display:flex; flex-direction:column; justify-content:center; align-items:center; }
.schduleWrap .dateLine li button:hover,
.schduleWrap .dateLine li button:focus { text-decoration:underline; }
.schduleWrap .dateLine li button i,
.schduleWrap .dateLine li button span,
.schduleWrap .dateLine li p i,
.schduleWrap .dateLine li p span { display:block; line-height:1; }
.schduleWrap .dateLine li button i,
.schduleWrap .dateLine li p i { color:#7d7d7d; font-size:.8125rem; font-weight:300; }
.schduleWrap .dateLine li button span,
.schduleWrap .dateLine li p span { color:#17523e; font-size:1.25rem; font-weight:400;  }
.schduleWrap .dateLine .curDate { border-radius:50%; border:2px solid #1c3f37; color:#000; vertical-align:middle; font-weight:700; }
.schduleWrap .dateLine button.active { background:#1c3f37; }
.schduleWrap .dateLine button.active i,
.schduleWrap .dateLine button.active span { color:#ecc4c4; }
.schduleWrap .dateLine button.active i { font-weight:400; }
.schduleWrap .dateLine button.active span { font-weight:700; }
.schduleWrap .dateLine button.regular { background:#ecc4c4; color:#1c3f37; }
.schduleWrap .dateLine button.regular i { color:#1c3f37; font-weight:400;  }
.schduleWrap .dateLine button.regular span { color:#1c3f37; font-weight:500; }
.schduleWrap .dateLine .btnMore { flex-grow:0; flex-shrink:0; }
.schduleWrap .dateLine .btnMore a { display:block; overflow:hidden; position:relative; width:3.125rem; height:3.125rem; border:1px solid #bfd2c9; border-radius:.625rem; box-sizing:border-box; text-indent:-999px; }
.schduleWrap .dateLine .btnMore a:before,
.schduleWrap .dateLine .btnMore a:after { content:''; position:absolute; left:50%; top:50%; background:#14503c; }
.schduleWrap .dateLine .btnMore a:before { width:1rem; height:.0625rem; margin-left:-.5rem; margin-top:-.03125rem; }
.schduleWrap .dateLine .btnMore a:after { width:.0625rem; height:1rem; margin-top:-.5rem; margin-left:-.03125rem; }
.schduleList { margin-top:1.875rem; }
.schduleList h4 { font-weight:500; font-size:1.375rem; }
.schduleList .item { overflow:hidden; position:relative; margin-top:3.25rem; }
.schduleList .item:nth-of-type(1) { margin-top:1.5rem; } 
.schduleList .item .img { overflow:hidden; float:left; position:relative; width:33.375%; padding-top:33.375%; }
.schduleList .item .img img { position:absolute; left:50%; top:50%; width:100%; transform:translate(-50%,-50%); }
.schduleList .item dl { margin-left:40%; padding-bottom:3.750em; }
.schduleList .item dl dt { margin-bottom:.75rem; }
.schduleList .item dl dt p.category { position:relative; margin-bottom:.625rem; line-height:1.2; }
.schduleList .item dl dt span { display:inline-block; position:relative; }
.schduleList .item dl dt p.category span:before { content:''; position:absolute; left:0; bottom:0; width:100%; height:.5em; background:#f5e1e1; }
.schduleList .item dl dt span i { position:relative; color:#14503c; font-weight:800; }
.schduleList .item dl dt span.tit { display:-webkit-box; -webkit-line-clamp:2; overflow:hidden; text-overflow:ellipsis; -webkit-box-orient:vertical; height:2.357em; line-height:1.1785; font-size:1.75rem; font-weight:600; word-wrap:break-word; }
.schduleList .item dl dd { overflow:hidden; line-height:1.6; text-overflow:ellipsis; font-size:1.25rem; }
.schduleList .item dl dd:nth-of-type(1) { height:3.200em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp:2; }
.schduleList .item dl dd:nth-of-type(2) { white-space:nowrap; }
.schduleList .item marquee { overflow:hidden; display:block; width:100%; height:100%; }
.schduleList .item ul { display:flex; flex: 1 0 auto; position:absolute; bottom:0; left:40%; }
.schduleList .item ul li { display:inline-block; vertical-align:top; }
.schduleList .item ul li:first-child { margin-right:0.5em; }
.schduleList .item ul a { display:block; width:9.875rem; line-height:3.125rem; border-radius:1.6rem; box-sizing:border-box; text-align:center; font-size:1.125rem; }
.schduleList .item ul li.view a { background:#fff; border:1px solid #1d5643; color:#14503c; font-weight:500; }
.schduleList .item ul li.ticket a { background:#1c3f37; color:#ecc4c4; font-weight:700; }
.lkWrap { float:right; width:27.5%;/*352/1280*/ margin-top:6.375em; }
.lkWrap h4 { margin-bottom:1.625rem; font-size:1.5625rem; line-height:1; }
.lkList ul { display:flex; flex-wrap:wrap; justify-content:space-between; margin-bottom:5.625em; }
.lkList ul li { display:inline-block; width:48.2954%; flex-basis:48.2954%; align-items:center; margin-bottom:.625rem; box-sizing:border-box; }
.lkList ul li a { display:flex; align-items:center; justify-content:center; width:100%; height:9.8125rem; padding:.25em; background:#ecc4c4 url(../images/main/bg_link.png) left top; background-size:5.3125rem auto; box-sizing:border-box; text-align:center; color:#152f29; font-size:1.375rem; font-weight:600; letter-spacing:-.025em; }
.lkList ul.FontWeightBold li a { font-weight:800; } 
.lkList ul li a:hover,
.lkList ul li a:focus { transform:translate(-2px, -2px); box-shadow:0.25em 0.25em 0px 0px rgba(28,63,55,1); transition:0.4s ease-in; }
.snsList ul { display:flex; flex-wrap:wrap; }
.snsList ul li { display:inline-block; width:23.8637%; margin-bottom:0.375em; margin-left:1.5150666%; }
.snsList ul li:nth-child(4n+1) { margin-left:0; }
.snsList ul li a { overflow:hidden; display:block; padding-top:90.4762%; border:1px solid #e5d8c8; background:#e5d8c8 center no-repeat; background-size:5.250rem auto; text-indent:-999px; font-size:0; box-sizing:border-box; }
.snsList ul li.sns1 a { background-image:url(../images/main/icon_sns1.png); }
.snsList ul li.sns2 a { background-image:url(../images/main/icon_sns2.png); }
.snsList ul li.sns3 a { background-image:url(../images/main/icon_sns3.png); }
.snsList ul li.sns4 a { background-image:url(../images/main/icon_sns4.png); }
.snsList ul li.sns5 a { background-image:url(../images/main/icon_sns5.png); }
.snsList ul li.sns6 a { background-image:url(../images/main/icon_sns6.png); }
.boardWrap h3 { margin-bottom:2.375rem; font-size:1.875rem; }
.boardGroup .tabList { position:absolute; right:4%; top:0; }
.boardGroup .tabList li { display:inline-block; }
.boardGroup .tabList li a { display:block; padding:.5em 1.25em; background:#fff; line-height:1.5; border-radius:2em; color:#686868; }
.boardGroup .tabList li a.active,
.boardGroup .tabList li a:hover,
.boardGroup .tabList li a:focus { background:#1c3f37; color:#ecc4c4; font-weight:700; transition:background 0.4s; }
.boardGroup .boardList ul { display:flex; }
.boardGroup .boardList ul li { width:32%; margin-left:2%; box-sizing:border-box; }
.boardGroup .boardList ul li:first-child { margin-left:0; }
.boardGroup .boardList ul li a { display:block; padding:2.8125rem 1.875rem; border:1px solid #e5e5e5; letter-spacing:-.025em; }
.boardGroup .boardList ul li a:hover,
.boardGroup .boardList ul li a:focus { border-color:#1c3f37; transform:translate(-2px, -2px); box-shadow:0.5em 0.5em 0px 0px rgba(28,63,55,1); transition:0.4s; }
.boardGroup .boardList ul li .tit,
.boardGroup .boardList ul li .txt { display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-box-orient:vertical; word-wrap:break-word; }
.boardGroup .boardList ul li .tit { -webkit-line-clamp:2; height:2.8em; line-height:1.4; font-size:1.25rem; font-weight:600; }
.boardGroup .boardList ul li a:hover .tit,
.boardGroup .boardList ul li a:focus .tit { text-decoration:underline; }
.boardGroup .boardList ul li .date { display:block; margin:1rem 0; color:#737373; font-size:.9375rem; }
.boardGroup .boardList ul li .txt { display:none; -webkit-line-clamp:3; height:4.2em; line-height:1.4; color:#333; font-size:1.0625rem; }

@supports (display:flex) {
	.schduleList .item dl dd:nth-of-type(1) { height:auto; }
}
@media only screen and (max-width:1280px) {
	.visual { height:62.5vw; }
	.visual .billboard-hero__inner video,
	.visual .billboard-hero__inner iframe { top:0; left:50%; width:auto; height:62.5vw; min-height:auto; transform:translateX(-50%); }
    .schduleList .item dl dt span.tit br { display:none; }
}
@media only screen and (max-width:960px) {
    #wrap { padding-top:0; }

	.visual .slide-controls .slide-fraction,
	.visual .slideBtn,
	.visual .slideBtn[tabindex] { display:none; }
	.visual .slide-controls .slide-scrollbar { display:block; }
	.visual .slide-controls .slide-scrollbar .swiper-pagination-bullet { margin:0 4px; background:#fff; opacity:0.5; }
	.visual .slide-controls .slide-scrollbar .swiper-pagination-bullet-active { opacity:1; }
	.schduleWrap { position:relative; float:none; width:100%; margin-top:2em; }
	.schduleWrap h3 { font-size:1.545em; }
	.schduleWrap .dateLine h4 { position:absolute; top:2px; right:0; }
	.schduleWrap .dateLine ul { max-width:none; }
	.schduleWrap .dateLine li { margin:0 1px; }
	.schduleWrap .dateLine li button span { font-size:1.091rem; }
	.schduleWrap .dateLine .btnMore { display:flex; justify-content:flex-end; align-items:center; width:5em; }
	.schduleList .item:nth-of-type(1) { margin-top:2em; }
	.schduleList .item .img { width:37.73927%; margin-bottom:1em; padding-top:37.73927%; }
	.schduleList .item .img img { width:100%; height:100%; }
	.schduleList .item dl { margin-top:0.364em; margin-left:43.5%; padding-bottom:0; }
	.schduleList .item dl dt p.category { margin-bottom:0.7em; }
	.schduleList .item dl dt span.tit { height:auto; -webkit-line-clamp:1; font-size:1.455em; }
	.schduleList .item dl dd { height:auto; font-size:1.091em; }
	.schduleList .item dl dd:nth-of-type(1) { height:auto; -webkit-line-clamp:1; }
	.schduleList .item ul { position:static; max-width:56.52174%; margin:0.5rem auto 0; }
	.schduleList .item ul li { flex-grow:1; width:48.5%; }
	.schduleList .item ul li:first-child { margin-right:3%; }
	.schduleList .item ul a { width:100%; }
	
    .lkWrap { float:none; width:100%; margin-top:3.455em; }
	.lkWrap h4 br { display:none; }
	.lkList ul { margin-bottom:2.545em; }
	.lkList ul li { flex-basis:auto; width:49%; }
	.lkList ul li a:hover,
	.lkList ul li a:focus { transform:none; transition:none; box-shadow:none; }
	.lkList ul li a { height:41.11111vw; }
	.snsList ul li { width:32.3232%; margin-bottom:0.5em; }
	.snsList ul li:nth-child(4n+1) { margin-left:1.5150666%; }
	.snsList ul li:nth-child(3n+1) { margin-left:0; }
	
	.boardWrap h3 { margin-bottom:1.091rem; font-size:1.545rem; }
	.boardGroup .tabList li a { padding:0.333em 0.833em; font-size:1.091em; }
	.boardWrap { margin-top:3em; margin-bottom:4.182em; }
	.boardGroup .boardList ul li:nth-child(3) { display:none; }
	.boardGroup .boardList ul li { width:49%; }
	.boardGroup .boardList ul li a { padding:1.455em; }
	.boardGroup .boardList ul li a:hover,
	.boardGroup .boardList ul li a:focus { border-color:#e5e5e5; transform:none; box-shadow:none; transition:none; }
}
@media only screen and (max-width:720px) {
	.visual,
	.visual .billboard-hero__inner video,
	.visual .billboard-hero__inner iframe { height:min(400px, 111.1111vw); }
}
@media only screen and (max-width:360px) {
	.schduleWrap .dateLine ul { padding:0; }
	.schduleWrap .dateLine .btnMore { width:auto; margin-left:2px; }
}

@media print {
    body { width:210mm; height:277mm; margin:0; /* margin: auto auto; 로 자동 여백 설정도 가능 */ } 
    #container>section,
    #container>div {page-break-before: always;}
}

/* 레이어 팝업 */
.popupWrap { display:none; z-index:5; position:absolute; top:6.25em; left:0; right:0; width:100%; max-width:1920px; margin:0 auto; text-align:center; }
.popupWrap.viewWrap { display:block; text-align:left; }
.popupWrap .popup {	display:none; margin:0 5px; box-sizing:border-box; }
.popupWrap .popup.viewPop { display:inline-block; vertical-align:top; }
.popupWrap .popup .popupTop { border:1px solid #462e2e; box-sizing:border-box; }
.popupWrap .popup .popupTop a { display:inline-block; }
.popupWrap .popup iframe { width:640px; height:360px; }
.popupWrap .popupBtm { padding:6px; background:#000; color:#fff; text-align:center; line-height:22px; font-size:14px; }
.popupWrap .popupBtm label { display:inline-block; padding:0 5px; }
.popupWrap .popupBtm button { width:35px; height:21px; border:1px solid #dcdcdc; vertical-align:top; color:#fff; }
@media all and (max-width: 767px) {
	.popupWrap .popup iframe { width:100% !important; height:auto !important; }
}