@charset "utf-8";
/*************************************************
프로젝트명 : 연합뉴스TV 행사페이지
commnet : contents.css (PC 모드)
*************************************************/

@import url('swiper-3.4.2.min.css');

/* =============== ######공통 (common) ======================== */
html,body{height:auto;}
body{font-weight:400;font-family:'Spoqa Han Sans Neo','Malgun Gothic','맑은 고딕',Gulim,'굴림',AppleSDGothicNeo-Regular,sans-serif;letter-spacing:-0.3px;line-height:1;color:#231815;font-size: 17px;}
h1,h2,h3,h4,h5,h6{font-weight:400;}
strong{font-weight:500;display: inline;}
a{display:inline-block;vertical-align:top;}

@media only screen and (min-width:980px){
	body{min-width:1100px;}
	a:hover{text-decoration:underline;}
	a:active,a:hover{outline:0;}
}

.ir-txt{display:inline-block;text-indent:-9999px;font-size:0;}
.ir-txt::selection{font-size:0;} /* 드래그시 버튼에 글자 보임 방지 */

/* =============== 상단메뉴 (nav) ======================== */
.inner{width: 970px;max-width: 100%;margin: 0 auto;}
.inner::after{content: '';display: block;clear: both;}
.header{position: relative;z-index: 200;background: #fff;}
.header-box{padding: 20px 0;display: flex;align-items: center;justify-content: space-between;}
.logo{flex: 1;}
.logo>a>.ir-txt{box-sizing: border-box;background: url(../img/sprites_yonhapnewstv.svg) 0 -50px no-repeat;width: 287px;height: 20px;margin-left: 10px;}
.nav{flex: 1.6;}
.nav-menu{display: flex;flex-flow: row wrap;justify-content: space-around;align-items: center;}
.nav-menu>li>a{font-size: 18px;font-weight: 500;position: relative;text-decoration: none;}
.nav-menu>li>a::after{width: 0;height: 0.3rem;background: #3e9c9b;left: 50%;content: '';display: block;position: absolute;bottom: -21px;}
.nav-menu>li>a:hover::after{width: 100%;left: 0;transition: all .3s;}

.mobile-menu, .mobile-btn {display: none;}

/* =============== 메인비주얼 ======================== */      
.main-visual{text-align: center;}

/* =============== 스팟영상, 협찬 ======================== */
.spot-video {background-color: #dbe2fb;padding: 50px;height: auto;}
.spot-video > div > iframe {margin: 0 auto;max-width: initial;}
.sponsor{text-align: center;padding: 40px 0 60px 0;}
.sponsor>h2{font-size: 24px;font-weight: 500;margin-bottom: 30px;}
.sponsor>ul{display: grid;grid-template-columns: repeat(auto-fill, minmax(19%, auto));gap: 10px;}
.sponsor>ul>li>img{max-width: 100%;}

/* =============== 서브페이지 ======================== */
.sub-visual{height: 180px;background: #b7bbab;position: relative;}
.sub-visual>.obj{background: url(../img/sub-visual.png) center bottom no-repeat;width: 1903px;max-width:100%;height:180px;z-index: 1;margin: 0 auto;}
.contents{padding: 45px 0 80px 0;}
.contents>h1{text-align: center;}
.contents>h1>span{font-size: 25px;font-weight: 500;margin-bottom: 24px;text-align: center;}

/* =============== 인사말 ======================== */
.cont-unit01{display: flex;flex-wrap: wrap;}
.cont-unit01>.img{flex: 1;}
.cont-unit01>.info{flex: 3;margin-left: 60px;}
.cont-unit01>.img>img{max-width: 100%;}
.cont-unit01>.info>p{margin-bottom: 20px;text-indent: 8px;line-height: 28px;font-weight: 300;text-align: justify;}
.cont-unit01>.info>.sign{float: right;font-size: 15px;margin-top: 30px;}
.cont-unit01>.info::after{content: '';display: block;clear: both;}
.cont-unit01>.info>.sign>p>span {vertical-align: middle;font-size: 24px;margin: -4px 0 0 18px;letter-spacing: 10px;}
.cont-unit01>.info>.sign>p>span>img{max-width: 100%;}

/* =============== 음악회소개 ======================== */
.sec2, .sec3{margin-top: 80px;}
.poster>img{max-width: 100%;}
.event-cont{margin-bottom: 20px;display: flex;}
.event-cont>ul{flex: 1 1 40%;}
.event-cont>ul:last-child>li>p:first-child{background: #3e9c9b;background: #3e9c9b;}
.event-cont>ul>li{display: flex;align-items: flex-start;flex-flow: row wrap;line-height: 1.5;}
.event-cont>ul>li>p:first-child{border-radius: 50px;color: #fff;background: #3e9c9b;width: 120px;height: 38px;line-height: 38px;text-align: center;margin: 0 17px 0 0px;vertical-align: top;text-indent: 6px;letter-spacing: 6px;}
.event-cont>ul>li>p:last-child{margin: 7px -3px 21px 0;flex: 1;}
iframe {max-width: 100%;}

/* =============== 프로그램 ======================== */
ul.tab01{margin-bottom: 40px;border-bottom: 1px solid #e3e3e3;}
ul.tab01>li{display: inline-block;width: 170px;border-top: 1px solid #e3e3e3;border-left: 1px solid #e3e3e3;border-right: 1px solid #e3e3e3;text-align: center;font-size: 19px;color: #797979;padding: 11px;cursor: pointer;margin-bottom: -1px;box-sizing: border-box;}
ul.tab01>li:last-child{margin-left: -4px;}
ul.tab01>li.current{border-top: 2px solid #231815;border-left: 2px solid #231815;border-right: 2px solid #231815;border-bottom: 1px solid #fff;color: #231815;font-weight: 500;position: relative;z-index: 1;}

.tab-content{display: none;position: static;}
.tab-content.current{display: inherit;}
.tab-content>p{padding-left: 10px;}

.table-container01>div{display: grid;grid-template-rows: minmax(20px, auto);grid-template-columns: 1fr 2fr 1fr;text-align: center;align-items: center;}
.table-container01>.table-title{display: block;color: #fff;background: linear-gradient(to right, #3e9c9b 0, #3e9c9b 70%, #d8c0a5 100%);padding: 8px 0;}
.table-container01>.table-cont:nth-child(odd){background: #F9F9FB;}
.table-container01>.table-cont:last-child{background: none;}
.table-container01>div:nth-child(7){display: block;}
.table-container01>.table-cont{padding: 20px 0;}
.table-container01>.table-cont>.item:first-child>p{text-align: left;padding-left: 23%;}
.table-container01>.table-cont>.item:nth-child(2){color: #286d6a;text-align: left;}
.table-container01>.table-cont>.item{line-height:1.3;}
.table-container01>.table-cont>.item>p{margin-bottom: 14px;}   
.table-container01>.table-cont>.item>p:last-child{margin-bottom: 0;}
.table-container01>.table-cont>.item>p>span{font-size: 13px;display: block;line-height: 2;font-weight: 300;color: #999;} 
.detail01{margin-top: 24px;color: #999;font-size: 15px;font-weight: 300;}
.detail01>p:first-child{margin-bottom: 10px;}

.cont-unit02{margin-bottom: 60px;padding: 0 10px;}
.cont-unit02>h2{font-size: 21px;font-weight: 500;margin-bottom: 10px;color: #231815;}
.cont-unit02>h5{color: #999;font-weight: 300;font-size: 14px;margin-bottom: 18px;}
.cont-unit02>p{line-height: 28px;font-weight: 300;}
.detail02{color: #fff;background:  linear-gradient(to right, #3e9c9b 0, #3e9c9b 70%, #d8c0a5 100%);margin-bottom: 27px;font-size: 18px;position: relative;padding: 5px 5px 5px 10px;}
/*.detail02::after{content: '';border: 1px solid #45508a;position: absolute;top: 50%;right: 0;width: calc(100% - 50px);}*/

/* =============== 출연진 ======================== */
.cont-unit03>.img-background{background: url(../img/person.jpg) center no-repeat;max-width: 100%;width: 970px;height: 1441px;color:#fff;}
.cont-unit03>.img-background>.info{padding: 80px;}
.cont-unit03>.img-background>.info>h2{font-weight: 500;font-size: 28px;margin-bottom: 35px;}
.cont-unit03>.img-background>.info>p{text-align: justify;font-weight: 300;line-height: 30px;margin-bottom: 20px;}
/* =============== 오시는 길 ======================== */
.location{margin-bottom: 40px;}
.location>h2{font-weight: 500;font-size: 22px;margin-bottom: 15px;}
.location>p{line-height: 1.5;color: #696969;}
.map>iframe{width: 100%;min-height: 300px;margin-bottom: 30px;}
.table-container02>.table-title{color: #fff;background:  linear-gradient(to right, #3e9c9b 0, #3e9c9b 70%, #d8c0a5 100%);padding: 8px 0;text-align: center;}
.table-container02>.table-cont{display: grid;grid-template-rows: minmax(20px, auto);grid-template-columns: 0.3fr 1fr;text-align: center;align-items: center;padding: 18px 0;border-bottom: 1px solid #E2E2E2;line-height: 1.5;}
.table-container02>.table-cont>.item:first-child{font-weight: 500;}
.table-container02>.table-cont>.item:last-child{text-align: left;}
.table-container02>.table-cont>.item>span{display: block;margin-top: 7px;font-size: 15px;}
.table-container02>.table-cont>.item strong{color: #c83535;}
.color01{color: #4dab39;}
.color02{color: #bb527c;}

/* =============== 풋터 ======================== */
footer {text-align: center;border-top: 1px solid #f3f3f3;padding: 50px 0;}
footer>.ir-txt {box-sizing: border-box;background: url(../img/sprites_yonhapnewstv.svg) 0 0 no-repeat;width: 112px;height: 19px;}
footer > address {font-size: 12px;margin-top: 15px;font-weight: 300;color: #999;}