@charset "utf-8";

:root {
	--font-size:18px;
	--sub-font-size: 16px;
}

.m_gnb .sub_menu {display:none !important;}
.web_dis {display:block;}
.mb_dis {display:none;}


/* header */
#header {width:100%; position: relative; left:0px; top:0px; z-index:9999; box-sizing:border-box; transition:all 0.3s 0s ease-in-out;}
#header h1 {position:absolute; left:0px; top:50%; transform:translateY(-50%); -wbkit-transform:translateY(-50%); z-index:10; line-height:0px}
.header_bar {padding:0px 10px; background: #fff; box-shadow:0px 6px 5px rgba(0, 0, 0, 0%);}
.header_bar.fix {width:100%; position: fixed; left: 0px; top:0px;}
.in_header {max-width:var(--inner); display: flex; align-items: center; width:100%; height:130px; box-sizing:border-box; margin:0 auto; position:relative; z-index:9;}
.in_header .all_menu {display:none;}

/* wrap */
#wrap {width:100%; overflow:hidden; word-break:keep-all; transition:all 0.3s 0s ease-in-out;}
#inner_wrap {position:relative; padding:0px 10px 100px 10px;}
.inner {max-width:var(--inner); margin:0 auto;}
.main_quick {position:fixed; right:10px; top:50%; transform: translateY(-50%); z-index:9;}
.main_quick > a {background:#000; display:flex; width:100px; height:100px; border-radius:100%; font-size: 14px; font-weight:500; line-height:1.4em; justify-content: center; align-items: center; color:#fff; text-align: center; flex-direction: column;}
.main_quick > a img {margin-bottom: 5px;}


.m_gnb_on {display:none;  position:absolute; right:10px; top:50%; box-sizing:border-box; transform:translateY(-50%);}
.m_gnb_on .menu_btn {margin:0 auto;}
.menu_btn {position:absolute; right:0px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); box-sizing:border-box; display:block; }
.menu_btn a {display:flex; width: 140px; padding:5px; height:48px; border-radius:60px; background:#fff; border:1px solid #000; align-items:center; font-size:var(--sub-font-size); font-weight:600; color:#000; padding-left:30px;}
.menu_btn a > span {display:flex; margin-left:3px; width:38px; height:38px; background: #fff; border-radius:100%; align-items:center; justify-content: center; overflow:hidden;}
.menu_btn a > span > span {position:relative; width:22px; height:12px;background: #000;}
.menu_btn a > span > span:After {content:""; width:100%; height:3px; background:#fff; position:absolute; left:0%; top:2px;}
.menu_btn a > span > span:before {content:""; width:100%; height:3px; background:#fff; position:absolute; left:0%; bottom:2px;}


/* GNB */
.w_gnb {padding:0px 0px 0px 400px; width: 100%;}
.w_gnb .gnb {max-width:970px;margin-left:auto; display:flex; flex-wrap:wrap; justify-content:space-around;  transition:all 0.2s 0s ease-in-out;}
.w_gnb .gnb > li {text-align:left; flex:1; padding:0px 5px; vertical-align:top; position:relative;}
.w_gnb .gnb > li > a {color:#000000; display:flex; width:100%; align-items:center; font-size:20px; font-weight:300; height:85px; transition:all 0.2s 0s ease-in-out; position:relative;}
.w_gnb .gnb > li:hover > a {font-weight:600; color: var(--key-color);}
.w_gnb .sub_menu  {position:absolute; left:0px; width:100%; padding:0px 5px 20px 5px; overflow:hidden; top:100%; display:none; }
.w_gnb .sub_menu > li {padding:2px 0; letter-spacing:-0.5px; text-align: left;}
.w_gnb .sub_menu > li > a {word-break:auto-phrase; display:block;font-size:16px; color:#000; font-weight:300; padding:4px 0em; line-height:1.4em;}
.w_gnb .sub_menu > li > a:hover {font-weight:600; color: var(--key-color); text-underline-offset:5px;  text-decoration: underline;}
.w_gnb .m_gnb_on {position:absolute; right:0px; top:-1px; padding:21px; background:#2d3749}
#gnb_bar {display:none; position:absolute; left:0%; top:100%; width:100%; background:#fff; box-shadow:0px 2px 5px rgba(0, 0, 0, 0%)}
.w_gnb .gnb04 {max-width:160px;}

/* slide_menu */
.slide_menu_wrap {width:100%; max-width:100%; box-sizing:border-box; height:100%;  z-index:998; position:fixed; right:-102%; top:0px; bottom:0px; box-shadow:-1px 0px 5px rgb(0, 0, 0, 0.25); }
.slide_menu_wrap:after {display:block; content:""; width:0%; height:100%; background:#000; position:fixed; left:0%; top:0px; opacity:0.2;  transition:all 0.3s 0s ease-in-out;}
.slide_menu_wrap.on:after {width:100%}
.slide_menu_inner {height:100%; padding:0px 30px 30px 30px; background:#fff; box-sizing:border-box; overflow-y:auto; overflow-x:inherit; -webkit-overflow-scrolling:touch; z-index:2; position:relative;}
.slide_menu_inner .header {background:url(../img/common/logo.png) no-repeat left center; background-size:auto 40px; height:100px; display: flex; align-items:center; position: relative;}
.slide_menu_inner .header:after {content:""; width:calc(100% + 60px); height:1px; background: #ccc; position: absolute; left: 50%; top: 100%; transform: translateX(-50%);}
.slide_menu_inner .bt_close {margin-left:auto; width:38px; height:38px; background: #000; border-radius: 100%; position: relative; font-size:1px; text-indent: -999999em;}
.slide_menu_inner .bt_close:after {display:block; content:""; width:20px; height:2px; background:#fff; transform-origin:center; transform:translate(-50%, -50%) rotate(45deg); position:absolute; top:50%; left:50%;}
.slide_menu_inner .bt_close:before {display:block; content:""; width:20px; height:2px; background:#fff; transform-origin:center; transform:translate(-50%, -50%) rotate(135deg); position:absolute; top:50%; left:50%;}

.slide_menu_wrap .top_menu {display:flex; margin-top:30px; background: var(--key-color); border-radius:10px;}
.slide_menu_wrap .top_menu > li:not(:first-child):before {content:""; width:1px; height:1em; background:#000; opacity: 0.3; position: absolute; left:-5px; top:50%; transform: translateY(-50%);}
.slide_menu_wrap .top_menu > li {flex:1; position: relative; gap:10px}
.slide_menu_wrap .top_menu > li > a {color:#000; display:flex; height:4em;justify-content:center; align-items:center; font-size:14px; line-height:1.4em; font-weight:500; padding:0px;}
.slide_menu_wrap .gnb {overflow:hidden; margin-top:20px;}
.slide_menu_wrap .gnb > li {transform:translateX(30%); -webkit-transform:translateX(30%); transition:all 0.8s 0s ease-in-out; -webkit-transition:all 0.8s 0s ease-in-out;}
.slide_menu_wrap .gnb > li > a {display:flex; justify-content: space-between; font-size:20px; line-height:1.3em; align-items: center; min-height:2.5em; font-weight:600; color:#000;}
.slide_menu_wrap .gnb > li > a:after {display: block; justify-content:center; align-items: center; content:"+"; box-sizing: border-box; padding-top:0.15em; width:26px; height:26px; border-radius:100%; background: #000; color:#fff; font-size:20px; line-height:24px; font-weight:400; text-align:center;}
.slide_menu_wrap .gnb > li > a.on:after {content:"-";background:var(--key-color);}
.slide_menu_wrap .gnb .sub_menu {display:none}
.slide_menu_wrap .gnb .sub_menu > li:not(:first-child) {margin-top:5px}
.slide_menu_wrap .gnb .sub_menu > li > a {display:flex; align-items: center; min-height:3em; background: #efefef; border-radius:4px; line-height:1.4; padding:5px 1em; font-size:16px; color:#000; transition:all 0.3s 0s ease-in-out; -webkit-transition:all 0.3s 0s ease-in-out; font-weight:400;}
.slide_menu_wrap.on .gnb > li {transform:translateX(0%); -webkit-transform:translateX(0%); transition:all 0.8s 0s ease-in-out; -webkit-transition:all 0.8s 0s ease-in-out;}


.section {padding:min(90px, 13vw) 10px; font-size: var(--font-size); line-height:1.5em}
.section .go_btn > a {display: flex; align-items: center; font-size:14px; height:26px; line-height: 1.3em; font-weight:300; color: #000;}
.section .go_btn > a img {margin-right: 10px;}
.m_tit {padding:1em 0px 0.4em 0px; color:#000000; font-size:2.33333em; line-height:120%; font-weight:400; }
.m_tit > strong {font-weight:800;}
.m_tit_txt {font-size:1.55em; margin-bottom:1em}

#section1 {padding-top:0px; padding-bottom: 0px;}
.main_visual {display: flex;}
.main_visual .movie_banner {width:50%}
.main_visual .movie > a {display:block; overflow:hidden; border-radius:7px;}
.main_visual .banner_slide {overflow:hidden; margin-top:10px}
.main_visual .banner_slide .box {display:block; overflow:hidden; border-radius:4px; padding-bottom:calc(159 / 740 * 100%); position:relative}
.main_visual .banner_slide .box > img {position:absolute; left: 0px; top: 0px; width:100%; height:100%; object-fit: cover;}
.main_visual .banner_slide .swiper-pagination {position:relative; top: auto; left: auto; bottom: auto; margin-top:10px}
.main_visual .banner_slide .swiper-pagination-bullet {background:#000000; opacity: 1;}
.main_visual .banner_slide .swiper-pagination-bullet-active {background:var(--key-color);}

.main_visual .quick_notice {width: 50%; padding-left:20px;}
.main_visual .quick {display: flex; gap:8px}
.main_visual .quick > li {flex:1}
.main_visual .quick > li > a {display:flex; align-items: center; justify-content: center; text-align: center; position:relative; border-radius:6px; font-size: 1.6666em; line-height: 1.2em; height:5.333em; background: var(--key-color); color: #fff; font-weight: 600; transition: all 0.3s 0s ease-in-out;}
.main_visual .quick > li > a:after {content: ""; position: absolute; right:10px; bottom: 10px; width:39px; height: 39px; border-radius:100%; background: url(../img/main/m_arrow.png) no-repeat center center #fff; background-size:10px auto;}
.main_visual .quick > li > a:hover {background:#000;}


.main_board {margin-top:50px; position:relative}
.main_board .go_btn {position:absolute; right:0px; top: 0px;}
.main_board > h3 {font-size:1.333em; line-height:1.4em; font-weight:300;}
.main_board .list {margin-top:20px;}
.main_board .list > li:not(:first-child) {margin-top:10px;}
.main_board .list > li * {transition:all 0.3s 0s ease-in-out;}
.main_board .list > li > a {display:flex; flex-direction:column; justify-content: center; overflow: hidden; padding:0px 3em 0px 2em; height:100px; background:#f1f1f3; border-radius:4px; position:relative}
.main_board .list > li > a:after {content: ''; width:5px; height:5px; border-top:2px solid #333; border-right:2px solid #333; transform:translateY(-50%) rotate(45deg); position:absolute; right:2em; top:50%;transition:all 0.3s 0s ease-in-out;}
.main_board .list > li > a .subject {width:100%; display: flex; align-items: center;}
.main_board .list > li > a .txt_a {max-width:100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis;}
.main_board .list > li > a .date {margin-top:0.2em; color:#666666; font-size:min(14px, 2.5vw);}
.main_board .list > li > a .new {min-width:46px; height:26px; background:var(--key-color); border-radius:60px; display: flex; color:#fff; position:relative; justify-content: center; align-items: center; font-size: 11px; margin-left:5px; align-self: flex-start;}
.main_board .list > li > a .new:after {content:""; border-top:10px solid var(--key-color); border-left:0px solid transparent; border-right:13px solid transparent; position:absolute; right:5px; top:85%; transition:all 0.3s 0s ease-in-out;}
.main_board .list > li > a:hover {background:var(--key-color);color:#fff;}
.main_board .list > li > a:hover .date {color:#fff;}
.main_board .list > li > a:hover:after {border-color:#fff;}
.main_board .list > li > a:hover .new {color: var(--key-color); background: #fff;}
.main_board .list > li > a:hover .new:after {border-top-color:#fff}

.main_movie .box .movie {cursor:pointer; border:1px solid #fff; border-radius:8px; overflow:hidden; position:relative}
.main_movie .box .movie::after {display: block; content:""; width:72px; height:72px; background:url(../img/main/bt_play.png) no-repeat left top/cover; position: absolute; left: 50%; top:50%; transform: translate(-50%, -50%);}
.main_movie .box .txt_t {margin:0.8em 0px 0.2em 0px; font-size:1.3333em; line-height:1.4em; font-weight:600; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis;}
.main_movie .box .txt_s {font-size:0.95em; font-weight:600;}
.movie_frame {padding-bottom:calc(376 / 669 * 100%); position: relative; overflow:hidden;}
.movie_frame > img {position:absolute; left:0px; top:0px; width:100%; height:100%; object-fit: cover;}

.event_banner {position:relative}
.event_banner .arrow {z-index:9; text-indent:-999999em; display:flex; width:60px; height:60px; display:flex; justify-content:center; align-items:center; border-radius:100%; background:#000; position:absolute; top:50%; transform:translateY(-50%);}
.event_banner .arrow:after {content:''; width:8px; height:8px; border-top:3px solid #fff; border-right:3px solid #fff; border-radius:3px; display:block; transform:rotate(45deg);}
.event_banner .swiper-button-prev:after {transform:rotate(-134deg);}
.event_banner .swiper-button-prev {left:-75px;}
.event_banner .swiper-button-next {right:-75px;}
.event_banner .swiper {overflow: hidden;}
.event_banner .box {display: block;}
.event_banner .box .img {overflow:hidden; padding-bottom:100%; position:relative}
.event_banner .box .img > img {position:absolute; left:0px; top: 0px; width:100%; height:100%; object-fit: cover; border-radius:4px;}
.event_banner .box .info {padding:min(1.2em, 2.1vw) min(2em, 4vw); border:1px solid #ccc; border-radius:0px 0px 4px 4px; margin-top:-4px}
.event_banner .box .info * {transition: all 0.3s 0s ease-in-out;}
.event_banner .box .txt_a {line-height: 1.4em; height: 2.8em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2;-webkit-box-orient: vertical;}
.event_banner .box .date {font-size:min(14px, 2.5vw); margin-top:2em; color:#666666}
.event_banner .box:hover .info {border-color: var(--key-color); color: var(--key-color);}
.event_banner .box:hover .date {color: var(--key-color);}

#section3 {background: #000; } 
.product_banner {display: flex; position:relative}
.product_banner .m_tit_area {width:277px; min-width:277px; margin-right:min(90px, 6vw); color:#fff}
.product_banner .m_tit_area h3 {font-size:min(2.5em, 7vw); line-height: 1.3em;}
.product_banner .m_tit_area .ico {display: block; padding:2em 0px; text-align: right;}
.product_banner .control_wrap { position:absolute; left: 0px; bottom:0px; width:277px;}
.product_banner .bt {display: flex; justify-content: center; align-items: center; font-size:1.11em; margin-top:0.5em; padding-top:0.2em; font-weight:600; height:4em; background: var(--key-color); color:#fff; margin-bottom:65px;;}
.product_banner .control {display: flex; justify-content: flex-end; gap:5px; margin-top:auto;}
.product_banner .control .arrow {z-index:9; text-indent:-999999em; display:flex; width:60px; height:60px; display:flex; justify-content:center; align-items:center; border-radius:100%; background:#fff; position: relative; top: auto; right: auto; left: auto; bottom: auto; margin:0px;}
.product_banner .control .arrow:after {content:''; width:8px; height:8px; border-top:3px solid #000; border-right:3px solid #000; border-radius:3px; display:block; transform:rotate(45deg);}
.product_banner .control .swiper-button-prev:after {transform:rotate(-134deg);}
.product_banner .swiper {min-width: 1470px;}
.product_banner .swiper .img {padding:0px 30px 30px 0px;}
.product_banner .swiper .img > span {display:block; overflow: hidden; padding-bottom: calc(250 / 330 * 100%); position:relative}
.product_banner .swiper .img > span > img {position:absolute; left:0px; top: 0px; width:100%; height:100%; object-fit: cover;}
.product_banner .swiper .box {display: block; box-shadow:2px 3px 5px rgba(0, 0, 0, 50%); border-radius:4px; color: #fff; transition:all 0.3s 0s ease-in-out;}
.product_banner .swiper .box * {transition:all 0.3s 0s ease-in-out;}
.product_banner .swiper .box:hover {background: #fff !important;}
.product_banner .swiper .box:hover * {color:#000;}
.product_banner .swiper .box:hover .info::before {background: url(../img/common/arrow2.svg) no-repeat left top/cover; transform:rotate(0deg);}
.product_banner .swiper .info {padding:30px 40px; position: relative;}
.product_banner .swiper .info::before {content:""; width:12px; height:11px; position: absolute; right:40px; top: 40px; background: url(../img/common/arrow.svg) no-repeat left top/cover; transform:rotate(-45deg);}
.product_banner .swiper .txt_a {font-weight:600; font-size:1.666em; line-height: 1.5em; overflow: hidden;  white-space: nowrap;  text-overflow: ellipsis;  -o-text-overflow: ellipsis;}
.product_banner .swiper .txt_b {font-size: var(--sub-font-size); overflow: hidden;  white-space: nowrap;  text-overflow: ellipsis;  -o-text-overflow: ellipsis;}
.product_banner .swiper .txt_c {font-size:0.95em; font-weight:100; line-height: 1.4em; height:4.2em; overflow: hidden;	text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp:3; line-clamp:3;-webkit-box-orient: vertical; margin-top:2em}
.product_banner .swiper-slide  { width:360px;}
.product_banner .swiper .box.bg1 {background: #006dff;}
.product_banner .swiper .box.bg2 {background: #ff7000;}
.product_banner .swiper .box.bg3 {background: #ff00e2;}
.product_banner .swiper .box.bg4 {background: #d7f44f; color: #000 !important;}
.product_banner .swiper .box.bg5 {background: #6c00ff;}
.product_banner .swiper .box.bg6 {background: #ff7000;}
.product_banner .swiper .box.bg7 {background: #ff00e2;}
.product_banner .swiper .box.bg8 {background: #d7f44f; color: #000 !important;}

/* footer */
#footerW {clear:both; background:#fff; box-sizing:border-box; margin:0 auto; position:relative; font-size: var(--sub-font-size);}
#footerW.z_over {z-index:101; position:relative;}
#footer_navi {padding:2em 0px;  max-width: var(--inner); margin:0 auto; position:relative; display: flex; gap:20px; justify-content: space-between;}
#footer_navi:After {content: ""; width:100vw; height:1px; background:#e5e5e5; position:absolute; left: 50%; top: 100%; transform: translateX(-50%);}
#footer_navi > ul {display:flex; align-items:center;}
#footer_navi .navi {gap:5px min(20px, 2vw); flex:1; max-width:calc(100% - min(130px, 26vw));}
#footer_navi .navi > li {max-width: max-content;}
#footer_navi .sns {gap:3px; min-width:max-content;}
#footer_navi .sns a {display:flex; max-width:8vw; max-height:8vw; width: 4.187em; height:4.187em; border:1px solid #e5e5e5; justify-content: center; align-items:center; border-radius:100%;}
#footer_navi .sns a img {max-width:5vw;}


#footer {position:relative; max-width:var(--inner); margin:0 auto; background:url(../img/common/logo.png) no-repeat 10px 50px; background-size:auto 44px; padding:50px 0px 50px 260px;}
#footer .go_top {position:absolute; right:0px; top:30px; z-index:99}
#footer .go_top > a {display:flex; width:67px; height:67px; line-height:1.6em; background:#000; justify-content:center; text-align: center; align-items:center; flex-direction:column; color:#fff; font-size:9px; font-weight:600; border-radius:100%;}
#footer .addressW { padding:0px 0px 0px 0px; box-sizing:border-box; position:relative; color:#333333; font-weight:500; line-height:1.4em;  }
#footer .addressW .txt_t {font-size:1.25em; line-height:1.3em; font-weight:600; padding-bottom:10px;}
#footer .addressW a {color:#333333}
#footer .addressW address {margin:0px -5px;}
#footer .addressW address span {display:inline-block; padding:0px 5px;}

#footer .addressW address .flex {flex-direction:column; align-items:flex-start}
#footer .addressW address .flex > li {margin-bottom:5px; display:flex; flex-wrap:wrap; align-items:center; }
#footer .addressW address .flex strong {min-width:123px;}
#footerW .copy {padding-top:10px; font-size:0.875em; z-index:1;}



/* sub_page */
.title_bar {padding:min(20px, 2vw) 0px;}
.lnb_position {margin-bottom:min(50px, 7vw);}
.lnbs3 > ul {display:flex; justify-content: center; gap:0px min(50px, 5vw)}
.lnbs3 li > a {font-size:1.111em; display:block; border-bottom:4px solid transparent; line-height:1.4em; word-break:break-all;}
.lnbs3 li.on > a, .lnbs3 li > a:hover {font-weight:600; border-color: var(--key-color);}

#lnb_wrap .lnbs {display:none;}
#lnb_wrap .ico_home {display:none;}
.lnb_tit, a.lnb_tit {font-size:var(--sub-font-size); display:block; box-sizing:border-box; padding-left:20px; color:#000; line-height:60px; height:60px; cursor:pointer; padding-right:20px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; -o-text-overflow:ellipsis;}
.lnb_tit:after {display:block; content:""; position:absolute; right:20px; top:50%; transform:translateY(-50%); width:0; height:0;border-top:7px solid #fff; border-left:5px solid transparent; border-right:5px solid transparent; transition:all 0.2s 0s ease-in-out;}
.lnb_tit.on:after {transform:rotate(-180deg); margin-top:-5px}

.sub_con { max-width:var(--sub-inner); margin:0 auto; font-size:var(--font-size); word-break:keep-all;}
.sub_con > .s_tit:first-child {margin-top:0px;}
.s_tit {font-size:2.6666em; color:#000000; line-height:130%; position:relative; margin-top:60px; font-weight:800; display:flex; align-items:center;}
.s_tit.no-flex {display:block; line-height:1.3em;}
.s_tit.tc {text-align:center; justify-content:center; background:none !important; padding-left:0px;}
.s_tit.tc:after {display:none;}
.s_tit.tc:before {display:none;}
.ss_tit {font-size:2em; color:#000; margin:2.26em 0px 0.5em 0px; font-weight:700; display:flex; align-items:center;}
.ss_tit.tc {justify-content:center; text-align:center}
.ss_tit.no-flex {display:block;}
.ss_tit > span{font-weight:300;}
.b_txt {font-size:min(2em , 5.5vw); line-height:1.6em;}
.b_txt_s {font-size:min(1.44em , 4.5vw); line-height:1.6em;}

.title_bar {text-align: center; padding:35px 0px 20px 0px;}
.title_bar > h2 {font-size:2.55em; line-height: 1.4em;}



/*atab*/
.atab {display:flex; overflow-x:auto; gap:8px; justify-content:center; position:relative;}
.atab::-webkit-scrollbar {width:5px; height:8px; background-color:#eee;}
.atab::-webkit-scrollbar-thumb {background:#666;}
.atab li {flex:1;}
.atab li a {display:flex; height:2.94em; justify-content:center; align-items:center; background:#fff; text-align:center; font-weight:500; font-size:17px; line-height:1.2em; box-sizing:border-box; color:#000; padding:0px 5px; border-radius:60px; }
.atab li.on {position:relative; z-index:2;}
.atab li.on a {background:#009178; color:#fff;}

.btab {border-bottom:1px solid #cccc; margin-bottom:40px; display:flex; flex-wrap:wrap; justify-content:center; padding:1.5em 0px;}
.btab li {padding:2px 1em;}
.btab li a {color:#999999; font-weight:600;}
.btab li.on a {color:#009477; font-weight:700;}

.ctab {display:flex; overflow-x:auto; margin-bottom:50px; padding-bottom:10px; position:relative; margin:0px -5px;}
.ctab::-webkit-scrollbar {width:5px; height:8px; background-color:#eee;}
.ctab::-webkit-scrollbar-thumb {background:#666;}
.ctab li {flex:1; padding:0px 5px; min-width:fit-content;}
.ctab li a {display:flex; height:60px; justify-content:center; align-items:center; background:#fff; box-sizing:border-box; text-align:center; font-weight:700; font-size:18px; line-height:1.2em; box-sizing:border-box; color:#999999; padding:0px 1em; border:1px solid #cccccc;}
.ctab li.on {position:relative; z-index:2;}
.ctab li.on a { color:#009477; border-color:#009477}




.of_hi .fl50 {float:left; width:49%;}
.of_hi .fr50 {float:right; width:49%;}
.graybox { background:#cccccc; padding:10px;}
.no_flash { display:none;}

/* 레이어팝 */
.layerPop {-webkit-overflow-scrolling:touch; display: flex; align-items: center; justify-content:center; width:100%; position:fixed; left:0; right:0; top:0; bottom:0; padding:10px; z-index:99999;  background:rgba(0, 0, 0, 50%); font-size:var(--font-size); line-height:1.5em;}
.pop_wrap {width:100%; max-height:100%; padding:10px; position:relative;  background:#fff;}
.pop_wrap .pop_body {padding:15px 20px; word-break:keep-all; overflow-y:auto; max-height:90vh;}
.pop_wrap .pop_body::-webkit-scrollbar { width: 6px; }
.pop_wrap .pop_body::-webkit-scrollbar-thumb { background-color:#ccc; border-radius: 10px;}
.pop_wrap .pop_body::-webkit-scrollbar-track { background-color: transparent; }
.pop_wrap .x_btn {position:absolute; right:10px; top:10px; display:block; cursor:pointer; background:none; width:40px; height:40px; font-size:0px;}
.pop_wrap .x_btn:after {display:block; content:""; width:20px; height:4px; background:#000; transform-origin:center; transform:translate(-50%, -50%) rotate(45deg); position:absolute; top:50%; left:50%;}
.pop_wrap .x_btn:before {display:block; content:""; width:20px; height:4px; background:#000; transform-origin:center; transform:translate(-50%, -50%) rotate(135deg); position:absolute; top:50%; left:50%;}
.pop_wrap .pop_head.bg_no {background:#fff;}
.pop_wrap .pop_head.bg_no .title {color:#000}
.pop_wrap .pop_head.bg_no .x_btn:after {background:#000}
.pop_wrap .pop_head.bg_no .x_btn:before {background:#000;}
.pop_wrap .pop_head {background:linear-gradient(-120deg, rgba(33,73,166,1) 0%, rgba(69,113,233,1) 100%); position:relative;}
.pop_wrap .pop_head .x_btn {top:50%; transform: translateY(-50%); font-size:1px !important; text-indent:-999999px;}
.pop_wrap .pop_head .title {font-size:26px; line-height:140%; color:#fff; padding:20px 50px 15px 25px; text-align:left; font-weight:800;}
.pop_wrap .pop_head .title.tc {padding-left:50px;}
.pop_wrap .pop_head .s_txt {font-size:14px; line-height:14px;  color:#646464; text-align:center; padding:0px 0px 30px 0px;}



/* 팝업 */
.main_layer_pop {position:absolute; left:5%;  top:100px; z-index:9999}
.main_pop_bottom {background:#fff; font-weight:300; color:#000; padding:10px; position:relative; font-size:14px; box-sizing:border-box; border:1px solid #ccc;}
.main_pop_bottom .close {position:absolute; right:10px; top:10px; padding-right:30px; background:url(../img/common/close.png) no-repeat right center; background-size:20px auto;}
.main_layer_pop_inner {width:100%; height:100%; display:table; position:relative; margin:0 auto; box-sizing:border-box;}
.main_layer_pop_inner .cell {display:table-cell; vertical-align:middle; position:relative; padding:0px 10px;}
.main_layer_pop .bx-wrapper .bx-controls-direction a {margin-top:-22px; width:44px; height:44px;}
.main_layer_pop .bx-wrapper .bx-prev {left:0px; background:url(../img/main/pop_l.png) no-repeat 0 0;}
.main_layer_pop .bx-wrapper .bx-next {right:0px; background:url(../img/main/pop_r.png) no-repeat 0 0;}
.main_layer_pop .pop_wrap_in {margin:0 auto;}
.main_layer_pop .pop_wrap_in{overflow-y:auto;}


.layers_wrap {background:#FFF; position:relative; min-width:300px;  font-weight:300;}
.layers_wrap .layers_tit {width:100%; padding:15px 0px; line-height:150%; background:#333;  text-align:center; font-size:1.8em; color:#fff; position:relative;}
.layers_wrap .layers_tit .logo {padding-left:25px; padding-top:20px;}
.layers_wrap  .close_pop { position:absolute; right:25px; top:17px;}
.layers_wrap .layers {padding:20px; font-size:14px; position:relative; /*min-height:100px; max-height:760px; overflow-x:hidden; overflow-y:auto; -webkit-print-color-adjust:exact;*/}

.layers_wrap .close {height:30px; border-top:none; text-align:right; background:#e2e2e2; line-height:30px;}
.layers_wrap .close a { display:inline-block; zoom:1; font-family:Pretendard; color:#2d2d2d; padding-right:20px; background:url(http://pic.neungyule.com/newnetimes/img/btn/pop_close_s.gif) no-repeat right center; margin-right:10px;}
.layers_wrap .pop_tit {padding-left:5px; border-bottom:1px solid #afafaf; min-height:41px; padding-bottom:3px; font-family:Pretendard; color:#444444; font-size:22px; line-height:41px;}
.layers_wrap .pop_tit.ico_check2 { font-size:13px; min-height:20px; padding:10px 10px 10px 50px; background:url(../img/common/ico_check2.gif) no-repeat 10px 10px #f9f9f9; line-height:150%; border-bottom:none;}
.layers_wrap .pop_tit_no {min-height:38px; font-family:Pretendard; color:#444444; font-size:22px; line-height:38px;}


.print_wrap #header {display:none !important}
.print_wrap .sub_visual {display:none !important}
.print_wrap .lnb_position {display:none !important}
.print_wrap #lnb_wrap {display:none !important}
.print_wrap .title_bar {display:none !important}
.print_wrap .page_tab {display:none !important}
.print_wrap #footerW {display:none !important}
.print_wrap .print_bt {display:none !important}
.print_wrap .p_none {display:none !important}
.print_wrap .print_hide {display:none !important}
#wrap.print_wrap, .print_wrap #inner_wrap {padding:0px !important}


.date_picker_two {overflow:hidden; position:relative}
.date_picker_two .date_picker {float:left; width:47%;}
.date_picker {display:flex; align-items:center;}
.date_picker .input {width:100%; flex:1;}
.date_picker img {min-width:fit-content; margin:0px 10px;}
.date_picker.two_col .input {width:100%;}
.date_picker_two .col-sm-2  {float:left; width:47%;}
.date_picker_two .pa {left:50%; top:0%; line-height:30px; text-align:center; width:10px; margin:0px 0px 0px -5px;}




.map_wrap {border-bottom:1px solid #ccc; height:580px; overflow:hidden; box-sizing:border-box; margin-top:30px; margin-bottom:1em}
.map_wrap > div {height:100% !important; width:100% !important;}
.map_wrap > div .wrap_map {height:100% !important; width:100% !important;}
.map_p_wrap {display: flex; flex-wrap: wrap; gap:10px 40px;}
.map_p {display:flex; align-items:center; font-size:1.111em; font-weight:700;}
.map_p > strong {align-self:flex-start; display:flex; align-items:center; font-weight:500; min-width:fit-content; margin-right:15px;}
.map_p > strong img {margin-right:10px;}


.e2_project {position: relative; color: #fff; padding-top: min(60px, 6vw); padding-bottom: min(60px, 6vw); background: url(../img/program/04_bg01.jpg) no-repeat center bottom;}
.e2_project:before {content:""; width:100vw; height:100%; background: #006dff; position:absolute; left: 50%; top: 0px; transform: translateX(-50%); z-index: -1;}
.e2_project .txt_a { text-align: center; font-size:1.7777em; line-height:1.4em; font-weight:100;}
.e2_project .box_wrap {display:flex; justify-content: space-between; margin:min(50px, 5vw) 0px; position:relative; gap:20px; border:1px solid var(--sub-key-color); border-radius:6px; padding:min(40px, 5vw)}
.e2_project .box_wrap:after {content: ""; width:1px; height:72%; position:absolute; left: 50%; top: 50%; transform: translateY(-50%); background: var(--sub-key-color); opacity:0.5;}
.e2_project .box_wrap .box {max-width:555px; width: calc(50% - 10px);}
.e2_project .box_wrap .box > dl:not(:first-child) {margin-top:2em}
.e2_project .box_wrap dl {display: flex; align-items: center;}
.e2_project .box_wrap dl dt {display: flex; align-self: flex-start; font-weight:600; min-width:6.2em ; width:6.2em; height:2.16em; border-radius:60px; align-items: center; justify-content: center; color:var(--key-color); background: #fff; padding-top:0.2em}
.e2_project .box_wrap dl dd {flex:1; padding-left:1em;}
.e2_project .box_wrap .dec {color: var(--sub-key-color); margin-top:1em}
.e2_project .box_wrap .bul01 > li:before {background: var(--sub-key-color);}
.e2_project .team_wrap {max-width:572px; margin:0 auto; width:90%; text-align: center;}
.e2_project .team_wrap > h3 {display: inline-flex; padding-top:0.2em; font-size:1.444em; height:2.1em; border-radius:60px; width:7em; background: #fff; color: var(--key-color); align-items: center; justify-content: center;}
.e2_project .team {display: flex; gap:10px; align-items: flex-end; margin-top:2em; height:310px;}
.e2_project .team > li {flex:1; height: 100%;}
.e2_project .team > li > h4 {font-size:1.77em; line-height: 1.3em; font-weight: 600;}
.e2_project .team .bar {display: flex; height:calc(100% - 1.77em); flex-direction: column; justify-content: center; align-items: center; color: #ff7000; font-size:1.333em; line-height:1.4em; background:#333333; border-radius:10px; }
.e2_project .team .bar > strong {font-size:1.333em;}
.e2_project .team > li:nth-child(1) {height:79%;}
.e2_project .team > li:nth-child(3) {height:60%;}

.enter_method {margin:0 auto;} 
.enter_method .info {padding-bottom:min(40px, 4vw); border-bottom:9px solid #000; border-width: min(9px, 1.5vw);}
.enter_method .info > li {display:flex; align-items:center; margin-top:0.7em} 
.enter_method .info .subj {display: flex; align-self: flex-start; font-size: var(--sub-font-size); font-weight:600; min-width:8.5em ; height:2.16em; border-radius:60px; align-items: center; justify-content: center; color:var(--key-color); border:1px solid var(--key-color); background: #fff; padding-top:0.2em; margin-right:10px;}
.enter_method .dec {padding:min(30px, 4vw) 0px; text-align: center; font-size: var(--sub-font-size);}
.enter_method .btn {display: flex; justify-content: space-between; gap:10px;}
.enter_method .btn > li {max-width:320px; flex:1}
.enter_method .btn > li > a {display:flex; color:#fff; padding-top:0.2em; justify-content: center; align-items:center; border-radius:8px; font-weight:500; height:5em; background: var(--key-color);}
.enter_method .btn > li > a img {margin-left:0.5em; margin-top: -0.2em;}





/* 1280px 이상 */
@media screen and (min-width:1199px) {
	.m_gnb {display:none !important;}
     
}



@media screen and (max-width:1640px) {
	.quick_sns {padding-right:0px;}
	
}

/* 1440px 이하 */
@media screen and (max-width:1439px) {
	

	
	#footerW {padding-left:10px; padding-right:10px;}

	
}

/* 1200px 이하 */
@media screen and (max-width:1200px) {
	.w_gnb {display: none;}
	#header h1 {left:50%; transform:translate(-50%, -50%); -wbkit-transform: translate(-50%, -50%);	}
	#header h1 img {height:50px;}
	.in_header {height: 100px;}
	.in_header .all_menu {display: block;}

	.main_visual {flex-direction: column; gap:min(40px, 4vw)}
	.main_visual .movie_banner {width: 100%;}
	.main_visual .movie img {width:100%}
	.main_visual .quick_notice {width: 100%; padding: 0px;}

	

}

/* 980px 이하 */
@media screen and (max-width:979px) {
	:root {
		--font-size:17px;
		--sub-font-size:15px;
	}

	
	.slide_menu_wrap {width:100%; max-width:100%; right:-102%}

	
	.main_movie {flex-direction: column;}
	.main_movie .box {width:100%}
	.main_career > ul > li {width:calc(50% - 12.5px)}
	.login_bt .pop_bt {display: none;}

	.main_quick {right:-200px}

	.lnb_position {transform: none; width:100%;}
	.lnb_position .lnb_title, .lnbs3, .lnb_quick {display:none;}

	#lnb_wrap {position: relative;}
	#lnb_wrap:before {content:""; width:100vw; height:100%; position: absolute; left: 50%; top: 0px; transform: translateX(-50%); background: var(--key-color);}
	#lnb_wrap .lnbs {display:block;}
	#lnb_wrap .lnb {display:flex; margin:0 auto; box-sizing:border-box; position:relative; z-index:9; left:50%; transform:translateX(-50%); transition:all 0.3s;}
	#lnb_wrap .lnb .lnbs { width:50%; max-width:300px; box-sizing:border-box; border-right:1px solid rgba(255, 255, 255, 30%); position:relative;}
	#lnb_wrap .lnb .lnbs .copy_menu { position:absolute; left:0px; top:calc(100% + 0px); top:-webkit-calc(100% + 0px); width:100%; border-left:1px solid #e2e2e2;  border-right:1px solid #e2e2e2;  border-top:1px solid #e2e2e2; display:none; background:#fff; box-shadow: 0px 0px 13px rgba(0, 0, 0, 10%);}
	#lnb_wrap .lnb .lnbs .sub_menu {display:none !important;}

	.lnb_tit, a.lnb_tit {color:#fff; font-size: 16px; padding-left: 20px; line-height: 60px; height: 60px;}
	.lnb ul li a {font-size:15px; display:block; line-height:130%; min-height:30px; height:auto; padding:15px 0px 15px 20px; border-bottom:1px solid #e2e2e2; box-sizing:border-box; text-align:left; border-top:none; font-weight:500;}
	.lnb ul li a:hover {color:var(--key-color);}

	.e2_project .box_wrap {flex-direction: column;}
	.e2_project .box_wrap .box {width: 100%; max-width:none;}
	.e2_project .box_wrap:after {display:none;}
	
}

/* 768 이하 */
@media screen and (max-width:767px) {
	:root {
		--font-size:15px;
		--sub-font-size:14px;
	}


	.pc_view {display:none}
	.mb_view {display:block}
	.main_layer_pop {-webkit-overflow-scrolling:touch; position:fixed; overflow-y:auto; width:100% !important; max-width:100% !important; transform:none !important; -webkit-transform:none !important; left:0 !important; right:0 !important; top:0 !important; bottom:0; z-index:99999; background:rgba(0, 0, 0, 50%); margin:0px !important}
    .main_pop_bottom {padding:10px; font-size:14px;}
    .main_pop_bottom .close {right:10px; top:10px;}
	.main_layer_pop .pop_wrap_in {float:none !important;}
	
	#header h1 img {height:40px}
	.in_header {height:70px;}
	.menu_btn a {width:32px; height:32px; padding:0px; text-indent: -9999999em; border:none;}
	.menu_btn a > span {border-radius:0px;}
	.menu_btn a > span > span {width:100%; height:3px;}
	.menu_btn a > span > span:after {background: #000; top:-10px; height:100%}
	.menu_btn a > span > span:before {background: #000; bottom:-10px; height:100%}

	.m_tit {font-size:min(2em, 8vw);}

	.product_banner {flex-direction: column;}
	.product_banner .m_tit_area {width:100%; min-width: inherit; margin:0px 0px 10px 0px}
	.product_banner .m_tit_area .ico {display:none;}
	.product_banner .swiper {min-width:inherit; max-width:calc(100% + 10px);}
	.product_banner .control_wrap {position: relative; left: auto; bottom: auto; width:100%; margin-top:20px;}
	.product_banner .control {padding:20px 0px; display:none;}
	.product_banner .bt {margin:0px;}

	#footer {padding:30px 0px; background:none;}
	#footer_navi {height:auto;}
	#footer_navi > ul {padding:0px; display:flex; justify-content:center;}	
	#footer > div {width:100%;}
    #footer .addressW {padding:0px 0px 0px 0px; min-height:inherit; background-position:center 20px; text-align:center;}
	#footerW .copy > p {text-align:center;}
	#footerW .copy {text-align:center; }
	#footer .addressW .f_link {display:none;}
	#footer .addressW address .flex {align-items:center}
	#footerW .familySite {position:relative; max-width:250px; margin:0 auto; margin-top:20px; right:auto ;top:auto} 
	#footer .addressW address .flex strong {min-width:inherit}
	#footer_navi .navi > li a {font-size:14px;}
	#footer .go_top {top:-18px;}
  	#footer .addressW {background-position:center 20px; font-size:13px; background-size:auto 40px;}
	#footer .go_top img {width:30px;}
	#footerW .copy {padding:10px 0px;}
	
	

	.over_layerW {position:relative;}
	.over_layerW .table_style1 {width:100%; margin:0px;}
	.over_layerW .table_style1 tbody tr th.tl {word-break: keep-all}
	.over_layerW table td, .over_layerW table th {word-break: keep-all}
    .over_layer {overflow:auto;}
	.over_layer > div {overflow:inherit; min-width:680px;}
	.over_layer::-webkit-scrollbar {width:5px; height:8px; background-color:#eee;}
	.over_layer::-webkit-scrollbar-thumb {background:#666;}
    .over_layerW:after {display:block; content:""; width:10px; height:100%; position:absolute; right:0px; top:0px; background:url(../img/common/bg_shadow.png) repeat-y left top}
    .over_layer > table {min-width:900px;}

	
}






/* 480px 이하 */
@media screen and (max-width:479px) {
	:root {
		--font-size:14px;
		--sub-font-size:13px;
	}

	#header h1 img {height: 30px;}

    .in_header {height:60px;}
	.slide_menu_inner {padding:0px 15px}
	.slide_menu_inner .header {height:80px; background-size:auto 30px ;}
	.slide_menu_inner .header:after {width: calc(100% + 30px);	}
	
    .m_tit {font-size:22px;}
    .m_tit_txt {font-size:15px;}
	.main_visual .quick > li > a:after {width:7.8vw; height:7.8vw}
	.main_visual .quick {flex-direction: column;}
	.main_visual .quick > li > a {height:3.5em;}
	.main_visual .quick > li > a br {display: none;}
	.main_board .list > li > a {height:5.5em;}
	.main_board .list > li > a .new {min-width: 39px; height: 21px;	font-size: 10px;	}
	.product_banner .control .arrow {width:11vw; height:11vw}
	.product_banner .swiper-slide {width:73vw}
	.product_banner .swiper .info {padding:min(30px, 6.25vw) min(40px, 8.25vw)}
	.product_banner .swiper .info::before {right:6vw; top:8vw}
	.product_banner .swiper .img {padding:0px min(30px, 6.25vw) min(30px, 6.25vw) 0px} 

	#footer .addressW {font-size:12px; background-size:auto 34px;}
	#footer_navi .sns > a img {height:34px;}
	#footer_navi .navi > li:not(:first-child):after {height:10px; margin-top:-5px;}
    #footer .addressW address {margin:0px;}
    #footer .addressW address strong {display:block;}
    #footer .addressW address span {padding:2px 5px;}
	#footer_navi .navi > li a {font-size:12px;}
	#footer .addressW address .flex strong {min-width:100%;}
	#footer .addressW address .flex > li {justify-content:center;}
	#footer .go_top > a {width: 55px; height: 55px;}

    .pop_wrap .pop_head .title {text-align:left !important; font-size:20px; padding-left:15px !important; padding:15px 45px 15px 15px;}
    .pop_wrap .pop_head .title br {display:none;}
	.pop_wrap .pop_body {padding:10px}

	#inner_wrap {padding-bottom:50px; padding-top:0px;}

	.lnb_tit, a.lnb_tit {height:50px; line-height:50px; font-size:14px; }
	.lnb ul li a {font-size:13px;}
	.lnb_tit:after {right:10px;}

	.e2_project .txt_a {font-size:1.4em;}
	.e2_project .box_wrap dl {flex-direction: column; align-items: flex-start;}
	.e2_project .box_wrap dl dd {padding:10px 0px 0px 0px;}
	.e2_project .team {height: 220px;}
	.enter_method .info > li {flex-direction: column; align-items: flex-start;} 
	.enter_method .info .subj {margin-bottom:10px;}

}