@charset "utf-8";

html,body {font-size:16px;}
body {overflow-x:hidden;}

input[type="text"],
input[type="password"],
input[type="file"] {height:45px; line-height:45px;border-radius:0;padding:0 10px;}
input[type="image"] {border:none;border-radius:0;}
input[type="submit"] {height:25px;}


/* placeholder */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {color:#444;font-size:16px;}
input:-moz-placeholder,
textarea:-moz-placeholder {color:#444;font-size:16px;}
input::-moz-placeholder,
textarea::-moz-placeholder {color:#444;font-size:16px;}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {color:#444;font-size:16px;}


/*------------------------------------------------
* button
/*------------------------------------------------*/

/* button */
.btn-pop-info {margin-right:10px;}
.btn-info-vod {background:url('../../resources/images/btn-pop-play.png') no-repeat;background-size:cover;width:48px;height:49px;background-color:#fff;border-radius:100%;}
.btn-info-vod:hover {background-color:#ccc;}
.btn-info-link {background:url('../../resources/images/btn-pop-link.png') no-repeat;background-size:cover;width:48px;height:48px;border-radius:100%;border:2px solid #fff;transition:opacity 0.25s;}
.btn-info-link:hover {opacity:0.7;}
.btn-info-vod,
.btn-info-link {display:none;}

.btn-info-share {font-size:20px;color:#fff;background:#666;padding:10px 23px;border-radius:30px;}
.btn-info-share:before {content:"";display:inline-block;position:relative;width:26px;height:28px;background:url('../../resources/images/btn-share-icon.png') no-repeat;background-size:100%;vertical-align:middle;margin-right:14px;top:-2px;}


/*------------------------------------------------
* popup
/*------------------------------------------------*/
/* layout */
.popup {position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7);opacity:0;visibility:hidden;transition:all 0.25s;}
.popup.on {opacity:1;visibility:visible;}
.popup_inner {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); background:#202020;border-radius:10px;box-shadow: 0px 2px 8px 5px rgba(0, 0, 0, 0.3);}
.popup_close {position:absolute; display:block; top:25px; right:25px; width:36px; height:36px;background:url('../../resources/images/btn-close-popup.png') no-repeat;background-size:100%;}

.popup-bg {position:fixed;left:0;top:0;right:0;bottom:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:890;opacity:0;visibility:hidden;transition:all 0.2 ease-out;}
.popup-bg.on {opacity:1;visibility:visible;}


/*------------------------------------------------
* contents
/*------------------------------------------------*/

/* wrap */
.wrap {width:100%;max-width:1920px;margin:0 auto;background:#141414;}
.wrap.fixed {position:fixed;left:50%;transform: translate(-50%,0);}

/* header */
header {position:relative;width:100%;}
header .gnb-area {position:fixed;width:100%;height:100px;left:0;top:0;transition:background 0.2s ease-out;z-index:100;}
header .gnb-area.fixed {position:fixed;background:#0a0a0a;z-index:500;}
header .header .logo {width:99px;height:65px;margin:16px 0 0 81px;}
header .header .logo a {display:block;width:100%;height:100%;background:url('../../resources/images/logo.png') no-repeat;background-size:100%;}

header .header {position:absolute;left:0;top:0;z-index:10;display:flex;flex-direction:row;}
header .header .gnb {position:relative;margin:31px 0 0 45px;}
header .header .gnb>ul {display:flex;}
header .header .gnb>ul>li {margin:0 25px;position:relative;height:65px;}
header .header .gnb>ul>li>a {color:#fff;font-size:24px;}
header .header .gnb>ul>li>a.on {color:yellow;}

header .header .gnb>ul>li>ul.gnb_depth_2 {position:absolute;display:block;width:190px;background:#202020;border-radius:10px;overflow:hidden;box-shadow: 0px 2px 8px 5px rgba(0, 0, 0, 0.3);left:50%;transform:translate(-50%,0);padding:10px 0;}

header .header .gnb>ul>li>ul.gnb_depth_2 {margin-top:20px;opacity:0;visibility:hidden;transition:all 0.25s;transform:translate(-50%,15px);}
/* header .header .gnb>ul>li:hover>ul.gnb_depth_2 {opacity:1;visibility:visible;transform:translate(-50%,0);} */

header .header .gnb>ul>li>ul.gnb_depth_2:before {position:absolute;content:"";left:0;top:0;display:block;width:100%;height:4px;background:rgb(116,199,62);background: linear-gradient(90deg, rgba(116,199,62,1) 0%, rgba(0,142,211,1) 100%);}
header .header .gnb>ul>li>ul.gnb_depth_2>li {margin:0;}
header .header .gnb>ul>li>ul.gnb_depth_2>li>a {font-size:16px;color:#ccc;display:block;padding:10px 0;text-align:center;}
header .header .gnb>ul>li>ul.gnb_depth_2>li>a:hover {color:#fff;}

header .util {position:absolute;right:0;top:0;z-index:10;display:flex;flex-direction:row;}
header .util .login-area {position:relative;width:40px;height:40px;margin:30px 113px 0 0;}
header .util .login-area .login-btn-area {width:40px;height:40px;}
header .util .login-area:hover {cursor:pointer;}
header .util .login-box {position:absolute;left:-194px;top:25px;width:260px;opacity:0;visibility:hidden;transform:translate3d(0,7px,0);transition:all 0.13s ease-out;padding-top:21px;}
header .util .login-box:before {position:relative;content:"";display:block;left:-8px;width:276px;height:19px;background:url('../../resources/images/lgoin-box-header.png') no-repeat;background-size:cover;}

/* header .util .login-area:hover .login-box {opacity:1;visibility:visible;transform:translate3d(0,0,0);} */
header .util .login-area.on .login-box {opacity:1;visibility:visible;transform:translate3d(0,0,0);}
header .util .login-area ul {width:260px;background:#202020;border-radius:0px 0px 10px 10px;box-shadow:0 2px 8px 0px rgba(0, 0, 0, 0.8);}
header .util .login-area ul li {width:100%;height:56px;}
header .util .login-area ul li:nth-child(n+2) {border-top:1px solid #444;}
header .util .login-area ul li a {display:flex;width:100%;height:56px;color:#fff;align-items:center;padding:0 0 0 14px;}
header .util .login-area ul li a span em {font-style:normal;color:#004ea1;background:#fff;padding:4px 17px;border-radius:20px;margin-left:10px;}

header .search-area {position:relative;margin:25px 30px 0 0;}
header .btn-header-search,
header .btn-header-search-fake {width:28px;height:28px;background:url('../../resources/images/header-search-icon.png') no-repeat;background-size:cover;}
header .btn-header-search-fake {position:absolute;right:0;top:10px;opacity:1;visibility:visible;transition:all 0.12s ease-out;transform:translate3d(0px,0,0);}

header .search-box {border:2px solid #444;background:#0d0d0d;border-radius:50px;padding:0 20px;width:0px;transition:all 0.12s ease-out;opacity:0;visibility:hidden;overflow:hidden;}
header .search-box .search-box-field {display:flex;align-items:center;}
header .search-box .search-box-field input {flex:1;border:none;background:transparent;color:#fff;}

header .search-area.on .search-box {opacity:1;visibility:visible;width:300px;}
header .search-area.on .btn-header-search-fake {opacity:0;visibility:hidden;transform:translate3d(-150px,0,0);}

header .kv-area a[data-kv-event="false"] {cursor:default;}
header .kv-area .cont-image {overflow:hidden;}
header .kv-area .swiper-btn-area button {width:60px;height:60px;border:4px solid #fff;opacity:0.3;border-radius:50%;transition:opacity 0.25s;}
header .kv-area .swiper-btn-area button:hover {opacity:1;}
header .kv-area .swiper-btn-area button:after {display:none;}
header .kv-area .swiper-btn-area button.swiper-button-next {background:url('../../resources/images/btn-swiper-next.png') no-repeat;background-size:100%;}
header .kv-area .swiper-btn-area button.swiper-button-prev {background:url('../../resources/images/btn-swiper-prev.png') no-repeat;background-size:100%;}

/* curation-bnr */
.curation-bnr {position:relative;width:100%;height:79px;background:url('../../resources/images/curation-bnr.jpg') no-repeat;background-size:cover;}
.curation-bnr-area {height:100%;display:flex;flex-direction:row;justify-content:center;align-items:center;font-size:28px;}
.curation-bnr-area .txt-1 {letter-spacing:-1px;color:#fff;}
.curation-bnr-area .btn-view-curation {width:182px;height:46px;border:2px solid #fff;border-radius:50px;font-size:20px;margin-left:30px;color:#fff;}

/* contents list */
.contents-list {position:relative;width:100%;padding:100px 0 140px 0;overflow:hidden;}
.contents-list-favor {background:#181818;}
.contents-list:nth-child(n+5) {padding:40px 0 140px 0;}


/* ---------------------------------------------------------------------------- */
/* .contents-area default */
.cont-image {position:relative;}

.contents-area {position:relative;width:auto;margin-left:180px;}
.contents-area .header-tit {font-size:48px;color:#fff;}

.contents-area .cont-box {width:100%;padding:21px 0 0 0px;}

.contents-area .cont-box:after {content:"";display:block;clear:both;}
.contents-area .cont-box .cont-list {width:400px !important;margin-right:20px;}
.contents-area .cont-box .cont-list .cont-image {width:100%;height:225px;margin-bottom:17px;border-radius:10px;overflow:hidden;}
.contents-area .cont-box .cont-list .cont-image:hover {cursor:pointer;}
/* .contents-area .cont-box .cont-list .cont-image .badge-hot {position:absolute;left:20px;top:20px;width:70px;height:30px;background:url('../../resources/images/badge-bg.png') no-repeat;background-size:cover;font-size:18px;color:#fff;text-align:center;} */
.contents-area .cont-box .cont-list .cont-image .badge-hot {position:absolute;left:20px;top:20px;width:70px;height:30px;font-size:18px;color:#fff;text-align:center;background:#f14c13;border-radius:4px;}
.contents-area .cont-box .cont-list .cont-link {display:block;}
/* .contents-area .cont-box .cont-list .cont-link .tit {display:inline-block;font-size:18px;color:#fff;background:#1f4e9c;padding:7px 25px;border-radius:25px;margin-bottom:20px;} */
.contents-area .cont-box .cont-list .cont-link .tit {display:inline-block;font-size:18px;color:#fff;margin-bottom:3px;}
.contents-area .cont-box .cont-list .cont-link .sub-tit {font-size:24px;color:#fff;}
.contents-area .cont-box .cont-list .cont-link .desc {display:none;}

.contents-area .swiper-btn-area {position:absolute;width:100%;height:1px;z-index:10;}

.contents-area .swiper-btn-area:before,
.contents-area .swiper-btn-area:after {content:"";display:block;position:absolute;top:0px;right:0;width:44px;height:308px;border-radius:10px 0px 0px 10px;background:transparent;}
.contents-area .swiper-btn-area:before {left:0;width:130px;}
.contents-area .swiper-btn-area:after {right:0;}
.contents-area .swiper-btn-area button {position:absolute;margin-top:0;top:0;width:43px;height:225px;border-radius:9px 0px 0px 9px;background:rgba(0,0,0,0.85);}
.contents-area .swiper-btn-area button:before {position:absolute;left:50%;top:50%;content:"";display:block;width:23px;height:38px;transform:translate(-50%,-50%);background-repeat:no-repeat;background-size:cover;background-position:center;background-image:url('../../resources/images/btn-swiper-arrow.png');}
.contents-area .swiper-btn-area button:after {display:none;}
.contents-area .swiper-btn-area .swiper-button-prev {left:0;background:none;}
.contents-area .swiper-btn-area .swiper-button-prev:before {transform:translate(-50%,-50%) rotate(180deg);}
.contents-area .swiper-btn-area .swiper-button-next {right:0;}

/* 
.contents-area .swiper-btn-area button {top:0;margin-top:0;width:120px;height:400px;}
.contents-area .swiper-btn-area button.swiper-button-disabled {}
.contents-area .swiper-btn-area button:before {position:absolute;left:50%;top:23%;content:"";display:block;width:60px;height:60px;transform:translate(-50%,0);background-repeat:no-repeat;background-size:cover;background-position:center;background-image:url('../../resources/images/btn-swiper-arrow.png');background-color:rgba(68,68,68,0.8);border-radius:100%;}
.contents-area .swiper-btn-area button:after {display:none;}
.contents-area .swiper-btn-area .swiper-button-prev {left:0px;}
.contents-area .swiper-btn-area .swiper-button-prev:before {transform:translate(-50%,-0) rotate(180deg);}
.contents-area .swiper-btn-area .swiper-button-next {right:0px;}
.contents-area .swiper-btn-area .swiper-button-next:before {} */

.contents-area .tab-area {display:flex;flex-direction:row;padding:60px 0 25px;overflow:hidden;}
.contents-area .tab-area .swiper-slide {width:auto !important;}
.contents-area .tab-area button {min-width:140px;height:44px;border:2px solid #404040;color:#fff;border-radius:100px;font-size:16px;margin-right:15px;padding:0 20px;}
.contents-area .tab-area button.view-all {margin-right:40px;}
.contents-area .tab-area button.on {border:2px solid #fff;background:#fff;color:#004ea1;font-weight:bold;}
.contents-area .tab-area .swiper-btn-area {display:none;}

/* ---------------------------------------------------------------------------- */

/* curation-cont */
.curation-cont {position:relative;width:100%;height:1000px;}

.curation-cont .youtube-bg-background:before {display:block;content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:10;}
.curation-cont .youtube-bg-img {display:none;}

.curation-cont-area {position:absolute;width:1420px;left:50%;top:0;transform:translate(-50%,0);padding:90px 0 0 0;z-index:20;}
/* .curation-cont-area .tit {font-size:30px;color:#7496ca;margin-bottom:10px;width:236px;height:79px;} */
.curation-cont-area .tit {font-size:30px;color:#7496ca;margin-bottom:18px;width:170px;}
.curation-cont-area .sub-tit {width:870px;height:auto;margin-bottom:26px;font-size:55px;font-weight:bold;color:#fff;line-height:1.2;}
.curation-cont-area .desc {width:930px;font-size:24px;color:#fff;}
.curation-cont-area .btn-area {padding:24px 0 0 7px;}
.curation-cont-area .btn-area:after {content:"";display:block;clear:both;}
.curation-cont-area .btn-curation {float:left;width:170px;height:60px;border-radius:5px;margin-right:17px;font-size:24px;}
.curation-cont-area .btn-curation:before {position:relative;content:"";display:inline-block;background-size:cover;margin-right:15px;vertical-align:middle;top:-3px;}
.curation-cont-area .btn-play {border:1px solid #e3e3e3;background:#fff;}
.curation-cont-area .btn-play:hover {background:#ccc;}
.curation-cont-area .btn-play:before {width:27px;height:33px;background:url('../../resources/images/curation-icon-play.png') no-repeat;background-size:cover;}
.curation-cont-area .btn-info {border:1px solid #444444;background:#444;color:#fff;}
.curation-cont-area .btn-info:hover {background:#888;}
.curation-cont-area .btn-info:before {width:31px;height:31px;background:url('../../resources/images/curation-icon-info.png') no-repeat;background-size:cover;}

/* contents-list-game */
.contents-list-game .contents-area .cont-box {display:flex;padding:60px 0 0 0px;}
.contents-list-game .contents-area .cont-box .tit {display:none !important;}
.contents-list-game .contents-area .swiper-btn-area {display:none;}

/* popup login */
.popup-login .popup_inner {width:700px;height:590px;display:flex;justify-self:center;align-items:center;}
.popup-login .popup_inner .popup_contents {width:100%;height:70%;text-align:center;}
.popup-login .popup_inner h2 {font-size:48px;color:#fff;margin-bottom:85px;width:100%;}
.popup-login .popup_inner .pop-cont {display:flex;position:relative;justify-content:center;padding-top:145px;}
.popup-login .popup_inner .pop-cont h2 {position:absolute;left:50%;top:0;transform:translate(-50%,0);}
.popup-login .popup_inner .pop-cont h2.quiz-login {font-size:38px;}
.popup-login .popup_inner .btn-sns-login {position:relative;display:block;font-size:18px;text-align:center;color:#fff;}
.popup-login .popup_inner .btn-sns-login:before {position:relative;content:"";display:block;width:100px;height:100px;border-radius:100%;margin-bottom:25px;}
.popup-login .popup_inner .sns-naver {margin-right:150px;}
.popup-login .popup_inner .sns-naver:before {background:url('../../resources/images/sns-logo-naver.png') no-repeat;background-size:cover;background-color:#03c65a;}
.popup-login .popup_inner .sns-kakao {}
.popup-login .popup_inner .sns-kakao:before {background:url('../../resources/images/sns-login-kakao.png') no-repeat;background-size:cover;background-color:#fee500;}
.popup-login .popup_inner .btn-sns-login-close {position:absolute;left:50%;bottom:-140px;transform:translate(-50%,0);width:296px;height:63px;background:#444444;border-radius:10px;font-size:24px;color:#fff;}


.popup-quiz-login .popup_inner {width:700px;height:590px;display:flex;justify-self:center;align-items:center;}
.popup-quiz-login .popup_inner .popup_contents {width:100%;height:70%;text-align:center;}
.popup-quiz-login .popup_inner h2 {font-size:48px;color:#fff;margin-bottom:85px;width:100%;}
.popup-quiz-login .popup_inner .pop-cont {display:flex;position:relative;justify-content:center;padding-top:145px;}
.popup-quiz-login .popup_inner .pop-cont h2 {position:absolute;left:50%;top:0;transform:translate(-50%,0);}
.popup-quiz-login .popup_inner .pop-cont h2.quiz-login {font-size:38px;}
.popup-quiz-login .popup_inner .btn-sns-login {position:relative;display:block;font-size:18px;text-align:center;color:#fff;}
.popup-quiz-login .popup_inner .btn-sns-login:before {position:relative;content:"";display:block;width:100px;height:100px;border-radius:100%;margin-bottom:25px;}
.popup-quiz-login .popup_inner .sns-naver {margin-right:150px;}
.popup-quiz-login .popup_inner .sns-naver:before {background:url('../../resources/images/sns-logo-naver.png') no-repeat;background-size:cover;background-color:#03c65a;}
.popup-quiz-login .popup_inner .sns-kakao {}
.popup-quiz-login .popup_inner .sns-kakao:before {background:url('../../resources/images/sns-login-kakao.png') no-repeat;background-size:cover;background-color:#fee500;}
.popup-quiz-login .popup_inner .btn-sns-login-close {position:absolute;left:50%;bottom:-140px;transform:translate(-50%,0);width:296px;height:63px;background:#444444;border-radius:10px;font-size:24px;color:#fff;}

/* popup share */
.popup-share {top:0;}
.popup-share .popup_inner {width:1030px;display:flex;justify-self:center;align-items:center;}
.popup-share .popup_inner .popup_contents {width:100%;text-align:center;}
.popup-share .popup_inner h2 {font-size:48px;color:#fff;margin-bottom:75px;width:100%;}
.popup-share .popup_inner .pop-cont {padding:120px 0 80px;}
.popup-share .popup_inner .pop-cont .btn-area {display:flex;position:relative;justify-content:center;margin-bottom:75px;}
.popup-share .popup_inner .btn-sns-share {position:relative;display:block;font-size:18px;text-align:center;color:#fff;margin-left:105px;padding:0;}
.popup-share .popup_inner .btn-sns-share:first-child {margin-left:0px;}
.popup-share .popup_inner .btn-sns-share:before {position:relative;content:"";display:block;width:100px;height:100px;border-radius:100%;margin-bottom:25px;}
.popup-share .popup_inner .sns-naver:before {background:url('../../resources/images/sns-logo-naver.png') no-repeat;background-size:cover;background-color:#03c65a;}
.popup-share .popup_inner .sns-facebook:before {background:url('../../resources/images/sns-logo-facebook.png') no-repeat;background-size:cover;background-color:#1877f2;}
.popup-share .popup_inner .sns-twitter:before {background:url('../../resources/images/sns-logo-twitter.png') no-repeat;background-size:cover;background-color:#2c96d4;}
.popup-share .popup_inner .sns-kakao:before {background:url('../../resources/images/sns-logo-kakao.png') no-repeat;background-size:cover;background-color:#fee500;}
.popup-share .popup_inner .copy-area {display:flex;width:810px;height:65px;margin:0 auto;overflow:hidden;border-radius:10px;}
.popup-share .popup_inner .copy-area .copy-box {flex:1;font-size:24px;line-height:65px;background:#fff;text-align:left;padding:0 35px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.popup-share .popup_inner .copy-area .btn-sns-copy {color:#fff;font-size:24px;background:#444;padding:0 30px;}


/* popup quiz */
.popup-quiz {top:0;}
.popup-quiz .popup_inner {width:700px;height:600px;display:flex;justify-self:center;align-items:center;background:#ffca54;border-radius:10px;overflow:hidden;}
.popup-quiz .popup_inner .popup_contents {position:relative;width:100%;height:100%;text-align:center;}
.popup-quiz .popup_inner .popup_contents:before {position:absolute;content:"";display:block;width:100%;height:110px;left:0;bottom:0;background:#efb033;}
.popup-quiz .popup_inner h2 {font-size:90px;margin-bottom:45px;width:100%;font-weight:bold;}
.popup-quiz .popup_inner .desc {font-size:32px;line-height:1.4;}
.popup-quiz .popup_inner .pop-cont {padding:100px 0 80px;}
.popup-quiz .popup_inner:before {content:"";display:block;position:absolute;left:30px;bottom:70px;width:107px;height:201px;background:url('../../resources/images/quiz-pop-11.png') no-repeat;background-size:100%;z-index:10;}
.popup-quiz .popup_inner:after {content:"";display:block;position:absolute;right:30px;bottom:70px;width:108px;height:205px;background:url('../../resources/images/quiz-pop-12.png') no-repeat;background-size:100%;z-index:10;}
.popup-quiz .popup_inner .btn-area button {position:absolute;left:50%;bottom:78px;width:296px;height:63px;background:#000000;color:#fff;font-size:24px;border-radius:10px;transform:translate(-50%,0);}
.popup-quiz .popup_close {background:url('../../resources/images/btn-close-popup-black.png') no-repeat center;background-size:90%;border: 2px solid #000;border-radius: 50%;}

.popup-quiz.false .popup_inner:before {content:"";display:block;position:absolute;left:30px;bottom:70px;width:71px;height:193px;background:url('../../resources/images/quiz-pop-21.png') no-repeat;background-size:100%;z-index:10;}
.popup-quiz.false .popup_inner:after {content:"";display:block;position:absolute;right:30px;bottom:70px;width:71px;height:203px;background:url('../../resources/images/quiz-pop-22.png') no-repeat;background-size:100%;z-index:10;}


/* popup popup-curation */
.popup-curation .popup_inner {width:700px;height:95%;display:flex;justify-self:center;align-items:center;}
.popup-curation .popup_inner .popup_contents {width:100%;height:100%;text-align:center;padding:65px 0 50px;}
.popup-curation .popup_inner .pop-cont {display:flex;flex-direction:column;height:100%;}
.popup-curation .popup_inner h2 {font-size:36px;color:#fff;padding-bottom:25px;}
.popup-curation .popup_inner h2:before {content:"";display:block;width:122px;height:78px;background:url('../../resources/images/logo-curation-popup.png') no-repeat;background-size:cover;margin:0 auto;margin-bottom:10px;}
.popup-curation .popup_inner .pop-list {width:100%;display:flex;flex-wrap:wrap;justify-content:flex-start;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-left:70px;}
.popup-curation .popup_inner .pop-data {width:170px;height:170px;margin:10px;}
.popup-curation .popup_inner .pop-data label {position:relative;display:block;width:100%;height:100%;border-radius:100%;border:2px solid #888888;}
.popup-curation .popup_inner .pop-data label img {position:relative;opacity:0.5;z-index:10;transition:opacity 0.15s;filter:grayscale(100%);}
.popup-curation .popup_inner .pop-data label:after {content:"";display:block;position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;visibility:hidden;z-index:0;transition:all 0.15s ease-out;}
.popup-curation .popup_inner .pop-data label span {position:absolute;display:block;left:0;bottom:30px;width:100%;font-size:24px;color:#888;z-index:10;}
.popup-curation .popup_inner .pop-data input[type="checkbox"]:checked+label {border:none;}
.popup-curation .popup_inner .pop-data input[type="checkbox"]:checked+label:after {background:url('../../resources/images/cu-check-bg.png') no-repeat;background-size:cover;opacity:1;visibility:visible;}
.popup-curation .popup_inner .pop-data input[type="checkbox"]:checked+label span {color:#fff;}

.popup-curation .popup_inner .pop-data label:before {display:none;}
.popup-curation .popup_inner .pop-data input[type="checkbox"]:checked+label img {opacity:1;filter:none;}

.popup-curation .popup_inner .btn-area {display:block;padding-top:25px;}
.popup-curation .popup_inner .btn-area .btn-cu {width:295px;height:65px;border-radius:7px;font-size:24px;}
.popup-curation .popup_inner .btn-area .btn-cu:first-child {margin-right:20px;}
.popup-curation .popup_inner .btn-area .check-ok {background:#fff;}
.popup-curation .popup_inner .btn-area .check-cancel {background:#444444;color:#fff;}

.popup-curation ::-webkit-scrollbar {width: 6px;}
.popup-curation ::-webkit-scrollbar-track {background-color:#333;}
.popup-curation ::-webkit-scrollbar-thumb {border-radius: 3px;background-color:gray;  }
.popup-curation ::-webkit-scrollbar-button {width:0;height:0;}

/* popup popup-info */
.popup-info {position:absolute;height:auto;background:none;padding-bottom:100px;}
.popup-info .popup_inner {position:relative;width:1030px;height:1px;overflow:hidden;top:0;transform:translate(-50%,0);border-radius:0 0 10px 10px;padding:0 0 75px 0;opacity:0;}
.popup-info .pop-vod {position:relative;width:100%;height:578px;overflow:hidden;}
.popup-info .pop-vod img {display:none;}
.popup-info .pop-vod img:hover {cursor:pointer;}
.popup-info .pop-vod iframe {display:block; width:100% !important; height:578px;}
.popup-info .pop-header {position:relative;width:936px;margin:0 auto;padding:60px 0 65px 0;}
/* .popup-info .pop-header .tit {font-size:20px;display:inline-block;color:#fff;background:#1f4e9c;padding:7px 25px;border-radius:25px;margin-bottom:7px;} */
/* .popup-info .pop-header .tit {font-size:20px;display:inline-block;width:151px;height:39px;margin-bottom:10px;} */
.popup-info .pop-header .tit {font-size:20px;display:inline-block;width:130px;margin-bottom:10px;}
.popup-info .pop-header .sub-tit {font-size:32px;color:#fff;font-weight:bold;padding:0 0 15px 0;}
.popup-info .pop-header .sub-tit br {display:none;}
.popup-info .pop-header .desc {font-size:18px;color:#fff;padding:0 0 24px 0;}
.popup-info .contents-area {margin-left:0;}
.popup-info .contents-area .header-tit {width:936px;margin:0 auto;font-size:24px;color:#fff;margin-bottom:21px;font-weight:normal;}
.popup-info .contents-area .cont-box {width:960px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:flex-start;overflow:hidden;padding:0;transition:height 0.4s ease-out;}
.popup-info .contents-area .cont-box .cont-list {width:300px !important;height:300px;margin-right:0;margin:0 10px 20px;padding:0 0 25px 0;background:#2f2f2f;border-radius:10px 10px 0 0;}
.popup-info .contents-area .cont-box .cont-list .cont-image {height:auto;margin-bottom:17px;border-radius:10px 10px 0 0;}
.popup-info .contents-area .cont-box .cont-list a {padding:0 17px;}
.popup-info .contents-area .cont-box .cont-list a .tit {font-size:16px;margin-bottom:1px;}
.popup-info .contents-area .cont-box .cont-list a .sub-tit {font-size:18px;}
.popup-info .popup_close {right:-50px;}

.popup-info .pop-info-arrow {position:relative;width:940px;margin:0 auto;transform:translate(0,-44px);}
.popup-info .pop-info-arrow:before {display:block;content:"";clear:both;position:absolute;width:100%;height:2px;left:0;top:50%;transform:translate(0,-50%);background:#444;z-index:0;}
.popup-info .pop-info-arrow:after {display:block;content:"";clear:both;position:absolute;width:100%;height:2px;left:0;top:50%;height:50%;background:#202020;z-index:0;box-shadow:0 -15px 24px 0px rgba(0, 0, 0, 0.6);}
.popup-info .btn-info-arrow {position:relative;display:block;width:50px;height:50px;background:url('../../resources/images/pop-info-arrow.png') no-repeat;background-size:cover;margin:0 auto;z-index:10;}

.popup-info .pop-info-detail {position:relative;width:940px;margin:0 auto;}
.popup-info .pop-info-detail .header-tit {width:936px;margin:0 auto;font-size:24px;color:#fff;margin-bottom:21px;font-weight:normal;}
.popup-info .pop-info-detail .detail-box {display:flex;font-size:18px;line-height:1.6;}
.popup-info .pop-info-detail .detail-box .tit {color:#888;padding-right:5px;}
.popup-info .pop-info-detail .detail-box .desc {color:#fff;flex:1;}

.popup-info.on .popup_inner {height:auto;overflow:visible;opacity:1;}

/* popup mobile menu */
.popup-mgnb.on {display:none;}

/* contents clone */
.cont-clone {position:absolute;left:0;top:0;z-index:1000;width:488px;height:405px;opacity:0;visibility:hidden;transition:opacity 0.2s ease-out;}
.cont-clone.on {opacity:1;visibility:visible;transform:translate(0,10px);}
.cont-clone .contents-area {margin-left:0;width:100%;height:100%;background:#202020;border-radius:10px;box-shadow: 0px 2px 8px 5px rgba(0, 0, 0, 0.3);}
.cont-clone .contents-area .cont-box {width:100%;padding:0}
.cont-clone .contents-area .cont-box .cont-list {width:100% !important;margin-right:0;}
.cont-clone .contents-area .cont-box .cont-list .cont-image {height:274px;overflow:hidden;margin-bottom:20px;border-radius:10px 10px 0 0;}
.cont-clone .contents-area .cont-box .cont-list .cont-image img {height:100%;}
.cont-clone .contents-area .cont-box .cont-list .cont-link {padding:0 20px;}
.cont-clone .contents-area .cont-box .cont-list .tit {font-size:20px;}
.cont-clone .contents-area .cont-box .cont-list .sub-tit {font-size:28px;}
.cont-clone .contents-area .cont-box .cont-list br {display:none;}
.cont-clone .contents-area .btn-area {padding:16px 20px 0;display:none;}
.cont-clone .contents-area .btn-area .btn-info-vod,
.cont-clone .contents-area .btn-area .btn-info-link {width:36px;height:36px;}

/* footer */
footer {width:100%;background:#181818;}
footer .footer-info {display:flex;flex-direction:row;justify-content:center;align-items:center;padding:80px 0;}
footer .footer-info .header-tit {width:251px;height:31px;background:url('../../resources/images/footer-tit.png') no-repeat;background-size:cover;margin-right:70px;}
footer .footer-info ul:after {content:"";display:block;clear:both;}
footer .footer-info ul li {float:left;width:66px;height:66px;border:2px solid #fff;border-radius:100%;margin-right:18px;}
footer .footer-info ul li a {position:relative;display:block;width:100%;height:100%;}
footer .footer-info ul li a:before {position:absolute;content:"";display:block;clear:both;left:0;top:0;width:62px;height:62px;}
footer .footer-info ul li a.flink-naver:before {background:url('../../resources/images/footer-naver.png') no-repeat;background-size:cover;}
footer .footer-info ul li a.flink-kakao:before{background:url('../../resources/images/footer-kakao.png') no-repeat;background-size:cover;}
footer .footer-info ul li a.flink-facebook:before{background:url('../../resources/images/footer-facebook.png') no-repeat;background-size:cover;}
footer .footer-info ul li a.flink-twitter:before{background:url('../../resources/images/footer-twitter.png') no-repeat;background-size:cover;}
footer .footer-info ul li a.flink-instagram:before{background:url('../../resources/images/footer-instagram.png') no-repeat;background-size:cover;}
footer .footer-info ul li a.flink-youtube:before{background:url('../../resources/images/footer-youtube.png') no-repeat;background-size:cover;}

footer .footer-copy {width:100%;border-top:1px solid #444;padding:45px 0;}
footer .footer-copy p {text-align:center;color:#888;font-size:16px;}
footer .footer-copy p:first-child {font-size:20px;padding:0 0 20px 0;}

/* page top */
.page-top {width:100%;text-align:right;}
.page-top .btn-page-top {height:92px;width:92px;background:url('../../resources/images/btn-top-icon.png') no-repeat;background-size:100%;cursor:pointer;}

/* search */
.search-cont {padding-top:100px;}

.search-cont .btn-area {width:1680px;padding:50px 0;margin:0 auto;}
.search-cont .btn-area a {display:inline-block;font-size:48px;color:#fff;}
.search-cont .btn-area a:before {position:relative;display:inline-block;content:"";width:76px;height:76px;top:-4px;border:2px solid #5b5b5b;border-radius:100%;background:url('../../resources/images/btn-back-arrow.png') no-repeat;background-size:100%;vertical-align:middle;margin-right:30px;}

.search-cont .contents-area {margin-left:0;width:1680px;margin:0 auto;}
.search-cont .swiper-wrapper {flex-wrap:wrap;}
.search-cont .contents-area .cont-box .cont-list {margin-right:0;margin:0 10px;margin-bottom:60px;}
.search-cont .contents-area .no-data {color:#fff;text-align:center;font-size:32px;padding:100px 0;margin:0 auto;}

/* quiz */
.wrap.page-quiz {background:#efb033;}
.wrap.page-quiz header .kv-area .cont-image {height:auto !important;}
.quiz-cont {position:relative;width:100%;z-index:3000;}
.quiz-cont .contents-area {margin-left:0;}

.quiz-gage {position:relative;width:100%;height:237px;background:url('../../resources/images/quiz-gage-bg.png') no-repeat center top;background-size:cover;z-index:2;}
.quiz-gage .quiz-gage-box {position:relative;width:1440px;margin:0 auto;}
.quiz-gage .quiz-gage-box:before {position:absolute;top:-55px;left:240px;content:"";display:block;width:223px;height:230px;background:url('../../resources/images/quiz-gage-jm.png') no-repeat;background-size:100%;}


.quiz-gage .tit {font-size:32px;color:#fff;text-shadow:-3px -3px 0 #000, 3px -3px 0 #000, -3px 3px 0 #000, 3px 3px 0 #000;padding:29px 0 0 494px;}
.quiz-gage .quiz-gage-bar {position:absolute;left:0;top:0;}
.quiz-gage .quiz-gage-bar .score {position:absolute;width:146px;height:126px;left:1160px;top:88px;background:url('../../resources/images/quiz-score-bg.png') no-repeat;background-size:100%;z-index:10;color:#fff;text-align:center;font-weight:bold;padding-top:29px;}
.quiz-gage .quiz-gage-bar .score span {position:relative;}
.quiz-gage .quiz-gage-bar .score .score_num {font-size:38px;top:2px;margin-right:2px;}
.quiz-gage .quiz-gage-bar .score .total_num {font-size:20px;top:2px;margin-left:5px;}
.quiz-gage .gage-bar-box {position:absolute;width:1010px;height:80px;left:241px;top:119px;border:10px solid #000;border-radius:40px;background:rgb(97,187,65);background: linear-gradient(90deg, rgba(97,187,65,1) 0%, rgba(0,142,211,1) 100%);overflow:hidden;}
.quiz-gage .gage-bar-box .gage-bar-move {position:absolute;right:0;top:0;width:100%;height:100%;background:#fff;transition:width 0.85s ease-out;}

.quiz-section {position:relative;width:100%;background:url('../../resources/images/quiz-bg.jpg') no-repeat;background-size:contain;min-height:1730px;padding:360px 0 0 0;}
.quiz-box {width:930px;margin:0 auto;position:relative;}
.quiz-box .quiz-image {position:relative;width:100%;height:520px;border:10px solid #000;background:#fff;margin-bottom:10px;}
.quiz-box .quiz-image img {position:absolute;width:930px;height:520px;left:-10px;top:-10px;}
.quiz-box .btn-area {display:flex;margin-bottom:20px;}
.quiz-box .btn-area button {flex:1;height:100px;border:5px solid #000;border-radius:10px;font-size:40px;color:#fff;}
.quiz-box .btn-area button:first-child {margin-right:20px;}
.quiz-box .btn-area .btn-view-vod {background:#087ce1;}
.quiz-box .btn-area .btn-submit {background:#d55245;}

.quiz-box .quiz-btn-area {display:flex;height:100px;border:5px solid #000;border-radius:10px;background:#000;padding:5px;font-size:40px;}
.quiz-box .quiz-btn-area .quiz-btn-txt {flex:1;background:#e2e2e2;display:flex;align-items:center;justify-content:center;}
.quiz-box .quiz-btn-area .btn-quiz {width:80px;height:80px;background:url('../../resources/images/quiz-btn-arrow.png') no-repeat;background-size:100%;}
.quiz-box .quiz-btn-area .btn-quiz.btn-quiz-next {transform:rotate(180deg);}

.quiz-box .badge-right-answer {position:absolute;width:169px;height:169px;right:-75px;top:-75px;background:url('../../resources/images/quiz-answer-mark.png') no-repeat;background-size:100%;z-index:10;}

.quiz-box .cont-list .cont-link {display:none;}

.quiz-list {background:#000;border-radius:10px;padding:10px;margin-bottom:30px;}
.quiz-list .question {font-size:38px;text-align:center;font-weight:bold;padding:15px 0 25px 0;color:#fff;}
.quiz-list .answer-list {display:flex;flex-direction:column;background:#fff;height:390px;font-size:36px;padding-left:80px;justify-content:center;}
.quiz-list .answer-list input[type="radio"] + label {display:block;padding:12px 0;}
.quiz-list .answer-list input[type="radio"] + label span {color:#d32f2f;}
.quiz-list .answer-list input[type="radio"] + label:before {position:relative;content:"";display:inline-block;width:30px;height:30px;border:5px solid #000;border-radius:5px;vertical-align:middle;margin-right:15px;top:-4px;}
.quiz-list .answer-list input[type="radio"]:checked + label:before {background:url('../../resources/images/checkbox-on.png') no-repeat;background-size:100%;border-color:#000;background-color:#fff;}

.quiz-list.quiz-type-ox .answer-list {background:transparent;flex-direction:row;padding-left:0;height:450px;}
.quiz-list.quiz-type-ox .answer-list input[type="radio"] + label {flex:1;background:#fff;margin:0 5px;font-size:0;}
.quiz-list.quiz-type-ox .answer-list input[type="radio"] + label:before {position:absolute;width:250px;height:250px;border:none;margin-right:0;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0.35;transition:opacity 0.25s;}
.quiz-list.quiz-type-ox .answer-list .quiz-ox-o + label:before {background:url('../../resources/images/quiz-ox-o.png') no-repeat;background-size:100%;}
.quiz-list.quiz-type-ox .answer-list .quiz-ox-x + label:before {background:url('../../resources/images/quiz-ox-x.png') no-repeat;background-size:100%;}
.quiz-list.quiz-type-ox .answer-list .quiz-ox-o:checked + label:before {background:url('../../resources/images/quiz-ox-o.png') no-repeat;background-size:100%;opacity:1;}
.quiz-list.quiz-type-ox .answer-list .quiz-ox-x:checked + label:before {background:url('../../resources/images/quiz-ox-x.png') no-repeat;background-size:100%;opacity:1;}

.quiz-team {position:absolute;bottom:100px;}
.quiz-team-1 {left:-234px;width:144px;height:334px;background:url('../../resources/images/quiz-team-1.png') no-repeat;background-size:100%;animation:motion 1.4s  infinite ease-in-out;}
.quiz-team-2 {right:-234px;width:144px;height:334px;background:url('../../resources/images/quiz-team-2.png') no-repeat;background-size:100%;animation:motion 1.4s 0.7s infinite ease-in-out;}

/* page-location */
.page-location {width:1680px;margin:0 auto;font-size:20px;color:#fff;padding:40px 0 60px 10px;}
.page-location:after {content:"";display:block;clear:both;}
.page-location span {float:left;}
.page-location span:not(:last-child):after {position:relative;content:"";display:inline-block;width:10px;height:17px;margin:0 13px;background:url('../../resources/images/icon-location.png');background-size:100%;vertical-align:middle;top:-2px;}

/* join-cont */
.join-cont {width:100%;padding-top:100px;}
.join-cont .contents-area {margin-left:0;}
.join-cont .header-box {width:100%;position:relative;background:#202020;padding:45px 0 40px 0;text-align:center;}
.join-cont .header-box:before {content:"";display:block;width:103px;height:98px;background:url('../../resources/images/icon-join.png');background-size:100%;margin:0 auto;}
.join-cont .header-box .tit {font-size:40px;color:#fff;padding-top:25px;}
.join-cont .join-box {display:flex;width:1240px;margin:0 auto;flex-wrap:wrap;justify-content:space-between;padding:70px 0 0 0;}
.join-cont .join-list {width:580px;margin-bottom:70px;}
.join-cont .join-list .join-link {width:100%;}
.join-cont .join-list .join-link .join-image {width:100%;height:360px;overflow:hidden;border-radius:10px;}
.join-cont .join-list .tit {font-size:32px;color:#fff;padding:25px 0 5px 0;font-weight:bold;}
.join-cont .join-list .desc {font-size:24px;color:#888;}
.join-cont .join-list .notify {padding-top:5px; font-size:20px;color:#888;}

/* scroll down */
.scroll-down {position:absolute;right:70px;top:65%;width:107px;height:81px;z-index:5000;animation:scroll-down-motion 1.4s  infinite ease-in-out;}
.scroll-down .btn-scroll-down {width:100%;height:100%;background:url('../../resources/images/btn-scroll-down.png') no-repeat;background-size:100%;}


@keyframes motion {
    0% {transform:translateY(0);}
    50% {transform:translateY(-16px);}
    0% {transform:translateY(0);}
}

@keyframes scroll-down-motion {
    0% {transform:translateY(0);}
    50% {transform:translateY(-16px);}
    0% {transform:translateY(0);}
}

@media screen and (min-width:1441px) {
    /* contents-list-custom */
    .contents-list-custom {padding:0 !important;margin-top:-433px;height:418px;z-index:100;}
    .contents-list-custom .contents-area {margin-left:0;width:1420px;left:50%;top:0;transform:translate(-50%,0);}
    .contents-list-custom .contents-area .header-tit {font-size:30px;color:#fff;}
    .contents-list-custom .contents-area .cont-box {padding:21px 0 0 4px;}
    .contents-list-custom .contents-area .cont-box .cont-list {float:left;}
    .contents-list-custom .contents-area .cont-box .cont-list {width:340px !important;margin-right:20px;}
    .contents-list-custom .contents-area .cont-box .cont-list .cont-image {width:100%;height:190px;margin-bottom:13px;}
    .contents-list-custom .contents-area .cont-box .cont-list a p:nth-child(2) {color:#000;}
    .contents-list-custom .contents-area .cont-box .cont-list .desc {display:none;}
    .contents-list-custom .contents-area .cont-box .swiper-btn-area {display:none;}
}

/* 아이폰 두번 클릭 제거 */
@media screen and (min-width:541px) {
    header .header .gnb>ul>li:hover>ul.gnb_depth_2 {opacity:1;visibility:visible;transform:translate(-50%,0);}
}

/* 404 */
.container-404 {position:relative; height:100vh; background:url('../images/bg_404.jpg') no-repeat center / cover;}
.container-404 .txt-box {position:absolute; top:50%; left:calc(50% - 680px); transform:translateY(-50%);}
.container-404 .txt-box .logo {width:136px; margin-bottom:5px;}
.container-404 .txt-box .title {padding-bottom:145px; color:#fff; font-size:70px; font-weight:700;}
.container-404 .txt-box .btn-link {display:inline-flex; justify-content:center; align-items:center; width:330px; height:60px; padding-right:55px; border-radius:6px; background:#444 url('../images/arrow_404.png') no-repeat right 50px center; background-size:33px 28px; color:#fff; font-size:24px;}