﻿@import url(//font.imbc.com/noto/noto.css);
@import url(//font.imbc.com/mbcnew/mbcnew.css);
@import url(//font.imbc.com/pretendard/pretendard.css);
/* reset */
* { margin:0; padding:0; line-height:1; letter-spacing:-1px; font-size:100%; vertical-align:top; border:0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
input { font-family:'notokr-demilight'; }
a { text-decoration:none; color:#222; }
.main a { color:#fff; }
ol, ul, dl { list-style:none; }
img, video { border:0 none; vertical-align:bottom; }
img{image-rendering: -webkit-optimize-contrast;backface-visibility: hidden;}
table { border-collapse:collapse; border-spacing:0; }
body {background:#000;font-family:'notokr-demilight','돋움', 'dotum';min-width: 1340px;}
button, button:focus, button:active { padding:0; cursor:pointer; font-family:'notokr-demilight'; background:none; color:#fff; }
button span { position:relative; }
strong { font-family:'notokr-bold'; }
#wrap { min-width:1340px; }
.wrapper { width: 1218px; margin: 0 auto; position:relative; }
.ellipsis-multi { text-overflow: ellipsis; overflow:hidden; display:-webkit-box !important; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word; }
.ellipsis { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.blind{position: absolute;overflow: hidden;clip: rect(0 0 0 0);width: 1px;height: 1px;margin: -1px;}

.sub {position:relative; }
.sub .ad-area{text-align: center;margin-top:30px;}
/* main ***********************************************************************************************************/
/* top banner */
.main-banner{position:relative;}
.main-banner a{display:block;overflow:hidden;text-align:center}
.main-banner a img{width:auto;min-width:100%;margin-left:-50%;margin-right:-50%}
.main-banner .check{position:absolute;top:50%;right:50%;margin-top:-7px;margin-right:-609px;font-size:0}
.main-banner .check label{margin-right:7px;font-size:16px;color:#bfbfbf;cursor:pointer}
.main-banner .check input[type="checkbox"]{position:absolute;width:0;height:0;z-index:-1px}
.main-banner .check label span.box{position:relative;display:inline-block;width:16px;height:16px;margin-right:10px;background-color:#fff;background-size:16px;vertical-align:bottom;text-indent:-9999px}
.main-banner .check input[type="checkbox"]{cursor:pointer;}
.main-banner .check input[type="checkbox"]:checked + label span.box{background:url(//img.imbc.com/commons/2018/image/main/banner_check_close.jpg) no-repeat 50% 50%}

/* accessibility */
#accessibility {position:absolute; top:0; left:0; z-index:9999;  width:100%; text-align:left}
#accessibility a {display:block; position:absolute; top:-1000px; left:0; z-index:500; width:100%; text-align:center}
#accessibility a:focus, #accessibility a:active {position:absolute; top:0; z-index:1000; height:40px; background:#000; font:bold 12px dotum; color:#fff; line-height:40px}

/* nav */
#header { position:relative; z-index:180; background:url(//img.imbc.com/commons/2018/image/main/nav-bg-black.png) repeat-x center top; height:88px; }
.nav { overflow:hidden; height:88px; }
.nav .gnb { float:left; overflow:hidden; }
.nav .gnb ul {overflow: hidden;}
.nav .gnb ul li {font-size: 0; float: left; margin-left: 5px; line-height: 88px; position: relative;}
.nav .gnb ul li:first-child {margin-left: 0; margin-right: 5px;}
.nav .gnb ul li:first-child a {padding-left: 0;}
.nav .gnb ul li a {color: #fff; padding: 4px 6px; font-size: 17px; box-sizing: border-box; font-family: 'notokr-medium'; vertical-align: middle;}
.nav .gnb ul li a.en {padding: 0; font-size: 0;}
.nav .gnb ul li a span {padding: 6px 8px; font-size: 18px; box-sizing: border-box; vertical-align: middle;}
.nav .gnb ul li.logo a, .nav .gnb ul li.search a {font-size: 0;}
.nav .gnb ul li.menu a:hover {background: #fff; color: #000; font-family: 'notokr-bold';}
.nav .gnb ul li.menu.active a {background: #fff; color: #000; font-family: 'notokr-bold';}
.nav .gnb ul li.menu a.en:hover span {font-weight: bold; background: #fff; color: #000; font-family: 'notokr-bold'; letter-spacing: -0.070em;}
.nav .gnb ul li.menu.active a.en span {font-weight: bold; background: #fff; color: #000; font-family: 'notokr-bold'; letter-spacing: -0.070em;}
.nav .gnb ul li a img {vertical-align: middle; width: inherit;}
.nav .snb {float: right; overflow: hidden;}
.nav .snb ul {float: left;}
.nav .snb ul li {font-size: 0; float: left; line-height: 88px;}
.nav .snb ul li a {color: #eee; vertical-align: middle; font-size: 12px; line-height: 0; font-family: 'notokr-bold';}
.nav .snb ul.login {margin-right: 2px;}
.nav .snb ul.login li {margin-right: 7px; background: url(//img.imbc.com/commons/2018/image/main/snb-line.png) no-repeat right center; padding-right: 7px; box-sizing: border-box;}
.nav .snb ul.login li:last-child {margin-right: 0; background: none;}
.nav .snb ul.box {margin-top: 27px;}
.nav .snb ul.box li {width: 49px; height: 33px; border: 1px solid rgba(255, 255, 255, .3); border-right: 0;}
.nav .snb ul.box li:last-child {border-right: 1px solid rgba(255, 255, 255, .3);}
.nav .snb ul.box li a {text-align: center; display: block; width: 100%; height: 33px; line-height: 33px;}
.nav .snb ul.box li.mbic {width: 84px; position: relative;}
/* mbic -> new 
.nav .snb ul.box li.mbic:after {content: ''; width: 29px; height: 15px; background: url(//img.imbc.com/commons/2018/image/main/b-new.png); position: absolute; top: -10px; left: 9px; }
*/
.nav .snb ul.box li img {vertical-align: middle; margin-top: -3px;}
.nav .snb ul.box li.pr {width: 62px;}
.nav .snb ul.box li.clip {width: 46px;}

/* search */
.search a { color:#fff; }
.search-area { display:none; text-align:center; width:100%; height:100%; z-index:15000; position:fixed; top:0; left:0; padding-top:125px; }
.search-area .search-after { width:100%; height:100%; position:absolute; top:0; left:0; background:url(//img.imbc.com/commons/2018/image/main/search-bg.png); z-index:140; }
.search-area.active { display:block; }
.search-area button.btn-src-close{position:absolute;top:0;right:-60px;z-index:150}
.search-area .search-box { position:relative; z-index:15000; width:1010px; height:437px; background:url(//img.imbc.com/commons/2018/image/main/search-box-bg.jpg) no-repeat center top; margin:0 auto; }
.search-area .box-wrap { width:594px; margin:0 auto; }
.search-area .search-form { padding-top:28px; margin-bottom:38px; position:relative; }
.search-area .search-form input[type="text"] { font-size:34px; color:#9c9c9c; width:100%; padding:18px 38px 18px 0; text-align:center; background:#fafbfb; box-sizing:border-box; border-bottom:3px solid #e6e6e6; height: auto; line-height: normal; }
.search-area .search-form input::placeholder { color:#9c9c9c; }
.search-area .search-form label {position:absolute; left:-9999px; }
.search-area .search-form form button { position:absolute; top:51px; right:0; }

.search-area .best-list { text-align:left; overflow:hidden; }
.search-area .pop-list { float:left; width:50%; }
.search-area .pop-list h3 { font-size:24px; color:#1e1e1e; font-size:24px;font-family:'notokr-bold'; margin-bottom:25px; letter-spacing:-2px; }
.search-area .pop-list h3 strong { color:#4664e6; font-weight:normal; }
.search-area .pop-list ol li { font-size:18px; margin-top:15px; }
.search-area .pop-list ol li:first-child { margin-top:0; }
.search-area .pop-list ol li span, .search-area .pop-list ol li strong { line-height:22px; display:inline-block; font-weight:normal; font-family:'notokr-demilight'; }
.search-area .pop-list ol li span { width:7%; color:#7687e2; font-style:italic; }
.search-area .pop-list ol li strong  { width:93%; color:#1e1e1e; }
.search-area .pop-word { padding-right:20px; box-sizing:border-box; }

/* footer */
#footer { background-color:#0b0b0b; padding:30px 0 60px; }
.fnb-wrap { overflow:hidden; margin-bottom:28px; }
.fnb-wrap ul {overflow:hidden;font-size: 0;}
.fnb-wrap ul li {float:left;height: 20px;}
.fnb-wrap ul.foot-menu { float:left; }
.fnb-wrap ul.foot-menu li { margin-left:20px; }
.fnb-wrap ul.foot-menu li:first-child { margin-left:0; }
.fnb-wrap ul.foot-menu li a {font-size:16px;line-height: 20px;font-family:'notokr-demilight';color:#acacac;display: block;}
.fnb-wrap ul.foot-menu li a span, .fnb-wrap ul.foot-menu li a strong {font-size:16px;}
.fnb-wrap ul.foot-menu li a span {font-family: "noto-regular"; line-height: 20px;}
.fnb-wrap ul.foot-menu li a strong { font-family:'notokr-bold'; font-weight:normal; line-height: 19px;}
.fnb-wrap ul.foot-menu li:hover a { color:#e5e5e5; font-weight:normal; }
.fnb-wrap ul.sns-menu { float:right; }
.fnb-wrap ul.sns-menu li { margin-left:17px; }
.fnb-wrap ul.sns-menu li:nth-child(2),
.fnb-wrap ul.sns-menu li:nth-child(3){margin-left:14px}
.fnb-wrap ul.sns-menu li:first-child { margin-left:0; }
.fnb-wrap ul.sns-menu li a { width:22px; height:20px; display:block; text-indent:-9999px; background-repeat:no-repeat; background-position:center top; }
.fnb-wrap ul.sns-menu li a.twt { width:20px; background-image:url(//img.imbc.com/commons/2018/image/main/fnb-sns1.png); }
.fnb-wrap ul.sns-menu li a.fcb { background-image:url(//img.imbc.com/commons/2018/image/main/fnb-sns2.png); }
.fnb-wrap ul.sns-menu li a.isg { background-image:url(//img.imbc.com/commons/2018/image/main/fnb-sns3.png); }
.fnb-wrap ul.sns-menu li a.ytb { background-image:url(//img.imbc.com/commons/2018/image/main/fnb-sns4.png); }
.fnb-wrap ul.sns-menu li a.kko { background-image:url(//img.imbc.com/commons/2018/image/main/fnb-sns-kko-v2.png); }
.add-wrap { font-size:14px; color:#a5a5a5; line-height:22px; margin-bottom:40px; }
.add-wrap .add-list{overflow:hidden}
.add-wrap .add1{margin-bottom:9px}
.add-wrap .add-list .ceo, .add-wrap .add-list .detail{float:left}
.add-wrap .add-list .ceo { line-height:22px; width:185px}
.add-wrap .add-list .detail{ width:1000px }
.add-wrap .add-list span { line-height:22px; background:url(//img.imbc.com/commons/2018/image/main/add-vertical-line.png) no-repeat left center; padding-left:8px; margin-left:8px; }
.add-wrap .add-list span.first{background:none; padding-left:0; margin-left:0;}
.add-wrap .add-list span a{ line-height:22px; font-size:14px; color:#a5a5a5 }
.add-wrap .add-list span a:hover{text-decoration:underline}
.copylight { font-size:14px; letter-spacing:0; color:#fff }

/* gnb 뱃지 추가
.nav .gnb ul li:nth-child(5):after {content: '2022 카타르 월드컵'; width: 97px; height: 23px; background: url(//img.imbc.com/commons/2018/image/main/gnb_wdc2022.png) no-repeat; position: absolute; top: 10px; left: 0px; animation: ani 1.1s ease infinite alternate; text-indent:-9999px}
@keyframes ani { 0% { opacity: 0 } 100% { opacity: 1 } } */