@charset "utf-8";

:root {--navy:#171C61; --red:#D35D5D; --blue:#003EA1; --yellow:#EDAE55; --green:#00A13E;}
body.m-menu-active {overflow:hidden;}

/* 공통 */
#wrap {position:relative;width:100%;}
#wrap.sub-page {padding:100px 0 0;}

/* main */
#header {position:absolute;left:0;top:0;z-index:99;width:100%;height:90px;border-bottom:1px solid #000;}
#header.fixed {position:fixed !important;background:#FFF;box-shadow:2px 2px 15px 0 rgba(0,0,0,0.13);}
#header .header-inner {display:flex;width:1600px;height:100%;margin:0 auto;}
#header .logo {width:96px;margin:auto 0;}
#header .logo a {display:block;}

#header .menu-area {margin-left:auto;width:calc(100% - 196px);}
#gnb ul {display:flex;gap:60px;}
#gnb ul li a {position:relative;display:flex;height:89px;align-items:center;font-weight:500;font-size:20px;line-height:1.4;}
#gnb ul li.on a {font-weight:600;}
#gnb ul li a::after {content:"";position:absolute;left:50%;bottom:-1px;display:block;width:0;border-bottom:3px solid #000;transition:all 0.25s ease-out;}
#gnb ul li a:hover::after,
#gnb ul li.on a::after {left:0;width:100%;}

#header .m-menu-btn {display:none;right:-30px;position:relative;width:70px;height:70px;font-size:1px;color:transparent;background:none;border:0;overflow:hidden;}
#header .m-menu-btn.active {right:-15px;}
#header .m-menu-btn .icon {position:absolute;left:25px;top:50%;margin-top:-1px;width:30px;height:2px;background:#1C1C1C;border-radius:2px;}
#header .m-menu-btn .icon::before {content:"";position:absolute;left:0;top:-7px;width:100%;height:2px;background:#1C1C1C;border-radius:2px;}
#header .m-menu-btn .icon::after {content:"";position:absolute;left:0;bottom:-8px;width:100%;height:2px;background:#1C1C1C;border-radius:2px;}
#header .m-header .m-menu-btn .icon {background:none !important;}
#header .m-header .m-menu-btn .icon::before {top:0;transform:rotate(-45deg);}
#header .m-header .m-menu-btn .icon::after {bottom:-1px;transform:rotate(45deg);}

.menu-wrap .menu-inner {display:flex;width:100%;justify-content:space-between;}
.menu-wrap .m-header {width:100%;height:70px;padding:0 15px;justify-content:space-between;align-items:center;border-bottom:1px solid #ddd;display:none;}
#header .m-header .logo {width:78px;}
#header .m-header .m-menu-btn {margin:0;}

.sns-menu {margin-left:auto;display:flex;align-items:center;gap:4px;}
.sns-menu a {position:relative;display:inline-flex;width:40px;height:40px;font-size:1px;color:transparent;}
.sns-menu .insta {background:url('../img//icon_insta.svg') no-repeat center;}
.sns-menu .blog {background:url('../img//icon_blog.svg') no-repeat center;}

#container {padding:90px 0 0;}
.main-visual {height:890px;color:transparent;background:url('../img//main_visual.png') no-repeat center, linear-gradient(#fdf0ce, #fdf0ce) no-repeat 0 100%/100% calc(100% - 230px);}
.main-visual .sec-inner {padding:90px 0 0;display:flex;flex-direction:column;justify-content:center;width:1600px;height:100%;margin:0 auto;}
.main-visual .fair-title {margin:0 0 42px;}
.main-visual .fair-eng {margin:0 0 75px;}
.main-visual .fair-date {margin:0 0 80px;}
.main-visual img {vertical-align:top;}

.schedule-sec {background:#fff url('../img//bg_about.png') no-repeat 100% 0;border-top:1px solid #111;overflow:hidden;}
.schedule-sec .sec-inner {display:flex;width:1600px;margin:0 auto;}
.schedule-sec .left-wrap {padding:168px 0 152px;width:23%;}
.schedule-sec .right-wrap {position:relative;padding:168px 0 152px;width:72%;margin-left:auto;}
.schedule-sec .right-wrap .sec-tit {position:absolute;right:-110px;top:-50px;font-weight:900;font-size:150px;color:#f7f7f7;}
.schedule-sec .title {padding:20px 0 35px;font-family:'Pretendard', sans-serif;font-weight:700;font-size:50px;}
.schedule-sec .title span {font-family:'Montserrat', sans-serif;font-weight:100;margin-left:10px;}

.com-table {border-top:3px solid #000;}
.com-table th {padding:25px 20px;text-align:left;vertical-align:top;font-weight:700;font-size:25px;line-height:38px;background:#fff;border-bottom:1px solid #111;}
.com-table td {padding:25px 20px;text-align:left;font-weight:300;font-size:22px;line-height:38px;background:#fff;border-bottom:1px solid #111;}
.com-table .num {padding-left:30px;line-height:29px;}
.com-table .tit {padding:0;line-height:29px;}
.com-table .tit a {padding:25px 20px;display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.com-table .tit a:hover {text-decoration:underline;}
.com-table .date {text-align:center;line-height:29px;}
.com-table .flex-box {display:flex;}
.com-table .flex-box .part {padding:0 0 12px;width:400px;}
.com-table .flex-box .part + .part {margin-left:auto;}
.com-table .flex-box .part .tit {font-weight:600;font-size:25px;line-height:38px;color:#000;margin:0 0 24px;}
.com-table .flex-box .part .tit span {background:linear-gradient(#fdf0ce, #fdf0ce) no-repeat 0 16px/100% 12px;}
.com-table .flex-box .part .line {line-height:33px;}
.com-table .flex-box .part .line b {display:inline-flex;width:174px;font-weight:500;}
.com-table .flex-box .part .line span {margin-left:36px;}

.board-sec {background:#FAFAFA;border-top:1px solid #111;}
.board-sec .sec-inner {padding:108px 0 160px;width:1600px;margin:0 auto;}
.board-sec .tab-title {display:flex;margin:0 0 40px;}
.board-sec .tab-title li button {position:relative;font-weight:300;font-size:55px;line-height:1;color:#ccc;background:none;border:0;}
.board-sec .tab-title li:first-child {position:relative;margin-right:62px;}
.board-sec .tab-title li:first-child::after {content:"";position:absolute;left:224px;top:27px;width:45px;height:1px;background:#000;transform:rotate(290deg);}
.board-sec .tab-title li.active button {font-weight:700;color:#111;}
.board-sec .tab-cont {position:relative;display:none;}
.board-sec .tab-cont.active {display:block;}
.board-sec .tab-cont .more-btn {position:absolute;right:0;top:-96px;z-index:1;display:flex;justify-content:space-between;align-items:center;padding:0 25px;width:154px;height:57px;background:#fff;border:1px solid #000;overflow:hidden;}
.board-sec .tab-cont .more-btn .text {display:flex;line-height:27px;font-weight:400;font-size:18px;transition:all .2s ease-in-out;}
.board-sec .tab-cont .more-btn .icon {display:flex;width:16px;height:27px;background:url('../img//icon_arrow.png') no-repeat center;}
.board-sec .tab-cont .more-btn .bg {background:#000;display:flex;width:100%;height:100%;position:absolute;left:0;bottom:0;transform:translateX(-101%);z-index:-1;transition:all .2s ease-in-out;}
.board-sec .tab-cont .more-btn:hover .text {color:#fff;}
.board-sec .tab-cont .more-btn:hover .icon {background-image:url('../img//icon_arrow_w.png');transition:all .2s ease-in-out .1s;}
.board-sec .tab-cont .more-btn:hover .bg {transform:translateX(0);}

.direction-sec {padding:0 0 90px;background:#fff url('../img//bg_contact.png') no-repeat 100% 0;border-top:1px solid #111;overflow:hidden;}
.direction-sec .sec-inner {display:flex;flex-wrap:wrap;width:1600px;margin:0 auto;}
.direction-sec .sec-inner .title {font-weight:700;font-size:55px;line-height:1;letter-spacing:-1.375px;margin:0 0 24px;}
.direction-sec .sec-inner .left-wrap {padding:198px 0 84px;width:46.4%;}
.direction-sec .sec-inner .right-wrap {margin-left:auto;position:relative;padding:198px 0 84px;width:46.4%;}
.direction-sec .right-wrap .sec-tit {position:absolute;right:-110px;top:-50px;font-weight:900;font-size:150px;color:#f7f7f7;}
.direction-sec .map-box {width:100%;height:500px;background:#f1f1f1;border-bottom:1px solid #e0e0e0;overflow:hidden;}
.direction-sec .map-box > .root_daum_roughmap {width:100% !important;height:100% !important;}

.go-top {position:fixed;right:42px;bottom:40px;z-index:99;width:50px;height:50px;font-size:1px;color:transparent;background:#000 url('../img//icon_arrow_up.svg') no-repeat center;overflow:hidden;border:0;border-radius:50%;display:none;}

#footer {display:flex;align-items:center;padding:68px 0;width:100%;color:#fff;background:#333;}
#footer .footer-inner {display:flex;justify-content:space-between;width:1600px;margin:0 auto;overflow:hidden;}
#footer .logo {display:block;margin:0 0 25px;}
#footer .logo img {vertical-align:top;}
#footer .copyright {font-family:'Pretendard', sans-serif;}
#footer .center-wrap {padding:8px 0 0;}
#footer .line {line-height:18px;margin:0 0 20px;}
#footer .line b {display:inline-flex;width:68px;font-family:'Pretendard', sans-serif;}
#footer .line span {margin-left:20px;font-family:'Pretendard', sans-serif;white-space:nowrap;}
#footer .sponsor {display:flex;justify-content:flex-end;align-items:center;gap:30px;margin:0 0 23px;}
#footer .site-menu {display:flex;justify-content:flex-end;gap:10px;}
#footer .site-menu li a {display:inline-flex;font-weight:500;font-size:13px;line-height:1.45;color:#fff;white-space:nowrap;background:linear-gradient(#fff, #fff) no-repeat 0 100%/0 1px;transition:background-size .25s;}
#footer .site-menu li a:hover {background-size:100% 1px;}


@media screen and (max-width: 1675px) {
    #header {height:80px;}
    #gnb ul li a {height:79px;font-size:18px;}
    #container {padding:80px 0 0;}
    #header .header-inner,
    #footer .footer-inner,
    .main-visual .sec-inner,
    .schedule-sec .sec-inner,
    .board-sec .sec-inner,
    .direction-sec .sec-inner {padding-inline:30px;width:100%;}
    .main-visual {height:45vw;background:url('../img//main_visual.png') no-repeat 50% 0/100% auto;}
    .main-visual .sec-inner {padding-top:3vw;}
    .main-visual .fair-title {margin:0 0 2vw;}
    .main-visual .fair-eng {margin:0 0 3.5vw;}
    .main-visual .fair-date {margin:0 0 4vw;}
    .main-visual img {width:28vw;}
    .schedule-sec .right-wrap {padding:120px 0 80px;}
    .schedule-sec .right-wrap .sec-tit,
    .direction-sec .right-wrap .sec-tit {right:0;top:-40px;font-size:125px;}
    .schedule-sec,
    .direction-sec {background-size:auto 80px;} 
    .schedule-sec .title,
    .direction-sec .sec-inner .title,
    .board-sec .tab-title li button {font-size:40px;}
    .direction-sec .sec-inner .left-wrap,
    .direction-sec .sec-inner .right-wrap {padding:140px 0 50px;}
    .com-table th {padding:15px 10px;font-size:20px;}
    .com-table td {padding:15px 10px;font-size:18px;}
    .com-table .tit a {padding:15px 10px;}
    .com-table .flex-box .part .tit {font-size:20px;}
    .board-sec .sec-inner {padding-block:80px;}
    .board-sec .tab-title {margin:0 0 25px;}
    .board-sec .tab-title li:first-child {margin-right:55px;}
    .board-sec .tab-title li:first-child::after {left:168px;top:20px;width:36px;}
    .board-sec .tab-cont .more-btn {top:-70px;padding:0 20px;width:125px;height:50px;}
    .board-sec .tab-cont .more-btn .text {font-size:16px;}
    .direction-sec {padding:0 0 80px;}
}
@media screen and (max-width: 1570px) {
    .schedule-sec .left-wrap {display:none;}
    .schedule-sec .right-wrap {width:100%;margin:0;}
    .com-table .flex-box .part + .part {margin-left:50px;}
    #footer {padding:35px 0;}
    #footer .footer-inner {flex-wrap:wrap;justify-content:flex-start;}
    #footer .left-wrap {width:100%;margin:0 0 20px;}
    #footer .center-wrap {margin:0 auto 20px;}
    #footer .right-wrap {width:100%;}
    #footer .logo {text-align:center;margin:0 0 20px;}
    #footer .copyright {text-align:center;}
    #footer .line {margin:0 0 10px;}
    #footer .sponsor {justify-content:center;margin:0 0 10px;}
    #footer .site-menu {justify-content:center;}
}
@media screen and (max-width: 1200px) {
    #header {height:70px;}
    #gnb ul li a {height:69px;}
    #header .menu-area {width:calc(100% - 140px);}
    #container {padding:70px 0 0;}
    .com-table .flex-box {flex-wrap:wrap;}
    .com-table .flex-box .part {padding:0;width:100%;}
    .com-table .flex-box .part + .part {margin:30px 0 0;}
    .com-table .flex-box .part .tit {margin:0 0 10px;}
    .direction-sec .sec-inner .left-wrap {padding:140px 0 0;width:100%;}
    .direction-sec .sec-inner .right-wrap {padding:50px 0;width:100%;}
    .direction-sec .right-wrap .sec-tit {top:auto;bottom:200%;transform:translateY(47%);}
}
@media screen and (max-width: 1023px) {
    #header .header-inner {gap:0;justify-content:space-between;}
    #header .menu-area {width:80px;}
    .menu-area .menu-wrap {position:fixed;top:0;right:0;z-index:100;width:100%;height:100%;visibility:hidden;transition:.5s;}
    #header .m-menu-btn {display:block;}
    .menu-area .menu-wrap.active {visibility:visible;}
    .menu-area .menu-wrap.active .dimmed {position:absolute;left:0;top:0;z-index:1;width:100%;height:100%;background:rgba(0,0,0,0.6);cursor:pointer;}
    .menu-wrap .menu-inner {position:absolute;right:-75%;top:0;z-index:2;flex-direction:column;justify-content:flex-start;width:75%;height:100%;background:#fff;transition:right .5s;}
    .menu-wrap.active .menu-inner {right:0;}
    .menu-wrap .m-header {display:flex;}
    #gnb ul {flex-direction:column;gap:0;}
    #gnb ul li {position:relative;width:100%;}
    #gnb ul li::after {content:"";position:absolute;left:15px;right:15px;bottom:1px;height:1px;background:#DDD;}
    #gnb ul li a {height:auto;padding:16px 15px;}
    #gnb ul li a::after {content:none;}
    #gnb ul li a {color:#333 !important;}
    #gnb ul li:hover a,
    #gnb ul li.on a {color:#376DB5 !important;}
    .sns-menu {margin:20px 15px 0;}
    .schedule-sec,
    .direction-sec {background-size:auto 70px;}
    .schedule-sec .title {padding:0 0 20px;}
    .schedule-sec .title span {display:block;margin:0;}
}
@media screen and (max-width: 860px) {
    #header .header-inner,
    #footer .footer-inner,
    .main-visual .sec-inner,
    .schedule-sec .sec-inner,
    .board-sec .sec-inner,
    .direction-sec .sec-inner {padding-inline:20px;}
    .direction-sec .map-box {margin:0 -20px;width:calc(100% + 40px);height:400px;}
    .direction-sec .map-box .wrap_map {height:400px;}
    #footer .line {text-align:center;font-size:15px;line-height:1.5;margin:0 0 5px;}
    #footer .line b {width:auto;margin-right:10px;}
    #footer .line span {margin-inline:0 15px;}
    .schedule-sec,
    .direction-sec {background-size:auto 60px;}
    .schedule-sec .title, 
    .direction-sec .sec-inner .title,
    .board-sec .tab-title li button {font-size:32px;}
    .board-sec .tab-title li:first-child {margin-right:38px;}
    .board-sec .tab-title li:first-child::after {left:130px;top:15px;width:28px;}
    .board-sec .tab-cont .more-btn {top:-60px;padding:0 15px;width:50px;}
    .board-sec .tab-cont .more-btn .text {position:absolute;left:-2px;width:1px;height:1px;overflow:hidden;}
}
@media screen and (max-width: 610px) {
    .main-visual {height:137vw;background-image:url('../img//main_visual_m.jpg');}
    .main-visual img {opacity:0;}
    .schedule-sec,
    .direction-sec {background-size:100% auto;}
    .schedule-sec .right-wrap,
    .direction-sec .sec-inner .left-wrap {padding-top:22vw;}
    .com-table colgroup {display:none;}
    .com-table th {display:block;padding-bottom:0;width:100%;border:0;}
    .com-table td {display:block;padding-top:5px;width:100%;}
    .board-sec .com-table tr {position:relative;border-bottom:1px solid #111;}
    .board-sec .com-table td {border:0;}
    .com-table .num {position:absolute;left:0;top:0;padding:5px 10px;width:auto;background:none;}
    .com-table .tit a {padding:32px 10px 35px;}
    .com-table .date {position:absolute;right:0;bottom:0;padding:5px 10px;width:auto;background:none;}
    .com-table .flex-box .part .line span {margin-left:10px;}
    .go-top {right:15px;bottom:20px;}
}