@media screen and (max-width:1024px) {

/* header */
#header{position: absolute;left: 0;top: 0;width: 100%;z-index: 2000;transition:.3s;}
#header .inner{display: flex;align-items: center;justify-content: space-between;height: 80px;width: 100%;}
#header h1 a{display: block;width: 200px;height: 20px;background: url(../images/main/main_logo02.png);background-size: cover;transition:.3s;}
#header .btn_box{display: flex;align-items: center;gap:20px;}
#header .all_btn{display: none; position: relative;width: 22px;height: 19px;}
#header .all_btn span{position: absolute; width: 100%;height: 2px;background: #fff;left: 0;transition: .3s;}
#header .all_btn span:nth-child(1){top: 0;}
#header .all_btn span:nth-child(2){top: 50%;transform: translate(-50% , -50%);left: 50%;}
#header .all_btn span:nth-child(3){bottom: 0;}
#header .all_btn.on span{background: #000;}
#header .all_btn.on span:nth-child(1){top: 50%;transform: translateY(-50%) rotate(45deg);}
#header .all_btn.on span:nth-child(2){opacity: 0;}
#header .all_btn.on span:nth-child(3){top: 50%;transform: translateY(-50%) rotate(-45deg);}
#header .navi_btn{display: block; position: relative;width: 22px;height: 19px;}
#header .navi_btn span{position: absolute; width: 100%;height: 2px;background: #fff;left: 0;transition: .3s;}
#header .navi_btn span:nth-child(1){top: 0;}
#header .navi_btn span:nth-child(2){top: 50%;transform: translate(-50% , -50%);left: 50%;}
#header .navi_btn span:nth-child(3){bottom: 0;}
#header .navi_btn.on span{background: #000;}
#header .navi_btn.on span:nth-child(1){top: 50%;transform: translateY(-50%) rotate(45deg);}
#header .navi_btn.on span:nth-child(2){opacity: 0;}
#header .navi_btn.on span:nth-child(3){top: 50%;transform: translateY(-50%) rotate(-45deg);}
#header .btn_box a{font-size: 15px;color: #fff;transition: .3s;font-weight: 500;}

#header.white{background: #fff;}
#header.white h1 a{background: url(../images/main/main_logo01.png);background-size: cover;}
#header.white .all_btn span{background: #000;}
#header.white .gnb > li > a{color: #000;}
#header.white .gnb > li.on > a{color: var(--ma_c01);}
#header.white .btn_box a{color: #000;}

#header.on{background: #fff;}
#header.on h1 a{background: url(../images/main/main_logo01.png);background-size: cover;}
#header.on .all_btn span{background: #000;}
#header.on .gnb > li > a{color: #000;}
#header.on .gnb > li.on > a{color: var(--ma_c01);}
#header.on .btn_box a{color: #000;}


/* gnb */
.menu_box{position: absolute;display: none; left: 0;width: 100%;top: 0;align-items: center;justify-content: center;}
.gnb{display: flex;}
.gnb > li > a{display: block;line-height: 100px;text-align: center;width: 190px;font-size: 17px;transition: .3s;font-weight: 700;color: #fff;}
.gnb > li .fade_box{display: none; position: absolute;width: 100%; left: 0;top: 100%;background: #fafafa;}
.gnb > li ul{display: flex;width: 100%;justify-content: center;gap:50px;}
.gnb > li ul li a{position: relative; display: block;line-height: 100px;color: #232323;font-weight: 600;}
.gnb > li ul li a:hover{color: var(--ma_c01);}
.gnb > li ul li a:after{content:'';position: absolute;right: -26px;top: 50%;transform: translateY(-50%);width: 1px;height: 16px;background: #232323;}
.gnb > li ul li:last-child a:after{display: none;}

/* all_menu */
#all_menu{display: none; position: absolute;left: 0;top: 100px;width: 100%;background: #fafafa;z-index: 2000;padding: 50px 0;}
#all_menu ul{display: flex;justify-content: center;}
#all_menu ul li{width: 190px;}
#all_menu ul li a{display: block;text-align: center;font-size: 17px;margin-bottom: 15px;transition: .2s;}
#all_menu ul li a:hover{color: var(--ma_c01);}
#all_menu ul li a:last-child{margin-bottom: 0;}


/* 네비게이션 */
#navigation{display: none; position: absolute;left: 0;top: 80px;z-index: 1000;width: 100%;height: calc(100vh - 80px);background: rgba(0,0,0,.5);}
#navigation .navi_box{position: absolute; width: 50%;right: 0;top: 0;background: #fff;height: 100%;}
#navigation .navi_box > ul > li > a{position: relative; display: block;line-height: 60px;padding: 0 20px;border-top: 1px solid #ddd;font-size: 16px;}
#navigation .navi_box > ul > li > a:after{content:'';position: absolute;transition: .3s; right: 20px;top: 50%;transform: translateY(-50%);width: 12px;height: 8px;background: url(../images/main/footer_ico01.png);}
#navigation .navi_box > ul > li.on > a:after{transform:  translateY(-50%) rotate(180deg);}
#navigation .navi_box > ul > li:last-child > a{border-bottom: 1px solid #ddd;}
#navigation .navi_box > ul > li ul{display: none; background: #f4f4f4;padding: 15px 20px;border-top: 2px solid var(--ma_c01);}
#navigation .navi_box > ul > li ul li a{display: block; line-height: 35px;font-size: 16px;}
#navigation .navi_box > ul > li ul li.on a{color: var(--ma_c01);font-weight: 600;}


/* visual_wrap */
#visual_wrap ul li{position: relative;}
#visual_wrap ul li .txt{position: absolute;left: 50%;top: 50%;transform: translate(-50% , -50%);color: #fff;}
#visual_wrap ul li .txt span{font-size: 20px;}
#visual_wrap ul li .txt strong{display: block;font-size: 60px;font-weight:800;margin: 20px 0 50px;}
#visual_wrap ul li .txt p{font-size: 25px;font-weight: 500;line-height: 40px;}


/* footer */
#footer{position: relative; padding: 60px 0 100px;background: #000;}
#footer .inner{display: flex;justify-content: center;color: #fff;width: 100%;flex-direction: column;align-items: center;gap:30px;}
#footer .left_box > a{display: block;margin: 0 auto 30px;}
#footer .left_box a img{display: block;margin: 0 auto;}
#footer .left_box address{font-style: normal;line-height: 30px;margin-bottom: 0px;font-size: 13px;text-align: center;}
#footer .left_box address span{display: inline-block; width: 1px;height: 10px;background: #fff;opacity: .5;margin: 0 10px;}
#footer .left_box p{position: absolute;text-align: center;width: 100%;left: 0;bottom: 50px;}
#footer .right_box .f_box{position: relative;}
#footer .right_box .f_box button{position: relative;display: flex;align-items: center;justify-content: space-between; width: 220px;height: 40px;border: 1px solid rgba(255,255,255,.4);padding: 0 15px;color: #fff;text-align: left;}
#footer .right_box .f_box button i{transition: .4s;}
#footer .right_box .f_box button.on i{transform: rotate(180deg);}
#footer .right_box .f_box ul{display: none; position: absolute;left: 0;top: auto; bottom: 100%;width: 100%;border: 1px solid rgba(255,255,255,.4);border-top: 0 solid #000;padding: 15px;}
#footer .right_box .f_box ul li:not(:last-child){margin-bottom: 10px;}
#footer .right_box .f_box ul li a{color: #fff;}
#footer .right_box .sns_box{display: flex;gap:10px;justify-content:center;margin-top: 10px;}
#footer .right_box .sns_box img{width: 30px;}


/* 퀵메뉴 */
#quick_menu{position: fixed;bottom: 20px;right: 20px;z-index: 3000;}
#quick_menu ul li{margin-bottom: 10px;}
#quick_menu ul li a{display: flex;flex-direction: column; width: 50px;height: 50px;border: 1px solid transparent; border-radius: 50%;background: var(--ma_c01);align-items: center;justify-content: center;color: #fff;font-size: 23px;box-shadow: 1px 1px 10px 0px rgba(0,0,0,.3);}
#quick_menu ul li:last-child a{background: #fff;font-size: 14px;color: #000;font-weight: 700;border: 1px solid #ddd;}
#quick_menu ul li:last-child a i{transform: rotate(180deg);font-size: 18px;}


/* -----------------------------------------sub -----------------------------------------------------*/
#header.sub_header{border-bottom: 1px solid rgba(255,255,255,.3);}
.sub_visual{position: relative; height: 500px;}
.sub_visual.sub01{background: url(../images/sub/sub_visual01.jpg);background-size: cover;}
.sub_visual .inner{position: absolute;display: flex; left: 0;top: 55%;transform: translateY(-50%);width: 100%;color: #fff;flex-direction: column;align-items: center;}
.sub_visual .inner span{font-size: 25px;}
.sub_visual .inner p{font-size: 55px;font-weight: 700;margin: 20px 0 50px;}
.sub_visual .inner ul{display: flex;align-items: center;gap:40px;}
.sub_visual .inner ul li{position: relative; font-size: 17px;}
.sub_visual .inner ul li:after{content:'';position: absolute;right: -23px;top: 50%;transform: translateY(-50%);width: 4px;height: 4px;border-radius: 50%;background: #fff;}
.sub_visual .inner ul li:last-child:after{display: none;}

/* sub공통 */
.sub_wrap{word-break: keep-all;}
.sub_wrap .sub_con{padding: 100px 0;}
.sub_wrap .flex_wrap .con{display: block;align-items: flex-start;margin-bottom: 100px;}
.sub_wrap .flex_wrap .con:last-child{margin-bottom: 0;}
.sub_wrap .flex_wrap .con .tit_box{width: 100%;margin-bottom: 30px;}
.sub_wrap .flex_wrap .con .tit_box h3{font-size: 45px;font-weight: 800;line-height: 60px;}
.sub_wrap .flex_wrap .con .tit_box h3 span{color: var(--ma_c01);}
.sub_wrap .flex_wrap .con .tit_box h3 br{display: none;}
.sub_wrap .flex_wrap .con .con_box{width: 100%;padding-top: 0px;}
.sub_wrap .flex_wrap .con .con_box .txt_box{margin-bottom: 65px;}
.sub_wrap .flex_wrap .con .con_box .txt_box .tit{font-size: 30px;font-weight: 800;line-height: 1.5;}
.sub_wrap .flex_wrap .con .con_box .txt_box .tit span{color: var(--ma_c01);}
.sub_wrap .flex_wrap .con .con_box .txt_box .tit + span{display: block; font-size: 17px;line-height: 30px;color: #333;margin-top: 20px;}
.sub_wrap .flex_wrap .con .con_box .txt_box .txt span{display: block; font-size: 17px;line-height: 30px;color: #333;margin-top: 20px;}


/* 일반 */
.sub_wrap .basic_wrap .tit_box{font-size: 30px;font-weight: 800;line-height: 1.5;}
.sub_wrap .basic_wrap .tit_box span{color: var(--ma_c01);}


.sub_wrap .con iframe{width: 100%;height: 450px;}

/* list_box */
.sub_wrap .list_box li{display: flex;align-items: center;gap:10px; width: 50%;padding: 20px;border-bottom: 1px dashed #ddd;border-right: 1px dashed #ddd;}
.sub_wrap .list_box li .list_img{width: 100px;height: 100px;}
.sub_wrap .list_box li .list_img img{width: 100%;height: 100%;object-fit: cover;}
.sub_wrap .list_box li .list_txt {width: calc(100% - 110px);}
.sub_wrap .list_box li .list_txt strong{font-size: 17px;}
.sub_wrap .list_box li .list_txt p{font-size: 14px;line-height: 1.6;margin-top: 5px;}


/* gallery_list */
.gallery_list{display: flex;gap:50px 20px;flex-wrap:wrap;}
.gallery_list li{width: calc((100% - 20px)/2);}
.gallery_list li a{display: block;}
.gallery_list li a .img_Wrap{position:relative; width:100%; padding-bottom:65.789%;overflow: hidden;margin-bottom: 20px;}
.gallery_list li a .img_Wrap img{position:absolute;transition: .4s; left:0; right:0;  top:0; bottom:0; margin:auto; width:100%; height:100%; max-width:100%; max-height:100%;object-fit:cover}
.gallery_list li a:hover .img_Wrap img{transform: scale(1.1);}
.gallery_list li a .txt_wrap strong{display: block; white-space: nowrap; overflow:hidden;text-overflow: ellipsis;margin-bottom: 10px;font-size: 20px;}
.gallery_list li a .txt_wrap span{font-size: 15px;font-weight: 500;color: #787878;}
.gallery_list li a .txt_wrap p{color: #4b4b4b;font-size: 17px;line-height: 20px;font-weight: 500;margin-bottom: 10px;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word;}


/* cate_box */
.cate_box{margin-bottom: 50px;}
.cate_box .pc_cate{display: flex;gap:10px;flex-wrap:wrap;justify-content: center;}
.cate_box .pc_cate li a{display: block;padding: 0 25px;line-height: 40px;border: 1px solid #ddd;font-weight: 600;font-size: 15px;border-radius: 40px;}
.cate_box .pc_cate li.on a{color: #fff;background: var(--ma_c01);border: 1px solid var(--ma_c01);}
.cate_box .tab_cate{display: none;}


/* sub0101 Who We Are*/
.sub0101_wrap .con01 .img_box .box01{display: flex;gap:10px;margin-bottom: 20px;}
.sub0101_wrap .con01 .img_box .box01 .b_img{width: calc(60% - 5px);}
.sub0101_wrap .con01 .img_box .box01 .b_img img{width: 100%;}
.sub0101_wrap .con01 .img_box .box01 .s_img{display: flex; width: calc(40% - 5px);gap:10px;flex-wrap:wrap;}
.sub0101_wrap .con01 .img_box .box01 .s_img li{width: calc((100% - 10px)/2);}
.sub0101_wrap .con01 .img_box .box01 .s_img li img{width: 100%;height: 100%;object-fit: cover;}
.sub0101_wrap .con01 .img_box .box02{display: flex;gap:10px;}
.sub0101_wrap .con01 .img_box .box02 li{display: flex; width: 160px;height: 60px;border-radius: 10px;gap:15px;align-items: center;padding-left: 20px;background: #f4f4f4;}
.sub0101_wrap .con01 .img_box .box02 li p{font-size: 22px;font-weight: 700;color: #333;}

.sub0101_wrap .con02 .con_box .txt_box:nth-child(2){margin-bottom: 40px;}
.sub0101_wrap .con02 .box02{display: flex;gap:10px;}
.sub0101_wrap .con02 .box02 li{ width: calc((100% - 30px)/4);border: 6px solid #f4f4f4;}
.sub0101_wrap .con02 .box02 li:after{width: calc(100% - 12px);border: 6px solid var(--ma_c01);}
.sub0101_wrap .con02 .box02 li strong{font-size: 22px;}
.sub0101_wrap .con02 .box02 li span{margin: 5px 0 7px;font-size: 13px;}
.sub0101_wrap .con02 .box02 li p{font-size: 14px;line-height: 18px;}


/* sub0104_wrap 오시는 길*/
.sub0104_wrap .map_box{margin: 40px 0 50px;}
.sub_wrap .sub0104_wrap .flex_wrap .con .con_box .txt_box .tit{font-size: 30px;}


/* sub0201_wrap HISTORY*/
.sub0201_wrap .tit_box{margin-bottom: 55px;text-align: center;}
.sub0201_wrap .box_wrap{display: flex;margin-bottom: 100px;justify-content: center;}
.sub0201_wrap .box_wrap:last-child{margin-bottom: 0;}
.sub0201_wrap .box_wrap .img_box img{width: 100%;}
.sub0201_wrap .box_wrap .txt_box{padding-top: 10px;}
.sub0201_wrap .box_wrap .txt_box > strong{display: block; font-size: 35px;margin-bottom: 20px;color: var(--ma_c01);font-weight: 800;}
.sub0201_wrap .box_wrap:last-child .txt_box > strong{color: #e61c0d;}
.sub0201_wrap .box_wrap .txt_box ul{padding-left: 30px;}
.sub0201_wrap .box_wrap .txt_box ul li{display: flex;margin-bottom: 15px;}
.sub0201_wrap .box_wrap .txt_box ul li:last-child{margin-bottom: 0;}
.sub0201_wrap .box_wrap .txt_box ul li span{display: block;width: 85px;font-size: 15px;font-weight: 700;}
.sub0201_wrap .box_wrap .txt_box ul li p{font-size: 15px;font-weight: 500;}


/* sub0301_wrap Rookies란?*/
.sub0301_wrap .img_box{display: flex;gap:30px;}
.sub0301_wrap .img_box .b_img{width: 50%;}
.sub0301_wrap .img_box .b_img img{width: 100%;}
.sub0301_wrap .img_box .s_img{display: flex; width: 50%;flex-wrap:wrap;gap:20px;}
.sub0301_wrap .img_box .s_img li{width: calc((100% - 20px)/2);}
.sub0301_wrap .img_box .s_img li img{width: 100%;height: 100%;object-fit: cover;}

}