@charset "utf-8";

#foot_layout {position: relative;z-index: 2;background:#262a36;}
#foot_layout .layout {position: relative;max-width: 1240px;width: 100%;/*height: 100%;*/margin:0 auto;}

#banner {border-top:1px solid #e5e5e5; background:#fff;}
#banner .banner_box {overflow: hidden;}
#banner .banner_box .banner_wrap {position:relative; width:100%; height:75px; padding-left:245px;}
#banner .banner_box .banner_wrap strong {display:block; position:absolute; left:0;top:0; line-height:75px; font-size:15px; color:#333; font-weight:600;}
#banner .banner_box .banner_wrap .control {position:absolute; left:80px; top:24.5px; }
#banner .banner_box .banner_wrap .control:after {display:block; clear:both; visibility:hidden; content:'';}
#banner .banner_box .banner_wrap .control a {display:block; float:left; position:relative; width:26px; height:26px; margin:0 2px; border-radius:50%; background:#888;font-size:0; }
#banner .banner_box .banner_wrap .control a:before,
#banner .banner_box .banner_wrap .control a:after {display:block; position:absolute; top: 0;left: 0;right: 0;bottom: 0;margin: auto; content:'';}
#banner .banner_box .banner_wrap .control a:before {width:10px; height:2px;background: #fff;}
#banner .banner_box .banner_wrap .control a:after {width: 2px;height:10px;background: #fff;}

#banner .banner_box .banner_wrap .control button{display:block; float:left; position:relative;width:26px;height:26px;margin:0 2px;padding:0;border-radius:50%;background:#272f3c;font-size:0;}
#banner .banner_box .banner_wrap .control button[data-control="prev"]:before {right:-3px; width:7px; height:7px; border-color: #fff;}
#banner .banner_box .banner_wrap .control button[data-control="next"]:before {left:-3px;width:7px; height:7px; border-color: #fff;}
#banner .banner_box .banner_wrap .control button[data-control="stop"]:before {height:10px; box-shadow: -3px 0 #fff, 3px 0 #fff;}
#banner .banner_box .banner_wrap .control button[data-control="play"]:before {right:-2px; border-width: 6px 0 6px 8px;border-color: transparent transparent transparent #fff;}
#banner .banner_box .banner_wrap .grap {overflow:hidden; width:100%; }
#banner .banner_box .banner_wrap .grap .obj {position:relative; width:1000%;}
#banner .banner_box .banner_wrap .grap .obj:after {display:block; clear:both; visibility:hidden; content:'';}
#banner .banner_box .banner_wrap .grap .obj li {float:left;position:relative;padding-right: 80px;}
#banner .banner_box .banner_wrap .grap .obj li:after {display:block;position:absolute;right: 35px;top:35px;width: 11px;height: 2px;background:#b2b2b2;transform:rotate(45deg);-webkit-transform: rotate(-45deg);content:'';}
#banner .banner_box .banner_wrap .grap .obj li a {display:block;line-height:75px;font-size:15px; color:#333; font-weight:600;}


#foot_layout .move_top {position:absolute;right:50px;top: 48px;z-index: 0;width:60px;height:60px;}
#foot_layout .move_top a {display:block; width:100%; height:100%; background-position:-1px -115px;}

#foot_layout .footer-info {position: relative;padding: 50px 0 70px;}
#foot_layout .footer-info .utile_wrap {margin: 0 0 20px;}
#foot_layout .footer-info .utile_wrap:after {display:block; clear:both; visibility:hidden; content:'';}
#foot_layout .footer-info .utile_wrap li {display:inline-block; position:relative; margin-right:30px;}
#foot_layout .footer-info .utile_wrap li:last-child {margin-right:0;}
#foot_layout .footer-info .utile_wrap li:after {display:block;position:absolute;top: 11px;right: -19px;width:2px;height:2px;background:#808286;content:'';}
#foot_layout .footer-info .utile_wrap li:last-child:after {display:none;}
#foot_layout .footer-info .utile_wrap li a {display:block;width:100%;/*height:100%;*/font-size: 14px;color:#fff;}
#foot_layout .footer-info .utile_wrap li a.point {font-weight:900; color:#ffc107}
#foot_layout .footer-info address {display:block; margin:0 0 5px; color:#808286; font-size:14px; line-height:1.3;}
#foot_layout .footer-info address span {display:inline-block;position:relative; margin-right:20px; }
#foot_layout .footer-info address span:last-child {margin:0;}
#foot_layout .footer-info address span:after {display:inline-block; position:absolute;right:-10px; top:7px; width:1px; height:8px; background:#51555e; content:'';  }
#foot_layout .footer-info address span:last-child:after {display:none;}
#foot_layout .footer-info .copy {display:block; margin:0; color:#808286; font-size:14px;line-height:1.3;}
#foot_layout .footer-info .utile_wrap_right {position:absolute;right:0;top: 50px;width:210px;}
#foot_layout .footer-info .utile_wrap_right .sns_wrap {position:relative;margin:0 0 25px;padding-left: 58px;}
#foot_layout .footer-info .utile_wrap_right .sns_wrap strong {display:block;position:absolute;left:0;top: 3px;color:#cfcfd1;font-size:14px;}
#foot_layout .footer-info .utile_wrap_right .sns_wrap strong:after {display:inline-block;width:1px;height:10px;margin-left: 20px;background:#cfcfd1;content:'';}
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul {}
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul:after {display:block; clear:both; visibility:hidden; content:'';}
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li {float:left; width:28px; height:28px;margin-left:10px;}
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li a {display:block; width:100%; height:100%;}

#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(1) a {background-position:-115px -53px;} /* 유튜브 */
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(2) a {background-position:-1px -53px} /* 블로그 */
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(3) a {background-position:-77px -53px;} /* 페이스북 */
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(4) a {background-position:-153px -53px;} /* 포스트 */

#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(1) a:hover,
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(1) a:focus {background-position:-115px -84px;} /* 유튜브 */
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(2) a:hover,
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(2) a:focus {background-position:-1px -84px;} /* 블로그 */
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(3) a:hover,
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(3) a:focus {background-position:-77px -84px;} /* 페이스북 */
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(4) a:hover,
#foot_layout .footer-info .utile_wrap_right .sns_wrap ul li:nth-child(4) a:focus {background-position:-153px -84px;} /* 포스트 */

#foot_layout .footer-info .utile_wrap_right .family_site {position:relative; width:100%; height:35px;background:#2a2e3a;}
#foot_layout .footer-info .utile_wrap_right .family_site:after {display:block;position:absolute; right:15px; top:14px; width:5px;height:5px;border:solid #fff;border-width: 1px 0 0 1px;content:'';transform: rotate(45deg);}
#foot_layout .footer-info .utile_wrap_right .family_site.on:after {border-width:0 1px 1px 0;}
#foot_layout .footer-info .utile_wrap_right .family_site > a {display:block; width:100%; height:100%; padding:0 15px;  border:1px solid rgba(255,255,255,0.2); line-height:33px; color:#fff; font-size:14px; text-align:left;}
#foot_layout .footer-info .utile_wrap_right .family_site >div {display:none;}
#foot_layout .footer-info .utile_wrap_right .family_site.on >div {display:block;position:absolute;left:0;bottom:0;width: 100%;padding:0 0 35px ;}
#foot_layout .footer-info .utile_wrap_right .family_site >div > a {display:block; width:100%; height:35px;position:absolute; font-size:0; }
#foot_layout .footer-info .utile_wrap_right .family_site >div ul {text-align:left;}
#foot_layout .footer-info .utile_wrap_right .family_site >div ul li { display:block; width:100%; height:100%; border:1px solid rgba(255,255,255,0.2); border-bottom:none;background:#2a2e3a;  }
#foot_layout .footer-info .utile_wrap_right .family_site >div ul li a {display:block;width:100%;height:100%;padding: 10px 15px;line-height: 1.4;color:#fff;font-size:14px;}


@media screen and (max-width:1500px){
    #foot_layout .move_top {right:20px;}
}
@media screen and (max-width:1279px){
    #foot_layout .layout {padding: 0 40px;}
}

@media screen and (max-width:1023px){
    #foot_layout .layout {padding: 0 30px;}
    #banner .banner_box {padding-right:60px;}
    #banner .banner_box .banner_wrap {height:60px;}
    #banner .banner_box .banner_wrap .control {top:17px;}
    #banner .banner_box .banner_wrap strong,
    #banner .banner_box .banner_wrap .grap .obj li a {line-height:60px;}
    #banner .banner_box .banner_wrap .grap .obj li:after {top:29px;}
    #foot_layout .move_top {top:1px; right:0;}
    #foot_layout .footer-info {padding:35px 0;}
    #foot_layout .footer-info .utile_wrap {margin:0 0 15px;}
    #foot_layout .footer-info .utile_wrap_right {position:static; width:100%; margin:0 0 20px;}
    #foot_layout .footer-info .utile_wrap_right:after {display:block; clear:both; visibility:hidden; content:'';}
    #foot_layout .footer-info .utile_wrap_right .sns_wrap {float:left;margin: 0;}
    #foot_layout .footer-info .utile_wrap_right .family_site {float:right;width:200px;}

}

@media screen and (max-width:767px){
    #foot_layout .layout {padding:0 15px;}
    #banner .banner_box .banner_wrap {padding-left:145px;}
    #banner .banner_box .banner_wrap strong {font-size:0;}
    #banner .banner_box .banner_wrap .control {left:0;}
    #banner .banner_box .banner_wrap .grap .obj li {padding-right:50px;}
    #banner .banner_box .banner_wrap .grap .obj li:after {right:20px;}

    #foot_layout .footer-info {text-align:center;}
    #foot_layout .footer-info .utile_wrap_right .sns_wrap {float:none; width:210px; margin:0 auto;}
    #foot_layout .footer-info .utile_wrap_right .family_site {float:none; width:100%; max-width:210px; margin:15px auto;}



}