@charset "utf-8";

/* Landscape tablet to portrait tablet */
@media (max-width: 1200px) {
	/* 공통 */
	.only-desktop {display:none;}
	.only-tablet {display:block;}
	.only-mobile {display:none;}
	.desktop-tablet {display:block;}


	/* header */
	#header .sitelogo {top:20px;}
	#header .sitelogo img {height:55px;}
	#header {padding:0 15px;}
	#gnb ul li {padding:0 30px;}
	
	/* main */
	

	/* sub page */
	.sub-visual {padding-bottom:18%;}

	.sub-title {margin:30px auto 30px; padding-bottom:20px;}
	.sub-title h2 {font-size:22px;}

	.real-cont {padding:0 15px 60px;}
	
	
	/* footer */
	#footer {padding:25px 15px;}
	
	
	/* doc */
	.greeting-top {font-size:30px; padding-bottom:25px; margin-bottom:25px;}
	.greeting-top:after {width:60px; height:4px; margin-left:-30px;}

	.greeting .photo .box {padding:20px;}
	.greeting .info {margin-left:280px; padding-top:0;}

	.sub-img {margin-bottom:50px;}

	.doc-title {font-size:20px; padding-left:20px; margin-bottom:20px;}
	.doc-title:after {width:16px; height:16px; border-width:4px;}

	/* menu */
	.menu-member ul li {font-size:17px;}

	.menu-member2 ul {margin:-31px auto 30px;}
	.menu-member2 ul li {font-size:17px;}
	

	/* board */
	.mailform table {font-size:14px;}
	.mailform table thead th {padding:7px 5px; height:30px;}
	.mailform table tbody th {padding:7px 5px;}
	.mailform table tbody td {padding:7px 10px;}


	/* 로그인 */
	.login-box {margin:60px auto 0; padding:60px 0 80px;}



}

@media (max-width: 1024px) {
	
	#header {height:80px;}
	#header .sitelogo {top:18px;}
	#header .sitelogo img {height:45px;}
	#header {padding:0 15px;}
	#gnb {padding-top:20px;}
	#gnb ul li {padding:0 25px; font-size:16px; line-height:60px;}


	.main-comm {margin:0 auto 35px;}
	.main-comm .col {padding:0 10px;}
	
	.foot-menu {left:150px;}
	.foot-info {padding:25px 0 0 150px;}


	.sub-visual {padding-bottom:22%;}
	.sub-visual .text h2 {font-size:22px;}

	.sub-title {margin:25px auto 25px; padding-bottom:15px;}
	.sub-title h2 {font-size:20px;}

	.real-cont {min-height:350px; _height:350px; padding:0 15px 40px;}


	/* doc */
	.greeting-top {font-size:25px; padding-bottom:20px; margin-bottom:20px;}
	.greeting-top:after {width:50px; margin-left:-25px;}

	.sub-img {margin-bottom:40px;}

	/* menu */
	.menu-member ul li {font-size:15px; line-height:45px;}

	.menu-member2 ul {margin:-26px auto 25px;}
	.menu-member2 ul li {font-size:15px;}

	/* 로그인 */
	.login-box {margin:40px auto 0; padding:40px 0 40px;}
	.login-box .wrap {max-width:800px; margin:0 auto; position:relative; z-index:10}
	.login-box p {font-size:15px; margin-bottom:30px;}
	.login-box .info {margin-left:140px; height:auto; }



	
}


/* Landscape phone */
@media (max-width: 767px) {

	/* 공통 */
	.only-desktop {display:none;}
	.only-tablet {display:none;}
	.only-mobile {display:block;}
	.desktop-tablet {display:none;}

	/* header */
	#wrapper {padding-top:85px;}
	#header {position:fixed; top:0; left:0; width:100%; height:85px; background:#fff; border-bottom:1px solid #ddd; z-index:100}
	#header .sitelogo {position:relative; top:7px;}
	#header .sitelogo img {height:35px;}
	#header .util {top:5px; right:0;text-align:right; max-width:170px;}
	#header .util ul {margin:0 -5px;}
	#header .util ul li {float:right; padding:0 5px;}
	#header .util ul li:last-child {width:100%;}
	#gnb {display:none;}
	#m-gnb {display:block; margin:15px -15px 0; border-top:1px solid #ddd;}
	#m-gnb .swiper-wrapper > div:first-child:after {display:none;}
	#m-gnb .swiper-wrapper .swiper-slide {position:relative; float:left; width:auto; padding:0 20px;}
	#m-gnb .swiper-wrapper .swiper-slide:after {content:"";position:absolute; top:50%; margin-top:-7px; left:0; width:1px; height:14px; background:#ddd;}
	#m-gnb .swiper-wrapper .swiper-slide a {display:block; text-align:center; color:#454545; font-size:15px; font-weight:500; line-height:35px;}
	#m-gnb .swiper-wrapper .swiper-slide.active a {color:#004f9f;}
	#m-gnb .swiper-button-prev {top:0; left:0; margin:0; width:18px; height:36px; background:url('../images/common/slide_prev.png') 50% 50% no-repeat; background-size:9px 19px;}
	#m-gnb .swiper-button-next {top:0; right:0; margin:0; width:18px; height:36px; background:url('../images/common/slide_next.png') 50% 50% no-repeat; background-size:9px 19px;}
	#m-gnb .swiper-button-disabled {display:none;}
	
	

	/* main */
	.main-visual {margin:0 auto 20px;}
	.main-visual .img {padding-bottom:83.8%;}

	.main-comm {margin:0 auto 20px;}
	.main-comm .col {float:none; width:100%; margin-bottom:10px;}
	.main-comm .col:last-child {margin-bottom:0;}
	.main-comm .col .box {height:auto; padding:15px;}
	.main-comm .col .box .title {margin-bottom:10px;}
	.main-comm .col .box .title h2 {font-size:18px;}
	.main-comm .col .box .title h2:after {bottom:-8px; height:2px}
	.main-comm .col .box ul li a {width:100%; padding-right:80px;}
	.main-comm .col .box .more {top:15px; right:15px;}
	
	/* sub page */
	.sub-visual {padding-bottom:35%;}
	.sub-visual .text h2 {font-size:20px;}

	.sub-title {margin:20px auto 20px; padding-bottom:10px;}
	.sub-title h2 {font-size:18px;}
	.sub-title p {font-size:14px;line-height:1.4em; padding:0 20px;}

	.real-cont {min-height:250px; _height:250px; padding:0 15px 30px;}
	
	
	/* menu */
	.menu-member {display:none;}
	.m-lnb-menu {display:block;position:relative; background:#004f9f;text-align:center; z-index:500}
	.m-lnb-menu .submenu {position:relative; }
	.m-lnb-menu .submenu:after {content:"";position:absolute; top:13px; right:20px; transform:rotate(45deg); border:solid #fff;border-width:0 2px 2px 0; padding:5px;}
	.m-lnb-menu .submenu > a {display:block; padding:12px 25px 12px 25px; color:#fff; font-size:1.1em; line-height:20px; transition:none;}
	.m-lnb-menu .submenu.active:after {top:20px; transform:rotate(-135deg);}
	.m-lnb-menu .submenu ul {display:none; position:absolute; top:44px; left:0; width:100%; background:#f3f4f5; z-index:210;}
	.m-lnb-menu .submenu ul li a {display:block; padding:7px 0; color:#5d5d5d; font-size:15px; line-height:20px; text-decoration:none; border-bottom:1px solid #e0e0e0;}
	.m-lnb-menu .submenu ul li a:hover {color:#fff; background:#004f9f; border-bottom:1px solid #004f9f;}

	.menu-member2 ul {margin:-21px auto 20px;}
	.menu-member2 ul li {font-size:12px; line-height:35px;}
	.menu-member2 ul li a {border-bottom-width:1px}
	.menu-member2 ul li.active a {border-width:1px; border-bottom-width:1px;}
	

	/* footer */
	#footer {padding:20px 15px; font-size:13px; text-align:center;}
	#footer .bar {padding:0 5px;}
	#footer .br {display:block;}
	#footer .br .bar {display:none;padding:0;}
	#footer address {font-style:normal;}
	.foot-logo {position:relative; top:0; left:0; margin-bottom:10px;}
	.foot-logo img {height:35px;}
	.foot-menu {position:relative; top:0; left:0; margin-bottom:10px;}
	.foot-menu ul li {float:none; display:inline-block;vertical-align:top; padding:0 5px;}
	.foot-info {padding:0;}
	

	/* doc */
	.greeting-top {font-size:20px; padding-bottom:15px; margin-bottom:15px;}
	.greeting-top:after {width:40px; height:3px; margin-left:-20px;}

	.greeting .photo {float:none; width:180px; margin:0 auto; font-size:16px;}
	.greeting .photo .box {padding:10px; margin-bottom:10px;}
	.greeting .info {margin-left:0; padding-top:20px; font-size:15px}

	.sub-img {margin-bottom:30px;}

	.doc-title {font-size:18px; padding-left:18px; margin-bottom:15px;}
	.doc-title:after {width:14px; height:14px; border-width:3px;}
	


	/* board */

	/* 리스트 */
	.board-list {display:none;}
	.m_br { display:inline; }
	.m-board-list {display:block !important; border-top:1px solid #7d7d7d; border-bottom:1px solid #7d7d7d; margin-bottom:10px;}
	.m-board-list li {border-top:1px solid #7d7d7d; font-size:.9em; letter-spacing:-.25px; padding:10px 10px}
	.m-board-list li:first-child {border-top:0;}
	.m-board-list li a {display:block;}
	.m-board-list li a.btn-pack {display:inline-block;}
	.m-board-list li strong {font-size:1em; font-weight:normal; line-height:1.4em; color:#333; word-wrap:break-word; word-break:break-all; vertical-align:top;}
	.m-board-list li img {vertical-align:middle;}
	.m-board-list li .info {display:inline-block; position:relative; padding:4px 0 0 0; font-size:1em; line-height:1.4em; color:#888;}
	.m-board-list li .bar {color:#ccc; margin:0 6px;}
	.m-board-list .answer {border-top:1px solid #999; background:#f4f4f4; padding:10px; font-size:12px;}
	.m-board-list .answer .q {color:#666; padding:0 0 8px 18px; text-indent:-18px;}
	.m-board-list .answer .q span {font-weight:bold; font-size:1em; margin-right:6px;}
	.m-board-list .answer .a {color:#d15a13; padding:0 0 0 18px; text-indent:-18px;}
	.m-board-list .answer .a span {font-weight:bold; font-size:1em; margin-right:6px;}
	.m-board-list .none {padding:50px; text-align:center;}
	.m-board-list .end {color:#0072bb}
	.m-board-list .ing {display:inline-block;width:80px; height:25px; text-align:center; color:#fff; font-size:13px; line-height:25px;background:#afafaf; border-radius:20px;}
	.m-board-list .ok {display:inline-block; width:80px; height:25px; text-align:center; color:#fff; font-size:13px; line-height:25px;background:#243e91; border-radius:20px;}
	.m-board-list .btn-map {display:inline-block; width:80px; background:#b48831; color:#fff; border:0; font-size:.9em; line-height:25px;}
	.m-board-list .label {display:inline-block; vertical-align:top;color:#ff6000; padding-right:5px; font-size:1em; line-height:1.4em;}
	
	.m-board-list .head .tit {color:#333; font-size:14px; font-weight:400; line-height:1.3em; padding:13px 15px; background:#f7f7f7; border-bottom:1px solid #ddd;}
	.m-board-list table {width:100%; min-width:400px; border-collapse:collapse; border-spacing:0px; border-top:2px solid #898989;}
	.m-board-list table thead th {height:45px; border-bottom:1px solid #ddd; color:#454545; font-size:13px; font-weight:500; }
	.m-board-list table tbody td {padding:10px 0; border-bottom:1px solid #ddd; text-align:center; font-size:12px; font-weight:300; line-height:22px; color:#747474;}
	.m-board-list table tbody td.subject {text-align:left; padding-left:10px;}
	.m-board-list table tbody td img {vertical-align:middle;}
	.m-board-list table tbody td a {text-decoration:none; color:inherit;}
	.m-board-list table tbody tr:hover td {background-color:#fafafa;}
	.m-board-list table td.dashed_bt_line { border-bottom-style: dashed; }

	/* 검색 */
	.board-search .total-page {display:none;}
	.board-search .search {float:none; text-align:center;}
	.board-search .search .btn {padding:0 10px; height: 28px; line-height:28px; margin:2px 2px 0px; }
	
	.board-search .search .select { height: 28px; line-height:28px; font-size: 13px; }
	.board-search .search .input  { height: 28px; line-height:28px; font-size: 13px; }
	.board-search .search label  { font-size: 13px; line-height:28px; }
	.board-search .search .input.w10  , .input.w10  { width: 90px;  }
	.input.w10.time  { width: 40px;  }
	.board-search .search .input.w20 , .input.w20  { width: 180px; }
	.search.txtalgn { text-align:left; }


	.board-write .files_table input[type=file]{margin-right:10px; width:100% !important; margin-bottom:5px;}
	.board-write .btn-pack.medium {height:25px; line-height:23px;}

	.buttons {margin:20px auto;}

	/* 로그인 */
	.login-box {margin:20px auto 0; padding:30px 20px 30px;}
	.login-box:after {content:"";position:absolute; top:0; left:0; width:100%; height:100%; background:url('../images/sub/login_bg1.gif') 0 100% no-repeat; z-index:0}
	.login-box:before {content:"";position:absolute; top:0; right:0; width:100%; height:100%; background:url('../images/sub/login_bg2.gif') 100% 0 no-repeat; z-index:0}
	.login-box p {margin-bottom:15px;}
	.login-box .title {float:none; width:100%; margin:0 auto; padding-top:70px; font-size:15px; background-size:60px; background-position:50% 0}
	.login-box .info {margin-left:0; border-left:0; padding:10px 0 0 10px;}
	.login-box .group {padding:3px 0 3px 70px;}
	.login-box .group label {font-size:15px; line-height:35px;} 
	.login-box .group .input {width:100%; height:35px;}
	.login-box .bt-login {position:relative; top:5px; right:0; border:0; width:100%; height:40px; font-size:15px;}
	
	.join-area .form table tr {display:block;}
	.join-area .form table th {display:block; padding:5px 10px; height:auto; color:#333; font-size:14px; font-weight:500; text-align:left; background:#f9f9f9; border-bottom:1px solid #d8d8d8;}
	.join-area .form table td {display:block; padding:9px 10px; font-size:14px; border-bottom:1px solid #d8d8d8;}
	.join-area .form table td  .txt {display:block; padding-left:0;}
	.join-area .form table td .input {width:100% !important;}

	

}	

/* Landscape phones and down */
@media (max-width: 480px) {

	
}