@charset "utf-8";


/*skipLink*/
#skipLink{ overflow:hidden; position:fixed; top: 5px; z-index:999; }
#skipLink a{ width:1px; height:1px; text-align:center; line-height:0; overflow:hidden; font-size:0px; display:block; }
#skipLink a:focus,
#skipLink a:hover,
#skipLink a:active{ background:#b10e29; margin:0px; padding:8px 15px; width:auto; height:30px; color:rgb(255, 255, 255); line-height:1; font-size:12px; font-weight:700; text-decoration: underline; }


:root {
  --inner: 1400px;
  --color-primary: #39a1ff;
  --color-secondary: #37373f;
}


/*main*/
main { position:relative; z-index:1; overflow: hidden; }
main section { position:relative; }

/*usual*/
.inner { width: var(--inner); margin: 0 auto; position: relative; }
.click_box { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.flex_box { display: flex; flex-wrap: wrap; justify-content: space-between; }
.img_box { background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; }
.img_box > img { width: 100%; height: 100%; object-fit: cover; }	
.cc { display: flex; flex-direction: column; justify-content: center; align-items: center; }
.ac { align-items: center }
.as { align-items: flex-start; }
.ae { align-items: flex-end; }
.jcs { justify-content: flex-start; }
.jcc { justify-content: center; }
.jce { justify-content: flex-end; }
.round { padding: 1rem; border-radius: 500px; }
.round20 { padding: 1.25rem 2rem; border-radius: 1.25rem; }
.round15 { padding: 1.25rem 2rem; border-radius: .94rem; }
.round10 { padding: 1.25rem 2rem; border-radius: .625rem; }
.round5 { padding: .8rem; border-radius: .3125rem; }
.round0 { border-radius: 0 !important; }

.gray_bg1 { background: #f5f5f5; }
.gray_bg2 { background: #f7f7f7; }
.gray_bg3 { background: #f9f9f9; }
.gray_bg4 { background: #666; color: #fff; }
.gray_bg5 { background: #f3f4f7; }

.gray_bd1 { border: 1px solid #ddd; }
.gray_box { padding: 1.5rem; background: #f9f9f9; border: 1px solid #e8e8e8; border-radius: 10px; }
.gray_box2 { padding: 2.3rem 3.125rem; background: #f7f7f7; line-height: 1.7; }
.gray_box3 { padding: 1.2rem 2rem; background: #f9f9f9; border-radius: 10px; }
.gray_box4 { padding: 1.5rem 2rem; background: #f7f7f7; border-radius: 10px; }
.gray_box5 { padding: 1rem; background: #f4f4f4; }
.gray_box6 { padding: 1.5rem 2rem; background: #fff; border: 1px solid #ddd; }


.mob_only, .lower640, .lower480 { display: none; }
.hidden { display: none !important; }
.block { display: block; }
.hidden_word { position: absolute; clip: rect(0 0 0 0); width: 1px; height: 1px; margin: -1px; overflow: hidden; color: transparent; }
.flex_box > .half { width: 48.5%; }
.flex_box > .third { width: 31.25%; }
.flex_box > .quarter { width: 23.15%; }
.long { width: 100%; }
.no_click { pointer-events: none; -ms-user-select: none; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; user-select: none; -webkit-user-drag: none; }
.nowrap { white-space: nowrap; }
.ovf_hdn { overflow: hidden; }
.zi99 { z-index: 99; }

.no_bg { background:none !important; }
.no_bl { border-left:none !important; }
.no_bb { border-bottom:none !important; }
.no_bt { border-top:none !important; }
.no_br { border-right:none !important; }
.no_bd { border:none !important; }

.arrow_thick { width: .94rem; height: 1.5rem; background: url('/asset/images/arrow_thick.png') no-repeat 50% 50%; }


/*font*/
.fs36 { font-size: 2.25rem; }
.fs32 { font-size: 2rem; }
.fs30 { font-size: 1.875rem; }
.fs28 { font-size: 1.75rem; }
.fs27 { font-size: 1.6875rem; }
.fs26 { font-size: 1.625rem; }
.fs25 { font-size: 1.5625rem; }
.fs24 { font-size: 1.5rem; }
.fs23 { font-size: 1.4375rem; }
.fs22 { font-size: 1.375rem; }
.fs21 { font-size: 1.3125rem; }
.fs20 { font-size: 1.25rem; }
.fs19 { font-size: 1.1875rem; }
.fs18 { font-size: 1.125rem; }
.fs16 { font-size: 1rem; }
.fs17 { font-size: 1.0625rem; }
.fs15 { font-size: .94rem; }
.fs14 { font-size: .875rem; }
.fs13 { font-size: .81rem; }
.fs12 { font-size: .75rem; }

.nts { font-family: 'NotoSans'; }
.scd { font-family: 'SCoreDream', 'NotoSans'; }
.ptd { font-family: 'Pretendard', 'NotoSans'; }
.gmarket { font-family: 'GmarketSans', 'NotoSans'; }
.fw900 { font-weight: 900; }
.fw800 { font-weight: 800; }
.fw700 { font-weight: 700; }
.fw600 { font-weight: 600; }
.fw500 { font-weight: 500; }
.fw400 { font-weight: 400; }
.fw300 { font-weight: 300; }
.fw200 { font-weight: 200; }
.fw100 { font-weight: 100; }

.accent { font-weight: 500; color: #000; }
.refer { font-weight: 300; color: #999; }
.white { color: #fff !important; }
.red { color: #da1f1f !important; }
.red2 { color: #ed272d !important; }
.green { color: #82bc43 !important; }
.green2 { color: #1d8f25 !important; }
.blue { color: #0068c0 !important; }
.blue2 { color: #488ac3 !important; }
.skyblue { color: #55a5da !important; }
.blue3 { color: #0068c0 !important; }
.yellow { color: #f5a23a !important; }
.brown { color: #897c71; }
.orange { color: #fa8027; }
.pink { color: #0894b5 !important; }
.b_gray { color: #333 !important; }
.gray { color: #666 !important; }
.gray2 { color: #8d8d8d !important; }
.l_gray { color: #bbb !important; }
.c { text-align: center !important; }
.r { text-align: right; }
.underline { text-decoration: underline; text-underline-offset : 7px; }
.lh1 { line-height: 1; }
.lh14 { line-height: 1.4; }
.lh16 { line-height: 1.6; }
.lh17 { line-height: 1.7; }
.ti8 { text-indent: -.5rem; }
.ti16 { text-indent: -1rem; }
.indent14 { text-indent: .875rem }
.indent18 { text-indent: 1.125rem }
.pl8 { padding-left: .5rem; }
.pl16 { padding-left: 1rem; }
.ellip1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ellip2 { clear: both; word-break:break-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }



/*title*/
h3.h3_tit { font-size: 2.25rem; font-weight: 600; color: #222; line-height: 1; letter-spacing: -2px; position: relative; }
h3.deco::after { content: ""; position: absolute; width: 1.5625rem; height: 1.25rem; top: 0; left: -1.8rem; background: url('/asset/images/h3_deco.png') no-repeat 50% 50%; background-size: 100%; }
h4.h4_tit { font-size: 1.875rem; font-weight: 500; line-height: 1; position: relative; }
h4.deco { padding-left: 1.5rem; }
h4.deco::after { content: ""; position: absolute; top: 1rem; transform: translateY(-50%); left: 0; width: .94rem; height: .94rem; border: 4px solid #0291c5; }
h5.h5_tit { font-size: 1.25rem; font-weight: 500; position: relative; }
h5.deco{padding-left:1rem;}
h5.deco::after{content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 4px; height: 1.2rem; background-color:#0291c5;}




/*bg*/
.bg_red { background-color: #ea5413 !important; }
.bg_grn { background-color: #428e4d !important; }
.bg_blue { background-color: #196acf !important; }
.bg_skyblue { background-color: #2ea9ea !important; }
.bg_brown { background-color: #af622f !important; }
.bg_orange { background-color: #fa8027 !important; }
.bg_white { background-color: #fff !important; }
.bg_yel { background-color: #f39210 !important; }



/* 버튼*/
.btn_css { position: relative; line-height: 1; }
.btn_css:hover { opacity: .8; }
.btn_css span { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }

.btn_wrap { display: flex; flex-wrap: wrap; gap: 1.25rem; }
.btn_wrap2 { max-width: 700px; margin: 0 auto; display: flex; justify-content: center; gap: 1.25rem; }
.btn_wrap2 > a { width: calc(50% - 5px); }
.btn_wrap3 { max-width: 360px; margin: 60px auto 0 auto; display: flex; justify-content: center; gap: 1.25rem; }
.btn_wrap4 { display: flex; flex-wrap: wrap; gap: .625rem; }

.btn_style1 { display: inline-block; min-width: 11.25rem; min-height: 3.375rem; padding: .5rem 1.5rem; border-width: 1px; border-style: solid; text-align: center !important; background: #fff; }
.btn_style2 { display: inline-block; min-width: 6.25rem; min-height: 2.25rem; padding: .5rem 1.5rem; border-width: 1px; border-style: solid; border-radius: 5px;  text-align: center !important; background: #fff; }
.btn_style3 { display: inline-block; padding: .7rem 1.5rem .7rem; border-width: 1px; border-style: solid; border-radius: 500px; font-size: .94rem; font-weight: 600; text-align: center; background: #fff; }
.btn_style4 { display: inline-block; min-width: 7.5rem; min-height: 2.1875rem; padding: .5rem 1rem; border-width: 1px; border-style: solid;  font-size: .94rem; text-align: center !important; background: #fff;  }
.btn_style5 { display: inline-block; min-width: 9.125rem; min-height: 2.875rem; padding: .5rem 1rem; border-width: 1px; border-style: solid; border-radius: 500px; font-weight: 500; text-align: center; letter-spacing: 0; background: #fff; }
.btn_style6 { display: inline-block; min-width: 6rem; min-height: 2.5rem; padding: .5rem 1rem; border-width: 1px; border-style: solid;  font-size: .875rem; text-align: center !important; background: #fff;  }
.btn_style7 { display: inline-block; min-width: 6rem; min-height: 2rem; padding: .5rem 1rem; border-width: 1px; border-style: solid; border-radius: 500px; font-weight: 500; text-align: center; letter-spacing: 0; background: #fff; }


.red_fill { background: #e6002d; border-color: #e6002d; color: #fff; }
.red_line { border-color: #e6002d; color: #e6002d; }
.orange_fill { background: #fa8027; border-color: #fa8027; color: #fff; }
.orange_line { border-color: #fa8027; color: #fa8027; }
.brown_fill { background: #897c71; border-color: #897c71; color: #fff; }
.brown_line { border-color: #897c71; color: #897c71; }
.gray_fill { background: #6b6b6b; border-color: #6b6b6b; color: #fff; }
.gray_fill2 { background: #f2f2f2; border-color: #f2f2f2; color: #000; }
.gray_fill3 { background: #eee; border-color: #eee; color: #000; }
.gray_line { border-color: #ababab; color: #929191; }
.gray_line2 { background: #f2f2f2; border-color: #e8e8e8; color: #000; }
.gray_line3 { background: #fff; border-color: #a2a2a2; color: #000; }
.blue_fill { background: #0068c0; border-color: #0068c0; color: #fff; }
.blue_fill_pay { background: #0c81e8; border-color: #0c81e8; color: #fff; }
.blue_line { border-color: #0068c0; color: #0068c0; }
.green_fill { background: #8eb113; border-color: #8eb113; color: #fff; }
.green_line { border-color: #8eb113; color: #8eb113; }
.black_line { border-color: #000; color: #000; }
.black_fill { background: #000; border-color: #000; color: #fff; }
.black_fill2 { background: #2f2f2f; border-color: #2f2f2f; color: #fff; }
.black_fill3 { background: #414141; border-color: #414141; color: #fff; }
.white_fill { background: #fff; border-color: #fff; }              
.white_line { background: none; color: #fff; border-color: #fff; }              
.ghost { border: 0; background: rgba(0, 0, 0, .3); color: #fff; }

.orange_fill:focus,
.orange_line:focus { outline-color: #333 !important; }

.btn_right { display: flex; justify-content: flex-end; gap: .625rem; }
.btn_right img { vertical-align: middle; margin-right: 4px; }

.btn_arrow { position: relative; display: inline-block; padding-left: 1rem; text-align: left !important; }
.btn_arrow span { padding-left: 1rem; justify-content: flex-start !important; }
.btn_arrow::before { content: ""; position: absolute; top: 50%; right: 1rem; width: 7px; height: 7px; border-top: 1px solid #ccc; border-right: 1px solid #ccc; transform: translateY(-52%) rotate(45deg); }
.btn_arrow.black_fill::before { border-color: #fff; }
.btn_arrow.white_fill::before { border-color: #000; }


.btn_style3:hover { background: #333; }
.btn_style3 div { display: flex; width: fit-content; height: 1rem; overflow: hidden; line-height: 1; }

.btn_style3 div span {
  display: block;
  backface-visibility: hidden;
  font-style: normal;
  transition: .6s ease;
  transform: translateY(0) translateZ(0);
  text-shadow: 0 1rem 0 rgba(255, 255, 255, 1);
}
.btn_style3 div span:nth-child(1) {
  transition-delay: 0.05s;
}
.btn_style3 div span:nth-child(2) {
  transition-delay: 0.1s;
}
.btn_style3 div span:nth-child(3) {
  transition-delay: 0.15s;
}
.btn_style3 div span:nth-child(4) {
  transition-delay: 0.2s;
}
.btn_style3 div span:nth-child(5) {
  transition-delay: 0.25s;
}
.btn_style3 div span:nth-child(6) {
  transition-delay: 0.3s;
}
.btn_style3 div span:nth-child(7) {
  transition-delay: 0.35s;
}
.btn_style3 div span:nth-child(8) {
  transition-delay: 0.4s;
}
.btn_style3 div span:nth-child(9) {
  transition-delay: 0.45s;
}
.btn_style3 div span:nth-child(10) {
  transition-delay: 0.5s;
}
.btn_style3 div span:nth-child(11) {
  transition-delay: 0.55s;
}

.btn_style3:hover span {
  transform: translateY(-100%);

}
.btn_style3.reverse {
  --font-shadow: calc(var(--font-size) * -1);
}
.btn_style3.reverse:hover span {
  --m: calc(var(--font-size));
}



/* --------------------------------------------
 * layout
/* ------------------------------------------ */



#header { position: fixed; width:100%; height: 5rem; z-index:2; -webkit-transition: all 0.2s ease-in-out;-moz-transition: all 0.2s ease-in-out;-ms-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out; transition:all 0.2s ease-in-out; }
#header > .header_inner { position: relative; width: calc(100% - 5.625rem); max-width: calc(100% - ((100% - var(--inner)) / 2)); padding: 0 1.5rem 0 3.125rem; height: inherit; display: flex; justify-content: space-between; align-items: center; z-index: 6; }
#header h1.logo { width: 12rem; height: 2.8125rem; position: relative; }
#header h1.logo a { width: inherit; height: inherit; background-repeat: no-repeat; background-position: 50% 50%; background-image: url('/asset/images/logo.png'); background-size: 100%; }
#header .hd_btn { display: inline-block; margin-right: 10px; padding: 2px 10px 0; background: #00c0dd; color: #fff; border-radius: 3px; }

#header.hide_up { transform: translateY(-100%); pointer-events: none; }
.fixed #header { /*box-shadow: 0 0 10px rgba(0, 0, 0, .17);*/ }


#header .header_right { display: flex; gap: .75rem; align-items: center; }
#header .header_right p { color: #fff; line-height: .5; }

#header .menu_btn { width: calc((100% - var(--inner)) / 2); min-width: 5.625rem; height: inherit; background: #fff; position: absolute; right: 0; top: 0; }
#header .menu_btn a { padding: 0 0  0 1.5625rem; gap: 1rem; }

.pc .gnb { z-index: 6; }
/*
.pc .gnb > ul { display: flex; position: relative; }
.pc .gnb > ul > li { position: relative; padding: 0 40px; white-space: nowrap; }
.pc .gnb > ul > li::after{ content: ''; position: absolute; bottom: 0; left: 50%; display: block; background-color: #0c81e8; width: 0; opacity: 0; height: 3px; -webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;-ms-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out; transition:all 0.1s ease-in-out;}
.pc .gnb > ul > li > a{ position: relative; display: block; height: 5rem; line-height: 5rem; font-size: 1.125rem; color: #fff; }
.pc .gnb > ul > li:hover::before{ opacity: 1; width: 100%; margin-left: -50%;}
.pc .gnb > ul > li:hover::after{ width: 60%; margin-left: -30%; opacity: 1;}
.pc .gnb > ul > li:hover > a { color: #0c81e8 !important; }
.pc .gnb > ul > li .depth2 { pointer-events: none; opacity: 0; padding-top: 1.8rem; position: absolute; top: 5.625rem; left: 50%; transform: translateX(-50%); width: 100%; transition: .15s; }
.pc .gnb > ul > li .depth2.on { opacity: 1; pointer-events: auto; z-index: 99; }
.pc .gnb > ul > li .depth2 > li { white-space: wrap; text-align: center; }
.pc .gnb > ul > li .depth2 > li + li { margin-top: .8rem; }
.pc .gnb > ul > li .depth2 > li > a { white-space: wrap; }
.pc .gnb > ul > li .depth2 > li > a:hover { white-space: wrap; color: #0c81e8; }
*/
.pc .gnb > ul { display: flex; position: relative; }
.pc .gnb > ul > li { position: relative; padding: 0 2.5rem; white-space: nowrap; }
.pc .gnb > ul > li::after{ content: ''; position: absolute; bottom: 0; left: 50%; display: block; background-color: #0c81e8; width: 0; opacity: 0; height: 3px; -webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;-ms-transition: all 0.1s ease-in-out;-o-transition: all 0.1s ease-in-out; transition:all 0.1s ease-in-out;}
.pc .gnb > ul > li > a{ position: relative; display: block; height: 5rem; line-height: 5rem; font-size: 1.125rem; font-weight: 400; color: #fff; }
.pc .gnb > ul > li:hover::before{ opacity: 1; width: 100%; margin-left: -50%;}
.pc .gnb > ul > li:hover::after{ width: 60%; margin-left: -30%; opacity: 1;}
.pc .gnb > ul > li:hover > a { color: #0c81e8 !important; }
.pc .gnb > ul > li .depth2 { position: fixed; top: 5rem; left: 0; pointer-events: none; opacity: 0; width: 85vw; padding: 3rem 3rem 3rem 32rem; display: grid; gap: 1.25rem; grid-template-columns: repeat(4, 1fr); transition: .15s; }
.pc .gnb > ul > li .depth2.on { opacity: 1; pointer-events: auto; z-index: 99; }
.pc .gnb > ul > li .depth2 > li { max-width: 300px; height: 3rem; white-space: normal; position: relative; }
.pc .gnb > ul > li .depth2 > li > a { display: flex; align-items: center; position: absolute; width: 100%; height: 100%; padding: 0 .94rem; border: 1px solid #dedede; line-height: 1; z-index: 9; transition: .3s; overflow: hidden; background-repeat: no-repeat; background-position: right 1rem top 50%; }
.pc .gnb > ul > li .depth2 > li:hover > a { background-color: #0c81e8; color: #fff; border-color: #0c81e8; background-image: url('/asset/images/gnb_arrow.png'); }
.pc .gnb > ul > li .depth2 > li > .depth3 { display: none; }
.pc .gnb > ul > li .depth2 .left_tit { position: absolute; top: 0; left: 0; width: 28.875rem; max-width: 462px; height: var(--maxheight); background: linear-gradient(to right, #0c81e8, #53acfb); padding-left: 6.25rem; color: #fff; /*background: url('/asset/images/gnb_left_bg.jpg') no-repeat 50% 50%;*/ }
.pc .gnb > ul > li .depth2 .left_tit::after { content: ""; position: absolute; left: 0; bottom: 0; width: 9.25rem; height: 3.75rem; background: url('/asset/images/gnb_left_deco.png') no-repeat 50% 50%;}
.pc .gnb > ul > li .depth2 .left_tit h3 { position: relative; margin-top: 2.5rem; font-size :2rem; font-weight: 500; }
.pc .gnb > ul > li .depth2 .left_tit h3::after { content: ""; position: absolute; left: 0; top: 110%; width: 4.375rem; height: 2px; background: #fff; }
.pc .gnb > ul > li .depth2 .left_tit .article { margin-top: 2rem; font-weight: 300; }



.depth2 > li > a[target="_blank"]::after,
.depth3 > li > a[target="_blank"]::after { content: ""; display: inline-block; width: .75rem; height: .75rem; margin-left: 5px; background: url('/asset/images/linkout_icon.png') no-repeat 50% 50%; background-size: 100%; }



#header .slide_bg { display: none; position: absolute; top: 100%; left: 0; width: 100%; height: var(--maxheight); background: #fff; z-index: 5; border-top: 1px solid #ddd; box-shadow: 0 6px 10px rgba(102, 102, 102, .05); }

#header .hd-schbx { background-color: #fff; overflow: hidden; position: absolute; left: 0; width: 100%; top: 100%; padding: 3.4375rem 0; border-top: #d0cfd0 1px solid; border-bottom: #d0cfd0 1px solid; display: none;}
#header .hd-schbx * { font-family: 'NotoSans'; line-height: 1; }
#header .hd-schbx > .flex_box { position: relative; z-index: 2; gap: 2.75rem; }
#header .hd-schbx h3.title { font-size: 2.5rem; font-weight: 500; letter-spacing: -2px; }
#header .hd-schbx .right { width: 35rem; }
#header .hd-schbx .search_box { position: relative; width: 35rem; background: #0291c5; border-radius: 50px; }
#header .hd-schbx .search_box .search_input { width: calc(100% - 5.625rem); height: 3.375rem; border: 0; outline: 0; color: #fff; background: none; text-indent: 1rem; }
#header .hd-schbx .search_box .search_input::placeholder { color: rgba(255, 255, 255, .7); }
#header .hd-schbx .search_box .search_btn { width: 19px; position: absolute; right: 2rem; top: 50%; transform: translateY(-50%); }
#header .hd-schbx .keywords { display: flex; flex-wrap: wrap; gap: .625rem; }
#header .hd-schbx .keywords a { display: inline-block; padding: .45rem .625rem; border: 1px solid #ccc; border-radius: 5px; font-size: .81rem; color: #888; }
#header .hd-schbx .deco_circle { position: absolute; z-index: 1; width: 24vw; height: 24vw; border: 6.1vw solid #f8f8f8; border-radius: 50%; }
#header .hd-schbx .deco_circle.one { top: 0; left: 0; transform: translate(-15%, -60%); }
#header .hd-schbx .deco_circle.two { bottom: 0; right: 0; transform: translate(60%, 60%); }


#sidebar { position: fixed; top: 0; right: 0; width: 100%; height: 100vh; min-height: 800px; background: url('/asset/images/sidemenu_bg.jpg'); z-index: 9999; display: none; }
#sidebar .login_wrap { position: absolute; left: 20px; top: 20px; display: flex; gap: 20px; }
#sidebar .login_wrap p { color: #fff; }
#sidebar * { transition: .5s; }
#sidebar .bt-close { width: 5.25rem; height: 5rem; background: #fff; position: absolute; right: 0; top: 0; z-index: 5; }
#sidebar .gnb > ul { margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; }
#sidebar .gnb > ul > li { position: relative; flex: 1; height: 100vh; background: rgba(48, 163, 205, .85); }
#sidebar .gnb > ul > li + li { border-left: 1px solid rgba(255, 255, 255, .2); }
#sidebar .gnb > ul > li > a { display: block; width: 100%; text-align: center; font-size: 2.25rem; padding: .8rem 0; color: #fff; position: absolute; z-index: 2; left: 50%; top: 28vh; transform: translateX(-50%); }
#sidebar .gnb > ul > li > a::after { content: ""; position: absolute; left: 50%; transform: translateX(-50%); top: 110%; width: 3.75rem; height: 2px; background: #fff; }

#sidebar .gnb > ul > li.active > a { color: #30a3cd; }
#sidebar .gnb > ul > li.active > a::after{ transform: rotate(-45deg); }
#sidebar .gnb > ul > li > ul.depth2 { width: 100%; position: absolute; z-index: 2; left: 50%; top: 40vh; transform: translateX(-50%); padding: 1rem 0 2rem; text-align: center; }
#sidebar .gnb > ul > li > ul.depth2  > li > a { position: relative; display: block; width: 100%; margin-top: 1.5rem; font-size: 1.375rem; font-weight: 300; color: #fff; transition: .3s; }
#sidebar .gnb > ul > li > ul.depth2  > li:hover > a { color: #30a3cd; }
#sidebar .gnb > ul > li > ul.depth2 .left_tit { display: none; }
#sidebar .gnb > ul > li.on { background: rgba(0, 0, 0, .8); }

/*
#sidebar { position: fixed; top: 0; right: 0; width: 100%; height: 100vh; background: url('/asset/images/sidemenu_bg.jpg'); z-index: 9999; display: none; }
#sidebar * { transition: .5s; }
#sidebar .bt-close { width: 5.25rem; height: 5rem; background: #fff; position: absolute; right: 0; top: 0; z-index: 5; }
#sidebar .gnb > ul { margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: space-between; }
#sidebar .gnb > ul > li { position: relative; flex: 1; height: 100vh; background: rgba(48, 163, 205, .85); }
#sidebar .gnb > ul > li + li { border-left: 1px solid rgba(255, 255, 255, .2); }
#sidebar .gnb > ul > li > a { display: block; width: 100%; text-align: center; font-size: 2.25rem; padding: .8rem 0; color: #fff; position: absolute; z-index: 2; left: 50%; top: 41.5vh; transform: translateX(-50%); }
#sidebar .gnb > ul > li > a::before { content: ""; position: absolute; left: 50%; transform: translateX(-50%); top: 120%; width: 3.125rem; height: 0.9375rem; background: url('/asset/images/simple_arrow.png') no-repeat 50% 50%; background-size: 100%; }
#sidebar .gnb > ul > li > a::after { opacity: 0; content: ""; position: absolute; left: 50%; transform: translateX(-50%); top: 110%; width: 3.75rem; height: 2px; background: #fff; }
#sidebar .gnb > ul > li.on > a::before { opacity: 0; }
#sidebar .gnb > ul > li.on > a::after { opacity: 1; }
#sidebar .gnb > ul > li.active > a { color: #30a3cd; }
#sidebar .gnb > ul > li.active > a::after{ transform: rotate(-45deg); }
#sidebar .gnb > ul > li > ul.depth2 { width: 100%; position: absolute; z-index: 2; left: 50%; top: 35vh; transform: translateX(-50%); padding: 1rem 0 2rem; text-align: center; visibility: hidden; opacity: 0; }
#sidebar .gnb > ul > li > ul.depth2  > li > a { position: relative; display: block; width: 100%; margin-top: 1.5rem; font-size: 1.375rem; font-weight: 300; color: #fff; transition: .3s; }
#sidebar .gnb > ul > li > ul.depth2  > li:hover > a { color: #30a3cd; }
#sidebar .gnb > ul > li > ul.depth2 .left_tit { display: none; }
#sidebar .gnb > ul > li.on { background: rgba(0, 0, 0, .8); }
#sidebar .gnb > ul > li.on > a { top: 28vh; }
#sidebar .gnb > ul > li.on > ul.depth2 { visibility: visible; opacity: 1; top: 40vh; }
*/



.fixed #header,
.fixed2#header,
.fixed#header { background: #fff !important; border-color: #e9e9e9; }
.fixed #header #gnb > ul > li > a,
.fixed#header #gnb > ul > li > a,
.fixed2#header #gnb > ul > li > a { color: #000; }

.fixed #header .header_top { margin-top: -3rem; }

.fixed #header h1.logo a,
.fixed2#header h1.logo a,
.fixed#header h1.logo a { background-image: url('/asset/images/logo_b.png'); }

.fixed #header .header_right li img,
.fixed2#header .header_right li img,
.fixed#header .header_right li img { -webkit-filter: grayscale(100%) brightness(0); filter: grayscale(100%) brightness(0); }
.fixed #header .header_right p,
.fixed2#header .header_right p,
.fixed#header .header_right p { color: #000; }



#footer { padding: 3rem 0; background-color: #252525; font-size: .875rem; font-weight: 300; color: #fff; }
#footer .inner { position: relative; }
#footer .inner .logo { width: 10rem; }
#footer .inner .right { width: calc(100% - 19.375rem); }
#footer .inner nav { width: 100%; }
#footer .inner .btm { border-top: 1px solid rgba(255, 255, 255, .1); }

#footer .footer_nav li { padding: 0 1.25rem; position: relative; }
#footer .footer_nav li:first-child { padding-left: 0; }
#footer .footer_nav li + li::after { content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 1px; height: .875rem; background: #fff; opacity: .2; }
#footer .footer_nav li a { font-weight: 500; color: #fff; }
#footer .sns { gap: 10px; }

#footer .family_site { position: absolute; bottom: 0; right: 0; }
#footer .family_site > button { position: relative; width: 180px; height: 40px; border-top: 1px solid #fff; border-bottom: 1px solid #fff; text-align: left; color: #fff; text-indent: 5px; }
#footer .family_site > button::after { content: ""; position: absolute; top: 50%; right: 10px; width: 7px; height: 7px; border-top: 1px solid #fff; border-right: 1px solid #fff; transform: /*translateY(-50%)*/rotate(-45deg); }
#footer .family_site > ul { z-index: 20; max-height: 400px; overflow-y: scroll; position: absolute; bottom: 100%; width: 100%; padding: 5px 0; background: #333; display: none; }
#footer .family_site > ul li { padding: 10px 14px; /*background: #fff; border: 1px solid #ccc;*/ border-bottom: 0; }
#footer .family_site > ul li a { color: #fff; clear: both; word-break:break-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  }
#footer .family_site > ul::-webkit-scrollbar { width: 18px; }
#footer .family_site > ul::-webkit-scrollbar-thumb { height: 30%; background: #ccc; border: 6px solid #333; border-radius: 50px; }
#footer .family_site > ul::-webkit-scrollbar-track { background: transparent; border-radius: 5px; }



/*탭*/
.tab_box_wrap > .tab { display: none; position: relative; }
.tab_box_wrap > .tab.active { display: block; }



/* 팝업 */

.popup_scroll {max-height:700px; overflow-x:hidden; overflow-y:auto;}
.pop_main .gray_border { padding: 1rem; }

.pop_header { width: 100%; padding: 10px 30px; display: flex; justify-content: space-between; background: #897c71; color: #fff; }
.pop_header h1 { font-size: 1.3rem; font-weight: 500; }
.pop_header .close { font-size: 1.5rem; color: #fff; }
.pop_main { padding: 20px; }
.pop_main .title_wrap { padding: 25px 0; }
.pop_main .table_data th { padding: 10px 0; }
.pop_main .table_data td { padding: 8px 0; }

table.table_popup { table-layout: fixed; width: 100%; }
table.table_popup tr { border-bottom: 1px solid #dbdbdb; }
table.table_popup th { background: #f5f5f5; text-align: left; padding: 10px 15px; border-right: 1px solid #dbdbdb; }
table.table_popup td { padding: 10px; border-right: 1px solid #dbdbdb; text-align: left; }
table.table_popup td:last-child { border: 0; }
table.table_popup td .small_text { padding-left: 10px; }

/*테이블*/

.table_box { border-top: #000 2px solid; max-height: 800px; overflow: auto; position: relative; }
.table_box thead th { position: sticky; top: 0; }
.table_box tfoot td { position: sticky; bottom: 0; }
.table_line { width: 100%; border-top: #000 2px solid; position: relative; }
.table_line.bw1 { border-width: 1px; }
.table_line_red { border-top: #0c81e8 2px solid; overflow-X: auto; /* margin-top: 20px; */ position:relative;}

.table_box::-webkit-scrollbar { width: 10px; }
.table_box::-webkit-scrollbar-thumb { height: 30%; background: #0894b5; border-radius: 5px; }
.table_box::-webkit-scrollbar-track { background: #f0f0f0; border-radius: 5px; }



/*입력폼(회원가입 등)*/
table.table_write { table-layout: fixed; width: 100%; }
table.table_write tr { border-bottom: 1px solid #dbdbdb; }
table.table_write th { background: #f5f5f5; text-align: left; padding: 10px 20px; border-right: 1px solid #dbdbdb; }
table.table_write td { padding: 10px; border-right: 1px solid #dbdbdb; text-align: left; }
table.table_write td * { font-size: .94rem; }
table.table_write td:last-child { border: 0; }
table.table_write td .small_text { padding-left: 10px; }
table.table_write td input[type="password"],
table.table_write td input[type="email"],
table.table_write td input[type="text"] { width: 100%; max-width: 310px; }
table.table_write td input[type="text"].long_input { max-width: 100%; }

table.table_write td input[type="radio"] + label,
table.table_write td input[type="checkbox"] + label { margin-right: 1.25rem; }
table.table_write td textarea { width: 100%; height: 150px; }

.email_input input[type="text"], #ipt_email, #ipt_email2 { max-width: 10rem !important; }

.pick_day { background: #fff url('/asset/images/cal_icon.png') no-repeat right 15px top 50%; }

/*전화번호*/
.phone_input { width: 100%; max-width: 310px; display: flex; justify-content: space-between; gap: 2%; align-items: center; }
.phone_input > input[type="text"] { flex: 1; }
.phone_input > span { color: #999; line-height: 35px; }

/*사업자번호*/
.business_input { width: 100%; display: inline-block; max-width: 310px; }
.business_input .flex_box { gap: 2%; }
.business_input input[type="text"]:nth-child(1) { width: 25%; }
.business_input input[type="text"]:nth-child(3) { width: 22%; }
.business_input input[type="text"]:nth-child(5) { width: 40%; }
.business_input span { color: #999; line-height: 35px; }

/*사진첨부*/
.pic_upload { display: flex; flex-wrap: wrap; align-items: center; }
.pic_upload .gray_border { width: 150px; height: 180px; padding: 10px; border-radius: 3px; }
.pic_upload .pic_default { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
.pic_upload label { margin-left: 10px; }

/*파일첨부*/
.file_attach .file_list { height: 160px; overflow: auto; margin-top: 7px; border: 1px solid #ddd; border-radius: 3px; padding: 10px; }
.file_attach .file_list .filebox p { width: calc(100% - 20px); font-size: .94rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.file_attach .file_list .filebox p + p { margin-top: 7px; }
.file_attach .file_list .filebox .delete { color: #ff5353; margin-left: 5px; }
.file_attach label { padding: 7px 15px 6px; }



/*컨텐츠페이지 테이블*/
table.table_list { table-layout: fixed; }
table.table_list tr { border-bottom: 1px solid #ddd; }
table.table_list th { text-align: left; padding: 1.5rem 1.25rem; vertical-align: top; }
table.table_list td { text-align: left; padding: 1.5rem 1.25rem; }

table.table_basic { table-layout: fixed; }
table.table_basic tr { border-bottom: 1px solid #ddd; }
table.table_basic th { padding: 1rem; text-align: center; font-size: 1.125rem; border-right: 1px solid #ddd; }
table.table_basic th:last-child { border-right: 0; }
table.table_basic td { padding: .6rem 1.25rem; text-align: left; border-right: 1px solid #ddd; }
table.table_basic td:last-child { border-right: 0; }


/*고객서비스 데이터 검색 컨트롤러*/
.data_search_wrap { margin-top: 40px; padding: 30px; background: #f6f6f6; border-radius: .94rem; }
table.data_search { table-layout: fixed; }
table.data_search th {  }
table.data_search td { padding: 10px; text-align: left; }
table.data_search td select { width: 100%; max-width: 165px; }
.search_day { width: 100%; max-width: 300px; display: flex; justify-content: space-between; align-items: center; }
.search_day > input { width: 45%; }
.search_day > input { background: #fff url('/asset/images/cal_icon2.png') no-repeat right .94rem top 50%; }

.day_btns { padding: 0 30px; }
.day_btns > button { margin: 0 3px; padding: 6px 20px 5px; border-radius: 500px; font-size: .94rem; font-weight: 500; text-align: center; background: #dedede; color: #8d8d8d; }
.day_btns > button.active { background: #464646; color: #fff; }

.data_input { display: flex; gap: 1%; }
.data_input .flex_box { gap: 1%; }
.data_input .flex_box input:nth-child(1) { width: 66%; max-width: 165px; }
.data_input .flex_box input:nth-child(2) { width: 34%; }

.data_input2 { display: flex; gap: 1%; }
.data_input2 .flex_box { gap: 1%; }
.data_input2 .flex_box input:nth-child(1) { width: 48%; max-width: 165px; }
.data_input2 .flex_box input:nth-child(2) { width: 25%; }
.data_input2 .flex_box input:nth-child(3) { width: 25%; }



/*표*/
table.table_data { font-size: .94rem; }
table.table_data tr { border-bottom: 1px solid #ddd; }
table.table_data th { padding: 1rem; background: #f7f7f7; border-right: 1px solid #ddd; font-weight: 500; text-align: center; vertical-align: middle; }
table.table_data th:last-child { border-right: 0; }
table.table_data td { padding: .81rem; text-align: center; border-right: 1px solid #ddd; }
table.table_data td:last-child { border-right: 0; }
table.table_data .slide_table a { position: relative; font-weight: 700; }
table.table_data .slide_table a::after { content: ""; position: absolute; top: 50%; right: -20px; width: 8px; height: 8px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: translate(0, -50%) rotate(45deg); transition: .3s; }
table.table_data .slide_table a.active::after { transform: translate(0, -30%) rotate(-135deg); }
table.table_data .total td { padding: .94rem 20px; background: #e6f6fe; }

table.table_data2 { font-size: .875rem; border-top: 1px solid #000; }
table.table_data2 tr { border-bottom: 1px solid #ddd; }
table.table_data2 th { padding: .5rem; background: #f7f7f7; border-right: 1px solid #ddd; font-weight: 500; text-align: center; vertical-align: middle; }
table.table_data2 th:last-child { border-right: 0; }
table.table_data2 td { padding: .5rem; text-align: center; border-right: 1px solid #ddd; }
table.table_data2 td:last-child { border-right: 0; }
table.table_data2 .slide_table a { position: relative; font-weight: 700; }
table.table_data2 .slide_table a::after { content: ""; position: absolute; top: 50%; right: -20px; width: 8px; height: 8px; border-bottom: 2px solid #000; border-right: 2px solid #000; transform: translate(0, -50%) rotate(45deg); transition: .3s; }
table.table_data2 .slide_table a.active::after { transform: translate(0, -30%) rotate(-135deg); }
table.table_data2 .total td { padding: .94rem 20px; background: #e6f6fe; }

.sort_up { display: block; padding: 0 10px; text-align: right; position: relative; }
.sort_up::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 10px; border: 8px solid red; border-top: 0; border-right: 6px solid transparent; border-left: 6px solid transparent; }
.sort_down { display: block; padding: 0 10px; text-align: right; position: relative; }
.sort_down::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 10px; border: 8px solid blue; border-bottom: 0; border-right: 6px solid transparent; border-left: 6px solid transparent; }

/*리스트 게시판 검색창*/
/*
.search_general { padding: 1.25rem; display: flex; justify-content: center; gap: .8rem; background: #f7f7f7; border-radius: 10px; }
.search_general select { min-width: 140px; height: 45px; border-radius: 10px; }
.search_general input[type="text"] { width: 46%; max-width: calc(100% - 305px); height: 45px; border-radius: 10px; }
.search_general .search_btn { width: 100px; height: 45px; padding: 0 1.2rem; border-radius: 10px; background: #333 url('/asset/images/search_icon.png') no-repeat right 1.2rem top 50%; background-size: 15px; font-size: 1rem; color: #fff; text-align: left; }
.page_go { font-size: .875rem; margin: 2.2rem 0 .5rem; }
*/

.sch_wrap { display: flex; justify-content: space-between; }
.sch_form { display: flex; align-items: center; gap: 0.5rem; }
.sch_wrap .sch_form select, .sch_wrap .sch_form input { height: 2.5rem; }


/*리스트 게시판*/
table.board_list { table-layout: fixed; position: relative; color: #333; }
table.board_list::before { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: #000; }
table.board_list tr { border-bottom: 1px solid #e5e5e5; }
table.board_list th { padding: 1rem 0; background: #f5f5f5; position: relative; font-weight: 600; text-align: center; }
table.board_list td { padding: 1rem; text-align: center; font-size: .94rem; font-weight: 300; white-space: nowrap; }
table.board_list td:last-child { border: 0; }
table.board_list td.title { display: flex; align-items: center; gap: 5px; padding-right: .94rem; text-align: left; }
.sort_i { display: inline-block; width: 5rem; border: 1px solid #0068c0; border-radius: 3px; font-size: 0.8125rem; font-weight: 500; color: #0068c0; text-align: center; }
table.board_list td.title a { max-width: 93%; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* table.board_list td.title img { width: 17px; } */
table.board_list td.title b { color: #eb5d45; }
table.board_list td.date { color: #666; }
table.board_list td .notice { padding: 4px 1.2rem; border-radius: 10px; background: #eb5d45; font-size: .94rem; font-weight: 500; color: #fff; }
table.board_list td .notice_i { display: inline-block; width: 2.875rem;  border-radius: 14px; font-size: 0.9375rem; font-weight: 500; text-align: center; background: #47a957;  color: #fff;  padding: 0.2rem 0; }



table.board_list2 { table-layout: fixed; position: relative; color: #333; }
table.board_list2 tr { border-bottom: 1px solid #ddd; }
table.board_list2 th { padding: .875rem 0; background: #fff; border-right: 1px solid #ddd; position: relative; text-align: center; }
table.board_list2 th:last-child { border: 0; }
table.board_list2 td { padding: .6rem; border-right: 1px solid #ddd; text-align: center; font-weight: 300; white-space: nowrap; }
table.board_list2 td:last-child { border: 0; }
table.board_list2 td.title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
table.board_list2 td .btn_style4 { display: inline-block; margin: 0 auto; padding: .45rem; width: 5rem; font-size: .875rem; }



/*게시판 뷰페이지*/
.board_view .view_title { padding: 2.2rem 2rem; background: #fff; border-top: 2px solid #000; border-bottom: 1px solid #ccc; text-align: center; }
.board_view .view_title h4 { font-size: 1.75rem; font-weight: 500; }
.board_view .view_title h4 > span { display: flex; align-items: center; justify-content: center; gap: .625rem; }
.board_view .view_title ul { margin-top: 0.8rem; display: flex; flex-wrap: wrap; justify-content: center; }
.board_view .view_title li { margin: 3px 0; padding: 0 1rem; position: relative; font-size: .94rem; color: #666; line-height: 1; }
.board_view .view_title li + li { border-left: 1px solid #ddd; }
.board_view .attached_file { padding: 19px 40px 17px; display: flex; border-bottom: 1px dashed #ddd; }
.board_view .attached_file b { margin-right: .94rem; padding-right: .94rem; position: relative; font-weight: 700; }
.board_view .attached_file b::after { content: ""; position: absolute; top: 5px; right: 0; width: 1px; height: 14px; background: #ccc; }
.board_view .attached_file ul { width: calc(100% - 85px); }
.board_view .attached_file ul li + li { margin-top: 5px; }
.board_view .attached_file ul li a { width: fit-content; max-width: 100%; display: flex; align-items: center; }
.board_view .attached_file ul li a span { display: block; max-width: calc(100% - 30px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.board_view .attached_file ul li a img { margin-right: 2px; }
.board_view .view_contents { padding: 40px; border-bottom: 1px solid #ddd; }
.board_view .btn_wrap { padding: .94rem 0; justify-content: flex-end; }
.board_view .article { border-top: 1px solid #dedede; }
.board_view .article li { padding: .94rem 40px; display: flex; align-items: center; border-bottom: 1px solid #dedede; }
.board_view .article li > b { width: 100px; position: relative; }
.board_view .article li > b::after { content: ""; position: absolute; top: 50%; right: 30px; width: 7px; height: 7px; border-top: 2px solid #000; border-right: 2px solid #000; transform: translate(0, -30%) rotate(-45deg); }
.board_view .article li:last-child b::after { transform: translate(0, -80%) rotate(135deg); }
.board_view .article li span { width: calc(100% - 190px); }
.board_view .article li em { width: 100px; font-size: .94rem; font-weight: 300; color: #666; text-align: right; }



/*갤러리형 게시판*/
.photo_list { width:100%; }
.photo_list ul { width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.5rem; position: relative; }
.photo_list ul li { border-bottom: 1px solid #ddd; transition: .3s; position: relative; }
.photo_list ul li:hover { transform: translateY(-2px); }
.photo_list ul li .img_box { height: 205px; overflow: hidden; }	
.photo_list ul li .img_box img { width: 100%; height: 100%; object-fit: cover; }	
.photo_list ul li .descript { height: 8rem; padding: 1.25rem 0; background: #fff; position: relative; }	
.photo_list ul li .descript .title { font-weight: 500; color: #000; word-break:break-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }	
.photo_list ul li .descript .date { position: absolute; left: 0; bottom: 1rem; font-size: .94rem; color: #888; text-align: right; }	
.photo_list ul li .descript .hit { box-sizing: content-box; padding: ; position: absolute; right: 0; bottom: 1rem; font-size: .94rem; color: #888; text-align: right; padding-left: 21px; background: url('/asset/images/hit_icon.png') no-repeat 0 50%; }	



/*그리드형 게시판*/
.box_list { width:100%; }
.box_list ul {width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.box_list ul > li { border: 2px solid #ebebeb; border-radius: 5px; padding: 40px 25px 50px 25px; transition: .3s; position: relative; }
.box_list ul > li:hover { border-color: #0894b5; box-shadow: 0 15px 23px 0 rgb(0 0 0 / 5%); transform: translateY(-2px); }
.box_list ul > li .photo { display: block; height: 240px; background-color: #eee; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; }
.box_list ul > li .title { width: 100%; margin: 20px 0; font-size: 1.1rem; font-weight: 800; color: #1a1a1a; clear:both; word-break:break-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.box_list ul > li .article { font-size: .9rem; word-break:break-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.box_list ul > li .date { font-weight: 800; letter-spacing: -.5px; color: #0894b5; }
.box_list ul > li .notice_ico { position: absolute; top: 40px; right: 25px; }



/*페이징 버튼*/
.pagenate, 
.pagenate > span { display: flex; align-items: center; gap: .625rem; justify-content: center; text-align: center; margin-top: 1.5rem; }
.pagenate > a { display: flex; align-items: center;
    justify-content: center; width: 2.5rem; height: 2.5rem;  }
.pagenate li { display: inline-block; width: 2.5rem; height: 2.5rem; line-height: 2.25rem; border-radius: 5px; font-weight: 500; color: #666; overflow: hidden; }
.pagenate li:not(:has(a)) { display: inline-block;width: 2.5rem; height: 2.5rem; line-height: 2.25rem; background: #0c81e8; border-color: #0c81e8; font-weight: 700; color: #fff; }

.paging a.first{ background: url(../asset/images/btn_first.png) no-repeat center; }
.paging a.prev{ background: url(../asset/images/btn_prev.png) no-repeat center;}
.paging a.next{ background: url(../asset/images/btn_next.png) no-repeat center;}
.paging a.last{ background: url(../asset/images/btn_last.png) no-repeat center;}

.pagenate a.first{ background: url(../asset/images/btn_first.png) no-repeat center; width: 1.5rem; height: 1.0rem;}
.pagenate a.prev{ background: url(../asset/images/btn_prev.png) no-repeat center; width: 1.5rem; height: 1.0rem;}
.pagenate a.next{ background: url(../asset/images/btn_next.png) no-repeat center; width: 1.5rem; height: 1.0rem;}
.pagenate a.last{ background: url(../asset/images/btn_last.png) no-repeat center; width: 1.5rem; height: 1.0rem;}


/*모달*/
.blocker{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:auto;z-index:99998;padding:20px;box-sizing:border-box;background-color:#000;background-color:rgba(0,0,0,0.75);text-align:center}
.blocker:before{content:"";display:inline-block;height:100%;vertical-align:middle;margin-right:-0.05em}
.blocker.behind{background-color:transparent}
.modal{display:none;vertical-align:middle;position:relative;z-index:99999;max-width:480px;box-sizing:border-box;width:90%;background:#fff;padding:15px 30px;-webkit-border-radius:8px;-moz-border-radius:8px;-o-border-radius:8px;-ms-border-radius:8px;border-radius:8px;-webkit-box-shadow:0 0 10px #000;-moz-box-shadow:0 0 10px #000;-o-box-shadow:0 0 10px #000;-ms-box-shadow:0 0 10px #000;box-shadow:0 0 10px #000;text-align:left}
.modal a.close-modal{position:absolute;top:-12.5px;right:-12.5px;display:block;width:30px;height:30px;text-indent:-9999px;background-size:contain;background-repeat:no-repeat;background-position:center center;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==')}
.modal-spinner{display:none;position:fixed;top:50%;left:50%;transform:translateY(-50%) translateX(-50%);padding:12px 16px;border-radius:5px;background-color:#111;height:20px}
.modal-spinner>div{border-radius:100px;background-color:#fff;height:20px;width:2px;margin:0 1px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}
.modal-spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}
.modal-spinner .rect3{-webkit-animation-delay:-1.0s;animation-delay:-1.0s}
.modal-spinner .rect4{-webkit-animation-delay:-0.9s;animation-delay:-0.9s}
@-webkit-keyframes sk-stretchdelay{0%,40%,100%{-webkit-transform:scaleY(0.5)}20%{-webkit-transform:scaleY(1.0)}}
@keyframes sk-stretchdelay{0%,40%,100%{transform:scaleY(0.5);-webkit-transform:scaleY(0.5)}20%{transform:scaleY(1.0);-webkit-transform:scaleY(1.0)}}


/*레이어팝업*/
/* .lay_pop { min-width: 90%; } */



/*슬라이드*/

.slide_list dt.question { position: relative; width: 100%; border-bottom: 1px solid #ccc; }
.slide_list dt.question::after { content: ""; position: absolute; top: 50%; right: 1.25rem; width: .75rem; height: .75rem; border-right: 2px solid #333; border-bottom: 2px solid #333; transform: translate(0 , -50%) rotate(45deg); transition: .3s; }
.slide_list dt.question.on::after { transform: translate(0 , -50%) rotate(-135deg); }
.slide_list dt.question a { display: flex; gap: 1.25rem; padding: 1.25rem; font-size: 1.125rem; font-weight: 500; align-items: center; }
.slide_list dt.question a span { width: 3.625rem; height: 3.625rem; border-radius: 50%; background: #f5f5f5; }
.slide_list dt.question.on a span { background: #0068c0; color: #fff; }
.slide_list dd.answer { padding: 2.5rem; background: #f7f7f7; border-bottom: 1px solid #ccc; }




.quick_right { padding: 8px 13px; position: fixed; top: 55%; transform: translateY(-50%); right: 50px; z-index: 99; border-radius: 500px; background: rgba(201, 201, 201, .2); overflow: hidden; }
.quick_right li { position: relative; width: 5.9375rem; height: 5.9375rem; border-radius: 50%; transition: .3s; }
.quick_right::after { opacity: 0; content: ""; width: 5.9375rem; height: 5.9375rem; position: absolute; top: 50%; left: 100%; transform: translate(-50%, -50%); background: #da513a; border-radius: 50%; transition: .3s; }
.quick_right.move1::after { opacity: 1; left: 50%; top: calc(12.5% + 8px); }
.quick_right.move2::after { opacity: 1; left: 50%; top: 38%; }
.quick_right.move3::after { opacity: 1; left: 50%; top: 62%; }
.quick_right.move4::after { opacity: 1; left: 50%; top: 86%; }
.quick_right li a { transition: .05s; font-size: .94rem; }
.quick_right li a img { margin-bottom: 5px; }
.quick_right li:hover a { color: #fff; }
.quick_right li:hover a img { -webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1); }
.quick_right.on li a { color: #fff; }
.quick_right.on li a img { -webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1); }


/* table_dim */
.responsive-dim {display: none; position: absolute; top: 0; left: 0; width: 100%; bottom: 0;}
.responsive-dim::after{content: ""; position: absolute; top: 0; left: 0;  width: 100%; height: 100%; background: rgba(0,0,0,.3) url(/asset/images/tx_scroll.png) 50% 50% no-repeat;}
@media screen and (max-width:554px){
	.responsive-dim {display:block;}
}


@media screen and (max-width: 1660px) {
	#header .menu_btn a img { display: none; }
	#header .menu_btn a b { font-size: 1rem; }
	
}

@media screen and (max-width: 1500px) {
	.pc .gnb > ul > li { padding: 0 15px; }
	.pc .gnb > ul > li > a { font-size: 1rem; }
	.pc .gnb > ul > li .depth2 { padding: 2rem 2rem 2rem 430px; }
	.pc .gnb > ul > li .depth2 > li > a { font-size: 13px; }
	.pc .gnb > ul > li .depth2 .left_tit { width: 400px; }
	.pc .gnb > ul > li .depth2 .left_tit h3 { font-size: 1.75rem; }

	#header .header_right img { transform: scale(.9); }
	

}

@media screen and (max-width: 1560px){
	:root {
	  --inner: 90%;
	}
	#header .inner { width: 93%; }


	.quick_right { display: none; }
}

@media screen and (max-width: 1280px){
	.pc .gnb > ul > li .depth2 { width: 92vw; padding: 2rem 2rem 2rem 330px; }
	.pc .gnb > ul > li .depth2 .left_tit { width: 300px; padding-left: 40px; }
}

@media screen and (max-width: 1200px) and (min-width: 1024px) {
	.photo_list ul li .img_box  { height: 160px; }
}

@media screen and (max-width: 1080px) {
	#footer { padding: 45px 0; }
	#footer .inner .right { width: calc(100% - 190px); }
	#footer .family_site > button { width: 160px; height:35px; text-indent: 10px; }
	#footer .family_site > ul li { padding: 10px; }
}

@media screen and (max-width: 1024px) {
	.header_right .menu_btn { display: block; }
	.pc .gnb { display: none; }
	

	#sidebar { background-color: rgba(48, 163, 205, .85); }
	#sidebar .gnb > ul { background-color: rgba(48, 163, 205, .85); justify-content: center; align-content: center; height: 100vh; }
	#sidebar .gnb > ul > li { flex: none; width: 100%; height: auto; background: none; }
	#sidebar .gnb > ul > li.on { background: none; }
	#sidebar .gnb > ul > li > a { width: fit-content; margin: 0 auto; position: static; transform: none; font-size: 1.875rem; font-weight: 500; }
	#sidebar .gnb > ul > li > a::after { display: none; }
	#sidebar .gnb > ul > li > ul.depth2 { display: none; position: static; transform: none; }
	#sidebar .gnb > ul > li.active > a, #sidebar .gnb > ul > li > ul.depth2  > li:hover > a { color: #000; }
	
	
	.photo_list ul { grid-template-columns: repeat(3, 1fr); }
	
	#footer { padding: 30px 0; }
	#footer .inner { padding-bottom: 60px; }
	#footer .inner .logo, #footer .inner .right { width: 100%; text-align: center; }
	#footer .inner .logo img { width: 120px; }

	#footer .inner .right nav { margin-top: 20px; flex-direction: column-reverse; align-items: center; gap: 15px; }
	#footer address { width: 100%; }
	#footer .family_site { right: 50%; transform: translateX(50%); }
}


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

	
}

@media screen and (max-width: 980px) and (min-width: 800px) {
	.photo_list ul li .img_box  { height: 160px; }
}


@media screen and (max-width: 800px) {
	.header_right { gap: 15px; }


	.photo_list ul { grid-template-columns: repeat(2, 1fr); }

	.main_pop { width: 95% !important; position: fixed !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%)!important;}
	

}


@media screen and (max-width: 767px) {
	.mob_only { display: block; }
	.pc_only { display: none; }


	.flex_box .half { width: 100%; }
	.flex_box .half + .half { margin-top: 1rem; }
	.flex_box .half .round5 { margin-top: 40px; }



	.search_general { gap: 5px; }
	.search_general select,
	.search_general input[type="text"],
	.search_general .search_btn { height: 35px; border-radius: 5px; }
	.search_general select { min-width: 100px; }
	.search_general input[type="text"] { max-width: calc(100% - 200px); }
	.search_general .search_btn { width: 80px; }
	

	.table_line { overflow-x: auto; }

	table.table_list > colgroup { display: none; }
	table.table_list > tbody > tr { display: flex; flex-wrap: wrap; }
	table.table_list > tbody > tr > td, table.table_list > tbody > tr > th { width: 100%; }
	table.table_list > tbody > tr > th br { display: none; }

	table.table_data { min-width: 500px; }


}


@media screen and (max-width:640px){
	.lower640 { display: block; }
	.higher640 { display: none !important; }
	
	#header > .header_inner { padding: 0 1.5rem; }

	.flex_box > .quarter { width: 48.5%; }
	.flex_box > .quarter:nth-child(n+3) { margin-top: 30px; }


	.header_right .lang > button { font-size: .9rem; padding: 5px 11px }

	h3.h3_tit { font-size: 2rem; text-align: center; }
	h3.h3_tit + p { text-align: center; }
	h4.h4_tit { font-size: 1.5rem; }
	
	.search_general select { min-width: 80px; }
	.search_general input[type="text"] { max-width: 100%; width: calc(100% - 150px); }
	.search_general .search_btn { width: 60px; color: transparent; background-position: 50% 50%; }

	.photo_list ul { gap: 10px; }
	.photo_list ul li .img_box  { height: 160px; }

	.flex_box > .third { width: 100%; }
	.flex_box > .third + .third { margin-top: 10px; }

	.flex_box > .third .round5 { margin-top: 40px; }

	table.board_list colgroup, .board_list thead { display: none; }
	table.board_list tbody tr { padding: 5px 10px 0; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
	table.board_list tbody tr td { height: 30px; line-height: 30px; padding: 0; border: 0; }
	table.board_list tbody tr td.num { width: 35px; text-align: left; }
	table.board_list tbody tr td.notice_type span { padding: 0; border: 0; text-align: right; color: #0c81e8; } 
	table.board_list tbody tr td.title { width: calc(100% - 120px); padding-right: 0; gap: 0; }
	table.board_list tbody tr td.img {width: 78px; }
	table.board_list tbody tr td.writer {width: 60px; }
	table.board_list tbody tr td.date { width: 50%; height: 30px; font-size: .94rem; color: #999; line-height: 25px; text-align: left; }
	table.board_list tbody tr td.hit { width: 50%; height: 30px; font-size: .94rem; color: #999; line-height: 25px; text-align: right; }
	table.board_list tbody tr td.hit::before { content: "조회수 : "; }
	table.board_list td .notice { padding: 1px .7rem; font-size: .8rem; }
	table.board_list tbody tr td.state { font-size: .9rem; }
	.search_result table.board_list tbody tr td.title { width: 100%; }
	.qalist table.board_list tbody tr td.title { width: calc(100% - 108px); padding-right: 0; gap: 0; }
	.nsl table.board_list tbody tr td.num { width: 20px; }
	.nsl table.board_list tbody tr td.gg { width: 60px; height: 22px; line-height: 20px; }
	.nsl table.board_list tbody tr td.title { width: calc(100% - 175px); }

	table.board_list2 colgroup, .board_list2 thead { display: none; }
	table.board_list2 tbody tr { padding: 5px 10px 0; display: flex; flex-wrap: wrap; }
	table.board_list2 tbody tr td { width: 100%; text-align: left; padding: 0; border: 0; }
	table.board_list2 tbody tr td.num,
	table.board_list2 tbody tr td.locate { width: fit-content; margin-right: 5px; }
	table.board_list2 tbody tr td.locate::before { content: "지역 : "; }
	table.board_list2 tbody tr td.title::before { content: "자조모임명 : "; }
	table.board_list2 td:last-child { margin: 10px 0; text-align: right; }

	table.table_write colgroup { display: none; }
	table.table_write tr { display: flex; flex-wrap: wrap; }
	table.table_write th,
	table.table_write td { width: 100%; border: 0; }

	.board_view .view_contents { padding: 20px; }
	.board_view .article li { padding: 1rem 10px; }
	.board_view .article li b { width: 25px; font-size: 0px; }
	.board_view .article li b::after { right: 10px; }
	.board_view .article li span { width: calc(100% - 130px); }

	
	.slide_list > dt a span.round { width: 100px; text-align: center; }
	.slide_list > dt a span.medium { width: calc(100% - 110px);  }
	
	.slide_list > dd { overflow-x: scroll; }
	
	h4.deco::after {top:1.1rem;}
	

	#footer .footer_nav li { width: 50%; }
	#footer .footer_nav li:nth-child(3)::after { display: none; }
	#footer .footer_nav li:nth-child(n+3) { margin-top: 5px; }
}

@media screen and (max-width: 480px) {
	.lower480 { display: block; }
	.higher480 { display: none !important; }
	
	#header, #sidebar .bt-close { height: 4.75rem; }
	#header h1.logo { width: 10rem; }
	#sidebar .inner { width: 100%; }
	
	.header_top nav { width: 100%; }
	.header_top nav ul { justify-content: center; }
	.header_right { gap: 10px; }
	.header_right .btns a { width: 24px; height: 24px; }
	
	.search_general { flex-wrap: wrap; justify-content: flex-start; }
	.search_general input[type="text"] { width: calc(100% - 65px); }

	.photo_list ul li .img_box { height: 140px; }

	.flex_box > .half { width: 100%; }

	.pick_day { flex-wrap: wrap; justify-content: center; }
	.pick_day input { width: 100% !important; }

	.faq_list dt { padding: 15px 50px; }
	.faq_list dt i { left: 20px; font-size: 20px; }
	.faq_list dd { padding: 15px 15px 15px 50px; }
	.faq_list dd i { left: 20px; top: 15px; font-size: 20px; }
	.faq_list dt::after { width: 10px; height: 10px; right: 20px; }


	.data_input .flex_box { justify-content: flex-start; }
	.data_input .flex_box input { flex: 1; }

	
	.board_view .view_title h4 { font-size: 16px; }
	.board_view .attached_file { padding: 15px 20px; }
	.board_view .btn_style { font-size: .8rem; padding: 5px 10px; }


	table.table_basic td { padding: 6px 5px; }

	.fs15 { font-size: 13px; }
	.fs14 { font-size: 12px; }

	#footer .footer_nav li { width: 100%; padding: 0; }
	#footer .footer_nav li::after { display: none; }
	#footer .footer_nav li:nth-child(n+2) { margin-top: 5px; }
}


@media screen and (max-width: 360px) {
	.flex_box > .quarter { width: 100%; }
	.flex_box > .quarter:nth-child(n+1) { margin-top: 30px; }

	.table_line { overflow: auto; }

	.search_general select,
	.search_general input[type="text"],
	.search_general .search_btn { height: 30px; }

	.search_general select { min-width: 70px; }
	.search_general input[type="text"] { width: calc(100% - 45px); }
	.search_general .search_btn { width: 40px; }

	.photo_list ul li .img_box { height: 100px; }
	.photo_list ul li .descript { padding: .5rem;  height: 6rem; }
	.photo_list ul li .descript .title { font-size: .85rem; }
	.photo_list ul li .descript .date, .photo_list ul li .descript .hit { font-size: .78rem; }
	

	.board_view .article li span { width: calc(100% - 30px); }
	.board_view .article li em { display: none; }


}
@media screen and (min-width:768px) {
	#secondTable{
		margin-top: -58px;
	}
}