





@media screen and (min-width:1201px) {
/*header*/

#header{position: fixed; left: 0; top: 0; width: 100%; height: 90px; background-color: #fff;  overflow: hidden; border-bottom: 1px solid #ff6600;  z-index: 999;}
#header h1{position: absolute; height: 80px; left: 20px; top: 50%; transform: translateY(-50%); width: ;}
#header h1 img{width: 100%;}
#header .gnb{position: absolute; left: 50%; top: 50%; transform: translate(-40%,-50%);}
#header .gnb>ul{display: flex;}
#header .gnb>ul>li>a:hover{color: #ff6600;}
#header .gnb>ul>li{width: 150px;}
#header .gnb>ul>li>a{display: block; line-height: 90px; text-align: center; font-size: 20px; font-weight: 700; color: #111111;}
.gnb_sub_wrap{position: fixed; left: 0; top: 90px; width: 100%; height: 350px; background-color: #fff; bottom: 1px solid #F9F9F9; display: none; z-index: 998;}
.gnb_sub{position: absolute; left: 50%; top: 50%; transform: translate(-40%,-50%); display: flex;}
.gnb_sub ul{width: 150px;}
.gnb_sub ul a{display: block; text-align: center; line-height: 50px; color: #111111; font-size: 15px;}
.gnb_sub_wrap .gnb_sub .sub_menu a:hover{color: #ff6600;}
.m_gnb{display: none;}
.gnb_sub ul .point a{color: #ff6600;}
/*footer*/

#footer{position: relative; }
#footer .footer_top{height: 80px; border-top: 1px solid #ff6600; border-bottom: 1px solid #ff6600; position: relative; }
#footer .footer_top .footer_top_inner{display: flex; justify-content: space-between; width: 92%; max-width: 1440px;  margin: 0 auto;}
#footer .footer_top .footer_top_inner img{width: 100%;}
#footer .footer_top .footer_top_inner .footer_link{display: flex; text-align: center; align-items: center;}
#footer .footer_top .footer_top_inner .footer_link li a{color: #111111; font-size: 15px; font-weight: 700; padding: 0 10px;}
#footer .footer_bottom{position: relative;display: flex; flex-direction: column;width: 92%; max-width: 1440px;  margin: 0 auto; padding: 50px 0;}
#footer .footer_top .footer_top_inner .footer_link li a:hover{color: #ff6600;}
#footer .footer_bottom .footer_text{line-height:2; color: #111111;  font-size: 15px; font-weight: 700;}
#footer .footer_bottom .copy{ color: #333;  font-size: 15px; font-weight: 700;}
}



















@media screen and (min-width:801px) and (max-width:1200px){
#header{position: fixed; left: 0; top: 0; width: 100%; height: 90px; background-color: #fff;  overflow: hidden; border-bottom: 1px solid #ff6600;  z-index: 999;}
#header h1{position: absolute; height: 80px; left: 20px; top: 50%; transform: translateY(-50%);}
#header h1 img{width: 100%;}
#header .gnb{display: none;}
.gnb_sub_wrap{display: none;}
.gnb_sub ul .point a{color: #ff6600;}
.m_gnb{display: block; position: fixed; right: -100%; top: 90px; width: 100%; background-color: #FFF; border-left: 1px solid #EEE; height: 100%; z-index: 998;}

.m_gnb>ul>li>a{display: block;  text-align: center; font-size: 40px; font-family: "HanwhaB"; font-weight: bold;  padding: 20px; color: #ff6600;transition: transform ease .7s;}
.m_gnb>ul>li>a:hover{text-shadow: -1px -1px 0 #ff6600, 1px -1px 0 #ff6600, -1px 1px 0 #ff6600, 1px 1px 0 #ff6600; color: #FFF;}
.m_gnb>ul>li>ul{display: none;}
.m_gnb>ul>li>ul>li>a{display: block; color: #111;text-align: center;font-family: 'Noto Sans KR', sans-serif; font-weight: 400 ; font-size: 22px; line-height: 2;}
.m_gnb>ul>li>ul>li>a:hover{color: #ff6600;}
#header .menu_btn {position: absolute; right: 30px; top: 25px; width: 40px; height: 40px; background: none; border: none; cursor: pointer;}
#header .menu_btn span{position: absolute; display: block; width: 37px; height: 1px; background-color: #876749; transition-duration: 0.5s; top: 50%;}
#header .menu_btn span:first-child{margin-top: -10px;}
#header .menu_btn span:last-child{margin-top: 9px;}

#header .active_btn span:nth-child(2){opacity: 0;}
#header .active_btn span:first-child{transform: rotate(45deg); margin-top: 0;}
#header .active_btn span:last-child{transform: rotate(135deg); margin-top: 0;}






/*footer 테블릿 가로*/ 

#footer{position: relative; }
#footer .footer_top{height: 80px; border-top: 1px solid #ff6600; border-bottom: 1px solid #ff6600; position: relative; }
#footer .footer_top .footer_top_inner{display: flex; justify-content: space-between; width: 92%; max-width: 1440px;  margin: 0 auto;}
#footer .footer_top .footer_top_inner img{width: 100%;}
#footer .footer_top .footer_top_inner .footer_link{display: flex; text-align: center; align-items: center;}
#footer .footer_top .footer_top_inner .footer_link li a{color: #111111; font-size: 13px; font-weight: 700; padding: 0 10px;}
#footer .footer_bottom{position: relative;display: flex; flex-direction: column;width: 92%; max-width: 1440px;  margin: 0 auto; padding: 50px 0;}
#footer .footer_top .footer_top_inner .footer_link li a:hover{color: #ff6600;}
#footer .footer_bottom .footer_text{line-height:2; color: #111111;  font-size: 15px; font-weight: 700;}
#footer .footer_bottom .copy{ color: #333;  font-size: 15px; font-weight: 700;}
}



























@media screen and (min-width:601px) and (max-width:800px) {

#header{position: fixed; left: 0; top: 0; width: 100%; height: 90px; background-color: #fff;  overflow: hidden; border-bottom: 1px solid #ff6600;  z-index: 999;}
#header h1{position: absolute; height: 80px; left: 20px; top: 50%; transform: translateY(-50%);}
#header h1 img{width: 100%;}
#header .gnb{display: none;}
.gnb_sub_wrap{display: none;}
.gnb_sub ul .point a{color: #ff6600;}
.m_gnb{display: block; position: fixed; right: -100%; top: 90px; width: 100%; background-color: #FFF; border-left: 1px solid #EEE; height: 100%; z-index: 998;}

.m_gnb>ul>li>a{display: block; color: #ff6600; text-align: center; font-size: 30px; font-family: "HanwhaB"; font-weight: bold;  padding: 20px; color: #ff6600;transition: transform ease .7s;}
.m_gnb>ul>li>ul{display: none;}
.m_gnb>ul>li>ul>li>a{display: block; color: #111;text-align: center;font-family: 'Noto Sans KR', sans-serif; font-weight: 400 ; font-size: 18px; line-height: 2;}
.m_gnb>ul>li>ul>li>a:hover{color: #ff6600;}
#header .menu_btn {position: absolute; right: 30px; top: 25px; width: 40px; height: 40px; background: none; border: none; cursor: pointer;}
#header .menu_btn span{position: absolute; display: block; width: 37px; height: 1px; background-color: #876749; transition-duration: 0.5s; top: 50%;}
#header .menu_btn span:first-child{margin-top: -10px;}
#header .menu_btn span:last-child{margin-top: 9px;}

#header .active_btn span:nth-child(2){opacity: 0;}
#header .active_btn span:first-child{transform: rotate(45deg); margin-top: 0;}
#header .active_btn span:last-child{transform: rotate(135deg); margin-top: 0;}
/*footer 테블릿 세로*/ 
#footer{position: relative; }
#footer .footer_top{ border-top: 1px solid #ff6600; border-bottom: 1px solid #ff6600; position: relative;  padding: 20px 0;}
#footer .footer_top .footer_top_inner{display: flex; flex-direction: column; align-items: center; width: 92%; max-width: 1440px;  margin: 0 auto;}
#footer .footer_top .footer_top_inner img{width: 100%;}
#footer .footer_top .footer_top_inner .footer_link{display: flex; text-align: center; align-items: center;}
#footer .footer_top .footer_top_inner .footer_link li a{color: #111111; font-size: 13px; font-weight: 700; padding: 0 10px;}
#footer .footer_bottom{position: relative;display: flex; flex-direction: column;width: 92%; max-width: 1440px;  margin: 0 auto; padding: 50px 0;}
#footer .footer_top .footer_top_inner .footer_link li a:hover{color: #ff6600;}
#footer .footer_bottom .footer_text{line-height:2; color: #111111;  font-size: 15px; font-weight: 700;}
#footer .footer_bottom .copy{ color: #333;  font-size: 15px; font-weight: 700;}
}















@media screen and (max-width:600px) { 
#header{position: fixed; left: 0; top: 0; width: 100%; height: 90px; background-color: #fff;  overflow: hidden; border-bottom: 1px solid #ff6600;  z-index: 999;}
#header h1{position: absolute; height: 80px; left: 20px; top: 50%; transform: translateY(-50%);}
#header h1 img{width: 100%;}
#header .gnb{display: none;}
.gnb_sub_wrap{display: none;}
.gnb_sub ul .point a{color: #ff6600;}
.m_gnb{display: block; position: fixed; right: -100%; top: 90px; width: 100%; background-color: #FFF; border-left: 1px solid #EEE; height: 100%; z-index: 998;}

.m_gnb>ul>li>a{display: block; color: #ff6600; text-align: center; font-size: 25px; font-family: "HanwhaB"; font-weight: bold;  padding: 20px; color: #ff6600;transition: transform ease .7s;}
.m_gnb>ul>li>ul{display: none;}
.m_gnb>ul>li>ul>li>a{display: block; color: #111;text-align: center;font-family: 'Noto Sans KR', sans-serif; font-weight: 400 ; font-size: 15px; line-height: 2;}
.m_gnb>ul>li>ul>li>a:hover{color: #ff6600;}
#header .menu_btn {position: absolute; right: 30px; top: 25px; width: 40px; height: 40px; background: none; border: none; cursor: pointer;}
#header .menu_btn span{position: absolute; display: block; width: 37px; height: 1px; background-color: #876749; transition-duration: 0.5s; top: 50%;}
#header .menu_btn span:first-child{margin-top: -10px;}
#header .menu_btn span:last-child{margin-top: 9px;}

#header .active_btn span:nth-child(2){opacity: 0;}
#header .active_btn span:first-child{transform: rotate(45deg); margin-top: 0;}
#header .active_btn span:last-child{transform: rotate(135deg); margin-top: 0;}



/*footer 모바일*/ 
#footer{position: relative; }
#footer .footer_top{ border-top: 1px solid #ff6600; border-bottom: 1px solid #ff6600; position: relative;  padding: 20px 0;}
#footer .footer_top .footer_top_inner{display: flex; flex-direction: column; align-items: center; width: 92%; max-width: 1440px;  margin: 0 auto;}
#footer .footer_top .footer_top_inner img{width: 100%;}
#footer .footer_top .footer_top_inner .footer_link{display: flex; text-align: center; align-items: center;}
#footer .footer_top .footer_top_inner .footer_link li a{color: #111111; font-size: 12px; font-weight: 700; padding: 0 5px;}
#footer .footer_bottom{position: relative;display: flex; flex-direction: column;width: 92%; max-width: 1440px;  margin: 0 auto; padding: 50px 0;}
#footer .footer_top .footer_top_inner .footer_link li a:hover{color: #ff6600;}
#footer .footer_bottom .footer_text{line-height:2; color: #111111;  font-size: 12px; font-weight: 700;}
#footer .footer_bottom .copy{ color: #333;  font-size: 12px; font-weight: 700;}
}