@charset "utf-8";

@font-face {
    font-family: 'NanumSquare';
    src: url('../font/NanumSquareL.woff') format('woff'),
    url('../font/NanumSquareL.woff2') format('woff2');
    font-weight:300;
    font-style: normal;
}

@font-face {
    font-family: 'NanumSquare';
    src: url('../font/NanumSquareR.woff') format('woff'),
    url('../font/NanumSquareR.woff2') format('woff2');
    font-weight:400;
    font-style: normal;
}

@font-face {
    font-family: 'NanumSquare';
    src: url('../font/NanumSquareB.woff') format('woff'),
    url('../font/NanumSquareB.woff2') format('woff2');
    font-weight:700;
    font-style: normal;
}

@font-face {
    font-family: 'NanumSquare';
    src: url('../font/NanumSquareEB.woff') format('woff'),
    url('../font/NanumSquareEB.woff2') format('woff2');
    font-weight:800;
    font-style: normal;
}

/* Reset */
* {box-sizing:border-box;}
html,body{width:100%;height:100%;padding:0px; margin:0px;}
body {font-size:16px;font-family:"NanumSquare",Helvetica,sans-serif;line-height:1;color:#58595b;font-weight:400;letter-spacing:-0.05em;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,button,p,blockquote,th,td { margin:0; padding:0; -webkit-text-size-adjust:none;line-height:100%;}
img,fieldset{border:0}
ul,ol,li{list-style:none;}
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
hr {display:none;}
a, a:link {color:inherit;text-decoration:none;}
a:visited {color:inherit;}
a:hover, a:active {color:inherit;text-decoration:none;}
address {font-style:normal; font-weight:normal;}
legend,caption {display:none; clear:both;}
input,textarea,select,button,table { font-size:inherit;font-family:inherit;line-height:inherit; }/**font-size:100%;*/
input,select {vertical-align:middle}
textarea, input {outline-color:-moz-use-text-color;outline-style:none;outline-width:medium;}
textarea {resize:none;}
table {border-collapse:collapse}

button {border:0;cursor:pointer;-webkit-tap-highlight-color:transparent;outline:0 none;background-color:transparent;border-radius:0;}

span, a, strong {display:inline-block;}

article, aside, canvas, details, embed, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block;margin:0;}
command, datalist, keygen, mark, meter, progress, rp, rt, ruby, time, wbr { display: inline; }

/* blind */
.hidden{visibility:hidden;position:absolute;overflow:hidden;height:0;width:0;font-size:0}

/* float */
.f_left{float:left!important}
.f_right{float:right!important}
.clear{clear:both!important}

/* align */
.left{text-align:left!important}
.right{text-align:right!important}
.center,.center td,.center th {text-align:center}
.middle{vertical-align:middle!important}
.top{vertical-align:top!important}

/* float 해제 */
.f-clear:after { content:"."; display:block; clear:both; height:0; visibility:hidden; }
.f-clear { display:inline-block; }
* html .f-clear { height:1%; }
.f-clear { display:block; }

h1,h2,h3,h4,h5,h6 {font-weight:900;}

/*layout*/
body {overflow-x:hidden;}
#wrap {position:relative;min-width:360px;height:auto;margin:0 auto;}
.innerWrap {position:relative;width:980px;height:100%;margin:0 auto;}

figure img {display:block;}
figure.center {display:flex;justify-content:center;}
.pt,
.ani {position:absolute;background-repeat:no-repeat;background-position:0 0;}

header {position:fixed;top:0;left:0;width:100%;height:8.75rem;z-index:1000;}
header .logo {position:absolute;top:2.75rem;left:0;display:block;width:11.375rem;height:3.25rem;background:url("../images/brandLogo.png") 0 center no-repeat;background-size:11.375rem auto;}
header .logo a {width:100%;height:100%;}
header nav {position:absolute;top:2.938rem;right:0;height:80px;}
header nav ul {display:flex;}
header nav ul li {width:6.875rem;height:2.813rem;margin-left:0.938rem;font-size:1rem;line-height:1.125rem;background-color:#f17c22;color:#fff;text-align:center;font-weight:800;border-radius:0.563rem;}
header nav ul li > a {display:flex;width:100%;height:100%;align-items:center;justify-content:center;}
header.fixed {background-color:#fff;}

#wrap section {position:relative;margin:0 auto;}
#wrap main {overflow:hidden;}

.mt25 {margin-top:25px;}
.mt50 {margin-top:50px;}
.mt70 {margin-top:70px;}

.pcVer {display:block;}
.mVer {display:none;}

.horz_list_flex {display:flex;}
.horz_list_flex li {flex:1;text-align:center;}

.headingWrap {padding:14.375rem 0 6.563rem;background-color:#fdeada;}
.headingWrap .visual {margin-top:5.313rem;}
.headingWrap .bar {bottom:0;left:0;height:0.938rem;width:100%;
    background-image:url("../images/headgin_bg_bar.png"),linear-gradient(to right,#f37321 50%,#000 50%);
    background-position:center 0,0 0;
    background-repeat:no-repeat,no-repeat;
    background-size:auto 0.938rem,auto;
}

.liveWrap {padding:5.625rem 0 3.125rem;background-color:#fbb584;text-align:center;}
.liveWrap .info {margin-top:2.188rem;}
.liveWrap .typeBox {display:flex;justify-content:space-between;}
.liveWrap .typeBox figure {height:880px;}

.scheduleWrap {padding:70px 0;background-color:#fdeada;}

.dutyWrap {padding:5rem 0;text-align:center;}
.dutyWrap .link {margin-top:5.625rem;}

.interviewWrap {padding:5rem 0;background-color:#fdeada;}
.interviewWrap .horz_list_flex {margin-top:40px;}
.interviewWrap .horz_list_flex a:hover {transform:translateY(-10px);transition:0.3s ease-in-out;}

.moreInfoWrap {padding:5.625rem 0 4.063rem;}
.moreInfoWrap .horz_list_flex {margin-top:4.063rem;}
.moreInfoWrap .horz_list_flex figure {margin-top:1.25rem;}

.movieWrap {padding:5.625rem 0 4.063rem;background-color:#fbb584;}
.movieWrap .moviePlayArea {position:relative;z-index:20;}
.movieWrap .moviePlayArea .movieFrame {width:520px;margin:1.875rem auto 0;border:solid 7px #fff;box-shadow:0 10px 10px rgba(0,0,0,0.3);}
.movieWrap .moviePlayArea .movieBig {position:relative;width:100%;padding-bottom:56.25%;}
.movieWrap .moviePlayArea .movieBig iframe {position:absolute;width:100%;height:100%;display:block;}
.movieWrap .horz_list_flex li+li {margin-left:3.75rem;}

.flexCenter {display:flex;justify-content:center;}

.list li {font-size:22px;line-height:35px;letter-spacing:-0.02em;}
.infoWrap .list li span {font-family:Arial, Helvetica, sans-serif;}
span.lang {font-family:Arial, Helvetica, sans-serif;}

.dateWrap .text {color:#231f20;font-weight:800;}

.interviewListWrap {padding:215px 0 0 0;background-color:#fdeada !important;}
.interviewListWrap .innerWrap {padding-bottom:60px !important;}
.interviewListWrap p {padding-bottom:30px;border-bottom:solid 2px #f17c22;}
.interviewListWrap .interList {display:flex;margin-top:60px;flex-flow:row wrap;}
.interviewListWrap .interList li {width:234px;height:365px;margin-bottom:60px;text-align:center;}
.interviewListWrap .interList li:not(:nth-of-type(3n)) {margin-right:49px;}
.interviewListWrap .interList li figure {height:278px;}
.interviewListWrap .interList li dl {margin-top:15px;}
.interviewListWrap .interList li dl dt {font-size:20px;color:#f17c22;font-weight:700;}
.interviewListWrap .interList li dl dd {margin-top:5px;font-size:27px;line-height:32px;color:#231f20;font-weight:700;}

.interviewDetailPage .interviewDetailWrap .photoBox {position:relative;padding:11.375rem 0 2.5rem;background-color:#fdeada !important;text-align:right;}
.interviewDetailPage .interviewDetailWrap .photoBox dl {position:absolute;bottom:6.875rem;left:calc(50% - 18.75rem);text-align:left;}
.interviewDetailPage .interviewDetailWrap .photoBox dl dt {font-size:1.563rem;color:#eb7324;font-weight:700;}
.interviewDetailPage .interviewDetailWrap .photoBox dl dd {margin-top:1rem;font-size:2.188rem;color:#231f20;font-weight:700;}
.interviewDetailPage .interviewDetailWrap .photoBox img {margin-right:4.625rem;}
.interviewDetailPage .interviewDetailWrap .interviewList {position:relative;margin-top:7.5rem;padding:0 0 6.25rem 11.563rem;}
.interviewDetailPage .interviewDetailWrap .interviewList h3.title {position:absolute;top:0;left:0;font-size:1.875rem;color:#eb7324;font-weight:700;}
.interviewDetailPage .interviewDetailWrap .interviewList h3.title span {border-bottom:solid 1px #eb7324;}
.interviewDetailPage .interviewDetailWrap .interviewList dl {word-break:keep-all;}
.interviewDetailPage .interviewDetailWrap .interviewList dl dt {padding-left:15px;font-size:1.25rem;line-height:2.188rem;color:#fff;font-weight:700;background-color:#f37321;border-radius:1rem;}
.interviewDetailPage .interviewDetailWrap .interviewList dl dd {margin-top:1rem;font-size:1.188rem;line-height:2.188rem;font-weight:300;color:#231f20;letter-spacing:-0.02em;}
.interviewDetailPage .interviewDetailWrap .interviewList dl dd strong {display:initial;}
.interviewDetailPage .interviewDetailWrap .interviewList dl:not(:last-child) {margin-bottom:3.125rem;}

/* page motion */
.add-upscroll:not(.play-mo) {transform:translateY(70px) ;opacity:0;}
.play-mo.add-upscroll ,.play-mo .add-upscroll {animation: add-upscroll 0.7s 0s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay10 ,.play-mo .add-upscroll.delay10 {animation: add-upscroll 0.8s 0.1s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay20 ,.play-mo .add-upscroll.delay20 {animation: add-upscroll 0.8s 0.2s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay30 ,.play-mo .add-upscroll.delay30 {animation: add-upscroll 0.8s 0.3s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay40 ,.play-mo .add-upscroll.delay40 {animation: add-upscroll 0.8s 0.4s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay50 ,.play-mo .add-upscroll.delay50 {animation: add-upscroll 0.8s 0.5s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay60 ,.play-mo .add-upscroll.delay60 {animation: add-upscroll 0.8s 0.6s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay70 ,.play-mo .add-upscroll.delay70 {animation: add-upscroll 0.8s 0.7s ease-in-out;animation-fill-mode: both;}
.play-mo.add-upscroll.delay80 ,.play-mo .add-upscroll.delay80 {animation: add-upscroll 0.8s 0.8s ease-in-out;animation-fill-mode: both;}
@keyframes add-upscroll {
	0%		{transform:translateY(70px);opacity:0;}
	100%	{transform: translateY(0px);opacity:1;}
}

.add-downscroll:not(.play-mo) {transform:translateY(-70px) ;opacity:0;}
.play-mo.add-downscroll ,.play-mo .add-downscroll {animation: add-downscroll 0.7s 0.0s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay10 ,.play-mo .add-downscroll.delay10 {animation: add-downscroll 0.7s 0.1s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay20 ,.play-mo .add-downscroll.delay20 {animation: add-downscroll 0.7s 0.2s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay30 ,.play-mo .add-downscroll.delay30 {animation: add-downscroll 0.7s 0.3s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay40 ,.play-mo .add-downscroll.delay40 {animation: add-downscroll 0.7s 0.4s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay50 ,.play-mo .add-downscroll.delay50 {animation: add-downscroll 0.7s 0.5s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay60 ,.play-mo .add-downscroll.delay60 {animation: add-downscroll 0.7s 0.6s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay70 ,.play-mo .add-downscroll.delay70 {animation: add-downscroll 0.7s 0.7s ease-in-out;animation-fill-mode: both;}
.play-mo.add-downscroll.delay80 ,.play-mo .add-downscroll.delay80 {animation: add-downscroll 0.7s 0.8s ease-in-out;animation-fill-mode: both;}

@keyframes add-downscroll {
	0%		{transform: translateY(-70px) ;opacity:0;}
	100%	{transform: translateY(0px);opacity:1;}
}

.play-mo.shakeAni, .play-mo .shakeAni {
	animation: game_shake 0.5s infinite both;
}

@keyframes game_shake {
	0% 		{transform: rotate(2deg);}
	50% 	{transform: rotate(0);}
	100% 	{transform: rotate(2deg);}
}

@media (hover : hover) {
	
}

@media (max-width:980px) {
    .innerWrap {width:100%;padding:0 1.25rem;}
    header .logo {left:1.25rem;}
    header nav {right:1.25rem;}

    .headingWrap .innerWrap > figure img,
    .liveWrap .innerWrap > figure img,
    .dutyWrap .innerWrap > figure img,
    .interviewWrap .innerWrap > figure img,
    .moreInfoWrap .innerWrap > figure img {width:100%;}

    .horz_list_flex li img {width:100%;}
    .moreInfoWrap .horz_list_flex li+li {margin-left:20px;}
    .moreInfoWrap .horz_list_flex li figure img {width:80%;}
}

@media (max-width:750px) {
	
    html {font-size:14px;}

	.interviewDetailPage .interviewDetailWrap .photoBox dl {left:30px;}
	/* .interviewDetailPage .interviewDetailWrap .photoBox img {margin-left:;} */
}

@media (max-width:650px) {
    html {font-size:11px;}

    .interviewDetailPage .interviewDetailWrap .interviewList {padding-left:0;}
    .interviewDetailPage .interviewDetailWrap .interviewList h3.title {position:relative;margin-bottom:2rem;}
    .interviewDetailPage .interviewDetailWrap .photoBox img {width:25rem;}
}

@media (max-width:500px) {
    html {font-size:8px;}

    header nav ul li {height:3rem;}

    .liveWrap .link img {width:60%;}
    .dutyWrap .link img {width:60%;}

    .mVer {display:block;}
    .pcVer {display:none;}

    .headingWrap .innerWrap > figure img.mVer,
    .liveWrap .innerWrap > figure img.mVer,
    .moreInfoWrap .innerWrap > figure img.mVer {width:auto;}

    .movieWrap .moviePlayArea .movieFrame {border-width:2px;}
    .movieWrap .horz_list_flex {flex-flow:row wrap;}
    .movieWrap .horz_list_flex li {flex:none;width:100%;}
    .movieWrap .horz_list_flex li figure img {width:60%;}
    .movieWrap .horz_list_flex li+li {margin:40px 0 0 0;}

    .interviewDetailPage .interviewDetailWrap .photoBox dl dt {font-size:2rem;}
    .interviewDetailPage .interviewDetailWrap .photoBox dl dd {font-size:3rem;}

    .interviewDetailPage .interviewDetailWrap .interviewList h3.title {font-size:2.5rem;}
    .interviewDetailPage .interviewDetailWrap .interviewList dl dt {font-size:1.75rem;line-height:3.5rem;}
    .interviewDetailPage .interviewDetailWrap .interviewList dl dd {padding:0 5px;font-size:1.75rem;line-height:2.75rem;}
}