@charset "utf-8";
@import url('/jsp/webzine/lib/css/reset.css');

.contents-view-gallery ul li em {display:inline-block; height:55px; padding:0 30px 0 32px; line-height:65px; color:#fff; font-size:16px}
.contentsbox h4.info {position:relative; padding:15px 10px; margin:0; background:#366dad; color:#fff; font-size:16px; text-align:center; font-family:Dotum}
.contentsbox h4.info span {position:absolute; right:10px; bottom:-30px}
.contentsbox h4.top {padding-top:0}
.contentsbox h4 b{font-style:none; display:inline}
.gallery {overflow:hidden; clear:both; position:relative; margin-bottom:40px}
.gallery .pic {font-size:0}
.gallery .pic img {display:block}
.gallery p {position:absolute; left:0; bottom:0; width:100%; height:55px; background:url('/jsp/webzine/lib/images/common/bg_transparent_01.png') repeat 0 0}
.gallery em {display:inline-block; height:55px; padding:0 30px 0 32px; line-height:65px; color:#fff; font-size:16px}
.gallery .dbimg {position:relative; float:left; width:49.5%}
.gallery .dbimg:first-child {margin-right:1%}
.gallery .dbimg span.pic {display:block; width:100%; font-size:0}
.gallery .dbimg span.pic img {display:block; width:100%}
.dbgraph {clear:both; overflow:hidden; width:100%; margin-bottom:30px; background:url('/jsp/webzine/lib/images/common/bg_line_04.gif') repeat-y 50% 0; border:1px solid #ececec; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}
.dbgraph .dbimg {display: block; overflow:hidden; float:left; width:50%; border-right:1px solid #ececec; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}
.dbgraph .dbimg:last-child {border:0}
.dbgraph .dbimg img {display: block; border:0}
.mb10 {margin-bottom:10px !important}
.mb30 {margin-bottom:30px !important}
.text-right {text-align:right}
.footnote {margin-bottom:40px; color:#767676; font-size:14px; line-height:24px}
p.contents-view-img em {display:inline-block; margin-top:10px; font-size:14px; color:#767676}

.mobile .toparea .subvisual dl dd {letter-spacing:0}
.mobile .gallery {margin-bottom:30px}
.mobile .gallery p {height:30px; background:url('/jsp/webzine/lib/images/common/bg_transparent_01.png') repeat 0 0}
.mobile .gallery em {overflow:hidden;width:85%; height:30px; padding:0 20px 0 18px; font-size:15px; line-height:30px; text-overflow:ellipsis; white-space:nowrap}
.mobile .gallery em.double {padding-top:7px; line-height:20px}
.mobile .gallery .dbimg {float:none; width:100%}
.mobile .gallery .dbimg:first-child {margin:0 0 10px 0}
.mobile .dbgraph {background:none}
.mobile .dbgraph .dbimg {float:none; width:100%; border-right:0}
.mobile .dbgraph .dbimg:first-child {border-bottom:1px solid #ececec}
.mobile .dbgraph .dbimg img {width:100%}
.mobile .contentsbox h4.info {padding:10px 8px; margin:0; background:#366dad; color:#fff; font-size:16px; text-align:center}
.mobile .contentsbox h4 b{display:block}
.mobile dl.writerbox {padding:20px}
.mobile dl.writerbox dt strong {padding-top:0px}
.mobile dl.writerbox dd {padding:0px 0}
.mobile .footnote {margin-bottom:40px; color:#767676; font-size:12px; line-height:22px}
.mobile p.contents-view-img em {font-size:12px}

body#main .maincontents .flbox dd.only-mobile {display:none}
body#main.mobile.device .maincontents .flbox dd.only-pc {display:none}
body#main.mobile.device .maincontents .flbox dd.only-mobile {display:block}

/* chrome */
.chrome .contents-view-gallery ul li em {line-height:55px}
.chrome .gallery em {line-height:55px}

/* cover */
#cover .othermenu {height:auto; padding:0; background:none}

/* issue01 */
#issue_1 h4.info {line-height:24px}


/* issue02 */
#issue_2 .footnote {float:right; margin:5px 0 20px}
#issue_2.mobile .boardlist {margin-bottom:0}

/* issue03 */
#issue_3 h5 {color:#333; font-size:16px; margin:40px 0 30px; font-family:noto-bold}
#issue_3 .footnote {margin-top:10px}
#issue_3 .boardlist.disc table tbody td ul {padding-left:45px}
#issue_3 .boardlist.disc table tbody td ul li {text-align:left; line-height:28px; list-style-type:disc; color:#767676}
#issue_3.mobile h5 {margin-top:15px; font-size:14px}

/* trend01 */
#trend_1 .footnote {margin-top:-20px}
#trend_1.mobile .contentsarea .contentsbox h4 {line-height:24px}
#trend_1.mobile .footnote {font-size:12px; line-height:16px}

/* trend02 */
#trend_2 .listbox {clear:both; overflow:hidden; margin:30px 0}
#trend_2 .listbox> ul {padding:30px; background:#f5f7fa}
#trend_2 .listbox> ul li {padding-left:10px; background:url('../images/bg_bullet_01.gif') no-repeat 0 50%; color:#333; font-size:16px; line-height:34px}
#trend_2 .listbox dl {clear:both; overflow:hidden; height:290px; width:100%}
#trend_2 .listbox dl:first-child{border-top:2px solid #366dad}
#trend_2 .listbox dl dt {float:left; font-size:0}
#trend_2 .listbox dl dt img{display:block}
#trend_2 .listbox dl dd {float:left; width:423px; height:199px; padding:90px 0 0 47px; border-bottom:1px solid #ececec; line-height:28px}
#trend_2 .listbox dl dd h4 {padding:0; margin-bottom:8px}
#trend_2 .listbox dl dd p {margin-bottom:5px; color:#333; font-size:16px}
#trend_2 .listbox dl dd ul li {color:#767676; font-size:16px}
#trend_2 .mb30 {margin-bottom:30px; !important}
#trend_2.mobile .listbox {border:0}
#trend_2.mobile .listbox> ul li {margin-bottom:15px; background-position:0 10px; font-size:15px; line-height:24px}
#trend_2.mobile .listbox> ul li:last-child {margin-bottom:0}
#trend_2.mobile .listbox dl {height:auto}
#trend_2.mobile .listbox dl dt {float:none; font-size:0}
#trend_2.mobile .listbox dl dt img{display:block; width:100%}
#trend_2.mobile .listbox dl dd {width:auto; height:100%; padding:30px 10px; line-height:24px}
#trend_2.mobile .listbox dl dd p {font-size:15px}
#trend_2.mobile .listbox dl dd ul li {font-size:15px}

/* report01 */
#report_1 .listbox {margin-bottom:40px; font-size:16px}
#report_1 .listbox ul li {line-height:28px}
#report_1.mobile .listbox {font-size:15px; line-height:20px}
#report_1.mobile .listbox ul li {padding-bottom:10px; line-height:20px}
#report_1.mobile .toparea .subvisual dl dd {letter-spacing:-1px}

/* report02 */
#report_2 h4.info {padding:15px 10px; margin:0; background:#366dad; color:#fff; font-size:16px; text-align:center}
#report_2 .listbox {overflow:hidden; margin-bottom:30px}
#report_2 .listbox dl {float:left; width:50%; height:104px; padding:27px 0 0 50px; border:1px solid #d4d4d4; box-sizing:border-box}
#report_2 .listbox dl:first-child {border-right:0}
#report_2 .listbox dl dt{float:left; margin-right:30px; color:#353535; font-size:20px; font-weight:bold}
#report_2 .listbox dl dd{float:left}
#report_2 .listbox dl dd ul {padding-left:20px; background:url('../images/bg_bar_01.gif') no-repeat 0 -1px}
#report_2 .listbox dl dd ul li{color:#666; font-size:15px; font-weight:bold; line-height:28px}
#report_2.mobile .listbox dl {float:none; width:100%; padding:25px 0 0 10px}
#report_2.mobile .listbox dl:first-child {border-right:1px solid #d4d4d4; border-bottom:0}
#report_2.mobile .listbox dl dt{padding-top:15px; margin-right:10px; font-size:16px}
#report_2.mobile .listbox dl dd ul {padding-left:10px; background:url('../images/bg_bar_01.gif') no-repeat 0 -1px}
#report_2.mobile .listbox dl dd ul li{color:#666; font-size:13px; font-weight:bold; line-height:28px}
#report_2 strong i {font-style:italic}

/* story01  */
#story_1 .contents-view-txt strong{color:#333}

/* story02  */
#story_2 .toparea .subvisual dl dd {line-height:45px}
#story_2 .toparea .subvisual dl dd em {font-size:30px; font-weight:normal}
#story_2 .gallery .dbimg.left {width:39.4%}
#story_2 .gallery .dbimg.right {width:59.5%}
#story_2.mobile .mb10 {margin-bottom:10px}
#story_2.mobile .gallery .dbimg {float:none; width:100%; margin:0 0 10px 0}
#story_2.mobile .toparea .subvisual dl dd {line-height:26px}
#story_2.mobile .toparea .subvisual dl dd em {font-size:16px; font-weight:normal}

/* news01 */
#news_1 h5 {padding-bottom:10px; color:#333; font-size:18px; line-height:20px; font-family:noto-bold}
#news_1 h6 {height:56px; line-height:56px; margin-bottom:10px; padding-left:25px; background:url('../images/bg_tit_01.png') repeat 0 0; color:#333; font-size:18px}
#news_1 h6 span {margin-right:40px}
#news_1 .gallery {margin-bottom:60px}
#news_1 p.contents-view-img {margin-bottom:60px}
#news_1 .mb60 {margin-bottom:60px; !important}
#news_1.mobile .contents-view-gallery ul li em {font-size:13px}
#news_1.mobile a {text-decoration:underline}
#news_1 h5.top {margin-top:60px}

.mobile h6 {border:1px solid #366dad; background:none !important}
.mobile h6 span {padding-right:15px; border-right:1px solid #333}


/* boardlist */
.boardlist {clear:both; margin:-10px 0 40px}
.boardlist table {width:100%; border-top:2px solid #366dad; border-bottom:1px solid #ececec}
.boardlist table th {padding:20px 0 14px; border-top:1px solid #ececec; border-left:1px solid #ececec; color:#767676; text-align:center; font-size:14px}
.boardlist table td {padding:20px 0 14px; border-top:1px solid #ececec; border-left:1px solid #ececec; color:#767676; text-align:center; font-size:14px}
.boardlist table td.all {text-align:left}
.boardlist table thead th {background:#fbfcfd; color:#333; border-top:0}
.boardlist table tbody th {color:#333}
.boardlist table tfoot td {border-top:1px solid #333; border-bottom:1px solid #333}
.boardlist table tfoot th {border-top:1px solid #333; border-bottom:1px solid #333; color:#333}
.boardlist table .bleft {border-left:0 !important}
.boardlist table .btop {border-top:1px solid #ececec; !important}
.boardlist .bbottom {border-bottom:0 !important}
.boardlist > p{margin:20px 0 0; font-size:14px; font-weight:lighter}
.boardlist > p.first{margin-bottom:34px}
.mobile .boardlist {width:100%; overflow-x:scroll; margin-top:10px}
.mobile .boardlist > p{width:600px; margin:10px 0 34px; font-size:12px}
.mobile .boardlist table {width:600px}
.mobile .boardlist table th {padding:10px 0}
.mobile .boardlist table td {padding:10px}
.chrome .boardlist table th {padding:18px 0}
.chrome .boardlist table td {padding:18px 0}

@media screen and (max-width:374px) { 
	body#main.mobile.device .maincontents .flbox dd a strong em{display:inline-block; width:135px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
}

/* 2016.08.31 추가 */
.contentsarea .contentsbox h4 span {padding-top:20px}
.contentsarea .contentsbox h5 span {padding-top:20px}

/* 2016.10.26 reset.css에서 이동 */
.toparea .submenulist > ul.pc-menu li.menu-active-trend strong, .toparea .submenulist > ul.pc-menu li.menu-active-story strong, .toparea .submenulist > ul.pc-menu li.menu-active-report strong {height:79px; padding-top:40px; line-height:20px}