@charset "UTF-8";
/* webfont */
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanumpenscript.css);

/* reset */
* { padding: 0; margin: 0; list-style: none; }
*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
html { font-family: '맑은 고딕','Malgun Gothic',"Apple SD Gothic Neo","AppleGothic",'Nanum Gothic',"돋움", Dotum,"굴림",Gulim,Sans-serif; }
body { min-width: 320px; font-size: 12px; font-size: 0.75rem; color: #000000; }
img{border:0 !important;}

a { color: #000000; text-decoration: none; }
a:hover { color: #304f8d; text-decoration: underline; transition: all 0.2s ease-in 0s; }

::-moz-selection { color: #fff; background: #304f8d; }
::selection { color: #fff; background: #304f8d; }

.h1 { font-size: 29px; font-size: 1.8125rem; line-height: 1.2; font-weight: bold; letter-spacing: -0.05em; }
.h2 { font-size: 16px; font-size: 1rem; line-height: 1.4; font-weight: bold; }
.art-title { font-size: 18px; font-size: 1.125rem; line-height: 1.4; font-weight: bold; letter-spacing: -0.04em; }
.art-title .name { font-size: 10px; font-size: 0.625rem; color: #999999; margin-left: 10px; }
.art-title2 { font-size: 14px; font-size: 0.875rem; line-height: 1.3; font-weight: bold; letter-spacing: -0.05em; }
.art-title3 { font-size: 16px; font-size: 1rem; line-height: 1.3; font-weight: bold; letter-spacing: -0.05em; }
.summary { font-size: 13px; font-size:12px; line-height: 1.5; color: #666666; font-weight:normal;}
.container { width: 1060px; margin: 0 auto; }

input, textarea, select, button { font-family: "돋움", Dotum,"굴림",Gulim,Sans-serif; font-size: 12px; font-size: 0.75rem; line-height: 1.2; text-transform: none; padding: 0.833em; color: #222222; border: #dddddd 1px solid; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: radius; transition: border 0.2s ease-in 0s; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder, select::-webkit-input-placeholder, button::-webkit-input-placeholder { color: #555555; }
input::-moz-placeholder, textarea::-moz-placeholder, select::-moz-placeholder, button::-moz-placeholder { color: #555555; }
input:-moz-placeholder, textarea:-moz-placeholder, select:-moz-placeholder, button:-moz-placeholder { color: #555555; }
input:-ms-input-placeholder, textarea:-ms-input-placeholder, select:-ms-input-placeholder, button:-ms-input-placeholder { color: #555555; }
input:focus, textarea:focus, select:focus, button:focus { border-color: #304f8d; }
button, input[type=button] { cursor: pointer; border: #ddd 1px solid; font-size: 12px; font-size: 0.75rem; line-height: 1.2; font-weight: bold; background: #ffffff; }

/* header */
.bk-header { clear: both; }
.bk-header:before, .bk-header:after { content: ""; display: table; }
.bk-header:after { clear: both; }
.bk-header .header-1 { clear: both; height: 50px; background: #ffffff; -webkit-box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.25); position: relative; z-index: 99; border-bottom:1px solid #f5f5f5;width:1060px;margin:0 auto;}
.bk-header .header-1:before, .bk-header .header-1:after { content: ""; display: table; }
.bk-header .header-1:after { clear: both; }
.bk-header .header-1 .container { width: 100%; }
.bk-header .header-1 .grid-1 { float: left; }
.bk-header .header-1 .grid-2 { float: right; }
.bk-header .header-1 .slogo { background: #061e42; width: 58px; height: 50px; display: inline-block; text-align: center; float: left; }
.bk-header .header-1 .menu { float: left; }
.bk-header .header-1 .menu li { float: left; }
.bk-header .header-1 .menu a { font-size: 14px; font-size: 0.875rem; font-weight: 700; line-height: 3.571em; display: inline-block; padding: 0 1.071em; border-right: #f1f1f1 1px solid; }
.bk-header .header-1 .menu a:hover { background: #f1f1f1; }
.bk-header .header-1 .menu2 { float: right; border-right: #f1f1f1 1px solid; }
.bk-header .header-1 .menu2 li { float: right; }
.bk-header .header-1 .menu2 a { font-size: 14px; font-size: 0.875rem; font-weight: 700; line-height: 3.571em; display: inline-block; padding: 0 1.071em; border-left: #f1f1f1 1px solid; }
.bk-header .header-1 .menu2 a:hover { background: #f1f1f1; }
.bk-header .header-1 .ico { font-size: 20px; font-size: 1.25rem; display: inline-block; line-height: 2.5em; width: 1.750em; text-align: center; }
.bk-header .header-1 .ico:hover { text-decoration: none; }
.bk-header .header-1 .sns { float: left; border-right: #f1f1f1 1px solid; padding: 0 0.750em; }
.bk-header .header-1 .sns .ic-tw { color: #20a9e4; }
.bk-header .header-1 .sns .ic-fb { color: #2d5a9c; }
.bk-header .header-1 .sns .ic-rss { color: #EF922F; }
.bk-header .header-2 { clear: both; height:113px; background: #ffffff; position: relative; z-index: 88; }
.bk-header .header-2:before, .bk-header .header-2:after { content: ""; display: table; }
.bk-header .header-2:after { clear: both; }
.bk-header .header-2 .container { position: relative; }
.bk-header .header-2 .grid-1 { float: left; margin-top:30px; }
.bk-header .header-2 .grid-2 { float: right; margin-top:30px; text-align: right; }
.bk-header .header-2 .grid-2 li { padding: 0.3em 0; }
.bk-header .header-2 .grid-2 .ico { font-size: 22px; font-size: 1.375rem; width: 1.364em; height: 1.364em; line-height: 1.364em; text-align: center; }
.bk-header .header-2 .grid-2 .ico:hover { text-decoration: none; }
.bk-header .header-2 .grid-2 .srch .wp-srch { position: relative; }
.bk-header .header-2 .grid-2 .srch .wp-srch .input { padding-right: 2.3em; }
.bk-header .header-2 .grid-2 .srch .wp-srch .btn { position: absolute; top: 0.2em; right: 0.2em; }
.bk-header .header-2 .grid-2 .txt { font-family: 'Nanum Myeongjo', serif; font-size: 10px; font-size: 0.625rem; color: #999999; letter-spacing: -0.05em; }
.bk-header .header-2 .logo { position: absolute; top:35px; left:50%; margin-left: -132px; }
.bk-header .header-3 { clear: both; position: relative; z-index: 88; }
.bk-header .header-3:before, .bk-header .header-3:after { content: ""; display: table; }
.bk-header .header-3:after { clear: both; }
.bk-header .header-3 .container { position: relative; height: 120px; background: #ffffff; border-bottom: #f1f1f1 1px solid; box-shadow: 0 0 8px rgba(0, 0, 0, 0.075); padding: 0 1.667em; min-width:1060px;}
.bk-header .header-3 .ico { font-size: 22px; font-size: 1.375rem; width: 1.364em; height: 1.364em; line-height: 1.364em; text-align: center; }
.bk-header .header-3 .ico:hover { text-decoration: none; }
.bk-header .header-3 .col-1 { float: left; margin-top: 2.083em; }
.bk-header .header-3 .col-1 .ic-nav { float: left; }
.bk-header .header-3 .col-2 { position: absolute; top: 0.5em; left: 50%; font-size: 35px; font-size: 2.1875rem; font-weight: bold; letter-spacing: -0.05em; text-align: center; width: 230px; margin-left: -115px; }
.bk-header .header-3 .col-3 { float: right; margin-top: 2.083em; }
.bk-header .header-3 .wp-srch { position: relative; }
.bk-header .header-3 .wp-srch .input { padding-right: 2.3em; }
.bk-header .header-3 .wp-srch .btn { position: absolute; top: 0.2em; right: 0.2em; }
.bk-header .header-3 .nav { clear: both; text-align: center; margin-top: 0.6em; }
.bk-header .header-3 .nav:before, .bk-header .header-3 .nav:after { content: ""; display: table; }
.bk-header .header-3 .nav:after { clear: both; }
.bk-header .header-3 .nav li { display: inline-block; color: #666; }
.bk-header .header-3 .nav li a { font-size: 14px; font-size: 0.875rem; padding: 0.5em; display: inline-block; color: #666; }
.bk-header .header-3 .nav li .current { color: #0177c5; }
.bk-header .navigation { clear: both; }
.bk-header .navigation:before, .bk-header .navigation:after { content: ""; display: table; }
.bk-header .navigation:after { clear: both; }
.bk-header .navigation .container { height: 50px; background: #304f8d; position: relative; }
.bk-header .navigation a { color: #fff; display: inline-block; }
.bk-header .navigation a:hover, .bk-header .navigation .current { background: #233d72; }
.bk-header .navigation .ico { font-size: 24px; font-size: 1.5rem; width:2.292em; height:50px; line-height:53px; text-align: center; float: left; }
.bk-header .navigation .ico:hover { text-decoration: none; }
.bk-header .navigation .ic-nav { float: left; }
.bk-header .navigation .menu { float: left; }
.bk-header .navigation .menu li { float: left; position: relative; }
.bk-header .navigation .menu a { font-size:16px; font-size: 1rem; line-height:50px; font-weight: 700; padding: 0 0.9em; }
.bk-header .navigation .bx-more { position: absolute; top: 100%; right: 0; display: inline-block; z-index: 5; background: #fff; border: #304f8d 1px solid; border-top: none; }
.bk-header .navigation .bx-more a { color: #000; font-size: 14px; font-size: 0.875rem; line-height: 2.0em; display: block; }
.bk-header .navigation .bx-more a:hover { background: none; }
.bk-header .navigation .grid-rht { float: right; }
.bk-header .bx-dropdown { position: absolute; top: 100%; left: 0; z-index: 50; width: 100%; padding: 0 0 1%; clear: both; background: #f1f1f1; border: #ddd 1px solid; border-top: none; color: #666; font-size: 14px; font-size: 0.875rem; line-height: 1.5em; }
.bk-header .bx-dropdown:before, .bk-header .bx-dropdown:after { content: ""; display: table; }
.bk-header .bx-dropdown:after { clear: both; }
.bk-header .bx-dropdown a { color: #000000; }
.bk-header .bx-dropdown a:hover { background: none; }
.bk-header .bx-dropdown .grid-row { width: 100%; }
.bk-header .bx-dropdown .grid-1 { font-weight: bold; padding: 0.4em 4%; width: 20%; float: left; }
.bk-header .bx-dropdown .grid-2 { padding: 0.4em 4%; width: 80%; float: left; background: #fff; }
.bk-header .bx-dropdown .grid-2 a { margin: 0 0.3em; }
.bk-header .header-3 .bx-dropdown { border-top: #f1f1f1 1px solid; }
.bk-header .header-fixed { clear: both; width: 1060px; height: 50px; position: absolute; top: 0; left: 50%; margin-left:-530px; z-index: 9999; background: #304f8d; -webkit-box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.25); box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.25); color: #fff; }
.bk-header .header-fixed:before, .bk-header .header-fixed:after { content: ""; display: table; }
.bk-header .header-fixed:after { clear: both; }
.bk-header .header-fixed a { color: #ffffff; }
.bk-header .header-fixed .logo { position: absolute; top: 0; left: 50%; margin-left: -78px; }
.bk-header .header-fixed .logo2 { position: absolute; top: 0; left: 50%; width: 220px; margin-left: -110px; margin-top: 0.25em; text-align: center; font-size: 23px; font-size: 1.4375rem; font-weight: bold; letter-spacing: -0.05em; }
.bk-header .header-fixed .grid-1 { float: left; }
.bk-header .header-fixed .grid-2 { float: right; }
.bk-header .header-fixed .slogo { background: #061e42; width: 58px; height: 50px; display: inline-block; text-align: center; float: left; }
.bk-header .header-fixed .ico { text-align: center; }
.bk-header .header-fixed .ico:hover { text-decoration: none; }
.bk-header .header-fixed .ico i { font-size: 24px; font-size: 1.5rem; display: inline-block; float: left; padding: 10px 0.15em 8px; }
.bk-header .header-fixed .ico em { font-size: 17px; font-size: 1.0625rem; line-height: 2.8em; font-style: normal; display: inline-block; margin-left: 3px; }
.bk-header .header-fixed .ic-nav i { margin-left: 6px; }
.bk-header .header-fixed .sns, .bk-header .header-fixed .srch { float: left; padding: 0 0.2em; height: 50px; }
.bk-header .header-fixed .sns a { display: inline-block; }
.bk-header .header-fixed .srch { position: relative; }
.bk-header .header-fixed .srch .wp-srch { width: 220px; position: absolute; top: 0; right: 0; }
.bk-header .header-fixed .srch .wp-srch .input { width: 78%; float: left; margin-top: 0.55em; }
.bk-header .header-fixed .srch .wp-srch .btn { background-color: #304f8d; float: left; padding: 0 0.4em; }
.bk-header .header-fixed .bx-dropdown { position: relative; top: auto; }
.bk-header .header-fixed .bx-dropdown a { color: #000000; }
.bk-header .bg-black { background: #222222; }

/* footer */
.bk-footer { clear: both; background:#ffffff;}
.bk-footer:before, .bk-footer:after { content: ""; display: table; }
.bk-footer:after { clear: both; }
.bk-footer .footer-1 { clear: both; }
.bk-footer .footer-1:before, .bk-footer .footer-1:after { content: ""; display: table; }
.bk-footer .footer-1:after { clear: both; }
.bk-footer .footer-1 .container { background: #304f8d; height: 50px; color: #ffffff; }
.bk-footer .footer-1 a { color: #ffffff; }
.bk-footer .footer-1 .ic-nav { font-size: 17px; font-size: 1.0625rem; line-height: 2.5em; padding: 0 0.9em; display: inline-block; float: left; }
.bk-footer .footer-1 .ic-nav i { font-size: 24px; font-size: 1.5rem; line-height: 2.083em; display: inline-block; float: left; padding: 0 0.1em; }
.bk-footer .footer-1 .ic-nav em { font-size: 17px; font-size: 1.0625rem; line-height: 2.8em; font-style: normal; display: inline-block; margin-left: 3px; }
.bk-footer .footer-1 .ic-nav:hover { text-decoration: none; }
.bk-footer .footer-1 .totop { font-size: 18px; font-size: 1.125rem; line-height: 2.778em; text-align: center; width: 2.778em; height: 2.778em; display: inline-block; }
.bk-footer .footer-1 .totop:hover { background: #233d72; }
.bk-footer .bx-dropdown { width: 100%; padding: 0 0 1%; clear: both; background: #f1f1f1; border: #ddd 1px solid; border-top: none; color: #666666; font-size: 14px; font-size: 0.875rem; line-height: 1.5em; }
.bk-footer .bx-dropdown:before, .bk-footer .bx-dropdown:after { content: ""; display: table; }
.bk-footer .bx-dropdown:after { clear: both; }
.bk-footer .bx-dropdown a { color: #000000; }
.bk-footer .bx-dropdown a:hover { background: none; }
.bk-footer .bx-dropdown .grid-row { width: 100%; }
.bk-footer .bx-dropdown .grid-1 { font-weight: bold; padding: 0.4em 4%; width: 20%; float: left; }
.bk-footer .bx-dropdown .grid-2 { padding: 0.4em 4%; width: 80%; float: left; background: #fff; }
.bk-footer .bx-dropdown .grid-2 a { margin: 0 0.3em; }
.bk-footer .footer-2 { clear: both; margin-top: 1.250em; }
.bk-footer .footer-2:before, .bk-footer .footer-2:after { content: ""; display: table; }
.bk-footer .footer-2:after { clear: both; }
.bk-footer .footer-2 .wp-link { clear: both; background: #ffffff; border: #f1f1f1 1px solid; padding: 1.0em 0; text-align: center; }
.bk-footer .footer-2 .wp-link:before, .bk-footer .footer-2 .wp-link:after { content: ""; display: table; }
.bk-footer .footer-2 .wp-link:after { clear: both; }
.bk-footer .footer-2 .wp-link a { margin: 0 2.0em; display: inline-block; }
.bk-footer .footer-3 { clear: both; font-size:12px; font-weight:normal;}
.bk-footer .footer-3:before, .bk-footer .footer-3:after { content: ""; display: table; }
.bk-footer .footer-3:after { clear: both; }
.bk-footer .footer-3 .box1 { clear: both; padding: 2.083em 1.667em; }
.bk-footer .footer-3 .box1:before, .bk-footer .footer-3 .box1:after { content: ""; display: table; }
.bk-footer .footer-3 .box1:after { clear: both; }
.bk-footer .footer-3 .box1 .logo { float: left; }
.bk-footer .footer-3 .box1 .copy { float: left; margin-left: 2.5em; }
.bk-footer .footer-3 .box2 { clear: both; padding: 1.6em 1.667em 2.5em; border-top: #f1f1f1 1px solid; }
.bk-footer .footer-3 .box2:before, .bk-footer .footer-3 .box2:after { content: ""; display: table; }
.bk-footer .footer-3 .box2:after { clear: both; }
.bk-footer .footer-3 .box2 .grid-1 { text-align: center; line-height: 1.8em; }

.clear { clear: both; }
.clear:before, .clear:after { content: ""; display: table; }
.clear:after { clear: both; }

.lft { float: left; }
.rht { float: right; }
.img-lft { float: left; margin-right: 20px; }
.img-rht { float: right; margin-left: 20px; }

.photo { line-height: 0; }
.photo img { width: 100%; }
.photo a:hover { opacity: 0.9; }
.caty { color: #0177c5; }
.shadow { width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; z-index: 1; background: -moz-linear-gradient(top, transparent 0%, transparent 60%, rgba(0, 0, 0, 0.64) 99%, rgba(0, 0, 0, 0.65) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, transparent), color-stop(60%, transparent), color-stop(99%, rgba(0, 0, 0, 0.64)), color-stop(100%, rgba(0, 0, 0, 0.65))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, transparent 0%, transparent 60%, rgba(0, 0, 0, 0.64) 99%, rgba(0, 0, 0, 0.65) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, transparent 0%, transparent 60%, rgba(0, 0, 0, 0.64) 99%, rgba(0, 0, 0, 0.65) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, transparent 0%, transparent 60%, rgba(0, 0, 0, 0.64) 99%, rgba(0, 0, 0, 0.65) 100%); /* IE10+ */ background: linear-gradient(to bottom, transparent 0%, transparent 60%, rgba(0, 0, 0, 0.64) 99%, rgba(0, 0, 0, 0.65) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */ }

.caty-title { clear: both; color: #0177c5; padding: 0 1.667em; height: 4.167em; line-height: 4.167em; border-bottom: #f1f1f1 1px solid; border-top: #0177c5 2px solid; font-weight: bold; }
.caty-title:before, .caty-title:after { content: ""; display: table; }
.caty-title:after { clear: both; }
.caty-title h4 { float: left; font-size: 18px; font-size: 1.125rem; }
.caty-title .more { float: right; color: #0177c5; font-size: 12px; font-size: 0.75rem; display: inline-block; }
.caty-title i { font-size: 15px; font-size: 0.9375rem; }

.caty-t-black { color: #000000; border-top-color: #000000; }
.caty-t-black .more { color: #000000; }

.caty-t-gray { color: #000000; border-top: #eee 1px solid; margin-top: -1px; }
.caty-t-gray .more { color: #000000; }

.caty-t-blue { color: #002465; border-top-color: #002465; }
.caty-t-blue .more { color: #002465; }

.caty-t-green { color: #47960e; border-top-color: #47960e; }
.caty-t-green .more { color: #47960e; }

.caty-t-green2 { color: #005e20; border-top-color: #005e20; }
.caty-t-green2 .more { color: #005e20; }

.caty-title2 { font-size:18px; font-size: 1.125rem; color: #0177c5; font-weight: bold; padding: 1.111em 0 0; margin: 0 1.111em; }

.wrap-all { clear: both; }
.wrap-all:before, .wrap-all:after { content: ""; display: table; }
.wrap-all:after { clear: both; }

.unit-article, .unit-photo { padding-top: 4.167em; background: #f8f8f8; }

.bk-contents { clear: both; }
.bk-contents:before, .bk-contents:after { content: ""; display: table; }
.bk-contents:after { clear: both; }
.bk-contents > .container { background: #ffffff; box-shadow: 0 0 8px rgba(0, 0, 0, 0.075); min-width:1060px;}

div[role="body"] { float: left; width: -webkit-calc(63%); width: calc(63%); }
div[role="side"] { float: left; width: -webkit-calc(37%); width: calc(37%); background: #fff url(../images/bg-side.png) repeat-y left top; width:378px;}

.unit-article div[role="body"] { width: -webkit-calc(65.4545454545%); width: calc(65.4545454545%); }
.unit-article div[role="side"] { width: -webkit-calc(34.5454545455%); width: calc(34.5454545455%); }

.unit-main .bk-body, .unit-article .bk-body {border-top: #f1f1f1 1px solid; float:left; width:667px;}

/* main */
.bx-top-topic { clear: both; padding: 1.250em 1.667em;}
.bx-top-topic:before, .bx-top-topic:after { content: ""; display: table; }
.bx-top-topic:after { clear: both; }
.bx-top-topic .grid-1 .t1 { color: #0177c5; float: left; margin-right: 10px; font-weight: bold; }
.bx-top-topic .grid-1 .box { width: 300px; height: 18px; overflow: hidden; position: relative; float: left; display: inline-block; }
.bx-top-topic .grid-1 .box ul { width: 90%; }
.bx-top-topic .grid-1 .box li { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; }
.bx-top-topic .grid-1 .box li:hover { text-decoration: underline; }
.bx-top-topic .grid-1 .box .arr { position: absolute; top: 0; right: 0; color: #0177c5; font-size: 17px; font-size: 1.0625rem; }
.bx-top-topic .grid-1 .box .arr a { color: #0177c5; }
.bx-top-topic .grid-2 { color: #999999;}

.grid-main-title { clear: both; color: #0177c5; padding: 0 1.667em; height: 4.167em; line-height: 4.167em; border-bottom: #f1f1f1 1px solid; border-top: #f1f1f1 1px solid; font-weight: normal; overflow:hidden;}
.grid-main-title:before, .grid-main-title:after { content: ""; display: table; }
.grid-main-title:after { clear: both; }
.grid-main-title h4 { float: left; font-size: 18px; font-size: 1.125rem; }
.grid-main-title .more { float: right; color: #0177c5; font-size: 14px; font-size: 0.875rem; }
.grid-main-title .more a { color: #0177c5; }

.grid-hdline { clear: both; padding:15px 0 15px; margin:0 15px; border-bottom: #f1f1f1 2px solid; }
.grid-hdline:before, .grid-hdline:after { content: ""; display: table; }
.grid-hdline:after { clear: both; }
.grid-hdline .h1 { margin: 0.2em 0 0.5em; }
.grid-hdline .related { margin-top: 0.8em;}
.grid-hdline .related li { padding: 0.2em 0; font-size: 14px; font-size: 0.875rem; line-height: 1.3; font-weight: bold; }
.grid-hdline .related i { color: #0177c5; font-style: normal; font-weight: bold; }

.unit-opinion .grid-hdline { border-bottom: none; padding-bottom: 0; }

.grid-main-article { clear: both; padding: 25px 0 25px; margin: 0 15px; }
.grid-main-article:before, .grid-main-article:after { content: ""; display: table; }
.grid-main-article:after { clear: both; }
.grid-main-article h3 { margin-bottom: 0.8em; }
.grid-main-article .list-1 { clear: both; margin-bottom: 0.5em; }
.grid-main-article .list-1:before, .grid-main-article .list-1:after { content: ""; display: table; }
.grid-main-article .list-1:after { clear: both; }
.grid-main-article .list-1 h3 { margin-bottom: 0.6em; }
.grid-main-article .list-1 .summary { margin-bottom: 0.9em; }
.grid-main-article .list-2 { clear: both; margin-bottom: 0.5em; }
.grid-main-article .list-2:before, .grid-main-article .list-2:after { content: ""; display: table; }
.grid-main-article .list-2:after { clear: both; }
.grid-main-article .list-3 { clear: both; padding: 0.5em 0; margin-bottom: 1.5em; border-bottom: #f1f1f1 1px solid; border-top: #f1f1f1 1px solid; }
.grid-main-article .list-3:before, .grid-main-article .list-3:after { content: ""; display: table; }
.grid-main-article .list-3:after { clear: both; }
.grid-main-article .list-3 h3 { margin: 0.8em 0; }
.grid-main-article .related { margin-bottom: 1.5em; }
.grid-main-article .related li { padding: 0.1em 0; font-size: 14px; font-size: 0.875rem; line-height: 1.3; font-weight: normal; }
.grid-main-article .related i { color: #0177c5; font-style: normal; font-weight: bold; }

.grid-main-article2 { clear: both; }
.grid-main-article2:before, .grid-main-article2:after { content: ""; display: table; }
.grid-main-article2:after { clear: both; }
.grid-main-article2 .ttl { font-size: 14px; font-size: 0.875rem; line-height: 1.3; font-weight: bold; }
.grid-main-article2 .photo { position: relative; margin-bottom: 0.833em; }
.grid-main-article2 .grid-row { clear: both; overflow: hidden; }
.grid-main-article2 .grid-row:before, .grid-main-article2 .grid-row:after { content: ""; display: table; }
.grid-main-article2 .grid-row:after { clear: both; }
.grid-main-article2 .grid-row:last-child { border-bottom: #f1f1f1 1px solid; }
.grid-main-article2 .grid { overflow: hidden; }
/* .grid-main-article2 .row-1 .grid { height: 400px; }
.grid-main-article2 .row-2 .grid { height: 400px; }
.grid-main-article2 .row-3 .grid { height: 580px; } */
.grid-main-article2 .box { padding: 1.250em; border-bottom: #f1f1f1 1px solid; }
.grid-main-article2 .box:last-child { border-bottom: none; }
.grid-main-article2 .grid { width: 33.3%; float: left; border-right: #f1f1f1 1px solid; }
.grid-main-article2 .grid:last-child { border-right: none; }
.grid-main-article2 .summary { margin-top: 0.833em; }
.grid-main-article2 .col-4 { width: 66.6%; }
.grid-main-article2 .col-4 h3 { position: absolute; bottom: 0; left: 0; color: #fff; padding: 1.4em; z-index: 2; }
.grid-main-article2 .col-4 .photo { margin-bottom: 0; }
.grid-main-article2 .col-6 { width: 66.6%; }
.grid-main-article2 .col-6 h1 { font-size: 22px; font-size: 1.375rem; line-height: 1.3; font-weight: bold; letter-spacing: -0.05em; }
.grid-main-article2 .col-6 h2 { font-size: 14px; font-size: 0.875rem; line-height: 1.3; font-weight: bold; letter-spacing: -0.05em; }
.grid-main-article2 .col-7 h4 { font-size: 1.125rem; color: #0177C5; font-weight: bold; padding: 1.111em 0px 0px; margin: 0px 1.111em; }

.grid-main-article3 { clear: both; }
.grid-main-article3:before, .grid-main-article3:after { content: ""; display: table; }
.grid-main-article3:after { clear: both; }
.grid-main-article3 .ttl { font-size: 14px; font-size: 0.875rem; line-height: 1.3; font-weight: bold; }
.grid-main-article3 .photo { position: relative; margin-bottom: 0.833em; }
.grid-main-article3 .grid-row { clear: both; }
.grid-main-article3 .grid-row:before, .grid-main-article3 .grid-row:after { content: ""; display: table; }
.grid-main-article3 .grid-row:after { clear: both; }
.grid-main-article3 .grid-row:last-child { border-bottom: #f1f1f1 1px solid; }
.grid-main-article3 .grid { overflow: hidden; }
/*.grid-main-article3 .row-1 .grid { height: 340px; }
.grid-main-article3 .row-2 .grid, .grid-main-article3 .row-3 .grid, .grid-main-article3 .row-4 .grid { height: 345px; } */
.grid-main-article3 .row-5 { border-bottom: none !important; }
.grid-main-article3 .row-5 .col-1 { width: 66.6%; }
.grid-main-article3 .row-5 .list h3 { position: absolute; bottom: 0; left: 0; color: #fff; padding: 1.4em; z-index: 2; }
.grid-main-article3 .row-5 .list .photo { margin-bottom: 0; }
.grid-main-article3 .row-5 .list2 .photo { width: 95px; }
.grid-main-article3 .box { clear: both; padding:15px; border-bottom: #f1f1f1 1px solid; }
.grid-main-article3 .box:before, .grid-main-article3 .box:after { content: ""; display: table; }
.grid-main-article3 .box:after { clear: both; }
.grid-main-article3 .box:last-child { border-bottom: none; }
.grid-main-article3 .grid { width: 33.3%; float: left; border-right: #f1f1f1 1px solid; }
.grid-main-article3 .grid:last-child { border-right: none; }
.grid-main-article3 .summary { margin-top: 0.833em; }

.grid-main-article4 { clear: both; }
.grid-main-article4:before, .grid-main-article4:after { content: ""; display: table; }
.grid-main-article4:after { clear: both; }
.grid-main-article4 .list { clear: both; padding: 1.667em 0; margin: 0 1.667em; border-bottom: #f1f1f1 1px solid; }
.grid-main-article4 .list:before, .grid-main-article4 .list:after { content: ""; display: table; }
.grid-main-article4 .list:after { clear: both; }
.grid-main-article4 .list .photo { width: 180px; float: left; margin-right: 1.667em; }
.grid-main-article4 .list .summary { margin-top: 0.833em; }
.grid-main-article4 .date { font-size: 11px; font-size: 0.6875rem; margin-top: 0.8em; }
.grid-main-article4 .date span { color: #888888; }

.grid-main-article5 { clear: both; border-top: #f1f1f1 1px solid; padding: 1.667em 0; }
.grid-main-article5:before, .grid-main-article5:after { content: ""; display: table; }
.grid-main-article5:after { clear: both; }
.grid-main-article5 .list { width: 44%; float: left; margin: 0.8em 3%; }
.grid-main-article5 .list:nth-of-type(2n+1) { clear: left; }
.grid-main-article5 .list .caty { font-size: 14px; font-size: 0.875rem; margin-bottom: 1.071em; }
.grid-main-article5 .list .photo { float: left; margin-right: 1.667em; }

.btn-viewmore { clear: both; margin: 0 1.667em 1.667em; }
.btn-viewmore:before, .btn-viewmore:after { content: ""; display: table; }
.btn-viewmore:after { clear: both; }
.btn-viewmore a { background: #f7f7f8; border: #f1f1f1 1px solid; border-bottom-color: #ddd; border-right-color: #ddd; text-align: center; display: block; font-size: 14px; font-size: 0.875rem; line-height: 1.2; font-weight: bold; padding: 0.714em 0; }
.btn-viewmore a:hover { border-color: #ccc; text-decoration: none; background: #eee; color: #000000; }

.bx-date-list { clear: both; }
.bx-date-list:before, .bx-date-list:after { content: ""; display: table; }
.bx-date-list:after { clear: both; }
.bx-date-list .tab { float: left; }
.bx-date-list .tab li { float: left; }
.bx-date-list .tab a { float: left; border-right: #ddd 1px solid; border-bottom: #ddd 1px solid; background: #f8f8f8; padding: 0.6em 1.0em; display: inline-block; }
.bx-date-list .tab .current { background: #ffffff; border-bottom: #ffffff 1px solid; }
.bx-date-list .ic-calendar { float: right; font-size: 18px; font-size: 1.125rem; margin: 0.3em 0.8em; }
.bx-date-list .ic-calendar a:hover { text-decoration: none; }

.bx-page { clear: both; margin: 2.083em 1.667em; text-align: center; }
.bx-page:before, .bx-page:after { content: ""; display: table; }
.bx-page:after { clear: both; }
.bx-page a { border: #ddd 1px solid; display: inline-block; width: 2.917em; height: 2.500em; line-height: 2.3em; margin: 2px; }
.bx-page a:hover { background: #f8f8f8; }
.bx-page .current { background: #ccc; }

/* article */
.bx-article-ttl { clear: both; padding: 1.667em 2.500em 1.250em; }
.bx-article-ttl:before, .bx-article-ttl:after { content: ""; display: table; }
.bx-article-ttl:after { clear: both; }
.bx-article-ttl .grid-1 { float: left; width: 18%; padding: 0 0.833em; }
.bx-article-ttl .grid-1 .t1 { font-size: 19px; font-size: 1.1875rem; font-weight: bold; color: #0177c5; padding: 0.4em 0 0.7em; }
.bx-article-ttl .grid-1 .t1 i { display: inline-block; vertical-align: center; }
.bx-article-ttl .grid-1 .t1 a { color: #0177c5; }
.bx-article-ttl .grid-2 { float: right; width: 80%; }
.bx-article-ttl .grid-2 h1 { font-size: 30px; font-size: 1.875rem; }
.bx-article-ttl .grid-2 .tool { color: #999999; margin-top: 1.667em; }
.bx-article-ttl .grid-2 .tool .lft { font-size: 13px; font-size: 0.8125rem; }
.bx-article-ttl .grid-2 .tool .lft a { color: #999999; }
.bx-article-ttl .grid-2 .tool .rht a { display: inline-block; }
.bx-article-ttl .grid-2 .tool .rht i { color: #999999; font-size: 22px; font-size: 1.375rem; line-height: 1.200em; width: 1.200em; height: 1.200em; display: inline-block; text-align: center; }
.bx-article-ttl .grid-2 .tool .rht i:hover { text-decoration: none; }
.bx-article-ttl .grid-2 .tool .text { border: #f1f1f1 1px solid; display: inline-block; }
.bx-article-ttl .grid-2 .tool .text a { border-right: #f1f1f1 1px solid; }
.bx-article-ttl .grid-2 .tool .text a:last-child { border: none; }

.bk-article { clear: both; position: relative; }

/*20160611 추가*/
.bk-article {
font-size: 0.9375rem;
    line-height: 1.75;
    color: #222;
    padding: 0 1.3em;
    margin-bottom: 1.333em;
}

.bk-article:before, .bk-article:after { content: ""; display: table; }
.bk-article:after { clear: both; }
.bk-article .bx-like { width: 35px; float: left; margin-top: 10px; margin-left: 0; }
.bk-article .bx-like .ico { /*width: 5.000em; height: 2.500em;*/ width: 1.944em; height: 1.944em; display: block; color: #fff; text-align: center; margin-bottom: 0.833em; }
.bk-article .bx-like .ico:hover { opacity: 0.9; }
.bk-article .bx-like .ico i { font-size: 18px; font-size: 1.125rem; /*width: 1.667em; height: 1.667em; line-height: 1.667em;*/ width: 1.944em; height: 1.944em; line-height: 1.944em; display: inline-block; float: left; }
.bk-article .bx-like .ico em { width: 2.727em; font-size: 10px; font-size: 0.625rem; line-height: 3.000em; font-style: normal; display: inline-block; float: left; }
.bk-article .bx-like .fb { background: #426aa6; }
.bk-article .bx-like .fb i { background: #2d5a9c; }
.bk-article .bx-like .tw { background: #39b1e6; }
.bk-article .bx-like .tw i { background: #20a9e4; }
.bk-article .bx-like .comt { background: #f97231; }
.bk-article .bx-like .comt i { background: #f26522; }
.bk-article .bx-like .more { background: #515050; }
.bk-article .bx-like .more i { background: #3e3d3d; }
.bk-article .con { margin-left: 55px; padding-top: 1.8em; }
.bk-article .imgtbl {margin: 0 auto 1.667em; text-align: center;}
.bk-article .imgtbl img {margin: 0 1.250em!important;}
.bk-article .caption, .bk-article .dimg { font-size: 12px; font-size: 0.75rem; clear: both; color: #666666; margin-top: 0.2em; text-align: left; padding: 0 1.250em!important; }
.bk-article .caption:before, .bk-article .caption:after { content: ""; display: table;}
.bk-article .caption:after { clear: both; }
.bk-article .art-photo { clear: both; overflow: hidden; }
.bk-article .art-photo:before, .bk-article .art-photo:after { content: ""; display: table; }
.bk-article .art-photo:after { clear: both; }
.bk-article .art-photo .caption { padding: 0 1.667em; text-align: right!important; }
.bk-article .sub-title, .bk-article .subTitlebox { font-size: 17px; font-size: 1.0625rem; line-height: 1.3; font-weight: bold; letter-spacing: -0.05em; padding: 0 1.3em 1.111em; color: #999999; }
.bk-article p { font-size: 15px; font-size: 0.9375rem; line-height: 1.75; color: #222; padding: 0 1.3em; margin-bottom: 1.333em; }
.bk-article p a { text-decoration: underline; color: #0177c5; }
.bk-article .art-related { clear: both; padding: 0 1.3em; margin-bottom: 1.8em; }
.bk-article .art-related:before, .bk-article .art-related:after { content: ""; display: table; }
.bk-article .art-related:after { clear: both; }
.bk-article .art-related li { padding: 0.3em 0; font-size: 15px; font-size: 0.9375rem; line-height: 1.3; font-weight: bold; }
.bk-article .art-related i { color: #0177c5; font-style: normal; font-weight: bold; }
.bk-article .art-related .name { font-size: 11px; font-size: 0.6875rem; font-weight: normal; color: #999999; margin-left: 5px; }
.bk-article .wp-copy { clear: both; margin: 0.5em 1.3em 2.5em; color: #999999; }
.bk-article .wp-copy:before, .bk-article .wp-copy:after { content: ""; display: table; }
.bk-article .wp-copy:after { clear: both; }
.bk-article .wp-comt { clear: both; overflow: hidden; margin: 0 1.3em; }
.bk-article .wp-comt:before, .bk-article .wp-comt:after { content: ""; display: table; }
.bk-article .wp-comt:after { clear: both; }

/* comment */
.bx-comment { clear: both; margin-bottom: 2.5em; }
.bx-comment:before, .bx-comment:after { content: ""; display: table; }
.bx-comment:after { clear: both; }
.bx-comment .ttl { margin: 1.0em 0; clear: both; }
.bx-comment .ttl:before, .bx-comment .ttl:after { content: ""; display: table; }
.bx-comment .ttl:after { clear: both; }
.bx-comment .ttl h4 { font-size: 14px; font-size: 0.875rem; line-height: 1.3; font-weight: bold; float: left; }
.bx-comment .ttl h4 span { color: #0177c5; }
.bx-comment .ttl .link { float: right; font-size: 11px; font-size: 0.6875rem; color: #888888; }
.bx-comment .bx-write { clear: both; border: #f1f1f1 1px solid; border-top: #ccc 1px solid; background: #f8f8f8; padding: 1.3em 2.083em; }
.bx-comment .bx-write:before, .bx-comment .bx-write:after { content: ""; display: table; }
.bx-comment .bx-write:after { clear: both; }
.bx-comment .bx-write .grid-row1 { clear: both; margin-bottom: 1.0em; }
.bx-comment .bx-write .grid-row1:before, .bx-comment .bx-write .grid-row1:after { content: ""; display: table; }
.bx-comment .bx-write .grid-row1:after { clear: both; }
.bx-comment .bx-write .grid-row1 .lft { font-size: 14px; font-size: 0.875rem; line-height: 1.3; font-weight: bold; padding: 0.4em 0; }
.bx-comment .bx-write .grid-row2 { clear: both; }
.bx-comment .bx-write .grid-row2:before, .bx-comment .bx-write .grid-row2:after { content: ""; display: table; }
.bx-comment .bx-write .grid-row2:after { clear: both; }
.bx-comment .bx-write .grid-row2 .wp-textarea { position: relative; border: #ddd 1px solid; background: #fff; width: 85%; float: left; }
.bx-comment .bx-write .grid-row2 .wp-textarea .t1 { position: absolute; bottom: 5px; right: 10px; font-size: 10px; font-size: 0.625rem; color: #666; }
.bx-comment .bx-write .grid-row2 .wp-textarea .t1 em { color: #f35e1d; font-style: normal; }
.bx-comment .bx-write .grid-row2 .wp-textarea .textarea { width: 100%; border: none; padding-bottom: 1.8em; }
.bx-comment .bx-write .grid-row2 .btn { width: 15%; float: left; border-left: none; font-size: 14px; font-size: 0.875rem; padding: 2.5em 0; }
.bx-comment .bx-list .tab { clear: both; border-left: #f1f1f1 1px solid; border-bottom: #f1f1f1 1px solid; }
.bx-comment .bx-list .tab:before, .bx-comment .bx-list .tab:after { content: ""; display: table; }
.bx-comment .bx-list .tab:after { clear: both; }
.bx-comment .bx-list .tab li { float: left; border-bottom: #f1f1f1 1px solid; margin-bottom: -1px; }
.bx-comment .bx-list .tab a { padding: 1.0em 2.0em; display: inline-block; border-right: #f1f1f1 1px solid; color: #666666; }
.bx-comment .bx-list .tab .current { background: #fff; border-bottom: #ffffff 1px solid; }
.bx-comment .bx-list .tab .current a { color: #000000; }
.bx-comment .bx-list .grid-1 { clear: both; padding: 1.0em 0; }
.bx-comment .bx-list .grid-1:before, .bx-comment .bx-list .grid-1:after { content: ""; display: table; }
.bx-comment .bx-list .grid-1:after { clear: both; }
.bx-comment .bx-list .grid-1 .imo { float: left; margin-right: 10px; }
.bx-comment .bx-list .grid-1 .date { color: #888888; }
.bx-comment .bx-list .grid-1 .fix { flaot: left; margin-left: 10px; }
.bx-comment .bx-list .grid-1 .fix .btn-delete { border: #f1f1f1 1px solid; font-size: 11px; font-size: 0.6875rem; display: inline-block; padding: 0.3em 0.5em; color: #f72020; margin: 0 2px; }
.bx-comment .bx-list .grid-1 .fix .btn-modify { border: #f1f1f1 1px solid; font-size: 11px; font-size: 0.6875rem; display: inline-block; padding: 0.3em 0.5em; }
.bx-comment .bx-list .grid-1 .btn { border: #f1f1f1 1px solid; padding: 0.2em 1.0em; display: inline-block; font-size: 10px; font-size: 0.625rem; color: #0177c5; margin-left: 2px; }
.bx-comment .bx-list .grid-1 .btn i { font-size: 16px; font-size: 1rem; }
.bx-comment .bx-list .grid-1 .btn:hover { text-decoration: none; }
.bx-comment .bx-list .grid-1 .dislike { color: #f35e1d; }
.bx-comment .bx-list .grid-2 { clear: both; background: #f8f8f8; padding: 1.0em; }
.bx-comment .bx-list .grid-2:before, .bx-comment .bx-list .grid-2:after { content: ""; display: table; }
.bx-comment .bx-list .grid-2:after { clear: both; }

/* side */
.bk-side .grid-1 { clear: both; }
.bk-side .grid-1:before, .bk-side .grid-1:after { content: ""; display: table; }
.bk-side .grid-1:after { clear: both; }
.bk-side .grid-1 .box { clear: both; }
.bk-side .grid-1 .box:before, .bk-side .grid-1 .box:after { content: ""; display: table; }
.bk-side .grid-1 .box:after { clear: both; }
.bk-side .grid-1 .box .list { font-size: 17px; font-size: 1.0625rem; line-height: 1.4; font-weight: bold; letter-spacing: -0.06em; padding: 0.588em 1.176em; border-bottom: #f1f1f1 1px solid; display: block; clear: both; }
.bk-side .grid-1 .box .list:before, .bk-side .grid-1 .box .list:after { content: ""; display: table; }
.bk-side .grid-1 .box .list:after { clear: both; }
.bk-side .grid-2 { clear: both; }
.bk-side .grid-2:before, .bk-side .grid-2:after { content: ""; display: table; }
.bk-side .grid-2:after { clear: both; }
.bk-side .grid-2 .box { clear: both; position: relative; margin: 1.250em 1.667em; }
.bk-side .grid-2 .box:before, .bk-side .grid-2 .box:after { content: ""; display: table; }
.bk-side .grid-2 .box:after { clear: both; }
.bk-side .grid-2 .box .photo img { width: 100%; }
.bk-side .grid-2 .box .ttl { position: absolute; left: 0; bottom: 0; z-index: 2; font-size: 14px; font-size: 0.875rem; line-height: 1.3; font-weight: bold; color: #ffffff; letter-spacing: -0.06em; padding: 0.7em 1.250em; }
.bk-side .grid-2 .box .ttl a { color: #ffffff; }
.bk-side .grid-2 .box .ttl:hover { color: #ffffff; }
.bk-side .grid-2 .box .ttl .t1 { font-size: 17px; font-size: 1.0625rem; }
.bk-side .grid-2 .box .ttl .caty {color: #ffffff;}
.bk-side .grid-2 .box2 { clear: both; }
.bk-side .grid-2 .box2:before, .bk-side .grid-2 .box2:after { content: ""; display: table; }
.bk-side .grid-2 .box2:after { clear: both; }
.bk-side .grid-2 .box2 .list { font-size: 17px; font-size: 1.0625rem; line-height: 1.3; font-weight: bold; letter-spacing: -0.06em; padding: 0.588em 1.176em; border-bottom: #f1f1f1 1px solid; display: block; clear: both; }
.bk-side .grid-2 .box2 .list:before, .bk-side .grid-2 .box2 .list:after { content: ""; display: table; }
.bk-side .grid-2 .box2 .list:after { clear: both; }
.bk-side .grid-3 { clear: both; }
.bk-side .grid-3:before, .bk-side .grid-3:after { content: ""; display: table; }
.bk-side .grid-3:after { clear: both; }
.bk-side .grid-3 .box { clear: both; }
.bk-side .grid-3 .box:before, .bk-side .grid-3 .box:after { content: ""; display: table; }
.bk-side .grid-3 .box:after { clear: both; }
.bk-side .grid-3 .box .list { padding: 1.250em 1.667em; border-bottom: #f1f1f1 1px solid; display: block; clear: both; }
.bk-side .grid-3 .box .list:before, .bk-side .grid-3 .box .list:after { content: ""; display: table; }
.bk-side .grid-3 .box .list:after { clear: both; }
.bk-side .grid-3 .box h3 { font-size: 16px; font-size: 1rem; line-height: 1.3; font-weight: bold; letter-spacing: -0.04em; }
.bk-side .grid-3 .box h3 span { font-size: 12px; font-size: 0.75rem; color: #0177c5; }
.bk-side .grid-3 .box .ttl2 { font-size: 15px; font-size: 0.9375rem; line-height: 1.3; font-weight: 700; }
.bk-side .grid-3 .books .caty { font-size: 18px; font-size: 1.125rem; color: #005e20; }
.bk-side .grid-3 .books .ttl { margin: 0.5em 0; }
.bk-side .grid-4 { clear: both; }
.bk-side .grid-4:before, .bk-side .grid-4:after { content: ""; display: table; }
.bk-side .grid-4:after { clear: both; }
.bk-side .grid-4 .box { clear: both; position: relative; margin: 1.250em 1.667em; border-bottom: #f1f1f1 4px solid; }
.bk-side .grid-4 .box:before, .bk-side .grid-4 .box:after { content: ""; display: table; }
.bk-side .grid-4 .box:after { clear: both; }
.bk-side .grid-4 .box .photo img { width: 100%; }
.bk-side .grid-4 .box .ttl { position: absolute; left: 0; bottom: 0; z-index: 2; color: #fff; letter-spacing: -0.06em; padding: 1.5em 3.0em; text-align: center; width: 100%; }
.bk-side .grid-4 .box .ttl a { color: #fff; }
.bk-side .grid-4 .box .ttl:hover { color: #fff; }
.bk-side .grid-4 .box .ttl .t1 span { background: rgba(0, 0, 0, 0.6); display: inline-block; padding: 5px; }
.bk-side .grid-4 .box .ttl .t2 { font-size: 18px; font-size: 1.125rem; }
.bk-side .grid-4 .box .arr { position: absolute; top: 45%; left: 0; z-index: 3; width: 1.500em; height: 1.500em; display: inline-block; background: rgba(0, 0, 0, 0.6); color: #ffffff; font-size: 20px; font-size: 1.25rem; line-height: 1.500em; text-align: center; }
.bk-side .grid-4 .box .arr:hover { text-decoration: none; background: rgba(0, 0, 0, 0.9); }
.bk-side .grid-4 .box .next { left: auto; right: 0; }
.bk-side .grid-5 { clear: both; }
.bk-side .grid-5:before, .bk-side .grid-5:after { content: ""; display: table; }
.bk-side .grid-5:after { clear: both; }
.bk-side .grid-5 .box { clear: both; }
.bk-side .grid-5 .box:before, .bk-side .grid-5 .box:after { content: ""; display: table; }
.bk-side .grid-5 .box:after { clear: both; }
.bk-side .grid-5 .box .list { padding: 1.250em 1.667em; border-bottom: #f1f1f1 1px solid; display: block; clear: both; }
.bk-side .grid-5 .box .list:before, .bk-side .grid-5 .box .list:after { content: ""; display: table; }
.bk-side .grid-5 .box .list:after { clear: both; }
.bk-side .grid-5 .box h3 { font-size: 16px; font-size: 1rem; line-height: 1.3; font-weight: bold; letter-spacing: -0.05em; }
.bk-side .grid-5 .box h3 span { font-size: 12px; font-size: 0.75rem; color: #0177c5; }
.bk-side .grid-5 .box .ttl { font-size: 15px; font-size: 0.9375rem; line-height: 1.4; font-weight: 700; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; display: block; }
.bk-side .grid-5 .box .photo { position: relative; }
.bk-side .grid-5 .box .photo img { width: 100%; }
.bk-side .grid-5 .box .play { position: absolute; left: 5px; bottom: 15px; color: #ffffff; font-size: 25px; font-size: 1.5625rem; z-index: 5; opacity: 0.9; }
.bk-side .grid-5 .box .big .play { font-size: 80px; font-size: 5rem; left: 38%; top: 37%; }
.bk-side .grid-5 .box .big .ttl { font-size: 16px; font-size: 1rem; margin-top: 8px; }
.bk-side .grid-6 { clear: both; }
.bk-side .grid-6:before, .bk-side .grid-6:after { content: ""; display: table; }
.bk-side .grid-6:after { clear: both; }
.bk-side .grid-6 .box { clear: both; }
.bk-side .grid-6 .box:before, .bk-side .grid-6 .box:after { content: ""; display: table; }
.bk-side .grid-6 .box:after { clear: both; }
.bk-side .grid-6 .box .list { font-size: 17px; font-size: 1.0625rem; line-height: 1.4; font-weight: bold; letter-spacing: -0.05em; padding: 1.0em 1.176em; border-bottom: #f1f1f1 1px solid; display: block; clear: both; }
.bk-side .grid-6 .box .list:before, .bk-side .grid-6 .box .list:after { content: ""; display: table; }
.bk-side .grid-6 .box .list:after { clear: both; }
.bk-side .grid-6 .box .list:last-child { border: none; }

/* sponsor */
.unit-sponsor { clear: both; }
.unit-sponsor:before, .unit-sponsor:after { content: ""; display: table; }
.unit-sponsor:after { clear: both; }
.unit-sponsor .box { clear: both; padding: 0.8em 0; }
.unit-sponsor .box:before, .unit-sponsor .box:after { content: ""; display: table; }
.unit-sponsor .box:after { clear: both; }
.unit-sponsor .box li { font-size: 15px; font-size: 0.9375rem; line-height: 1.3; font-weight: bold; letter-spacing: -0.05em; padding: 0.2em 1.429em; display: block; clear: both; }
.unit-sponsor .box li:before, .unit-sponsor .box li:after { content: ""; display: table; }
.unit-sponsor .box li:after { clear: both; }

/* bottom-inside */
.bk-inside { clear: both; border-top: #f1f1f1 1px solid; }
.bk-inside:before, .bk-inside:after { content: ""; display: table; }
.bk-inside:after { clear: both; }
.bk-inside h4 { font-size: 18px; font-size: 1.125rem; color: #0177c5; font-weight: bold; padding: 0.8em 3%; border-bottom: #f1f1f1 1px solid; }
.bk-inside .con { clear: both; padding: 0 2%; }
.bk-inside .con:before, .bk-inside .con:after { content: ""; display: table; }
.bk-inside .con:after { clear: both; }
.bk-inside .box { width: 18%; margin: 1.8em 1% 2.5em; float: left; }
.bk-inside .photo { margin-bottom: 0.833em; }
.bk-inside .photo img { width: 100%; }

.bk-inside2 { clear: both; border-top: #f1f1f1 1px solid; }
.bk-inside2:before, .bk-inside2:after { content: ""; display: table; }
.bk-inside2:after { clear: both; }
.bk-inside2 h4 { font-size: 18px; font-size: 1.125rem; color: #0177c5; font-weight: bold; padding: 0.8em 2.5%; border-bottom: #f1f1f1 1px solid; }
.bk-inside2 .con { clear: both; padding: 0 1%; }
.bk-inside2 .con:before, .bk-inside2 .con:after { content: ""; display: table; }
.bk-inside2 .con:after { clear: both; }
.bk-inside2 .grid { width: 19%; padding: 1.250em; float: left; border-right: #f1f1f1 1px solid; overflow: hidden; }
.bk-inside2 .grid:last-child { border: none; }
.bk-inside2 .list { clear: both; padding: 1.250em; border-bottom: #f1f1f1 1px solid; }
.bk-inside2 .list:before, .bk-inside2 .list:after { content: ""; display: table; }
.bk-inside2 .list:after { clear: both; }
.bk-inside2 .list:last-child { border: none; }
.bk-inside2 .photo { margin-bottom: 0.833em; position: relative; }
.bk-inside2 .photo img { width: 100%; }
.bk-inside2 .col-1 { width: 43%; }
.bk-inside2 .col-1 .photo { margin-bottom: 0; }
.bk-inside2 .col-1 h3 { position: absolute; bottom: 0; left: 0; padding: 1.0em 0.8em; color: #ffffff; z-index: 5; }
.bk-inside2 .col-2 .summary { margin-top: 0.6em; }
.bk-inside2 .col-3, .bk-inside2 .col-4 { padding: 0; }

/* advertisement */
.unit-banner { overflow: hidden; text-align: center; clear: both; }
.unit-banner:before, .unit-banner:after { content: ""; display: table; }
.unit-banner:after { clear: both; }

.unit-banner-top { clear: none; }
.unit-banner-mid { clear: none; }
.unit-banner-side { padding: 1.667em 0; }
.unit-banner-half { padding: 1.667em 0; }
.unit-banner-half .banner { width: 50%; float: left; }
.unit-banner-leaderboard { padding: 1.667em 0; border-bottom: #f1f1f1 1px solid; }
.unit-banner-leaderboard2 { padding: 1.667em 0; border-top: #f1f1f1 1px solid; }
.unit-banner-article { line-height: 0; }
.unit-banner-main { margin-bottom: 1.667em; }

/* photo */
.bk-photo-section { clear: both; padding: 1.667em;}
.bk-photo-section:before, .bk-photo-section:after { content: ""; display: table; }
.bk-photo-section:after { clear: both; }
.bk-photo-section .grid-list { float: left; }
.bk-photo-section .grid-list .photo { width: 50%; float: left; margin-right: 1.0em; }
.bk-photo-section .grid-head { clear: both; margin-bottom: 2.500em; }
.bk-photo-section .grid-head:before, .bk-photo-section .grid-head:after { content: ""; display: table; }
.bk-photo-section .grid-head:after { clear: both; }
.bk-photo-section .grid-head .col-1 { width: 48%; float: left; }
.bk-photo-section .grid-head .col-1 h1 { margin: 0.4em 0; }
.bk-photo-section .grid-head .col-2 { width: 51%; float: right; }
.bk-photo-section .grid-head .grid-list { width: 46%; margin: 0 2% 1.667em; }
.bk-photo-section .grid-head .grid-list:nth-of-type(2n+1) { clear: left; }
.bk-photo-section .grid-body { clear: both; }
.bk-photo-section .grid-body:before, .bk-photo-section .grid-body:after { content: ""; display: table; }
.bk-photo-section .grid-body:after { clear: both; }
.bk-photo-section .grid-body .grid-list { width: 46%; margin: 0 2% 1.667em; }
.bk-photo-section .grid-body .grid-list:nth-of-type(2n+1) { clear: left; }
.bk-photo-section .grid-body .col-1 { width: 48%; float: left; padding: 1.667em 0; }
.bk-photo-section .grid-body .col-1 .summary { margin-top: 0.833em; }
.bk-photo-section .grid-body .col-1 .grid-list { width: 100%; clear: both; margin: 0; }
.bk-photo-section .grid-body .col-1 .grid-list:before, .bk-photo-section .grid-body .col-1 .grid-list:after { content: ""; display: table; }
.bk-photo-section .grid-body .col-1 .grid-list:after { clear: both; }
.bk-photo-section .grid-body .col-2 { width: 51%; float: right; padding: 1.667em 0; }

.bk-side .grid-4 .bx-next{left:auto;right:0;position:absolute;top:45%;z-index:3;width:1.500em;height:1.500em;display:inline-block;background:rgba(0, 0, 0, 0.6);color:#fff;font-size:1.25rem;line-height:1.500em;text-align:center;}
.bk-side .grid-4 .bx-prev{position:absolute;top:45%;left:0;z-index:3;width:1.500em;height:1.500em;display:inline-block;background:rgba(0, 0, 0, 0.6);color:#fff;font-size:1.25rem;line-height:1.500em;text-align:center;}

@media only screen and (max-width: 1200px) { html { font-size: 95%; }
  .container, .bk-header .header-1 .container {width: 1020px; }
  .bk-header .navigation .menu a { padding: 0 0.8em; }
  .bk-article .art-photo img { width: 100%; }
  .grid-main-article3 .row-1 .grid { height: 370px;}
  .unit-main .bk-body, .unit-article .bk-body{width:642px;}
  .grid-main-article2{width:643px;}
  .bk-article .imgtbl img{width:90%;}

/* photo */
.bk-photo-section { clear: both; padding: 1.667em;}
.bk-photo-section:before, .bk-photo-section:after { content: ""; display: table; }
.bk-photo-section:after { clear: both; }
.bk-photo-section .grid-list { float: left; }
.bk-photo-section .grid-list .photo { width: 50%; float: left; margin-right: 1.0em; }
.bk-photo-section .grid-head { clear: both; margin-bottom: 2.500em; }
.bk-photo-section .grid-head:before, .bk-photo-section .grid-head:after { content: ""; display: table; }
.bk-photo-section .grid-head:after { clear: both; }
.bk-photo-section .grid-head .col-1 { width: 48%; float: left; }
.bk-photo-section .grid-head .col-1 h1 { margin: 0.4em 0; }
.bk-photo-section .grid-head .col-2 { width: 51%; float: right; }
.bk-photo-section .grid-head .grid-list { width: 46%; margin: 0 2% 1.667em; }
.bk-photo-section .grid-head .grid-list:nth-of-type(2n+1) { clear: left; }
.bk-photo-section .grid-body { clear: both; }
.bk-photo-section .grid-body:before, .bk-photo-section .grid-body:after { content: ""; display: table; }
.bk-photo-section .grid-body:after { clear: both; }
.bk-photo-section .grid-body .grid-list { width: 46%; margin: 0 2% 1.667em; }
.bk-photo-section .grid-body .grid-list:nth-of-type(2n+1) { clear: left; }
.bk-photo-section .grid-body .col-1 { width: 48%; float: left; padding: 1.667em 0; }
.bk-photo-section .grid-body .col-1 .summary { margin-top: 0.833em; }
.bk-photo-section .grid-body .col-1 .grid-list { width: 100%; clear: both; margin: 0; }
.bk-photo-section .grid-body .col-1 .grid-list:before, .bk-photo-section .grid-body .col-1 .grid-list:after { content: ""; display: table; }
.bk-photo-section .grid-body .col-1 .grid-list:after { clear: both; }
.bk-photo-section .grid-body .col-2 { width: 51%; float: right; padding: 1.667em 0; }

.bk-side .grid-4 .bx-next{left:auto;right:0;position:absolute;top:45%;z-index:3;width:1.500em;height:1.500em;display:inline-block;background:rgba(0, 0, 0, 0.6);color:#fff;font-size:1.25rem;line-height:1.500em;text-align:center;}
.bk-side .grid-4 .bx-prev{position:absolute;top:45%;left:0;z-index:3;width:1.500em;height:1.500em;display:inline-block;background:rgba(0, 0, 0, 0.6);color:#fff;font-size:1.25rem;line-height:1.500em;text-align:center;}

/* PDF */
.bk-pdf { clear: both; padding: 1.667em; }
.bk-pdf:before, .bk-pdf:after { content: ""; display: table; }
.bk-pdf:after { clear: both; }
.bk-pdf .grid-row { clear: both; margin-bottom: 1.667em; }
.bk-pdf .grid-row:before, .bk-pdf .grid-row:after { content: ""; display: table; }
.bk-pdf .grid-row:after { clear: both; }
.bk-pdf .grid-row .lft { font-size: 33px; font-size: 2.0625rem; }
.bk-pdf .grid-row .lft span { font-size: 40px; font-size: 2.5rem; font-weight: bold; color: #304f8d; }
.bk-pdf .grid-row .rht { font-size: 16px; font-size: 1rem; margin-top: 1.0em; }
.bk-pdf .grid-row .rht .t1 { color: #304f8d; }
.bk-pdf .grid-row .rht .t2 { font-size: 22px; font-size: 1.375rem; font-weight: bold; }
.bk-pdf .grid-row2 { clear: both; background: #f0f4fc; }
.bk-pdf .grid-row2:before, .bk-pdf .grid-row2:after { content: ""; display: table; }
.bk-pdf .grid-row2:after { clear: both; }
.bk-pdf .grid-row2 .lft { padding: 0.833em 1.667em; }
.bk-pdf .grid-row2 .lft .wp-select { position: relative; display: inline-block; float: left; }
.bk-pdf .grid-row2 .lft .wp-select .select { -moz-appearance: none; -webkit-appearance: none; appearance: none; padding-right: 2.0em; }
.bk-pdf .grid-row2 .lft .wp-select i { position: absolute; top: 7px; right: 3px; font-size: 20px; font-size: 1.25rem; color: #304f8d; }
.bk-pdf .grid-row2 .lft .btn-view { background: #304f8d; color: #ffffff; font-weight: bold; font-size: 14px; font-size: 0.875rem; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: radius; padding: 0.65em 1.2em; display: inline-block; float: left; margin-left: 8px; }
.bk-pdf .grid-row2 .lft .btn-view:hover { background: #333333; }
.bk-pdf .grid-row2 .rht { font-size: 11px; font-size: 0.6875rem; padding: 1.8em 1.667em; color: #999999; }
.bk-pdf .grid-row2 .rht em { font-style: normal; color: #304f8d; }
.bk-pdf .grid-row3 { clear: both; padding: 1.667em 0; }
.bk-pdf .grid-row3:before, .bk-pdf .grid-row3:after { content: ""; display: table; }
.bk-pdf .grid-row3:after { clear: both; }
.bk-pdf .grid-row3 .lft { font-size: 18px; font-size: 1.125rem; font-weight: bold; }
.bk-pdf .grid-row4 { clear: both; margin-bottom: 0.833em; position: relative; }
.bk-pdf .grid-row4:before, .bk-pdf .grid-row4:after { content: ""; display: table; }
.bk-pdf .grid-row4:after { clear: both; }
.bk-pdf .grid-row4 .grid { min-height: 232px; }
.bk-pdf .grid-row4 .grid-col1 { width: 15%; float: left; padding: 1.5em; background: #304f8d; color: #fff; text-align: center; font-size: 20px; font-size: 1.25rem; }
.bk-pdf .grid-row4 .grid-col1 span { display: block; font-size: 10px; font-size: 0.625rem; color: #ddd; margin-top: 1.0em; }
.bk-pdf .grid-row4 .grid-col2 { width: 80%; float: left; }
.bk-pdf .grid-row4 .grid-col2 .box { width: 23%; float: left; text-align: center; margin-bottom: 1.667em; }
.bk-pdf .grid-row4 .grid-col2 .box a { position: relative; padding: 0.833em; display: inline-block; }
.bk-pdf .grid-row4 .grid-col2 .box i { display: none; }
.bk-pdf .grid-row4 .grid-col2 .box:hover i { position: absolute; top: 36%; left: 50%; margin-left: -40px; z-index: 3; font-size: 40px; font-size: 2.5rem; width: 80px; height: 80px; padding-top: 6px; display: block; border-radius: 70px; -webkit-border-radius: 70px; -moz-border-radius: 70px; -ms-border-radius: radius; color: #ffffff; text-align: center; background: rgba(0, 0, 0, 0.4); }
.bk-pdf .grid-row4 .grid-col2 .box:hover i em { font-size: 12px; font-size: 0.75rem; font-style: normal; display: block; margin-top: -10px; }
.bk-pdf .grid-row4 .grid-col2 .box2 { width: 27%; float: left; margin-bottom: 1.667em; }
.bk-pdf .grid-row4 .grid-col2 .box2 h4 { font-size: 16px; font-size: 1rem; margin-bottom: 0.5em; }
.bk-pdf .grid-row4 .grid-col2 .gray { background: rgba(0, 0, 0, 0.1); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; }
.bk-pdf .grid-row4 .btn-more { width: 3.5%; line-height: 232px; position: absolute; top: 0; right: 0; background: #cccccc; text-align: center; display: block; }
.bk-pdf .grid-row4 .btn-more i { font-size: 28px; font-size: 1.75rem; color: #ffffff; }
.bk-pdf .grid-row4 .btn-more:hover { text-decoration: none; opacity: 0.9; }

.bk-side .grid-4 .bx-next{left:auto;right:0;position:absolute;top:45%;z-index:3;width:1.500em;height:1.500em;display:inline-block;background:rgba(0, 0, 0, 0.6);color:#fff;font-size:1.25rem;line-height:1.500em;text-align:center;}
.bk-side .grid-4 .bx-prev{position:absolute;top:45%;left:0;z-index:3;width:1.500em;height:1.500em;display:inline-block;background:rgba(0, 0, 0, 0.6);color:#ffffff;font-size:1.25rem;line-height:1.500em;text-align:center;}
.imgtbl .dimg {
    line-height: 150%;
    margin-left: 12px;
    margin-top: 8px;
    margin-right: 12px;
}

.subTitlebox{color:#98989a; font-weight:bold; font-size:1.6em;}