@charset "utf-8";

/* 공통 */
.clear-both { clear:both;}
body, input, textarea, p, div { color:#333;}
li { list-style: none;}
h1, h2, h3, h4, h5, h6 { margin:0; padding:0;}
a { text-decoration: none; color:#333;}
a:hover { color:#007aff;}
div { box-sizing:border-box; }
img { max-width:100%; }

.float-left { float:left;}
.float-right { float:right;}
.bold { font-weight: bold;}
.none { display: none;}
.margin-30-0 { margin:30px 0;}
.padding-30-0 { padding:30px 0;}
table caption { display: none;}
.color-black { color:#000;}
.color-white { color:#fff;}
.color-blue-2 { color:#007aff;}
.color-red { color:red;}
.color-lightgray { color:#cccccc;}
.seemore { float: right;margin-top: -35px;font-size: 10pt; }
.seemoreRAB { font-weight: bold;font-family: arial;color:#007aff; }

/* main */
html { width:100%; height:100%; background:#F9F9F9}
body { width:100%; height:100%; background:url(http://image.hankookilbo.com/img/bg_body_top2.jpg) no-repeat center top 50px; background-size: contain; }
header { position:fixed; top:0; z-index:9999; width:100%; height:56px; background:#000; }
.wrap { width:100%; background:url(http://image.hankookilbo.com/img/bg_body_bottom.jpg) no-repeat center bottom; background-size: contain; }
.container { position:relative; margin: 0 auto; max-width: 960px; }
.content { margin: 0 auto; width:100%; max-width: 960px;}

header h1 { float:left; height:56px; font-size:24px; letter-spacing:-2px; line-height:1.4; }
header h1 a { line-height: 56px; display:inline-block; color:white; font-weight:200; }
header h1 img { vertical-align:top; margin:10px 4px; }
header h1 .logo-title,
header h1 .logo-title-m { margin:16px 4px; }
header li { float:left; }
.share li { padding:2px; }

.area-title { width:100%; height:200px; line-height:200px; text-align:center; display:table-cell; padding-top:50px;  }
.area-title img { width:80%; vertical-align:bottom }
.area-visual { width:100%; height:250px; position:relative }
.area-visual img { position:absolute; bottom:-5px; right:5%; }
.area-visual-sub { width:100%; height:400px; text-align:center; }
.area-visual-sub img { width:60%; max-width:280px; margin-top:5%;  }

#gnb { float:right; }
.gnbMenu { width:30px; height:30px; background:url(http://image.hankookilbo.com/img/btn_off.png) no-repeat; background-size:cover; cursor:pointer  }
.gnbMenu span { display:inline-block; width:100%; color:#FFED00; font-size:12px; text-align:center; }
.current {background:url(http://image.hankookilbo.com/img/btn_on.png) no-repeat; background-size:cover;   }
.current span { color:#000000  }
#gnb li { padding: 0; line-height:26px; }

.bottom {
	width:100%;
	height:100px;
	/*border-top:1px solid #fff;*/
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,0.00)), to(rgba(0,0,0,0.5)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.00), rgba(0,0,0,0.5));
	background: -moz-linear-gradient(top,rgba(0,0,0,0.00), rgba(0,0,0,0.5));
	background: -ms-linear-gradient(top, rgba(0,0,0,0.00), rgba(0,0,0,0.5));
	background: -o-linear-gradient(top, rgba(0,0,0,0.00), rgba(0,0,0,0.5));
}

.bottom .copyright {
	width:100%;
	display:inline-block;
	line-height:100px;
	text-align:center;
	vertical-align:middle;
	color:#fff
}

/* 메인 - 종이배 네비게이터 */
svg { background:url(http://image.hankookilbo.com/img/bg_papership.png) no-repeat; background-size:cover; }
g {}
g.Roller polygon { fill:#FFEE00; opacity:0.25}
text {font-weight:600; cursor:pointer }
g.Roller text { fill:#FFFFFF; font-weight:600 }
polygon { opacity:1; cursor:pointer }
/*
polygon.nopress { opacity:1 }
text.nopress { opacity:0.25 }
*/

/* 메인 - 기사 리스트 */
.article-list-1 { margin: 0 14px 36px 14px; padding:18px 0;}
.article-list-1 > li { display: block; clear:both; border-top:1px solid #ddd; padding-top:8px;}
.article-list-1 > li:first-child { border:none}
.article-list-1 > li.with-related { padding-top:31px; display: block; height:auto; min-height: 146px;}
.article-list-1 > li.no-pic { height:auto; padding-left:16px; background:url(http://image.hankookilbo.com/img/bg_bul_px5.gif) 4px 26px no-repeat; font-weight:100; }

li.no-pic .title { width:60%; float:left; margin-top:6px; }
li.no-pic .info { width:30%; float:right; min-width:180px;}

.article-list-1 .thumb { width: 226px; height: 132px; overflow: hidden; background-color: #ffffff; text-align:center; float:left; margin-right:14px;}
.article-list-1 .thumb img { width:auto; height: 132px;}
.article-list-1 .thumb2 { width: 226px; height:132px; overflow: hidden; background-color: #ffffff; text-align:center; float:left; margin-right:14px;}
.article-list-1 .thumb2 img{ width:auto; height:132px; position:relative; vertical-align:middle; bottom:auto;}
.article-list-1 .title a { color:#000; font-size:22px; font-weight: bold; letter-spacing:-0.04em; }
.article-list-1 .no-pic .title a { color:#000; font-size:19px; font-weight: normal; letter-spacing:-0.04em; }
.article-list-1 .title a:hover { color:#007aff;}
.article-list-1 .info { margin:14px 0 20px 0; height: 12px;}
.article-list-1 .info div { float:left; font-size:14px; color:#666;}
.no-pic .info div { float:right;}
.article-list-1 .info .date { margin-left:14px; border-left:1px solid #b3b3b3; padding-left:14px;}
.article-list-1 .info .num-comment { margin-left:14px; border-left:1px solid #b3b3b3; padding-left:32px; background:url("https://image.hankookilbo.com/images/icon-comment.png") 14px center no-repeat; font-weight: bold;}

.article-list-1 .info .num-comment a { color:#007aff;}

.article-list-1 .summary { font-size:16px; line-height:1.4em; color:#666; padding-left:240px; letter-spacing:-0.02em;}
.article-list-1 > li.no-pic > .summary { padding-left:0;}
.article-list-1 li.ad-h-85 { height:85px;}
.article-list-1 .feat-in-the-list { height: 440px;}

.article-list-1 .related { padding-left:245px; color:#ccc; font-size:14px; line-height: 22px; margin-top:16px;}
.article-list-1 .related ul li { background:url("https://image.hankookilbo.com/images/bul-related.png") 3px 10px no-repeat;}
.article-list-1 .related a { color:#666; display: block; padding-left:19px;}
.article-list-1 .related a:hover { color:#007aff;}

/* list */
.area-list { margin: 0 2% ; padding: 10px 0 0; background:rgba(255,255,255,1); border-radius:4px; border-top:6px solid #ddd; box-shadow: 1px 2px 3px rgba(0,0,0,0.1); }
.area-article { margin: 0 2%; padding: 10px 0 0; background:rgba(255,255,255,1); border-radius:4px; border-top:6px solid #ddd; box-shadow: 1px 2px 3px rgba(0,0,0,0.1); }

/* 메인 - 기사 본문 */
#article-list-wrap { float:left; width: 100%;}
#article-view-wrap {margin: 0 14px 36px 14px; padding:18px 0;}
#article-view-full-wrap { width: 1012px;}
#bnr-recommend { margin:26px 0 26px 0; padding:0px;display:block; width:684px;}
    #bnr-recommend img {display: inline-block;float:left;}

#main-news { clear:both;border-bottom:2px solid #6DCEF6;margin-top:130px; display:block;}
#main-news h3 { background: url("https://image.hankookilbo.com/images/h3-main-news.png") left top no-repeat; width: 84px; height: 22px; text-indent: -10000em; margin:20px 0 0 26px; padding-bottom:12px;}

/*====================================================================================
/*
/* 기사 시작
/*
/*====================================================================================*/
.content-article { margin:4px 0 0 0; border-top:1px solid #ccc !important; position: relative;}
.content-article-full { margin:4px 0 0 0; border-top:1px solid #ccc !important; position: relative; border-right: none !important; background-image:none !important;}
.content-member { margin:4px 0 0 0; border-top:1px solid #e5e5e5 !important; position: relative;}

#article-body { margin:0 auto 50px auto; clear:both; width:96%; padding-top:5px; font-size:18px; line-height: 210%; letter-spacing:-0.01em; color:#333;}
#article-body p { font-size:18px; line-height: 180%; margin:1.4em 0; color:#333;}
#article-body p a { color:#007aff;}
#article-body p a:hover { text-decoration:underline;}
#article-body h2 { font-weight:bold; font-size:20px; letter-spacing:-1px;}
#article-full-body { padding-top:5px; border-left:1px solid #eee; border-right:1px solid #eee;}

#article-title-wrap { margin:5px 0 0 0;}
#article-title { color:#000; font-size:36px; padding: 0 18px 7px 15px; font-weight:500; letter-spacing:-0.08em;}
#article-subtitle { color:#000; font-size:18px; font-weight: normal; padding: 0 18px 15px 15px;}
#article-info { border-top:1px dotted #ccc; border-bottom:1px solid #ccc; padding: 13px 0 16px 0;}
#article-info .author { float:left; color:#666; font-size: 12px;letter-spacing: -0.2em; margin-right:7px;}
#article-info .author .name { float: left;}
#article-info .author .name:hover { color:#007aff;}
#article-info .author .email { background: url("https://image.hankookilbo.com/images/icon-email.png") left top no-repeat; float:left; width:12px; height: 12px; text-indent: -100000em; margin:3px 0 0 3px;}
#article-info .author .email:hover { background-position: 0 -15px;}
#article-info .author-sep { color:#ccc; float: left; font-size:12px; text-align: left; width:8px;}
#article-info .author:first-child { padding-left:15px;}
#article-info .author:last-child { margin-right:0;}
#article-info .author a { color:#999;}
#article-info #date-edited { float:right; color:#999; font-size: 12px; margin-right:17px;}
#article-info #date-registered { float:right; color:#999; font-size: 12px; margin-right:17px;}

.caption { margin:0 auto; width:auto; display:inline-block;}
.caption img { display: block;}
.caption p { color:#4c4c4c; font-size:12px !important; padding:1em !important; margin:0 !important; border-top:1px solid #fff; background-color:#eee; text-align: left;}
#article-full-body .caption { background-color: #fff;}
#article-full-body .caption p { width:640px; background-color: #eee; margin:0 auto !important; display: block;}
#article-full-body #article-body .caption p { width:auto; background-color: #eee; margin:0 auto !important; display: block;}


#article-util-wrap { height: 39px; background-color:#f5f5f5; padding-right:16px;}
#article-util-wrap > div { float:right;}
#article-util-wrap .reply-num { background:url("https://image.hankookilbo.com/images/icon-comment.png") left 6px no-repeat; padding-left:21px; margin:4px 24px 0 0;}
#article-util-wrap .reply-num a { color:#007AFF; font-size:12px; margin:0; font-weight: bold;}
#article-util-wrap .share-fb { margin:4px 24px 0 0; width:120px; height: 22px; overflow: hidden;}
#article-util-wrap .share-tw { margin:5px 15px 0 0; width:80px; overflow: hidden;}


.article-img-align-right { float:right; margin:0 1em 1em 1em;}
.article-img-align-left { float:left; margin:0 1em 1em 0;}
.article-ad-align-right { float:right; margin:0 1em 1em 1em;}
.article-ad-align-left { float:left; margin:1em 1em 1em 0;}

#list-related-wrap {/*padding:40px 0;*/ clear:both;}
#list-related-wrap h4 { background: url("https://image.hankookilbo.com/images/title-related-article.png") 14px 14px no-repeat; height:55px; display: block; text-indent: -100000em; border-top:2px solid #ccc; border-bottom:1px solid #ccc;}

#list-related { padding:15px; line-height: 100%;}
#list-related li { background:url("https://image.hankookilbo.com/images/bul-related.png") 3px 10px no-repeat; font-size:16px; padding:1px 0 1px 20px;}
#list-related li a { color:#666; line-height: 150%;}
#list-related li a:hover { color:#007aff;}

.ad-below-article { text-align: center;}

.article-full-wrap { width:670px; margin:0 auto;}
#list-important-wrap { padding:0 0 30px 0;}
#list-important-wrap h4 { background: url("https://image.hankookilbo.com/images/title-important-article.png") 18px 14px no-repeat; height:55px; display: block; text-indent: -100000em; border-bottom:2px solid #ccc;}

#list-important { padding:22px 16px 10px 0; border-bottom:1px solid #ccc; height:160px;}
#list-important li { float:left; width:139px; margin-left:23px;}
#list-important li a { color:#666; font-size:14px;}
#list-important li a:hover { color:#007aff;}

.list-important-full li { }


.btn_viewn {display:block; width:100%; height:100px; position:absolute; top:150px; z-index:9999 }

/* Mobile small Device :
사용자 해상도가 480px 미만인 모바일 기기를 위한 코드를 작성한다. */
@media all and (max-width:479px) {
	body { background:url(http://image.hankookilbo.com/img/bg_body_top3.jpg) no-repeat center top 50px; background-size: contain; }
	.wrap { background:url(http://image.hankookilbo.com/img/bg_body_bottom2.jpg) no-repeat center bottom; background-size: contain; }
	.content { margin: -60px auto -80px;}
	header h1 { float:left; width:20%; max-width:60px; height:56px; }
	header h1 .logo-title{ display:none; }
	header h1 .logo-title-m{ display:none; }
	.article-list-1 .thumb2 { float:none; width:100%; height:60%; }
	.article-list-1 .thumb2 img{ height: auto; margin:5px 0; }
	.article-list-1 .title a { font-size:21px; }
	.article-list-1 .no-pic .title a { color:#000; font-size:18px; font-weight: normal;}
	.article-list-1 > li.no-pic {padding-left:0; background:url(http://image.hankookilbo.com/img/bg_bul_px3.gif) 0px 25px no-repeat;  }
	li.no-pic .title { width:100%; float:left; margin-top:6px; padding-left:6px }
	li.no-pic .info { width:100%; float:right; min-width:180px;}
	.article-list-1 .summary { padding-left:0; font-size:14px;}
	.article-list-1 .info { margin:10px 0 16px 0; height: 12px;}
	.article-list-1 .info div { font-size:12px;}
	
	.area-title { height:60px; line-height:60px;}
	.area-visual { height:130px;}
	.area-visual img { width:20%; bottom:-3px; }
	.area-visual-sub { height:80px;}
	
	.bottom {height:60px;}
	.bottom .copyright {line-height:60px; font-size:12px;}
	
	#article-body p { font-size:16px; line-height: 180%; margin:1.4em 0; color:#333;}
	#article-title {font-size:28px; letter-spacing:-0.06em;}
	#article-subtitle { font-size:16px; font-weight: normal; letter-spacing:-0.02em;}
	
	.btn_viewn {top:80px; height:40px;}
}
/* Mobile large Device :
사용자 해상도가 481px 이상이고 768px 미만인 모바일 기기를 위한 코드를 작성한다. */
@media all and (min-width:480px) and (max-width:768px) {
	body { background:url(http://image.hankookilbo.com/img/bg_body_top3.jpg) no-repeat center top 50px; background-size: contain; }
	.wrap { background:url(http://image.hankookilbo.com/img/bg_body_bottom2.jpg) no-repeat center bottom; background-size: contain; }
	.content { margin: -60px auto -90px;}
	header h1 .logo-title{ display:none; }
	.area-title { height:100px; line-height:100px;}
	.area-visual { width:100%; height:200px;}
	.area-visual-sub { width:100%; height:150px;}
	
	.btn_viewn {top:100px; height:40px;}
}

/* Tablet Device :
사용자 해상도가 769px 이상이고 1024px 이하일 때 실행됨. 랩탑 또는 저해상도의 데스크톱에 대응하는 코드를 작성한다. */
@media all and (min-width:769px) and (max-width:1024px) {
	body { background:url(http://image.hankookilbo.com/img/bg_body_top3.jpg) no-repeat center top 50px; background-size: contain; }
	.wrap { background:url(http://image.hankookilbo.com/img/bg_body_bottom2.jpg) no-repeat center bottom; background-size: contain; }
	.content { margin: -80px auto -120px;}
	.area-visual { width:100%; height:250px;}
	.area-visual-sub { width:100%; height:300px;}
	
	.btn_viewn {top:120px; height:80px}
}

/* Desktop Device :
사용자 해상도가 1025px 이상의 고해상도 랩탑 또는 데스크톱에서만 대응하는 코드를 작성한다. */
@media all and (min-width:1025px) {
	.content { margin: -150px auto -200px;}
	.area-visual { width:100%; height:250px;}
	.area-visual-sub { width:100%; height:300px;}
	
	.btn_viewn {top:150px; }
	
}