@charset "utf-8";

/* 공통 */
    .inner {width: 100%; margin: 0 auto; padding: 0 18px; max-width: 1400px;}
    /* 공통 마우스 오버*/
    .hoverUnderline .hoverItem {display: inline; position: relative; text-decoration: none; background-image: linear-gradient(to right, black 50%, transparent 50%); background-size: 210% 1px; background-position: 100% 100%; background-repeat: repeat-x; transition: 0.5s ease-in-out;}
    .hoverUnderline:hover .hoverItem {background-position: 0 100%;}

    /* board*/
    .board {clear: both; text-align: center; margin-bottom: 30px; border-top: 1px solid #000;}
    .board thead th {background:#f7f7f7; padding: 13px 4px 11px 4px; color:#222; letter-spacing: -1px; border-left: 1px solid #dbdbdb;}
    .board tbody th {background:#f7f7f7; padding: 13px 4px 11px 4px; color:#222; letter-spacing: -1px; border: 1px solid #dbdbdb;}
    .board thead th:first-child,
    .board tbody th:first-child {border-left:none;}
    .board td {border: 1px solid #dbdbdb; padding: 8px 10px 8px; text-align: center; word-break: keep-all;}
    .board td:first-child {border-left: none;}
    .board td:last-child {border-right: none;}
    .board td img{max-width: 100%;}
    .board .subject {text-align: left;}
    .board a span {display: inline-block !important; max-width: calc(100% - 50px); line-height: 1; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
    .board tr.boardNotice td {background: #f7f7f7;}

    /* board 머리글 상단 (일반형)*/
    .boardT {border-top: 2px solid #333;}
    .boardT thead th {background: #fff; padding: 18px 2px; border-left: none;}
    .boardT tr {border-bottom: 1px solid #dbdbdb;}
    .boardT td {border: none; padding: 18px 2px; color: #666; font-weight: 400;}

    /* board 갤러리형*/
    .boardGallery ul {display: flex; flex-wrap: wrap; width: calc(100% + 20px); margin-left: -10px;}
    .boardGallery ul li {width: calc(100% / 3 - 20px); margin: 0 10px 20px; position: relative; border-radius: 20px; border: 1px solid #ddd; padding: 10px 10px;}
    .boardGallery ul li .thumb {position: relative; overflow: hidden; width: 100%; height: 0; padding-bottom: 72%; border-radius: 10px; background-color: #f7f7f7;}
    .boardGallery ul li .thumb img {width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: cover;}
    .boardGallery ul li .info {text-align: center; margin-top: 20px;}
    .boardGallery ul li .info .title {font-size: 17px; color: #000; font-weight: 400;}
    .boardGallery ul li .info .date {display: block; font-size: 15px; color: #777; font-weight: 400; margin-top: 10px;}
    .boardGallery ul li > a {display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0;}

    /* board 커스텀*/
    .listtable table th {font-size: 1.05rem !important;}
    .listtable table td {font-size: .9rem !important; font-weight: 400;}
    .listtable table td.td_lg {font-size: 1.03rem !important;}
    .listtable table td a:hover,
    .listtable table td a:focus {color: inherit; text-decoration: none;}

    .boardlist {margin-bottom: 200px; font-weight: 400;}
    .board_view,
    .btnArea .btn {font-weight: 400;}

    .board_info span {font-size: .92rem !important;}
    .board_info .bar {display: inline-block; text-indent: -9999px; background: url("../../images/common/dreamdance/bar.gif") no-repeat center; width: 1px; padding: 0 11px;}

    .prev_box dd.prne_date,
    .next_box dd.prne_date {font-size: .95rem !important;}


    /* 페이징 커스텀*/
    .paginate a:hover,
    .paginate a:active,
    .paginate a:visited,
    .paginate a.on {border: solid 2px #008FBE; color: #008FBE;}


    /* download*/
    .btnDown {overflow: visible; vertical-align: bottom; border: 0; border-radius: 3px; background: #434747; cursor: pointer; display: inline-block; font-size: 1em; color: #fff !important; word-spacing: -1px; text-decoration: none !important;}
    .btnDown *:link,
    .btnAr *:visited,
    .btnAr *:active,
    .btnAr *:hover {color: #fff; text-decoration: none;}
    .btnDown a {overflow: visible; border: 0; display: block; color: #fff; padding: 11px 18px 10px 20px; min-width: 82px;}
    .btnDown a em {display: inline-block; width: 17px; height: 16px; margin-left: 10px; vertical-align: -2px; background: url("../../images/common/dreamdance/btnDown_ico.png") no-repeat 50% 50%;}
    .btnDown a.hoverUnderline .hoverItem {background-image: linear-gradient(to right, white 50%, transparent 50%);}


    /* tab*/
    .tabArea {font-size: 16px; margin-bottom: 0; overflow: hidden;}
    .tabArea ul {overflow: hidden; position: relative; width: 100%; border-radius: 50px; background-color: #f6f5f6; padding: .9rem .9rem;}
    .tabArea li {display: flex; justify-content: center; align-items: center; float: left; text-align: center; width: 33.33%; border: 1px solid #e1e1e1; border-left: 0; height: 55px; border-radius: 50px; margin: 0 10px 0 0; background: #fff;}
    .tabArea li:last-child {margin: 0 0 0 0 !important;}
    .tabArea li:nth-child(n+4) {margin-top: -1px;}
    .tabArea li a {display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; font-size: 1.07rem;}
    .tabArea li.choice,
    .tabArea li:hover {background: #008FBE; border-color: #008FBE !important; position :relative; z-index: 1;}
    .tabArea li.choice a, .tabArea li:hover a {color: #fff;}
    .tabArea li:first-child, .tabArea li:nth-child(3n+1) {border-left: 1px solid #e1e1e1;}
    .tabArea li.mbhi:hover {background: #ffffff; border-color: #e1e1e1 !important; text-indent: -9999px;}
    .tab_contents > div {display: none;}
    .tab_contents > div:first-child {display: block;}
    .tab_contents .subtit {margin-bottom: 20px;}
    .tabArea .tab_m_title {display: none;}

    /* tab type */
    .tabtype1 > ul > li {width: calc(100% / 2 - 5px) !important;}
    .tabtype2 > ul > li {width: 25% !important;}


    /* search 커스텀*/
    .borad_srch input[type="text"] {border: 1px solid #ceced0; font-size: 14px !important;}
    .borad_srch a.btn_srch {padding: 6px 17px 6px !important; font-size: .8rem;}


/* header*/
#header .header {background: transparent;}
#header .header {position: fixed; top: 0; left: 0; right: 0; z-index: 1000; transition: top 0.2s ease-in-out; background-color: transparent;}
#header .header .inner {max-width: 100%; padding: 0 0;}
#header .header .inner .etc {position: relative; display: flex; align-items: center; justify-content: space-between; padding: 18px 18px; margin: 0;}
#header .header .inner .etc h1 a {width: 150px; height: 50px; display: block; transition: filter 0.4s;}
#header .header .inner .etc h1 a img {width: 100%; height: 100%;}
#header .header .inner .etc h1 a.logoHover {display: none;}
#header .header .inner .etc .en {display: none;}
#header .header .inner .etc .allMenuIcon {position: absolute; top: 33px; right: 18px;}
#header .header .inner .gnb {display: none; position: relative; padding: 0 16px; transition: all 0.1s; overflow: hidden; height: auto;}
#header .header .inner .gnb .gnbWrap {display: flex; justify-content: center; align-items: center; gap: 0;}
#header .header .inner .gnb .gnbWrap .depth01 {flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform; display: block; width: fit-content;}


/*메뉴 hover*/
#header .header .inner .gnb .gnbWrap .depth01 > a {position: relative; display: block; padding: 12px 15px; }
#header .header .inner .gnb .gnbWrap .depth01 > a:hover,
#header .header .inner .gnb .gnbWrap .depth01 > a:visited,
#header .header .inner .gnb .gnbWrap .depth01 > a:active {position:relative; transition:0.5s color ease;}
#header .header .inner .gnb .gnbWrap .depth01 > a:after {content: ""; position: absolute;  transition: 0.5s all ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; bottom: -1px; height: 4px; width: 0; background: #008FBE;}
#header .header .inner .gnb .gnbWrap .depth01 > a.sc:after {left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%);}
#header .header .inner .gnb .gnbWrap .depth01 > a.sc:hover:after {width: 100%;}

#header .header.scrollOn {background: var(--Material-bg, rgba(255, 255, 255, 1));  border-bottom: 1px solid var(--Stroke-list, #e9e9e9); transition: 0.25s ease-out; box-shadow: 0 0 10px rgb(0 0 0 / 10%);}
#header .header.headerBg:before {background: var(--Stroke-list, #e9e9e9); content: "";display: block;position: absolute; top: 113px; left: 0; right: 0; height: 1px;}
#header .header.scrollOn .inner .etc h1 a.logo,
#header .header.headerBg .inner .etc h1 a.logo {display: none;}
#header .header.scrollOn .inner .etc h1 a.logoHover,
#header .header.headerBg .inner .etc h1 a.logoHover  {display: block;}
#header .header.scrollOn .inner .gnb .gnbWrap .depth01 > a,
#header .header.headerBg .inner .gnb .gnbWrap .depth01 > a,
#header .header.scrollOn .inner .etc .en a,
#header .header.headerBg .inner .etc .en a {color: #000; font-weight: 600;}
#header .header.scrollOn .inner #menu span, 
#header .header.headerBg .inner #menu span, 
#header .header.scrollOn .inner .etc .en a:after,
#header .header.headerBg .inner .etc .en a:after {background-color: #000;}

#header .allMenu {display: none; padding: 18px 18px; flex-direction: column; align-items: flex-start; gap: 12px; flex-shrink: 0; z-index: -1000; left: 0; top: 0; overflow: auto; position: fixed; white-space: nowrap; width: 100%; -webkit-overflow-scrolling: touch; overflow-x: hidden; opacity: 0; pointer-events: none; transition: opacity 0.4s; background: var(--Material-bg, rgb(0 0 0 / 90%)); -webkit-backdrop-filter: blur(25px); backdrop-filter: blur(25px);}
#header .allMenu {opacity: 1; transition-delay: 0s; visibility: visible; overflow-y: clip; pointer-events: all; z-index: 1000; height: 100vh} 
#header .allMenu .allMenuWrap {display: inline-block; position: relative; vertical-align: middle; white-space: normal; display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; height: calc(100% - 80px); gap: 12px; height: -moz-fit-content; height: fit-content;}
#header .allMenu .allMenuWrap .topinfo {width: 100%; display: flex; justify-content: space-between;}
#header .allMenu .allMenuWrap .topinfo .left h2 a {display: block;}
#header .allMenu .allMenuWrap .topinfo .left h2 a img {width: 150px; height: 50px;}
#header .allMenu .allMenuWrap .topinfo .right {display: flex;width: 50%; justify-content: end; height: 50px; align-items: center; gap: 27px;}

#header .allMenu .allMenuWrap .menuCont {height: 100%; width: 100%; padding: 24px 0 0 0;}
#header .allMenu .allMenuWrap .menuCont .menuList > ul {display: flex; flex-direction: column; gap: 8px;}
#header .allMenu .allMenuWrap .menuCont .menuList > ul > li > a {position: relative; line-height: 1.5;  position: relative; display: block; padding: 10px 0; font-size: 19px; color: #fff; font-weight: 600;}
#header .allMenu .allMenuWrap .menuCont .menuList > ul > li > a:after {content: ''; display: inline-block; position: absolute; top: 14px; right: 0; vertical-align: top; width: 22px; height: 22px; background-image: url("../../images/common/dreamdance/more_icon.png");}
#header .allMenu .allMenuWrap .menuCont .menuList > ul > li.NonMenuDepth02 > a:after {right: -99999999px;}
#header .allMenu .allMenuWrap .menuCont .menuList > ul > li > a.hoverUnderline .hoverItem {background-image: linear-gradient(to right, #ffffff 50%, transparent 50%);} 
#header .allMenu .allMenuWrap .menuCont .menuList > ul > li > ul {display: none;}
#header .allMenu .allMenuWrap .menuCont .menuList > ul > li > ul > li:first-child {margin-top: 6px;}
#header .allMenu .allMenuWrap .menuCont .menuList > ul > li > ul > li a {font-size: 16px; letter-spacing: -0.45px; padding: 0 0 0 12px; color: #fff;}
#header .allMenu .allMenuWrap .menuCont .menuList > ul > li.open > ul {height: auto; padding-bottom: 10px;}
#header .allMenu .allMenuWrap .menuCont .menuList > ul > li.open > ul li {padding: 10px 0;}
#header .allMenu .allMenuWrap .menuCont .menuList > ul > li > ul > li a.hoverUnderline .hoverItem {background-image: linear-gradient(to right, #ffffff 50%, transparent 50%);} 


/* 전체메뉴,모바일메뉴*/
#menu, #menu02 {position: relative; cursor: pointer; width: 20px; height: 18px; display: flex; justify-content: flex-end; }
#menu span, #menu02 span {position: absolute; width: 20px; height: 2px; background-color: #fff; margin: 0 0;}
#menu span:nth-child(1), #menu02 span:nth-child(1) {top: 0;}
#menu span:nth-child(2), #menu02 span:nth-child(2) {top: 7px;}
#menu span:nth-child(3), #menu02 span:nth-child(3) {top: 14px;}
#menu02.on span:nth-child(1) {top: 6px; transform: rotate(135deg); transition: all 0.4s ease-in-out;}
#menu02.on span:nth-child(2) {opacity: 0;}
#menu02.on span:nth-child(3) {top: 6px; transform: rotate(-135deg); transition: all 0.4s ease-in-out;}
#header .gnbBg {overflow: hidden; position: fixed; top: 0; left: 0; width: 100%; height: 400px; opacity: 1; z-index: 20; background: var(--Material-bg, rgba(255, 255, 255, 1)); transition: all 0.4s ease-in-out; border-bottom: 1px solid var(--Stroke-list,  #e9e9e9);}
#header .gnbBg:before {content: ""; display: block; position: absolute; bottom: -10px; right: -2px; width: 228px; height: 253px; background: url("../../images/common/dreamdance/gnb_bg.png") no-repeat 50% 50%; opacity: .4;}


/* footer*/
#footer .footer {border-top: 1px solid #e9e9e9; padding: 40px 0 50px; text-align: center;}
#footer .footer .foterWrap  {display: block;}    
#footer .footer .foterWrap .footerInfo {padding: 30px 20px 0;}
#footer .footer .foterWrap .footerInfo .footerLink {margin-bottom: 25px;}
#footer .footer .foterWrap .footerInfo .footerLink li {display: inline-block;}
#footer .footer .foterWrap .footerInfo .footerLink li:last-child:after {display: none;} 
#footer .footer .foterWrap .footerInfo .footerLink li:after {content: ''; display: inline-block; vertical-align: top; width: 1px; height: 13px; background: #000; margin: 4px 20px 0;}    
#footer .footer .foterWrap .footerInfo .footerLink li a {font-size: 17px; font-weight: 600; color: #000;}
#footer .footer .foterWrap .footerInfo p {font-size: 15px; font-weight: 400; color: #222; padding: 7px 0;}



/* ---------- 반응형 ---------- */  
    /* 1400이상 PC*/
    @media only screen and (min-width: 1400px) {
        /* 공통 */    
        .inner {padding: 0 0 !important;} 
    }

    /* 1280이상 PC*/
    @media only screen and (min-width: 1280px) {
        #header .header .inner .gnb {display: block !important;}
        /* board 갤러리형*/
        .boardGallery ul {width: calc(100% + 32px); margin-left: -16px;}
        .boardGallery ul li {width: calc(100% / 3 - 32px); margin: 0 16px 32px; padding: 20px 20px;}
    }

    /* 1024이상 PC*/
    @media only screen and (min-width: 1024px) {
        /* 공통 */
        .inner {padding: 0 90px }

        /* header*/
        #header .header {height: 114px;}    
        #header .header .inner {padding: 0 50px !important;}
        #header .header .inner .etc {margin: 0; position: relative; z-index: 10; padding: 0;}
        #header .header .inner .etc h1 {position: absolute; top: 21px; left:40px;}
        #header .header .inner .etc h1 a {width: 215px; height: 70px; background-size: 215px auto;}
        #header .header .inner .etc .en {display: block; position: absolute; top: 45px; right: 110px; left: auto; transform: translateX(0);}
        #header .header .inner .etc .en a {position:relative; inline-block; font-size: 20px; font-weight: 400; letter-spacing: 0.4px; color: #fff;}
        #header .header .inner .etc .en a:after {content: ""; display: block; position: absolute; top: 5px; right: -25px; width: 1px; height: 14px; transform: rotate(30deg); background-color: #fff;}
        #header .header .inner .etc .allMenuIcon {top: 44px; right: 40px;}    
        #header .header .inner .gnb {display: none; overflow: visible; padding: 0 0;}                
        #header .header .inner .gnb .gnbWrap .depth01 > a {color:#fff; font-size: 20px; line-height: 100%; letter-spacing: -0.4px; padding: 47px 42px; transition: padding 0.6s;}        
        #header .header .inner .gnb .gnbWrap .depth01.on > a,
        #header .header .inner .gnb .gnbWrap .depth01 > a:hover {color: var(--Gray-2, #0799ca); font-weight: 600;}
        #header .header .inner .gnb .gnbWrap .depth01.on > div {background-color: #fbfbfb; margin-left: 1px;} 
        #header .header .inner .gnb .gnbWrap .depth01 > a:before {content: ""; display: block; border-bottom: 3px solid #000; height: 3px; position: absolute; left: 50%; right: 50%; transform: translateX(-50%); bottom: 0; width: 0; transition: width 0.4s;}
        #header .header .inner .gnb .gnbWrap .depth01 > a span {padding-bottom: 10px;}            
        #header .header .inner .gnb .depth02 {display: none; opacity: 1; visibility: visible; pointer-events: all; transition: all 0.3s ease; position: absolute; top: 114px; left: 0; right: -1px; height: 286px; padding: 17px 0; background: transparent; /*border-right: 1px solid var(--Stroke-list, #e9e9e9);*/}
        #header .header .inner .gnb .depth01:last-child .depth02 {border-right: 0;}        
        #header .header .inner .gnb .depth02 .depth02Wrap {display: flex; gap: 30px;}
        #header .header .inner .gnb .depth02 .depth02Wrap > ul {display: flex; flex-direction: column; gap: 4px; justify-content: center; width: 100%;}
        #header .header .inner .gnb .depth02 .depth02Wrap > ul > li a {display: block; padding: 10px 0; color: var(--Font-dark, #111); font-size: 16px; line-height: 1.25; text-align: center;}        

        /* 전체메뉴*/
        #header .allMenu {padding: 21px 0;}
        #header .allMenu .allMenuWrap {min-height: 800px; overflow: auto; overflow-x: hidden; height: 100vh;}
        #header .allMenu .allMenuWrap .topinfo {padding: 0 90px; align-items: center; display: flex;}
        #header .allMenu .allMenuWrap .topinfo .left {display: block; width: 50%;}
        #header .allMenu .allMenuWrap .topinfo .left h2 {display: block;}
        #header .allMenu .allMenuWrap .topinfo .left h2 a img {width: 215px; height: 70px;}
        #header .allMenu .allMenuWrap .topinfo .left h2 img {width: 215px; filter: brightness(100%);}        
        #header .allMenu .allMenuWrap .topinfo .right {display: flex; width: 50%; justify-content: end; height: 70px; align-items: center; gap: 27px}
        #header .allMenu .allMenuWrap .menuCont {display: flex; justify-content: center; align-items: center; padding: 0 90px 0;}
        #header .allMenu .allMenuWrap .menuCont .menuList {width: 100vw; max-width: 1400px; margin: 0 auto;}
        #header .allMenu .allMenuWrap .menuCont .menuList > ul {gap: 0;}
        #header .allMenu .allMenuWrap .menuCont .menuList > ul > li {align-items: center; gap: 0; flex-wrap: wrap; display: grid; height: -moz-fit-content; height: fit-content; grid-template-columns: 15.7vw auto; padding: 50px 0; align-items: flex-start;}
        #header .allMenu .allMenuWrap .menuCont .menuList > ul > li + li {border-top: 1px solid var(--Stroke-list,  #e9e9e9);}
        #header .allMenu .allMenuWrap .menuCont .menuList > ul > li > a {color: #fff; font-size: 26px; font-weight: 600; letter-spacing: -0.72px; padding: 0;}
        #header .allMenu .allMenuWrap .menuCont .menuList > ul > li > a:after {top: 7px; right: 0; width: 1px; height: 13px; background-color: #fff; margin: 4px 20px 0; transform: rotate3d(1, 1, 1, 45deg);}        
        #header .allMenu .allMenuWrap .menuCont .menuList > ul > li > ul {display: flex; flex-direction: column; gap: 17px; height: 0; padding-bottom: 10px; overflow: hidden; transition: height 0.3s ease-out;}
        #header .allMenu .allMenuWrap .menuCont .menuList > ul > li.NonMenuDepth02 > a:after {right: 0 !important;}
        
        #header .allMenu .allMenuWrap .menuCont .menuList > ul > li > ul {display: grid; grid-template-columns: repeat(4, 0.19fr); height: -moz-fit-content; height: fit-content; flex-wrap: wrap; gap: 21px 30px;}
        #header .allMenu .allMenuWrap .menuCont .menuList > ul > li > ul > li {width: 180px;}
        #header .allMenu .allMenuWrap .menuCont .menuList > ul > li > ul > li:first-child {margin-top: 0;}
        #header .allMenu .allMenuWrap .menuCont .menuList > ul > li > ul > li a {transition: all 0.4s; color: #fff; font-size: 18px; letter-spacing: -0.57px; line-height: 1.6;}

        /* 전체메뉴,모바일메뉴*/
        #menu {height: 23px;}
        #menu span, #menu02 span {height: 3px;margin: 4px 0;}        

        /* footer*/
        #footer .footer {padding: 75px 0 50px; text-align: left;}
        #footer .footer .foterWrap  {position: relative; display: flex; align-items: center; max-width: 100%; padding: 0 90px !important;}    
        #footer .footer .foterWrap .footerInfo {padding: 0 0 0 120px;}
    }

    @media only all and (max-width:1024px) {
        /* tab */
        .tabArea .tab_m_title {display: block; background: #008FBE; height: 50px; border-radius: 25px;}
        .tabArea .tab_m_title a {position: relative; display: block; padding: 12px 10px; color: #fff; text-indent: 12px;}
        .tabArea .tab_m_title a:after {content: ''; position: absolute; right: 15px; top: 50%; margin-top: -1px; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #fff; transform: rotate(0deg);}
        .tabArea .tab_m_title.on a:after {transform: rotate(180deg);}

        .tabArea {font-size: 15px;}
        .tabArea ul {display: none; border-radius: 10px; margin-top: 5px; padding: .9rem .8rem;}
        .tabArea li {width: 100%; border: 0; height: 48px; text-align: left; margin: 0 0 10px 0; justify-content: left; text-indent: 15px;}
        .tabArea li:first-child {border-top: 0; border-left: 0;}
        .tabArea li.choice,
        .tabArea li:hover {background: #008FBE; color: #666;}
        .tabArea li a {display: block; padding: 12px 10px; text-indent: 12px; font-size: 15px;}
        .tabtype1 > ul > li {width: 100% !important;}
    }

    /* 모바일*/
    @media only screen and (max-width: 768px) {
        /* board*/
        .board tbody th,
        .board td {font-size: 0.95rem;}

        /* Mboard*/
        .Mboard,
        .Mboard thead,
        .Mboard tbody,
        .Mboard th,
        .Mboard td,
        .Mboard tr {overflow: hidden; display: block;}
        .Mboard tr {float: left; width: 100%; box-sizing: border-box;}
        .Mboard th,
        .Mboard td {float: left; clear: both; width: 100%; text-align: left; background: transparent !important; border: none !important; padding: 0 10px 5px 10px !important;}
        .board td.title,
        .board td.b_write {padding: 0 10px; max-width: 0; overflow: hidden; text-overflow: initial; white-space: inherit;}
        .Mboard thead tr {position: absolute; top: -9999px; left: -9999px;}
        .Mboard tr {position: relative; border-bottom: 1px solid #e4e7ec; border-top: none; padding: 15px 0;}
        .Mboard tr:first-child {border-top: none;}
        .Mboard tr:nth-child(even) {background-color: #f7f7f7;}
        
        .Mboard tbody td {position: relative; border: none; text-align: left;padding: 0 10px 5px 10px;}
        .Mboard tbody td br{display: none;}
        .memmore {vertical-align: bottom; background-size: 60% !important;}
        .Mboard td.title {padding: 0 10px; color: #000; text-align: left; font-weight: 700;}
        .Mboard td.counsel_name {padding: 0 10px; color: #000;text-align: left; font-weight: bold;}
        .Mboard td.nodata {padding: 0 10px; text-align: center;}
        .Mboard .b_date {padding: 3px 10px 0;}
        .Mboard .b_hit,
        .Mboard .b_file,
        .Mboard .b_none {display: none;}
        .board td.title,
        .board td.b_write{max-width: none; padding: 5px 10px;}
        .board td.title:before {display: inline; content: '핵심가치 : ';}
        .board .subject:before {display: inline; content: '제목 : '; color: #008FBE;}

        /* board 갤러리형*/
        .boardGallery ul {width: calc(100% + 20px); margin-left: -10px;}
        .boardGallery ul li {margin: 0 10px 20px; width: calc(100% /2 - 20px); padding: 15px 15px;}

           /* header*/
        #header .header .inner .etc .allMenuIcon {position: inherit; top: 0; right: 0;}

        /* footer*/
        #footer .footer .foterWrap .footerLogo img {width: 150px;}
        #footer .footer .foterWrap .footerInfo .footerLink li a {font-size: 16px;}
        #footer .footer .foterWrap .footerInfo p {font-weight: 400;}
    }

    @media only screen and (max-width: 640px) {
        /* board 커스텀*/
        .listtable table th,
        .listtable table td,
        .listtable table td.td_lg {font-size: 13px !important;}
    }

    @media only screen and (max-width: 460px) {
        /* board 갤러리형*/
        .boardGallery ul li {width: 100%; padding: 15px 15px;}
    }

    @media only screen and (max-width: 340px) {
        /* 공통 */    
        #wrap {width: 340px;}               
    }





























/* ---------- reset ---------- */
*, *:before, *:after  {-webkit-box-sizing: border-box; -moz-box-sizing: border-box;	box-sizing: border-box;  transition: 0.2s ease-out;}
html {overflow-x: hidden; font-size: 16px; color: #333;}
body {margin: 0; padding: 0; font-size: 1rem; font-weight: 500; font-family: 'Pretendard', sans-serif; letter-spacing: -0.20px; background-color: #fff; color: #222;}
html, div, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin: 0; padding: 0; border: 0}

h1, h2, h3, h4, h5, h6 {font-size: 1em; font-weight: 400;}
ul, li, dt, dd, ol, dl, dd, dt, p {margin: 0; padding:0; list-style:none;}
legend, caption, hr {position: absolute; margin: 0; padding: 0; font-size: 0; line-height: 0; text-indent: -9999em; overflow: hidden;}
label, input, button, select, img {vertical-align: middle;}

input, button {border: 0; margin: 0; padding: 0; font-family: 'Pretendard', sans-serif;}
input[type="image"]{border-radius: 0;}
input[type="submit"]{border-radius: 0; cursor: pointer;}
input[type="text"]{border-radius: 0;}
input[type="password"]{border-radius: 0;}
input[type="checkbox"]{border-radius: 0;}
input[type="reset"]{border-radius: 0;}
input::placeholeder { color:#949494; }
input::-webkit-input-placeholder { color:#949494; }
input:-ms-input-placeholder { color:#949494; }
input:-ms-input-placeholder { color:#949494; }
button { cursor:pointer; background-color: transparent;}

table {border-collapse: collapse; border-spacing: 0; table-layout: fixed; width: 100%;}
textarea, select {overflow: auto; border-radius: 0;}
select {margin: 0; border-radius: 0;}
em, address{font-style: normal;}
form, fieldset, blockquote{margin: 0; padding: 0; border: 0}

/* anchor */
a:link {text-decoration:none;}
a:visited, a:active {text-decoration:none;}
a:hover {text-decoration:none; }

/* skipNav */
#skipNav{position: relative; width: 100%; height: 0; z-index: 10000; }
#skipNav a{display: block; position: absolute; top: -500px; left: 0; font-size: 1px; text-indent: -10000px; overflow: hidden;}
#skipNav a:active, #skipNav a:focus {display: block; position: absolute; top: 0; left: 0; width: 100%; height: 30px; line-height: 28px; background-color: #007da8; border: 1px solid #cecece; font-size: 14px; color: #fff; text-indent: 0; text-align: center;}

/* 말줄임표, 숨김처리 */
.ellipsis {display: inline-block; overflow: hidden; max-width: 95%; vertical-align: middle; text-overflow: ellipsis; white-space: nowrap;}
.ellipsisMulti {width: 95%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; line-height: 1.4em; height: 2.8em;}
.blindtxt {font-size: 1px !important; height: 1px !important; overflow: hidden !important; position: absolute !important; top: -1000px !important; width: 1px !important; color: transparent !important;}
.clear:after {content: ""; display: block; clear: both;}

/* position */
.positionA{position:absolute !important;}
.positionF{position:fixed !important;}
.positionR{position:relative !important;}
.positionS{position:static !important;}

/* align */
.tAC{text-align:center !important;}
.tAL{text-align:left !important;}
.tAR{text-align:right !important;}

.fR{float:right !important;}
.fL{float:left !important;}
.fN{float:none !important;}

.mAuto{margin:0 auto !important;}

.clear{clear:both !important;}

.overH{overflow:hidden !important;}
.overA{overflow:auto !important;}
.overS{overflow:scroll !important;}
.overXh{overflow-x:hidden !important;}
.overYh{overflow-x:hidden !important;}
.overXa{overflow-x:auto !important;}
.overYa{overflow-y:auto !important;}
.overXs{overflow-x:scroll !important;}
.overYs{overflow-y:scroll !important;}

.disInline{ display:inline !important;}
.disBlock{ display:block !important;}
.disIBlock{ display:inline-block !important;}
.disN {display:none !important;}
.disF {display:flex !important;}

/* padding, margin */
.mT0 {margin-top: 0 !important;}
.mT10 {margin-top: 10px !important;}
.mT20 {margin-top: 20px !important;}
.mT30 {margin-top: 30px !important;}
.mT40 {margin-top: 40px !important;}
.mT50 {margin-top: 50px !important;}

.mB0 {margin-bottom: 0 !important;}
.mB10 {margin-bottom: 10px !important;}
.mB20 {margin-bottom: 20px !important;}
.mB30 {margin-bottom: 30px !important;}
.mB40 {margin-bottom: 40px !important;}
.mB50 {margin-bottom: 50px !important;}

.pl05 {padding-left: 5px;}
.pl10 {padding-left: 10px;}
.pl20 {padding-left: 20px;}
.pl30 {padding-left: 30px;}
.pl40 {padding-left: 40px;}
.pl50 {padding-left: 50px;}

.pT0 {padding-top: 0;}
.pT10 {padding-top: 10px;}
.pT20 {padding-top: 20px;}
.pT30 {padding-top: 30px;}
.pT40 {padding-top: 40px;}
.pT50 {padding-top: 50px;}

.pB0 {padding-bottom: 0;}
.pB10 {padding-bottom: 10px;}
.pB20 {padding-bottom: 20px;}
.pB30 {padding-bottom: 30px;}
.pB40 {padding-bottom: 40px;}
.pB50 {padding-bottom: 50px;}