@media (max-width: 360px) {
  html {
 font-size: 22px;
  }
}
@media (min-width: 361px) and (max-width: 480px) {
  html {
 font-size: 25px;
  }
}
@media (min-width: 481px) {
  html {
 font-size: 28px;
  }
}
@media (max-width: 991px) {

	.header {height: 3rem;word-break: keep-all; position: relative;}
	.header .header-top .container {position: relative; z-index:99; height: 3rem;}

	.header h1 { float: left; padding: 0.6rem 5px 0 15px; font-size: 0; text-align: center;}
	.header h1 a { display: inline-block; height: 1.04545455rem;  }
	.header h1 img {width: 8rem;}
	.header .top-logo {display: none;}

	.all-menu-view {display: block; position: absolute; top: 0; right: 0; z-index: 100; }
	.all-menu-view a {float: left; font-size: 0; display: inline-block; width: 3rem; height: 3rem; background: url(../images/common/nav.png) no-repeat center #2c2c2c; background-size: 25px 25px;}

	.m-menu {display: none; z-index: 101; position: fixed; top: 0; left: 0; right: 0; bottom: 0; height: 100%; background: #fff; letter-spacing: -1px; overflow-y: auto;}
	.all-menu-close {position: absolute; top: 0; right: 0;}
	.all-menu-close a {float: left; font-size: 0; display: inline-block; width: 3rem; height: 3rem; background: url(../images/common/close.png) no-repeat center #fff; background-size: 25px 25px; }
	.header-util {position: absolute; top: 0; left: 0; padding-left: 0.71428571rem; width: 12.59090909rem; height: 3rem; line-height: 3rem;  font-size: 0;}
	.header-util > li {display: inline-block; font-size: 0.59090909rem; }
	.header-util > li > a { color: #000;  }
	.header-util > li + li:before {content: "ㆍ"; padding: 0 0.18181818rem; color: #000; }
	.gnb {padding-top: 4rem;margin-bottom: 1.5rem;}
	.gnb-menus h3 a { position: relative; display: block; padding: 1rem 0 1rem; font-size: 0.7rem; margin: 0 15px; border-bottom: 1px solid #dcdcdc; color: #000; }
	.gnb-menus.gnb-menus h3 {background-image: url(../images/common/angle-down.png); background-repeat: no-repeat; 	background-position: right 0.71428571rem center; 	background-size: 6%;}
	.gnb-menus.gnb-menus h3.active {	background-image: url(../images/common/angle-up.png);}
	.gnb-menus h3.active a {border-bottom: 3px solid #000;}
	.gnb-menus h3 a i { display: none; position: absolute; top: 50%; right: 5px; margin-top: -0.45454545rem; }
	.gnb-menus h3 a.active {   }
	.gnb-menus h3 a:hover {text-decoration: none; }
	.gnb-menus h3 a.active i { display: block;  }
	.hiddenX {display: none;}
	.gnb-submenu { display: none; /* height: calc(100% - 50px); */ overflow-y: auto; padding: 0.4rem 0; margin-left: 0.71428571rem; border-bottom: 1px solid #dcdcdc;  }
	.gnb-submenu.active { display: block;  }
	.gnb-submenu > ul > li > a { position: relative; padding: 0; padding-bottom: 10px; font-size: 0.63636364rem; color: #000; width: auto; display: inline-block; }
	.gnb-submenu ul  li:before {content: "·";color: #000; padding-right: 5px;}
	.gnb-submenu > ul > li > a.active { text-decoration: none; font-weight: bold;  }
	.gnb-submenu > ul > li > a.active > i { display: block;  }

	.back { display: none; z-index: 10; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.7);  }

	.bottom-banner {float: left; width: 100%; background: #fff; border-top: 1px solid #dcdcdc;}
	.bottom-banner p {float: left; width: 50%; height: 2.3rem; border-right: 1px solid #dcdcdc; text-align: center; padding-top: 15px;}
	.bottom-banner p img {max-width: 80%; max-height: 1.4rem;}
	.bottom-banner p:first-child {border-left: 1px solid #dcdcdc;}
	.bottom-banner dl {position: relative; float: left; width: 100%; height: 2.3rem;border-top: 1px solid #dcdcdc; border-left: 1px solid #dcdcdc; border-right: 1px solid #dcdcdc;}
	.bottom-banner dl dt a {display: block; line-height: 2.3rem; padding-left: 20px; color: #000; font-weight: normal; font-size: 16px;}
	.bottom-banner dl dt a i {position: absolute; top: 0.4rem; right: 25px; color: #000; font-size: 30px;}
	.bottom-banner dl dd { position:absolute; display:none; width:100%; max-height:500px; overflow-y:auto; bottom:2.3rem; left:0; padding:20px; border:1px solid #dcdcdc; background:#fff;}
	.bottom-banner dl dd a { display:block; padding:5px 0; color: #000; font-size: 16px; }

	.footer {clear: both; width: 100%; float: left; background: #454545; padding: 30px 15px;}
	.footer .footer-logo {display: none;}
	.footer .right-con {}
	.footer .right-con .footer-txt {color: #fff; font-size: 16px;}
 	.footer .right-con .footer-txt a {color: #fff;}
 	.footer .right-con address {font-size: 16px; color: #a0a0a0; margin: 10px 0 0 0;}
 	.footer .right-con address span {color: #fff;}

	/* 메인 */

	.main { z-index: 1; word-break: keep-all;  background: url(../images/main/main_bg.jpg) no-repeat center 36rem #f4f4f4; }

	.main-banner {height: 14rem;position:relative; overflow: hidden; z-index: 10;}
	.main-banner-list li {height: 14rem;width: 100%;background-size: auto 14rem;background-repeat: no-repeat;background-position: center center;}
	.main-banner-list li img {height: 100%;width: 100%;}
	.main-banner .main-txt {position: absolute; top: 4rem; left: 20px; color: #fff;text-shadow: 5px 5px 10px #000; font-size: 26px; font-family: 's-core_dream2_extralight';}
	.main-banner .main-banner-btn {display: none; position: absolute; top: 9.2rem; left: 20px; }
	.main-banner .main-banner-btn span {display:inline-block; vertical-align: top;}
	.main-banner .main-banner-btn span#slide-counter {color: #fff; font-size: 14px; font-weight: normal; margin-top: 3px;}
	.main-banner .main-banner-btn .bx-pager {margin: 0 10px;}
	.main-banner .main-banner-btn .bx-pager.bx-default-pager .bx-pager-item {display:inline-block;}
	.main-banner .main-banner-btn .bx-pager.bx-default-pager a {text-indent: -9999px; display: inline-block; width: 30px; height: 2px; background: rgba(255, 255, 255, .5); float: left;}
	.main-banner .main-banner-btn .bx-pager.bx-default-pager a.active {background: #fff;}
	.main-banner .main-banner-btn .mb-btn {float: left; color: #fff;}
	.main-banner .main-banner-btn .mb-btn-prev,
	.main-banner .main-banner-btn .mb-btn-next {margin-top: 1px;}
	.main-banner .main-banner-btn .mb-btn-prev a,
	.main-banner .main-banner-btn .mb-btn-next a {color: #fff; font-size: 18px; margin: 0 3px;}

	.main .container {position: relative;}

	.main-info {position: relative; width: 100%; float: left;  box-shadow: 3px 3px 15px rgba(0, 0, 0, .4); background: linear-gradient(to right, #595959, #2c2c2c); z-index: 20;}
 	.main-info p {float: left; width: 33.333%;}
 	.main-info p a {display: block; width: 100%; height: 3rem; padding-top: 1rem; color: #fff; font-size: 16px; text-align: center;}

	.main-board {float: left; width: 92%; margin: 20px 4%; height: 12rem; background: #fff; padding: 20px; box-shadow: 3px 3px 15px rgba(0, 0, 0, .1);}
	.main-board .main-board-list {position: relative;}
	.main-board .main-board-list h3 {float: left; padding-right: 15px;}
	.main-board .main-board-list h3 a {font-size: 16px; color: #a0a0a0;}
	.main-board .main-board-list h3 a.active, 	.main-board .main-board-list h3 a:hover {color: #000; border-bottom: 2px solid #000; text-decoration: none;}
	.main-board .main-board-list ul {position: absolute; top: 2rem; left: 0; display: none; padding: 0; width: 100%;}
	.main-board .main-board-list ul li {float: left; width: 100%; background: url(../images/main/bullet.png) no-repeat left 9px; background-size: 2px 2px; padding: 0 0 15px 10px;}
	.main-board .main-board-list ul li a {color: #000; font-size: 14px; display: block; width: 100%; overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
	.main-board .main-board-list ul li .date {display: none;}
	.main-board .main-board-list p {position: absolute; top: -5px; right: -5px;}
	.main-board .main-board-list p i {font-size: 22px; color: #000;}

	.main-hot {position: relative; float: left; width: 49%; height: 12rem; margin-right: 1%; box-shadow: 3px 3px 15px rgba(0, 0, 0, .1);}
	.main-hot .main-hot-list li {position: absolute; top: 0; left: 0; width: 100%; height: 12rem;}
	.main-hot .main-hot-list li img {width: 100%; height: 100%;}
	.main-hot .main-hot-btn {position: absolute; bottom: 10px; right: 5px;}
	.main-hot .main-hot-btn .mh-btn {float: left; color: #fff; margin: 0 5px;}
	.main-hot .main-hot-btn .mh-btn a {color: #fff;}
	.main-hot .main-hot-btn .hot-btn-prev, .main-hot .main-hot-btn .hot-btn-next {margin-top: 2px;}

	.main-link {position: relative; float: left; width: 49%; height: 12rem; margin-left: 1%; background: #2c2c2c; box-shadow: 3px 3px 15px rgba(0, 0, 0, .1);}
	.main-link h3 {float: left; width: 100%; padding: 14px; margin-bottom: 10px; background: #747474; text-align: center; color: #fff; font-size: 16px; font-weight: normal;}
	.main-link h3 i {padding-right: 10px;}
	.main-link p {float: left; width: 100%; padding: 12px 0; text-align: center;}
	.main-link p a {font-size: 16px; color: #fff;}
	.main-link p:last-child {background: none;}

	.main-event {float: left; width: 100%; margin-top: 3rem; position: relative;}
	.main-event h3 {text-align: center; color: #000; font-size: 20px;}
	.main-event ul {float: left; width: 100%; margin-top: 1rem;}
	.main-event ul li {float: left; background-color: #fff; padding: 4.4rem 5px 0 10px; width: 48%; margin: 0 1% 10px 1%; height: 5.5rem; box-shadow: 3px 3px 15px rgba(0, 0, 0, .1); border-radius: 10px; background-size: 100% 4.2rem; background-repeat: no-repeat;}
	.main-event ul li a {display: block; width: 100%; height: 100%; font-size: 14px; color: #000; overflow:hidden;white-space:nowrap;text-overflow:ellipsis; }
	.main-event .more-btn {position: absolute; bottom: -30px; right: 20px; border-bottom: 1px solid #000; }
	.main-event .more-btn a {color: #000; font-size: 16px;}

	.main-member {position: relative; float: left; width: 92%; margin: 3rem 4%; margin-bottom: 60px;}
	.main-member h3 {text-align: center; color: #000; font-size: 20px;}
	.main-member ul {float: left; width: 100%; margin-top: 40px;}
	.main-member ul li {position: relative; float: left; height: 9rem;}
	.main-member ul li img {width: 100%; height: 100%;}
	.main-member ul li a span.txt {display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .5); color: #fff; padding: 40% 30px 0 0; text-align: right; font-size: 16px;}
	.main-member ul li:hover a span.txt {display: block;}
	.main-member .main-member-btn {position: absolute; bottom: -30px; left: 0; width: 100%;}
	.main-member .main-member-btn .mm-pager {display: none;}
	.main-member .main-member-btn .mm-btn {position: absolute; bottom: 0;}
	.main-member .main-member-btn .mm-btn .line {display: inline-block; width: 30px; height: 2px; background: #000; margin: 0 15px 3px 15px;}
	.main-member .main-member-btn .mm-btn-prev {left: 0;}
	.main-member .main-member-btn .mm-btn-next {right: 0;}
	.main-member .main-member-btn .mm-btn a {font-size: 15px; color: #000;}









}