@charset "utf-8";

@import url( "https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" );


/*font*/
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR&display=swap');






/* reset.css */
body{font-family: 'Noto Sans KR'; font-size: 14px; line-height: 1.6; color: #666; padding: 0; margin: 0; vertical-align: top; background-color: #f0eceb; -webkit-text-size-adjust:none; text-align: left;}

ul,ol,dl,li{margin: 0; padding: 0; list-style-type: none;}
dt,dd{margin: 0; padding: 0;}
img{border: 0; vertical-align: middle;}
a{text-decoration: none; color: #666;}
p{margin: 0; padding: 0; text-align: justify;}
h1,h2,h3,h4,h5{margin: 0; padding: 0; clear: both;}
table{border-collapse: collapse; border-spacing: 0;}
input{font-size: 13px; color: #898989;}
input[type=text],[type=file],[type=email],[type=password],[type=tel]{height: 30px; line-height: 30px; box-sizing: border-box; padding: 5px; border: 1px solid #ccc;}
input[type=file]{width: 100%;}
select{color: #898989; padding: 0; height: 30px; line-height: 30px;}
textarea{width: 100%; color: #898989; font-size: 13px; border: 1px solid #ccc; box-sizing: border-box; padding: 5px;}





@media screen and (min-width:0px) and (max-width:1024px) {
    
    
    /*-----header-----*/
    .headerWrap{text-align: center; background: #fff;}
    #header{width: 100%; height: 80px; display: block; transition: all 0.5s;}
    #header h1{height: 80px; line-height: 71px; display: block;}
    
    /*
    .btnLogin{position: absolute; top: 25px; right: 15px; font-size: 18px; color: #333;}
    .btnMy{position: absolute; top: 25px; right: 45px; font-size: 18px; color: #333;}
    */
    
    .btnCall{position: absolute; top: 25px; right: 15px;}
    .btnCall>.fa-bars{font-size: 24px; color: #333;}
    
    .gnbMo{position: fixed; top: 0; left: -250px; width: 250px; height: 100%; background: rgba(255,255,255,1); z-index: 999; transition: all 0.5s;}
    .gnbMo.on{left: 0;}
    
    #gnbMo{padding: 0;}
    #gnbMo>li{width: 100%; border-bottom: 1px solid #eee;}
    #gnbMo>li>a{width: 100%; background: rgba(0,0,0,0); line-height: 3; color: #333; font-weight: 600; text-align: left; text-indent: 20px; display: block;}
    #gnbMo>li>a>i{float: right; margin: 15px 15px 0 0;}
    
    #gnbMo>li>ul.depth2{width: 100%; background: rgba(0,0,0,0); padding-bottom: 10px; display: block;}
    #gnbMo>li>ul.depth2>li{width: 100%; text-align: left;}
    #gnbMo>li>ul.depth2>li>a{padding: 5px 0 5px 30px; box-sizing: border-box; display: block;}
    
    #gnbMo>li>ul>li>ul{margin-left: 40px; width: 220px; padding-bottom: 10px; display: block;}
    #gnbMo>li>ul>li>ul>li>a{color: #959498; display: block;}
    
    .user{width: 100%; border-bottom: 1px solid #ccc; padding: 20px 0; background: #333; text-align: center;}
    .user>span{font-weight: 600; color: #fff; padding-left: 20px; margin-bottom: 10px; text-align: center; display: block;}
    .user>a{display: inline-block;}
    .user>a.btnCall{width: 24px; height: 24px; line-height: 24px; font-size: 24px; color: #fff; background: none; margin-top: -5px; border: 0;}
    .user>a.btnLogin{height: 30px; line-height: 28px; font-size: 12px; color: #fff; border: 1px solid #fff; padding: 0 10px; box-sizing: border-box;}
    
    .gnbtn{position: absolute; bottom: 0; width: 100%; border-top: 1px solid #ccc;}
    .gnbtn>li{float: left; width: 50%; height: 35px; line-height: 35px;}
    .gnbtn>li+li{border-left: 1px solid #ccc; box-sizing: border-box;}
    .gnbtn>li>a{width: 100%; height: 100%; text-align: center; font-size: 12px;}
    
    .home{position: absolute; top: 25px; left: 20px;}
    .home>.fa-home{font-size: 24px; color: #aaa;}
    
    
    
    
    
    /*-----visual-----*/
    #visual{width: 100%; display: block;}
    #visual>img{width: 100%;}
    
    
    
    
    
    /*-----contents-----*/
    #contents{width: 100%; display: block;}
    
    #contents h2{font-size: 18px; color: #333; font-weight: 600; margin-bottom: 5px;}
    
    .quickBnr{width: 100%; margin-top: 5px; display: table;}
    .quickBnr>li{float: left; width: 50%; text-align: center;}
    .quickBnr>li:nth-child(1){background: #1068b3;}
    .quickBnr>li:nth-child(2){background: #782a90;}
    .quickBnr>li:nth-child(3){background: #f5821f;}
    .quickBnr>li:nth-child(4){background: #8dc63f;}
    .quickBnr>li:nth-child(5){background: #ffd700;}
	.quickBnr>li:nth-child(6){background: #111111;letter-spacing: -3.5px;}
    .quickBnr>li>a{line-height:30px; font-size: 18px; font-weight: 400; color: #fff; padding: 15px 5px; box-sizing: border-box; display: block;}
    .quickBnr>li>a>img{width: 20px; margin-right: 5px;}
    
    .phone{width: 100%; padding: 10px; box-sizing: border-box; background: #fff; margin-top: 5px; display: table;}
    .phone span{width: 60px; font-weight: 600; text-align: justify; color: #333; display: inline-block;}
    .phone li.notice{font-size: 12px; color: #aaa; margin-top: 5px;}
    
    
    
    /*tab*/
    .tab{width: 100%; display: table;}
    .tab>li{float: left;}
    .tab>li>a{width: 100%; height: 100%; text-align: center; color: #333; display: block;}
    .tab>li>a.on{font-weight: 600;}
    .tab2>li{width: 50%;}
    
    
    
    .mainTab{width: 100%; background: #fff; margin-top: 10px; display: table;}
    .mainTab>ul.tab>li>a{background: #f8f8f8; padding: 10px 0; color: #999; box-sizing: border-box;}
    .mainTab>ul.tab>li>a.on{background: #fff; color: #333;}
    .mainTab>div{width: 100%; padding: 10px; box-sizing: border-box; display: table;}
    .mainTab>div>ul{width: 100%; display: table;}
    .mainTab>div>ul>li>a{line-height: 2;}
    
    .photo>li{float: left; width: 50%;}
    .photo>li>a>img{width: 100%;}
    .photo>li:nth-child(1){padding-right: 10px; box-sizing: border-box;}
    .photo>li:nth-child(2){padding-left: 10px; box-sizing: border-box;}
    
    
    
    
    .calendar{width: 100%;  background: #fff; padding: 10px; box-sizing: border-box; margin-top: 10px; display: table;}
    .calendar>div{font-size: 18px; font-weight: 600; color: #333; text-align: center;}
    .calendar table{width: 100%;}
    .calendar th{text-align: center; width: 14.2857%; padding: 5px; box-sizing: border-box;}
    .calendar td>a{width: 100%; text-align: center; padding: 5px; box-sizing: border-box; display: block;}
    .dayoff{color: #c62127;}
    .dayoff>a{color: #c62127;}
    
    
    
    
    
    /*-----footer-----*/
    #footer{width: 100%; margin: 0 auto; padding: 10px 0; text-align: center; font-size: 12px; color: #aaa;}
    #footer>li{width: 100%; display: table;}
    #footer>li+li{margin-top: 5px;}
    #footer a{color: #aaa; padding: 0 10px; line-height: 1; display: inline-block;}
    #footer a+a{border-left: 1px solid #ccc;} 
    
    
    
    
    /*margin*/
    .mt5{margin-top: 5px;}
    .mt10{margin-top: 10px;}
    .mt20{margin-top: 20px;}
    .mt30{margin-top: 30px;}
    .mb10{margin-bottom: 10px;}
    
    
    
    /*align*/
    .alignC{text-align: center;}
    .alignR{text-align: right !important;}
    
    
	/* ----------------------- °¶·¯¸® ¸®½ºÆ® ----------------------- */
	.subConts .colGallList{border-top:2px solid #898989;}
	.subConts .colGallList ul{width:100%; height:112px; border-bottom:1px solid #dcdcdc; padding:15px 0; display:block;}
	.subConts .colGallList li{float:left;}
	.subConts .colGallList li.photo{width:160px; text-align:center;}
	.subConts .colGallList li.txt{calc(100% - 160px); line-height:30px; color:#898989;}
	.subConts .colGallList li.txt a{font-size:18px; font-weight:600; color:#333;}	

	.subConts .rowGallList{border-top:2px solid #898989;}
	.subConts .rowGallList table{width:100%;}
	.subConts .rowGallList td{width:33.3%; padding:20px 0; border-bottom:1px solid #dcdcdc;}
	.subConts .rowGallList td ul{margin:0 auto; width:150px; color:#898989; line-height:24px;}
	.subConts .rowGallList td ul li.title{width:150px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; padding-top:5px;}
	.subConts .rowGallList td ul li.title a{font-weight:600; font-size:13px;}
	
	.rowTable{width:100%; font-size:11px; table-layout:fixed; border-top:2px solid #898989;}
	.rowTable th{padding:10px 0; background-color:#f5f5f5; color:#333; border-bottom:1px solid #dcdcdc; vertical-align:middle; text-align: center;}
	.rowTable td{border-bottom:1px solid #dcdcdc; padding:6px 0 6px 0; font-size:11px; vertical-align:middle; text-align:center;}    
}