@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);

/* 본문, 섹션 공통사항 */

.icon_text_video, 
.icon_text_photo,
.icon_text_video2, 
.icon_text_photo2,
.icon_text_story2,
.icon_media_video,
.icon_media_photo,
.icon_media_story{ vertical-align:middle; margin-left:5px; border:0;}
.icon_share { background:url(//img.hani.co.kr/section-image/15/hani/images/icon/icon_share_article.png) no-repeat 0 0; padding-left:15px;  margin-left:5px; color:#555; font-size:11px;letter-spacing:-1px;  } 


/* sitemap -서비스 전체보기  */
#sitemap {overflow: hidden;position: relative;width: 1098px;margin: 0 auto;border: 1px solid #dbdbdb;text-align: left;}
#sitemap .fold { position: absolute; top: 14px; right :13px;}
#sitemap .fold a { display: block; width: 14px; height: 13px; background: url(//img.hani.co.kr/section-image/12/news/hani/images/com/btn/btn_sitemap.gif) no-repeat 0 -13px;}
#sitemap .fold.open a { background-position: 0 0; }
#sitemap .sitemap-title h3 { font-size:13px; color:#000 ;padding: 14px 0 12px 13px; }
#sitemap .sitemap-layer{ overflow: hidden; display: none; border-top: 1px solid #f4f4f4; }
#sitemap .sitemap-layer .line02  { margin-top:20px;}
#sitemap .sitemap-layer dl { float:left; width:120px;}
#sitemap .sitemap-layer dl.line-a { width:90px;}
#sitemap .sitemap-layer dl.line-c { width:125px;}
#sitemap .sitemap-layer dt{ padding: 10px 0 8px;  font-size: 12px; font-weight: bold; color: #444; }
#sitemap .sitemap-layer dt a{ color: #444;}
#sitemap .sitemap-layer dt li { line-height:1.5em;}
#sitemap .sitemap-layer dd { padding-bottom:5px;}
#sitemap .sitemap-layer dd a{ line-height: 17px; font-size: 12px; color: #777; }
#sitemap .sitemap-layer.open { display: block; }

#sitemap.open .fold a { background-position: 0 -13px; }
#sitemap.close .fold a { background-position: 0 0; }
#sitemap.open .sitemap-layer{ display:block; }
#sitemap.close .sitemap-layer{ display:block; height:0px; overflow: hidden; border:0px; }
#sitemap li { float:left; vertical-align:middle; font-size:15px;}
#sitemap .article-plus{ *left:0; top:52px; background-color:#fff; padding:0;-webkit-box-shadow: 2px 4px 4px rgba(0,0,0,0.5);-moz-box-shadow: 2px 4px 4px rgba(0,0,0,0.5);box-shadow: 2px 4px 4px rgba(0,0,0,0.5); text-align:center; z-index:3002;}
#sitemap .article-plus table {position:relative; overflow:hidden; text-align:left; }
#sitemap .article-plus table tr.first th,
#sitemap .article-plus table tr.first td { padding-top:20px;}
#sitemap .article-plus table tr.last th,
#sitemap .article-plus table tr.last td { padding-bottom:10px;}
#sitemap .article-plus table a { display:inline;  font-size:13px;}
#sitemap .article-plus th { text-align:right; width:20%;  height:20px; background-color:#f8f8f8; padding: 8px 15px; font-size:13px; font-weight:bold; color:#000; }
#sitemap .article-plus th span.bar{ color:#ebebeb;  padding: 0 5px; }
#sitemap .article-plus th.title {_width:auto; *width:auto; text-align: left; padding-left: 15%;}
#sitemap .article-plus td { text-align:left; font-size:13px; padding: 8px 0 8px 15px;}
#sitemap .article-plus td ul{ background:none; height:auto;}
#sitemap .article-plus td ul li { font-size:13px; padding:0; padding-right:10px; margin-right:10px; white-space:nowrap; }


/* footer */
#footer {clear: both;width: 1100px;margin: 0 auto;text-align: left;}
#footer .logo { float: left; width: 136px; height: 70px; }
#footer .footer-inner { float: left; width: 964px; margin: 10px 0 0; }
#footer .footer-inner .footer-link { width: 100%; zoom: 1; }
#footer .footer-inner .footer-link:after { content: "."; display: block; font-size: 0; height: 0; line-height: 0; clear: both; }
#footer .footer-inner .footer-link.first-child { border-bottom: 1px solid #eaeaea; }
#footer .footer-inner .links { float: left; }
#footer .footer-inner h4, #footer .footer-inner .links li{ float: left; font-size: 11px; line-height: 1.1; letter-spacing: -1px; }
#footer .footer-inner h4 { padding-top: 10px; padding-right: 8px; background: url(//img.hani.co.kr/section-image/12/news/hani/images/com/bul/bul_2x4_222.gif) no-repeat 100% 14px; font-weight: bold; color: #222; }
#footer .footer-inner .links li a { display: block; float: left; padding:10px 8px 8px 7px; color: #777; }
#footer .footer-inner .links li.last-child a { background: none; }
#footer .footer-inner .social { float: right; margin:5px 0; }
#footer .footer-inner .social li, #footer .footer-inner .social a { float: left; }
#footer .footer-inner .social a { display: block;}
#footer .footer-inner .social .facebook { background:url(//img.hani.co.kr/section-image/15/hani/images/icon/icon_top_facebook.png) no-repeat; width:20px; height:20px; margin-right:6px;}
#footer .footer-inner .social .twitter { background:url(//img.hani.co.kr/section-image/15/hani/images/icon/icon_top_twitter.png) no-repeat; width:20px; height:20px; }

#footer .footer-inner #family-sites { position: relative; float: right; margin: 2px 0 0; }
#footer .footer-inner #select-title { float: right; padding: 4px 0 2px 7px; border: 1px solid #dbdbdb; }
#footer .footer-inner #select-title:hover { text-decoration: none; color: #222; }
#footer .footer-inner #select-title { background:url(//img.hani.co.kr/section-image/15/hani/images/v2/btn_select.png) no-repeat 100% 2px;}
#footer .footer-inner #select-layer { display: none; position: absolute; bottom: 0; right: 0; width:100%; }
#footer .footer-inner #select-layer { border: 1px solid #ebebeb; background: #fff; }
#footer .footer-inner #select-layer ul.site-list { overflow: auto; overflow-x:hidden; height: 80px; padding: 7px 0; margin: 0 auto; }
#footer .footer-inner #select-layer ul.site-list li { line-height: 21px; }
#footer .footer-inner #select-layer ul.site-list li a { overflow: hidden; padding: 0 0 0 7px; }
#footer .footer-inner #select-layer ul.site-list li a:hover {   color: #222; }

#footer .footer-inner #family-sites.open #select-layer { display: block; }
#footer .footer-inner #family-sites.close #select-layer { display: block; height:0px; overflow:hidden; border: 0px; }


#footer .copyright { clear: both; width:100%; border-top: 2px solid #666; padding: 9px 0;  text-align: center; font-family: verdana; font-size: 11px; color: #333; line-height: 1.1; }



/* 우측 하니프렌즈 */
.hani-friend { margin-bottom:20px; background-color:#f7f7f7; border:1px solid #ebebeb; margin-top: 40px;}
.hani-friend h3 {font-size: 20px;padding: 25px 0 12px;text-align: center;}
.hani-friend ul {position:relative;height: 185px; padding-left: 2px;}
.hani-friend li {float:left;width: 49px;height: 45px;text-align:center;}
.hani-friend li .icon{display:block;height: 25px;width: 30px;background:url(//img.hani.co.kr/section-image/15/hani/images/v2/icon/icon_friend.png) no-repeat 50% 50%;cursor: pointer;background-size: 250px 86px;}
.hani-friend li.icon-mail .icon{ background-position: 0 0;}
.hani-friend li.icon-f .icon{background-position: -38px 0;}
.hani-friend li.icon-t .icon{background-position: -79px 0;}
.hani-friend li.icon-r .icon{background-position: -123px 0;}
.hani-friend li.icon-m .icon{background-position: -167px 0;}
.hani-friend li.icon-i .icon{background-position: -210px 0;}
.hani-friend li.icon-mail.on .icon{background-position: 0 -43px;}
.hani-friend li.icon-f.on .icon{background-position: -38px -43px;}
.hani-friend li.icon-t.on .icon{background-position: -79px -43px;}
.hani-friend li.icon-r.on .icon{background-position: -123px -43px;}
.hani-friend li.icon-m.on .icon{background-position: -167px -43px;}
.hani-friend li.icon-i.on .icon{background-position: -210px -43px;}

.hani-friend li .icon-area {/* height:54px; */text-align:center;padding: 10px 10px;}
.hani-friend li.on .icon-area {background-color: #fff;/* border:1px solid #d2d2d2; *//* border-bottom:0; */}


.hani-friend li .box-area {display:none;position:absolute;bottom:0;left:0;background-color: #fff;height: 140px;width:298px;/* border-top:1px solid #d2d2d2; */}
.hani-friend li.on .box-area {display:table; text-align: center;}
.hani-friend li.on .box-area .inner { display: table-cell; text-align: center; vertical-align: middle;}
.hani-friend li.on.icon-mail .box-area .inner{ text-align: left;}
.hani-friend li .box-area .inner {padding: 15px;vertical-align:middle;font-size:13px;line-height:1.6em;}
.hani-friend li .box-area .inner img { vertical-align:middle;}
.hani-friend li.icon-m .box-area .inner span { display: inline-block; }
.hani-friend li.icon-m .box-area .inner span a { padding: 0 5px;}
.hani-friend li.icon-m .box-area .inner span em {display:block; border-radius: 4px;border: 1px solid #ebebeb; padding: 2px 15px; margin-bottom: 10px;}
.hani-friend li .box-area .txt {font-size: 13px;letter-spacing: -0.07em;line-height: 1.4em;margin: 0 0 10px; color: #777;}
.hani-friend li .box-area .txt strong { font-weight: normal; text-decoration: underline; display: block;}
.hani-friend li .box-area .letter-btn {text-align: center;letter-spacing: -0.07em;}
.hani-friend li .box-area .btn {position: relative;display: inline-block;min-width: 50px;font-size: 12px;text-align: center;border-radius: 4px;
    padding: 4px 10px;border: 1px solid #000;letter-spacing: -0.07em;background-color: #000000;color: #fff;margin-right: 5px;}
.hani-friend li .box-area .letter-btn a em {position: absolute;right: 8px;top: -10px;width: 16px;height: 16px;font-size: 10px;background-color: #52FCF0;border-radius: 50%;color: #fff;font-weight: bold;text-align: center;}
.hani-friend li .box-area  .btn + .btn { background-color: #fff;color: #000; margin-right: 0;}
.hani-friend li .box-area .btn.instagram:after{display:block; content:''; position: absolute; width: 24px; height: 24px; top:3px; left:3px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3Cpath d='M12 2c2.717 0 3.056.01 4.122.06 1.065.05 1.79.217 2.428.465.66.254 1.216.598 1.772 1.153a4.908 4.908 0 0 1 1.153 1.772c.247.637.415 1.363.465 2.428.047 1.066.06 1.405.06 4.122 0 2.717-.01 3.056-.06 4.122-.05 1.065-.218 1.79-.465 2.428a4.883 4.883 0 0 1-1.153 1.772 4.915 4.915 0 0 1-1.772 1.153c-.637.247-1.363.415-2.428.465-1.066.047-1.405.06-4.122.06-2.717 0-3.056-.01-4.122-.06-1.065-.05-1.79-.218-2.428-.465a4.89 4.89 0 0 1-1.772-1.153 4.904 4.904 0 0 1-1.153-1.772c-.248-.637-.415-1.363-.465-2.428C2.013 15.056 2 14.717 2 12c0-2.717.01-3.056.06-4.122.05-1.066.217-1.79.465-2.428a4.88 4.88 0 0 1 1.153-1.772A4.897 4.897 0 0 1 5.45 2.525c.638-.248 1.362-.415 2.428-.465C8.944 2.013 9.283 2 12 2zm0 5a5 5 0 1 0 0 10 5 5 0 0 0 0-10zm6.5-.25a1.25 1.25 0 0 0-2.5 0 1.25 1.25 0 0 0 2.5 0zM12 9a3 3 0 1 1 0 6 3 3 0 0 1 0-6z' fill='rgba(255,255,255,1)'/%3E%3C/svg%3E");}
.hani-friend li .box-area .btn.instagram {background: #c52d5b; /* Old browsers */
    background: -moz-linear-gradient(-45deg, #f9ca26 1%, #e24d36 16%, #a845a2 56%, #4d45a2 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #f9ca26 1%,#e24d36 16%,#a845a2 56%,#4d45a2 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, #f9ca26 1%,#e24d36 16%,#a845a2 56%,#4d45a2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ padding: 5px 10px;border:0; padding-left: 30px;}

/*20200622*/
#footer .copyright {clear: both;width:100%;border-top: 1px solid #ddd;padding: 15px 0 20px;text-align: center;font-size: 11px;color: #555;line-height: 1.3;}
#footer .copyright p {font-family: verdana; font-size:11px; padding-top:3px;}
#footer .copyright .copyright-info {position:relative;overflow:hidden;clear:both;text-align:center;}
#footer .copyright .copyright-info li {position:relative;display:inline-block;font-size:11px;padding: 0 7px 0 5px;color: #777;}
#footer .copyright .copyright-info li.last-child  { background: none; }
#footer .copyright .copyright-info li:before {content: '';display: block;width: 1px;height: 8px;position:absolute;right: 0;background-color: #e4e4e4;top: 4px;}
#footer .copyright .copyright-info li.last-child:before { background-color: #fff;} 

/*20211207*/
#footer.renewal .footer-inner .footer-link.first-child .links li a { display: block; float: left; padding:10px 15px 8px 0; color: #000; font-weight: bold; }
#footer.renewal .footer-inner .footer-link.first-child h4 { background: none;}

