@charset "utf-8";


.index_wrap { min-width: 1200px; }

/*main*/
main { position:relative; min-width: 1200px; overflow: hidden; z-index:1; padding-top: 9.9rem; }
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 { 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_bg { background: #f7f7f7; }
.gray_bg2 { background: #f9f9f9; }
.gray_bg3 { background: #f8f8f8; }
.gray_bg4 { background: #666; color: #fff; }
.gray_border { border: 1px solid #dedede; }
.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; }


.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('../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; }


.primary { color: var(--color_primary) !important; }
.white { color: #fff !important; }
.red { color: var(--color_red) !important; }
.red2 { color: var(--color_red2) !important; }
.blue { color: var(--color_blue) !important; }
.blue2 { color: var(--color_blue2) !important; }
.green { color: var(--color_green) !important; }
.green2 { color: var(--color_green2) !important; }
.skyblue { color: var(--color_skyblue) !important; }
.yellow { color: var(--color_yellow) !important; }
.brown { color: var(--color_brown); }
.orange { color: var(--color_orange); }
.pink { color: var(--color_pink) !important; }
.b_gray { color: var(--color_b_gray) !important; }
.gray { color: var(--color_gray) !important; }
.l_gray { color: var(--color_l_gray) !important; }
.w_gray { color: var(--color_w_gray) !important; }

.c { text-align: center !important; }
.r { text-align: right; }
.underline { text-decoration: underline; text-underline-offset : 7px; }
.lh1 { line-height: 1; }
.lh12 { line-height: 1.2; }
.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('../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 var(--color_primary); }
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: var(--color_primary);}



/*li style*/
ul.ul_disc > li { position: relative; padding: 0 1rem; }
ul.ul_disc > li::before { content:""; position: absolute; top: .625rem; left: 0; width: 4px; height: 4px; background: var(--color_primary); border-radius: 10px; }
ul.white > li::before { background: #fff; }

ul.ul_trgl > li { position: relative; padding: 0 1.125rem; }
ul.ul_trgl > li::before { content:""; position: absolute; top: .5rem; left: 0; width: 0; height: 0; border-left: var(--color_primary) 8px solid; border-top: transparent 4px solid; border-bottom: transparent 4px solid; border-top: transparent 4px solid; }
ul.ul_trgl > li + li { margin-top: .3rem; }

ul.ul_roundbox > li { margin-bottom: 5px; padding: 1.5rem; padding-right: 3rem; background: #f7f7f7; border-radius: 500px; display: flex; gap: 3.2rem; align-items: center; }

ol.ol_num > li { counter-increment: inst; padding-left: 2rem; position: relative; }
ol.ol_num > li::before { content: counter(inst); position: absolute; top: 2px; left: 0; text-align: center; display: flex; justify-content: center; align-items: center; width: 1.25rem; height: 1.25rem; background: #888; border-radius: 50%; font-size: .9rem; color: #fff; }
ol.ol_num > li + li { margin-top: .625rem; }

ol.ol_num2 > li { counter-increment: inst2; padding-left: 2.8rem; position: relative; }
ol.ol_num2 > li::before { content: counter(inst2, decimal-leading-zero); position: absolute; top: -.2rem; left: 0; text-align: center; display: flex; justify-content: center; align-items: center; width: 2rem; height: 2rem; background: #897c71; border-radius: 50%; font-size: .9rem; font-weight: 500; color: #fff; }
ol.ol_num2 > li + li { margin-top: 1rem; }

ol.ol_num3 > li { counter-increment: inst3; position: relative; }
ol.ol_num3 > li::before { content: counter(inst3) "."; }
ol.ol_num3 > li + li { margin-top: .2rem; }

ol.num_box > li { counter-increment: inst4; padding: 2.65rem 3.4rem; position: relative; background: #f9f9f9; }
ol.num_box > li::before { content: counter(inst4, decimal-leading-zero); position: absolute; top: 2.5rem; left: 0; text-align: center; width: 2.5rem; height: 2rem; line-height: 2rem; background: #eb5d45; border-radius: 0 10px 10px 0; font-size: 1.0625rem; font-weight: 500; color: #fff; }
ol.num_box > li + li { margin-top: 5px; }

dl.exp_box { position: relative; overflow: hidden; padding-top: 3.5rem; }
dl.exp_box > dt { width: 100%; position: absolute; top: 0; left: 0; padding: 1rem 1.5rem; border: 1px solid #ccc; border-bottom: 0; border-radius: 10px 10px 0 0; font-weight: 500; }
dl.exp_box > dd { padding: 1.5rem; height: 100%; border: 1px solid #ccc; border-top: 0; border-radius: 0 0 10px 10px }
dl.exp_box > dd.gray_bg {  }



/*bg*/
.bg_red { background-color: var(--color_red) !important; }
.bg_grn { background-color: var(--color_green) !important; }
.bg_blue { background-color: var(--color_blue) !important; }
.bg_brown { background-color: var(--color_brown) !important; }
.bg_orange { background-color: var(--color_orange) !important; }
.bg_white { background-color: #fff !important; }
.bg_yel { background-color: var(--color_yellow) !important; }



/*btns*/

.btn_css { display: inline-block; position: relative; border-width: 1px; border-style: solid; text-align: center; background: #fff; }
.btn_css:hover { opacity: .8; }
.btn_css span { line-height: 1; 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 { min-width: 11.25rem; min-height: 3.375rem; padding: .5rem 1.5rem; }
.btn_style2 { min-width: 6.25rem; min-height: 2.25rem; padding: .5rem 1.5rem; border-radius: 5px; }
.btn_style3 { min-width: 6.25rem; min-height: 2.25rem; padding: .5rem 1.5rem; border-radius: 500px; font-size: .94rem; font-weight: 500; }
.btn_style4 { min-width: 7.5rem; min-height: 2.1875rem; padding: .5rem 1rem;  font-size: .94rem; }
.btn_style5 { min-width: 9.125rem; min-height: 2.875rem; padding: .5rem 1rem; border-radius: 500px; font-weight: 500; letter-spacing: 0; }
.btn_style6 { min-width: 6rem; min-height: 2.5rem; padding: .5rem 1rem;  font-size: .875rem; }
.btn_style7 { min-width: 6rem; min-height: 2rem; padding: .5rem 1rem; border-radius: 500px; font-weight: 500; letter-spacing: 0; }
.btn_style8 { min-width: 6rem; min-height: 2rem; padding: .3rem .8rem; border-radius: 5px; font-weight: 500; letter-spacing: 0; }
.btn_hover_eff { padding: .7rem 1.5rem .7rem; ; border-radius: 500px; font-size: .94rem; font-weight: 600; }


.bg_gradient {
	border: none !important;
	color: #fff !important;
    background: linear-gradient(-45deg,#0023b4,#44dddd,#8c8cfe,#ff7e81,#ff9628); /* #ee7752,#39a1ff,#23a6d5,#23d5ab */
    background-size: 1000% auto;
	animation: gradient 5s ease infinite;
}

.primary_fill { background: var(--color_primary) !important; border-color: var(--color_primary) !important; color: #fff; }
.primary_line { border-color: var(--color_primary) !important; color: var(--color_primary) !important; }

.red_fill { background: var(--color_red); border-color: var(--color_red); color: #fff; }
.red_line { border-color: var(--color_red); color: var(--color_red); }
.orange_fill { background: var(--color_orange); border-color: var(--color_orange); color: #fff; }
.orange_line { border-color: var(--color_orange); color: var(--color_orange); }
.brown_fill { background: var(--color_brown); border-color: var(--color_brown); color: #fff; }
.brown_line { border-color: var(--color_brown); color: var(--color_brown); }
.gray_fill { background: var(--color_gray); border-color: var(--color_gray); color: #fff; }
.gray_line { border-color: var(--color_gray); color: var(--color_gray); }
.gray_fill2 { background: var(--color_w_gray); border-color: var(--color_w_gray); color: #000; }
.gray_line2 { background: var(--color_w_gray); border-color: var(--color_w_gray); color: #000; }
.gray_line3 { background: #fff; border-color: a2a2a2; color: #000; }
.blue_fill { background: var(--color_blue) !important; border-color: var(--color_blue) !important; color: #fff; }
.blue_line { border-color: var(--color_blue) !important; color: var(--color_blue) !important; }
.skyblue_fill { background: var(--color_skyblue) !important; border-color: var(--color_skyblue) !important; color: #fff; }
.skyblue_line { border-color: var(--color_skyblue) !important; color: var(--color_skyblue) !important; }
.green_fill { background: var(--color_green); border-color: var(--color_green); color: #fff; }
.green_line { border-color: var(--color_green); color: var(--color_green); }
.black_line { border-color: #000; color: #000; }
.black_fill { background: #000; border-color: #000; color: #fff; }
.white_line { background: none; border-color: #fff; 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.primary_fill::before { border-color: #fff; }
.btn_arrow.black_fill::before { border-color: #fff; }
.btn_arrow.white_fill::before { border-color: #000; }
.btn_arrow.primary_line::before { border-color: var(--color_primary); }

.btn_hover_eff:hover { background: #333; }
.btn_hover_eff div { display: flex; width: fit-content; height: 1rem; overflow: hidden; line-height: 1; }

.btn_hover_eff 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_hover_eff div span:nth-child(1) {
  transition-delay: 0.05s;
}
.btn_hover_eff div span:nth-child(2) {
  transition-delay: 0.1s;
}
.btn_hover_eff div span:nth-child(3) {
  transition-delay: 0.15s;
}
.btn_hover_eff div span:nth-child(4) {
  transition-delay: 0.2s;
}
.btn_hover_eff div span:nth-child(5) {
  transition-delay: 0.25s;
}
.btn_hover_eff div span:nth-child(6) {
  transition-delay: 0.3s;
}
.btn_hover_eff div span:nth-child(7) {
  transition-delay: 0.35s;
}
.btn_hover_eff div span:nth-child(8) {
  transition-delay: 0.4s;
}
.btn_hover_eff div span:nth-child(9) {
  transition-delay: 0.45s;
}
.btn_hover_eff div span:nth-child(10) {
  transition-delay: 0.5s;
}
.btn_hover_eff div span:nth-child(11) {
  transition-delay: 0.55s;
}

.btn_hover_eff:hover span {
  transform: translateY(-100%);

}
.btn_hover_eff.reverse {
  --font-shadow: calc(var(--font-size) * -1);
}
.btn_hover_eff.reverse:hover span {
  --m: calc(var(--font-size));
}



/* --------------------------------------------
 * layout
/* ------------------------------------------ */



.global_tab { width:100%; height:2.2rem; background: var(--color_primary); text-align:center; }
.global_tab ul li{ width:auto; height:2.2rem; line-height: 2.2rem;}
.global_tab ul li a { display:block; height:2.2rem; line-height:2.2rem; padding: 0 1rem; font-size: .875rem; color:#fff;}
.global_tab ul li a:hover,
.global_tab ul li.active a {background: var(--color_yellow); color:#000;}
.global_tab ul li.active a:hover {background:#f0be00;}


#header { position: fixed; left: 0; top: 0; width:100%; background: #fff; border-bottom: 1px solid #e9e9e9; 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 .hd_top { border-bottom: 1px solid #e9e9e9; font-size: .875rem; }
#header .hd_top .inner { height: 4.8rem; }
#header .hd_top ul li { height: 2.25rem; line-height: 2.25rem; }
#header .hd_top ul li + li { margin-left: 10px; }
#header .hd_top a { color: #767676; }

#header .hd_btm .inner { height: 2.8rem; }
#header h1.logo { position: relative; }
#header h1.logo a { line-height: 0; vertical-align: middle; }
#header h1.logo a img { height: 2.4rem; }

#header .hd_btn { display: inline-block; margin-right: 10px; padding: 2px 10px 0; background: #00c0dd; color: #fff; border-radius: 3px; }

#header .bt-mn { flex-direction: column; gap: 4px; width: 2.8rem; height: 100%; border-left: 1px solid #e9e9e9; border-right: 1px solid #e9e9e9; }
#header .bt-mn i { width: 50%; height: 2px; background: #000; }


#header.hide_up { margin-top: calc(-7rem - 1px); }





.pc .gnb { width: calc(100% - 2.8rem); height: inherit; }
.pc .gnb > ul { height: inherit; display: flex; justify-content: space-between; position: relative; padding-right: 10%; }
.pc .gnb > ul > li { display: flex; justify-content: center; height: inherit; position: relative; white-space: nowrap; }
.pc .gnb > ul > li > a { position: relative; height: 100%; display: flex; align-items: center; font-size: 1.125rem; transition: none; }
.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: var(--color_primary); font-weight: 500; }
.pc .gnb > ul > li .depth2 { display: none; position: absolute; left: 50%; transform: translateX(-50%); top: 100%; text-align: center; padding: 1.25rem 1.5rem; background: #fff; border: 1px solid #ddd; border-radius: 10px; }
.pc .gnb > ul > li .depth2.on { display: block; }
.pc .gnb > ul > li .depth2 li + li { margin-top: .6rem; }




/*
.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('../images/linkout_icon.png') no-repeat 50% 50%; background-size: 100%; }
*/


#header .slide_bg { display: none; position: absolute; top: 91px; left: 0; width: 100%; height: calc(var(--wholeheight) + 50px); background: #fff; z-index: 5; box-shadow: 0 6px 10px rgba(102, 102, 102, .05); }


#sidebar { position: fixed; top: 0; right: 0; width: 100%; z-index: 99; display: none; background-color: rgba(0, 0, 0, .9); }
#sidebar .inner{ width: 90%; max-width: 1200px; height: 100vh; overflow-y: auto; }

#sidebar .inner .hd .bt-close{ width: 4rem; height: 4rem; display: block; position: absolute; top: 30px; right: 0; margin-top: -2rem; overflow: hidden;}
#sidebar .inner .hd .bt-close span{ position: absolute; top: -9999px; left: -9999px;}
#sidebar .inner .hd .bt-close::before{ content: ''; display: block; width: 2rem; height: 1px; background-color: #fff; position: absolute; top: 50%; left: 50%; margin: 0 0 0 -1rem; transform: rotate(45deg);}
#sidebar .inner .hd .bt-close::after{ content: ''; display: block; width: 2rem; height: 1px; background-color: #fff; position: absolute; top: 50%; left: 50%; margin: 0 0 0 -1rem; transform: rotate(-45deg);}

#sidebar .gnb { padding-top: 3rem; }
#sidebar .gnb * { color: #fff; }
#sidebar .gnb > ul { margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 1.25rem; }
#sidebar .gnb > ul > li { width: 23%; }
#sidebar .gnb > ul > li > a { position: relative; display: block; font-size: 1.25rem; padding: .8rem 0; border-bottom:  1px solid; font-weight: 500;background-repeat: no-repeat; background-position: 0 50%; }
#sidebar .gnb > ul > li > a::after { content: ""; position: absolute; top: 50%; right: 1rem; width: .8rem; height: .8rem; border-right: 2px solid #666; border-bottom: 2px solid #666; transform: translate(50%, -50%) rotate(45deg); }
#sidebar .gnb > ul > li.on > a::after { transform: translate(50%, -50%) rotate(225deg); }
#sidebar .gnb > ul > li.active > a { color: #069cc6;}
#sidebar .gnb > ul > li.active > a::after{ transform: rotate(-45deg);}
#sidebar .gnb > ul > li > ul.depth2 { padding: 1rem 0 2rem; }
#sidebar .gnb > ul > li > ul.depth2  > li > a{ display: block; border-bottom: 1px solid rgba(255, 255, 255, .3); font-size: 1rem; padding: .7rem 0; position: relative; }
#sidebar .gnb > ul > li > ul.depth2 .left_tit { display: none; }




.fixed #header #gnb > ul > li > a,
.fixed#header #gnb > ul > li > a { color: #000; font-weight: 500; }

.fixed #header .header_right a span,
.fixed#header .header_right a span { color: #000; font-weight: 300; }

.fixed #header .header_right .header_login .split,
.fixed#header .header_right .header_login .split { background: #000; }

.fixed #header .header_right .lang,
.fixed#header .header_right .lang { border: 1px solid #ccc; margin: -1px; }

.fixed #header .header_right .search_toggle img,
.fixed#header .header_right .search_toggle img { filter: brightness(0); }

.fixed #header .bt-mn > i,
.fixed#header .bt-mn > i { background-color: #000; }


#footer { background-color: #fff; border-top: 1px solid #ddd; font-weight: 300; }
#footer .inner { padding: 0; }
#footer .top { border-bottom: 1px solid #ddd; }
#footer .top .inner { height: 5rem; }
#footer .top .inner2 { height: 5rem; }
#footer .btm { padding: 2.5rem 0 2.5rem 16.875rem; background: url('../images/footer_logo_.svg') no-repeat 0 50%; background-size: 12rem; }

#footer address { font-size: .875rem; }
#footer address ul li { margin-right: 1rem; line-height: 1.7; }

#footer .right { display: flex; flex-direction: column; align-items: flex-end; }
#footer .family_site { position: relative; width: 180px; }
#footer .family_site > button { position: relative; width: 180px; height: 40px; background: #fff url('../images/arrow_down2.png') no-repeat right 1rem top 50%; border: 1px solid #666; border-radius: 5px; font-size: 1rem; padding: 0 1rem; text-align: left; color: #333; 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; }


#footer li.BankInfo > div { width:350px;overflow:hidden; border:1px solid #e7edee; margin:0 20px; background:url(../images/main/img_link.png) no-repeat right #fafbfb; }
#footer li.BankInfo > div > img { float:left; padding:11px; border-right:1px solid #d3dadb; background:#fff; }
#footer li.BankInfo > div > h1, #main_contents li.BankInfo > div > p { margin:0; padding:0 10px 0 64px; line-height:18px; }
#footer li.BankInfo > div > h1 { margin-top:6px; font-size:13px; color:#343434; }
#footer li.BankInfo > div > p { margin-bottom:6px; color:#565656; }
#footer li.BankInfo > div + div { margin-top:5px; }


#footer2 { background-color: #fff; border-top: 1px solid #ddd; font-weight: 300; }
#footer2 .inner { padding: 0; }
#footer2 .top { border-bottom: 1px solid #ddd; }
#footer2 .top .inner { height: 5rem; }
#footer2 .top .inner2 { height: 5rem; }
#footer2 .btm { padding: 2.5rem 0 2.5rem }

#footer2 address { font-size: .875rem; }
#footer2 address ul li { margin-right: 1rem; line-height: 1.7; }

#footer2 .right { display: flex; flex-direction: column; align-items: flex-end; }
#footer2 .family_site { position: relative; width: 180px; }
#footer2 .family_site > button { position: relative; width: 180px; height: 40px; background: #fff url('../images/arrow_down2.png') no-repeat right 1rem top 50%; border: 1px solid #666; border-radius: 5px; font-size: 1rem; padding: 0 1rem; text-align: left; color: #333; text-indent: 5px; }
#footer2 .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); }
#footer2 .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; }
#footer2 .family_site > ul li { padding: 10px 14px; /*background: #fff; border: 1px solid #ccc;*/ border-bottom: 0; }
#footer2 .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;  }

#footer2 .family_site > ul::-webkit-scrollbar { width: 18px; }
#footer2 .family_site > ul::-webkit-scrollbar-thumb { height: 30%; background: #ccc; border: 6px solid #333; border-radius: 50px; }
#footer2 .family_site > ul::-webkit-scrollbar-track { background: transparent; border-radius: 5px; }


#footer2 li.BankInfo > div { width:350px;overflow:hidden; border:1px solid #e7edee; margin:0 20px; background:url(../images/main/img_link.png) no-repeat right #fafbfb; }
#footer2 li.BankInfo > div > img { float:left; padding:11px; border-right:1px solid #d3dadb; background:#fff; }
#footer2 li.BankInfo > div > h1, #main_contents li.BankInfo > div > p { margin:0; padding:0 10px 0 64px; line-height:18px; }
#footer2 li.BankInfo > div > h1 { margin-top:6px; font-size:13px; color:#343434; }
#footer2 li.BankInfo > div > p { margin-bottom:6px; color:#565656; }
#footer2 li.BankInfo > div + div { margin-top:5px; }


#tocplusWindow { background-color: var(--color_primary); border-radius: 50%; }
#tocplusWindow #TpTbw > img { max-width: 2.5rem; margin: 1rem; }

/*탭*/
.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: #b10e29 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; }

.pick_day { background: #fff url('../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('../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%; }



/*로그인*/
.login_box { width: 100%; max-width: 850px; margin: 50px auto; display: flex; overflow: hidden; }
.login_box .left { width: 45%; max-width: 550px; padding: 4.375rem 1rem 4rem; }
.login_box .left .title_wrap { width: fit-content; margin: 0 auto; position: relative; margin-bottom: 6.25rem; }
.login_box .left .title_wrap .fs36 { line-height: 1.1; }
.login_box .left .title_wrap::after { content: ""; position: absolute; right: 0; bottom: 100%; width: 3.375rem; height: 1.9375rem; background: url('/asset/images/login_text_deco.png') no-repeat 50% 50%; background-size: 100%; }
.login_box .left .btn_css { display: block; width: 70%; margin: 0 auto; }
.login_box .right { width: 55%; padding: 4.375rem 3rem 4rem; border: 1px solid #ddd; border-left: 0; }
.login_box .right ul li input { width: 100%; padding: 1.25rem; height: 3.25rem; background: #f2f2f2; border: 0; border-radius: 50px; font-size: .94rem; }
.login_box .right ul li.three input { width: 30%; }
.login_box .right ul li.email input { width: calc(50% - 1rem); margin-top: .625rem; }
.login_box .right ul li.email input.long { width: 100%; }
.login_box .right ul li.email select { width: calc(50% - 1rem); height: 3.25rem; border-radius: 50px; margin-top: .625rem; }
.login_box .right .check { padding: .885rem 0; }
.login_box .right .btn_css { width: 100%; }
.login_box .right .btm { padding-bottom: 1.57rem; border-bottom: 1px dashed #e4e4e4; }


.login_box_in { width: 100%; padding: 4rem 2rem; }
.login_box_in .t_point { color: #0291c5 }




/*표*/
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 #ddd; }
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 { position: relative; padding: .5rem; text-align: center; border-right: 1px solid #ddd; }
table.table_data2 tr.bg td::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: var(--color_primary); opacity: .05; }
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; }

/*리스트 게시판 검색창*/
input:-webkit-autofill { -webkit-box-shadow: 0 0 0 30px transparent inset ; -webkit-text-fill-color: #000; }
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { transition: background-color 5000s ease-in-out 0s; }
.search_general { width: 100%; display: flex; gap: .8rem;  }
.search_general > form { display: flex; gap: 10px; }
.search_general fieldset { display: block; width: 100%; max-width: 300px; height: 3rem; position: relative; background: #fff; border: 1px solid #ddd; border-radius: 500px; overflow: hidden; }
.search_general select { min-width: 120px; height: auto; border: 0; border-bottom: 1px solid #000; }
.search_general input[type="text"] { display: block; width: calc(100% - 30px); padding: 0 1rem; height: inherit; border: 0; border-radius: 0; }
.search_general .search_btn { width: 1.75rem; height: 1.75rem; background: url('../images/search_icon.svg') no-repeat 50% 50%; background-size: 100%; position: absolute; top: 0; right: .75rem; height: 100%; }
.page_go { font-size: .875rem; margin: 2.2rem 0 .5rem; }



/*리스트 게시판*/
table.board_list { table-layout: fixed; position: relative; color: #333; font-size: .94rem; }
table.board_list::before { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: #000; }
table.board_list tr { position: relative; border-bottom: 1px solid #ddd; }
table.board_list th { position: relative; padding: .875rem 0; background: #f9f9f9; text-align: center; }
table.board_list td { position: relative; padding: .875rem; text-align: center; 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; }
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: 1.0625rem; margin-left: 0.2rem; }
table.board_list td.title b { color: #eb5d45; margin-left: 0.2rem; }
table.board_list td.date { color: #666; }
table.board_list td .notice_deco { display: inline-block; width: 2.5rem; padding: 1px; background: var(--color_primary); border-radius: 3px; font-size: .8125rem; font-weight: 500; color: #fff; text-align: center; }
table.board_list tr.notice td { font-weight: 500; }
table.board_list tr.notice td::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: var(--color_primary); opacity: .05; }


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: 2rem 1rem; background: #f9f9f9; border-top: 2px solid #000; border-bottom: 1px solid #000; text-align: center; }
.board_view .view_title h4 { font-size: 1.5rem; }
.board_view .view_title ul { margin-top: 12px; display: flex; flex-wrap: wrap; justify-content: center; }
.board_view .view_title li { padding: .4rem 10px; position: relative; font-size: .94rem; color: #666; }
.board_view .attached_file { padding: 19px 40px 17px; display: flex; }
.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; 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-top: 1px dashed #dedede; border-bottom: 1px dashed #dedede; }
.board_view .btn_wrap { padding: .94rem 0; justify-content: flex-end; }
.board_view .article { border-top: 1px dashed #dedede; }
.board_view .article li { padding: .94rem 40px; display: flex; align-items: center; border-bottom: 1px dashed #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; }
.board_view .comment_wrap { padding: 1.25rem 2.5rem; background: #f9f9f9; border-bottom: 1px dashed #ddd; position: relative; }
.board_view .comment_wrap ul { gap: .6rem; }
.board_view .comment_wrap ul li { flex: 1; }
.board_view .comment_wrap .long textarea { display: block; width: calc(100% - 120px); }
.board_view .comment_wrap .long a { display: block; width: 110px; position: relative; }
.board_view .comment_wrap .long a span { background: #555; border-radius: 3px; }
.board_view .comment_wrap #comment_name { background: none; border: none; padding: 0; font-weight: 500; }
.board_view .comment_wrap .del_btn { position: absolute; bottom: 1.25rem; right: 2.5rem; color: #666; }
.board_view .comment_wrap .date { position: absolute; top: 1.25rem; right: 2.5rem; font-weight: 300; color: #999; }
.file_input { display: flex; }
.file_input label { margin-left: 5px; width: 37px; border: 1px solid #ccc; border-radius: 3px; background: url('../images/clip_icon.png') no-repeat 50% 50%; }

.board_view .view_contents iframe { max-width: 100% !important; height: auto !important; aspect-ratio: 16 / 9; }


/*갤러리형 게시판*/
.photo_list { width:100%; }
.photo_list ul { width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; position: relative; }
.photo_list ul li { border: 1px solid #ddd; transition: .3s; position: relative; }
.photo_list ul li:hover { border-color: #b10e29; box-shadow: 0 15px 23px 0 rgb(0 0 0 / 5%); 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: 6.875rem; padding: 1rem 1.25rem; background: #fff; position: relative; }	
.photo_list ul li .descript .title { font-weight: 500; color: #333; 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; right: 1.25rem; bottom: 1rem; font-size: .875rem; color: #666; text-align: right; }	


/*그리드형 게시판*/
.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; }



/*페이징 버튼*/
.paging { display: flex; gap: .3125rem; justify-content: center; text-align: center; margin-top: 3rem; }
.paging a { width: 2rem; height: 2rem; line-height: 2rem; border: 1px solid #ddd; color: #666; }
.paging a:hover { color:var(--color_primary); }
.paging a.on { border-color: var(--color_primary); color: var(--color_primary); }
.paging a.direction { border: 0; }




/*모달*/
.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)}}



/*슬라이드*/

.slide_list > dt { position: relative; width: 100%; margin-top: 1rem; border: 1px solid #ccc; border-radius: 5px; }
.slide_list > dt::after { content: ""; position: absolute; top: 40%; right: 1.25rem; width: 1rem; height: 1rem; border-right: 2px solid #999; border-bottom: 2px solid #999; transform: translate(0 , -50%) rotate(45deg); transition: .3s; }
.slide_list > dt.on {border-radius: 5px 5px 0 0; }
.slide_list > dt.on::after {transform: translate(0 , -50%) rotate(-135deg);  top: 55%;}
.slide_list > dt a {display: flex; padding: 1.2rem 3rem 1.2rem 4rem; align-items: center; }
.slide_list > dt a span {padding: .6rem 1rem; }
.slide_list > dd {padding: 1.2rem 2rem 1.2rem 4rem; background: #f7f7f7; border: 1px solid #ccc; border-top: 0; border-radius: 0 0 5px 5px; position:relative; word-break: break-all;}
.slide_list > dt i,
.slide_list > dd i{position:absolute; left:1.8rem; top:0.9rem; font-size:1.375rem; font-weight:500;}




@media screen and (max-width: 1700px) {
	
	
}


@media screen and (max-width: 1600px) {
	

	.header_right .header_search input { width: 200px; }
	
}


@media screen and (max-width: 1480px){

	.pc .gnb > ul > li { padding: 0 1.5rem; }

}
@media screen and (max-width: 1280px){
	:root {
	  --inner: 95%;
	}

	#header { position: relative; }
	#header.hide_up { margin: 0; }
	main { padding-top: 0; }

	.header_top { left: 230px; right: auto; top: 50%; transform: translateY(-50%); border-radius: 10px; }
	
	.header_right { max-width: 100%; }
	.header_right .header_search input { height: 40px; line-height: 40px; }
	
}


@media screen and (max-width: 1200px) and (min-width: 1024px) {
	.photo_list ul li .img_box  { height: 160px; }
}

@media screen and (max-width: 1024px) {

	.header_right .bt-mn { gap: 5px; }

	.header_top { left: 200px; height: 30px; } 
	.header_top .inner li { height: 30px; line-height: 30px; } 
	.header_top .inner li + li::after { height: 13px; }
	.header_right .header_search input { height: 34px; line-height: 34px; }

	#sidebar .gnb > ul { gap: 0; }
	#sidebar .gnb > ul > li { flex: none; width: 100%; }
	#sidebar .gnb > ul > li > a { border-color: #e1e1e1; }
	#sidebar .gnb > ul > li > ul.depth2 { display: none; }
	#sidebar .gnb > ul > li > ul.depth2 > li > a { border: 0; }
	
	
	.photo_list ul { grid-template-columns: repeat(3, 1fr); }

	

}


@media screen and (max-width: 980px) {
	#footer .top ul { justify-content: center; }
	#footer .top ul li { font-size: 12px; }
	#footer .btm { padding-top: 90px; padding-left: 0; background-position: 50% 20px; }
	#footer address { width: calc(100% - 256px); }
	
}

@media screen and (max-width: 980px) and (min-width: 800px) {
	.photo_list ul li .img_box  { height: 160px; }
}


@media screen and (max-width: 840px) {
	.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) {

	
	.header_top { left: 0; }
	.header_search { margin-top: 20px; }
	.header_search input { width: 100%; height: 40px; line-height: 40px; }

	.flex_box .half { width: 100%; }
	.flex_box .half + .half { margin-top: 1rem; }

	.flex_box .half .round5 { margin-top: 40px; }


	

	.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){
	.mob_only { display: block !important; }
	.pc_only { display: none; }
	
	.login_box { margin: 0; }
	.login_box .left { display: none; }
	.login_box .right { border-left: 1px solid #ddd; }

	#header .hd_top .inner { padding-bottom: 0; align-items: center; }
	
	
	.header_right .header_login, .header_right .bt-mn { margin: 0; }

	h3.h3_tit { font-size: 2rem; }
	h4.h4_tit { font-size: 1.5rem; }
	


	.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; }
	table.board_list tbody tr td { height: 30px; line-height: 30px; padding: 0; border: 0; }
	table.board_list tbody tr td.num { width: fit-content; text-align: left; }
	table.board_list tbody tr td.notice_type{width: 50%; text-align:right;}
	table.board_list tbody tr td.notice_type span { padding: 0; border: 0; text-align: right; color: #b10e29; } 
	table.board_list tbody tr td.title { width: calc(100% - 5.3rem); padding-right: 0; gap: 0; }
	table.board_list tbody tr td.name {width:5rem; text-align: right;}
	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%; }

	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 .top .inner { height: auto; padding: 10px 0; line-height: 2; }
	#footer address { width: 100%; }
	#footer .btm .right { width: 100%; margin-top: 10px; }
	
}

@media screen and (max-width: 480px) {

	#sidebar .inner { width: 100%; }
	.header_top .inner { width: 100%; }
	.header_top .inner li { flex: 1; text-align: center; padding: 0; }
	.header_top .inner li:last-child { display: none; }
	
	.header_right { gap: 10px; }
	.header_right .btns a { width: 24px; height: 24px; }
	


	.photo_list ul li .img_box { height: 140px; }
	.photo_list ul li .descript { padding: .75rem 1rem; }
	.photo_list ul li .descript .date { right: 1rem; bottom: .75rem; }

	.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 .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; }

	.board_view .comment_wrap { padding: 10px 20px; }
	.board_view .comment_wrap .del_btn { bottom: 10px; right: 20px; }
	.board_view .comment_wrap .date { top: 10px; right: 20px; }
	.board_view .comment_wrap .long textarea { width: calc(100% - 60px); }
	.board_view .comment_wrap .long a { width: 50px; }
}


@media screen and (max-width: 360px) {

	.table_line { overflow: auto; }

	.photo_list ul li .img_box { height: 100px; }
	.photo_list ul li .descript { padding: .5rem .75rem;  height: 5.5rem; }
	.photo_list ul li .descript .title { font-size: .85rem; }
	.photo_list ul li .descript .date { font-size: .78rem; }
	

	.board_view .article li span { width: calc(100% - 30px); }
	.board_view .article li em { display: none; }


	
}
