@charset "utf-8";

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


/*usual*/
.inner { width: var(--inner); margin: 0 auto; position: relative; }
.inner2 { width: var(--inner2); 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; }
.grid_box { display: grid; }
.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; }
.round30 { border-radius: 1.875rem; }
.round20 { border-radius: 1.25rem; }
.round15 { border-radius: .94rem; }
.round10 { border-radius: .625rem; }
.round5 { padding: .8rem; border-radius: .3125rem; }
.round0 { border-radius: 0 !important; }

.gray_bg { background: #f7f7f7; }
.gray_bg2 { background: #f8f8f8; }
.gray_bg3 { background: #f9f9f9; }

.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%; }
.grid_box.grid2 { grid-template-columns: repeat(2, 1fr); }
.grid_box.grid3 { grid-template-columns: repeat(3, 1fr); }
.grid_box.grid4 { grid-template-columns: repeat(4, 1fr); }
.w_full { 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; }
.relative { position: relative; }

.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*/
.fs90 { font-size: 4.4vw; letter-spacing: -.25rem; }
.fs70 { font-size: 4.375rem; letter-spacing: -.125rem; }
.fs65 { font-size: 4.0625rem; letter-spacing: -.125rem; }
.fs50 { font-size: 3.125rem; letter-spacing: -.125rem; }
.fs45 { font-size: 2.8125rem; letter-spacing: -3px; }
.fs40 { font-size: 2.5rem; letter-spacing: -.125rem; }
.fs36 { font-size: 2.25rem; letter-spacing: -.125rem; }
.fs35 { font-size: 2.1875rem; letter-spacing: -.125rem; }
.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; }
.secondary { color: var(--color_secondary) !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; }
.d_gray { color: var(--color_d_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; }
.r { text-align: right; }
.underline { text-decoration: underline; text-underline-offset : 7px; }
.lh0 { line-height: 0; }
.lh1 { line-height: 1; }
.lh12 { line-height: 1.2; }
.lh13 { line-height: 1.3; }
.lh14 { line-height: 1.4; }
.lh16 { line-height: 1.6; }
.lh17 { line-height: 1.7; }
.ls-1 { letter-spacing: -1px; }
.ls-2 { letter-spacing: -.125rem; }
.ls-3 { letter-spacing: -.1875rem; }
.ls-4 { letter-spacing: -.25rem; }
.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 1.5rem; }
ul.ul_disc > li::before { content:""; position: absolute; top: 1rem; left: 0; width: .5rem; height: .5rem; background: var(--color_primary); border-radius: 10px; }


ul.ul_disc2 > li { position: relative; padding: 0 1rem; }
ul.ul_disc2 > li::before { content:""; position: absolute; top: .75rem; left: 0; width: .3125rem; height: .3125rem; background: var(--color_l_gray); 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_check > li { position: relative; padding: 0 1.5rem; }
ul.ul_check > li::before { content:""; position: absolute; top: .5rem; left: 0; width: .625rem; height: 1.25rem; border-right: var(--color_primary) .25rem solid; border-bottom: var(--color_primary) .25rem solid; transform: rotate(45deg);  } 
*/

ul.ul_check > li { position: relative; padding: 0 1.5rem; }
ul.ul_check > li::before { content:"✓"; font-weight: 700; color: var(--color_primary); position: absolute; top: 0; left: 0; }

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: 4px; left: 0; text-align: center; display: flex; justify-content: center; align-items: center; width: 1.5rem; height: 1.5rem; background: #888; border-radius: 50%; font-size: .9rem; color: #fff; }

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 }




/*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_navy { background-color: var(--color_navy) !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; padding: inherit; 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: 15.625rem; min-height: 5.625rem; padding: .5rem 2.25rem; border-radius: 1.25rem; font-size: 1.875rem; font-weight: 700; }
.btn_style2 { min-width: 6.25rem; min-height: 3.125rem; padding: .5rem 1.5rem; border-radius: 500px; font-size: 1.375rem; font-weight: 700; }
.btn_style3 { min-width: 6.25rem; min-height: 3.125rem; padding: .5rem 1.75rem; border-radius: 500px; font-size: 1.375rem; font-weight: 700; }
.btn_style4 { min-width: 5.625rem; min-height: 3.125rem; padding: .5rem 1.5rem; border-radius: .75rem; font-weight: 600; }

/* olds */
.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; }
.navy_fill { background: var(--color_navy) !important; border-color: var(--color_navy) !important; color: #fff; }
.navy_line { border-color: var(--color_navy) !important; color: var(--color_navy) !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; }
.gradient_blue { background: linear-gradient(to right, #0870f0, #07266f); 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: .625rem; height: .625rem; border-top: 1px solid #ccc; border-right: 1px solid #ccc; transform: translateY(-52%) rotate(45deg); }
.btn_style1.btn_arrow span { padding-left: 2.25rem; }
.btn_style1.btn_arrow::before { right: 2.25rem; border-width: 3px; border-color: #fff; }
.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
/* ------------------------------------------ */



#header { position: fixed; left: 0; top: 0; width:100%; 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 .inner { position: relative; height: var(--header_height); }

#header h1.logo { width: 8.5rem; height: fit-content; position: relative; }
#header h1.logo a { display: block; height: fit-content; line-height: 0; }
#header h1.logo a img { height: 2.4rem; }

#header .menu_btn { width: 1.875rem; display:block; }
#header.hide_up { margin-top: calc(var(--header_height) * -1); }





.pc .gnb { width: 61%; }
.pc .gnb > ul { display: flex; justify-content: space-between; position: relative; }
.pc .gnb > ul > li { display: flex; justify-content: center; position: relative; white-space: nowrap; }
.pc .gnb > ul > li > a { position: relative; height: 100%; display: flex; align-items: center; font-size: 1.375rem; font-weight: 700; color: #000; 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 .depth2 { display: none; position: absolute; left: -1rem; top: 130%; text-align: center; box-shadow: 0 0 20px rgba(0, 0, 0, .08); border-radius: 0 0 15px 15px; overflow: hidden; }
.pc .gnb > ul > li .depth2.on { display: block; }
.pc .gnb > ul > li .depth2 > li { text-align: left; }
.pc .gnb > ul > li .depth2 > li > a { display: block; min-width: 10rem; padding: 1rem 1.25rem; background: #fff; font-size: 1.125rem; font-weight: 500; transition: background-color .3s; }
.pc .gnb > ul > li .depth2 > li:hover > a { background: #f7f7f7; font-weight: 700; }
.pc .gnb > ul > li .depth3 { display: none; }




/*
.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); }


#drawer { position: fixed; top: 0; right: 0; width: 100%; height: 100vh; z-index: 99; display: none; }
#drawer > .bg { background-color: rgba(0, 0, 0, .5); }
#drawer .container { width: 90%; max-width: 50vw; height: 100vh; position: fixed; z-index: 100; right: 0; top: 0; background: #fff; overflow-y: auto; transform: translateX(100%); transition: .3s; }
#drawer.open .container { transform: translateX(0); }

#drawer .bt-close{ position: absolute; top: 40px; right: 7.2vw; transform: translateX(50%); }

#drawer .gnb { padding-top: 6.25rem; }
#drawer .gnb > ul > li > a { position: relative; display: block; font-size: 1.875rem; font-weight: 700; padding: .8rem 0;  padding-left: 8%; background-repeat: no-repeat; background-position: 0 50%; }
#drawer .gnb > ul > li > a::after { content: ""; position: absolute; top: 50%; right: 7.2vw; width: .8rem; height: .8rem; border-right: 3px solid #000; border-bottom: 3px solid #000; transform: translate(50%, -50%) rotate(45deg); }
#drawer .gnb > ul > li.on > a::after { transform: translate(50%, -50%) rotate(225deg); }

#drawer .gnb > ul > li.active > button::after{ transform: rotate(-45deg);}
#drawer .gnb > ul > li > ul.depth2 { display:none; padding: 1rem 0 2rem; background: #f7f7f7; padding-left: 8%; padding-right: 7.2vw; }
#drawer .gnb > ul > li > ul.depth2 > li > a { position: relative; display: block; padding: .7rem 0; font-size: 1.5625rem; letter-spacing: -1px; transition: none; }
#drawer .gnb > ul > li > ul.depth2 > li.on > a,
#drawer .gnb > ul > li > ul.depth2 > li:hover > a { font-weight: 700; color: var(--color_blue); }

#drawer .has_depth3 > a { position: relative; }
#drawer .has_depth3 > a::after { content: ""; position: absolute; top: 50%; right: 0; width: .6rem; height: .6rem; border-right: 2px solid #666; border-bottom: 2px solid #666; transform: translate(50%, -50%) rotate(45deg); }
#drawer .has_depth3.on > a::after { transform: translate(50%, -50%) rotate(225deg); }
#drawer .depth3 li a { font-size: 1.25rem; }
#drawer .depth3 li a::before { content: "- "; }



.fixed #header { background: rgba(255, 255, 255, .95); }

/*
.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: var(--color_navy); }
#footer * { font-weight: 300; color: #fff; }
#footer address i { opacity: .8; font-size: .8125rem; display: inline-block; margin: 0 .5rem; }
#footer .top { padding: 3.125rem 0; }
#footer .left { width: 40%; }
#footer .logo { width: 8.5rem; }
#footer .right { width: 60%; }
#footer .lnb_dep1 > li > a { font-size: 1.25rem; font-weight: 700; }
#footer .lnb_dep1 .depth2 { margin-top: 1rem; }
#footer .lnb_dep1 .depth2 > li { line-height: 1.8; }
#footer .lnb_dep1 .depth3 > li { position: relative; padding-left: .5rem; }
#footer .lnb_dep1 .depth3 > li::before { content: ""; position: absolute; left: 0; top: .7rem; width: .3rem; height: .3rem; border-radius: 50%; background: #fff; }

#footer .btm { padding: 2rem 0 3.5rem; border-top: 1px solid #fff; }

#quickMenuToggle { position:fixed; z-index: 5; right: 1.25rem; bottom: calc(11vh - 3rem); width: 2rem; height: 2rem; background: #fff; border: 2px solid #999; color: #666; border-radius: 50%; font-size: 1.5rem; line-height: 1; }
#quickMenu { position:fixed; z-index: 5; right: 1.25rem; bottom: 11vh; }
#quickMenu.hide { right: 100vw; }
#quickMenu ul li { width: 5rem; aspect-ratio: 1; overflow: hidden; border-radius: .625rem; margin-top: 1.25rem; transition: .3s; }
#quickMenu ul li:hover { transform: translateY(-5px); box-shadow: 0 5px 10px rgba(0, 0, 0, .3); }
/* .quickMenu ul li:hover { animation: float 1s infinite; } */





/*탭*/
#tabIdxWrap > .tab, .tab_idx_wrap > .tab { display: none; position: relative; }
#tabIdxWrap > .tab.active, .tab_idx_wrap > .tab.active { display: block; }


.tab_btn_style1 { display: flex; flex-wrap: wrap; gap: .625rem; }
.tab_btn_style1 > li { background: var(--color_w_gray); border-radius: 500px; cursor: pointer; text-align: center; position: relative; }
.tab_btn_style1 > li > button { padding: .5rem 1.75rem; font-size: 1.375rem; font-weight: 300; color: var(--color_l_gray); letter-spacing: -1px; transition: 0s; }
.tab_btn_style1 > li.active { background: var(--color_primary); }
.tab_btn_style1 > li.active > button { font-weight: 700; color: #fff; }


.tab_btn_style2 { display: grid; grid-template-columns: repeat(3, 1fr); gap: .625rem; }
.tab_btn_style2 > li { display: flex; justify-content: center; align-items: center; background: var(--color_w_gray); cursor: pointer; position: relative; }
.tab_btn_style2 > li > button { padding: 1rem 2rem; font-size: 1.375rem; font-weight: 300; color: var(--color_l_gray); letter-spacing: -1px; transition: 0s; }
.tab_btn_style2 > li.active { background: linear-gradient(to right, #0870f0, #07266f); color: #fff; }
.tab_btn_style2 > li.active > button { font-weight: 700; color: #fff; }


.tab_btn_style3 { padding: .75rem .75rem 0; display: flex; flex-wrap: wrap; background: #f8f8f8; border-radius: .94rem .94rem 0 0; }
.tab_btn_style3 > li { border-radius: .94rem .94rem 0 0; cursor: pointer; text-align: center; position: relative; }
.tab_btn_style3 > li > button { padding: 1rem 1.75rem .75rem; font-size: 1.125rem; font-weight: 700; color: var(--color_l_gray); letter-spacing: -1px; transition: 0s; }
.tab_btn_style3 > li.active { background: #fff; }
.tab_btn_style3 > li.active > button { color: var(--color_primary); }




/* 팝업 */

.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; }



/*로그인*/
.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('../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_style1 tr { gap: 20px; }
table.table_style1 td { text-align: left; border: 1px solid #ddd; border-radius: 20px; }




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 tr { position: relative; border-bottom: 1px solid #ddd; }
table.board_list td { position: relative; padding: 1.5625rem; 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; font-size: 1.25rem; text-align: left; }
table.board_list td.title a { max-width: 93%; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
table.board_list td.title i { transform: rotate(45deg); color: var(--color_l_gray) }
table.board_list td.title b { color: var(--color_primary); margin-left: 0.2rem; }
table.board_list td.date { font-size: 1.25rem; font-weight: 500; color: var(--color_l_gray); letter-spacing: -1px; }
/*
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; }


/* table_dim */
.table_scroll { position: relative; overflow-x:auto; }
.responsive-dim {display: none; position: absolute; top: 0; left: 0; width: 100%; bottom: 0;}
.responsive-dim::before{content: ""; position: absolute;  z-index: 5; top: 0; left: 0;  width: 100%; height: 100%; background: rgba(0,0,0,.3);}
.responsive-dim::after{content: ""; position: absolute;  z-index: 6; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; width: 60px; height: 60px; background: url('../images/tx_scroll.png') no-repeat 50% 50%; }

@media screen and (max-width:767px){
	.responsive-dim {display:block;}
}




/*게시판 뷰페이지*/
.board_view .view_title { padding: 3rem 1rem 2rem; 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: .625rem; justify-content: center; text-align: center; margin-top: 3rem; }
.paging a { width: 3.125rem; height: 3.125rem; line-height: 3.125rem; border-radius: .75rem; font-size: 1.375rem; font-weight: 800; }
.paging a:hover, .paging a.on { background-color :var(--color_primary); color: #fff; }
.paging a.direction { border: 0; }





/*슬라이드*/
.faq_list { border-bottom: 1px solid #ddd; }
.faq_list dt { position: relative; width: 100%; border-top: 1px solid #ddd; border-radius: 5px; }
.faq_list dt::before { content: "Q"; font-size: 1.875rem; font-weight: 700; color: var(--color_primary); position: absolute; top: 50%; left: 2.5rem;  transform: translate(0 , -50%); }
.faq_list dt::after { content: ""; position: absolute; top: 45%; 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; }
.faq_list dt.on {border-radius: 5px 5px 0 0; }
.faq_list dt.on::after {transform: translate(0 , -50%) rotate(-135deg);  top: 55%;}
.faq_list dt a {display: flex; min-height: 5rem; font-size: 1.25rem; font-weight: 700; line-height: 1.3; padding: 0 5rem; align-items: center; }
.faq_list dd { position:relative; padding: 1.5rem 5rem; background: #f8f8f8; line-height: 1.6; word-break: break-all;}
.faq_list dd::before { content: "A"; font-size: 1.875rem; font-weight: 700; color: var(--color_skyblue); position: absolute; top: 1rem; left: 2.5rem; }





.modal-overlay { display: none; position: fixed; z-index: 1000; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(4px); }
.modal-content { overflow: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; padding: 0 1.875rem 1.875rem; border-radius: .625rem; max-width: 800px; width: 90%; max-height: 95vh; min-height: 50vh; }
.modal-close { position: absolute; top: 1.25rem; right: 1.25rem; background: none; border: none; cursor: pointer; }
.modal-header { position: sticky; z-index: 9; top: 1px; height: 5rem; display: flex; justify-content: space-between; align-items: center; background: #fff; border-bottom: 1px solid #ccc; }
.modal-header .modal-close { position: static; }
.modal-body { padding-top: 1.875rem; overflow-y: auto; }


@media screen and (max-width: 1800px) {
    :root {
        --inner: 90%;
        --inner2: 90%;
      }
	
}


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


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


}


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

@media screen and (max-width: 1024px) {
    :root {
        --header_height: 6rem;
    }
    

    #header h1.logo { width: 6rem; }
    #header .menu_btn { width: 20px; }

    #footer .left { width: 100%; text-align: center; margin-bottom: 30px; }
    #footer .right { width: 100%; }
    #footer .logo { margin: 0 auto; }
    #footer .lnb_dep1 { gap: 20px; justify-content: center; }
    #footer .btm { text-align: center; }

	.pc .gnb { width: calc(100% - 250px); }
    .pc .gnb > ul > li > a { font-size: 1.125rem; }
	
	.photo_list ul { grid-template-columns: repeat(3, 1fr); }

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

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


@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: 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) {

    .btn_style1 { min-width: 12rem; min-height: 4rem; padding: .5rem 1.5rem; border-radius: 1.25rem; font-size: 1.5rem; }
    .btn_style1.btn_arrow span { padding-left: 1.5rem; }
    .btn_style1.btn_arrow::before { right: 1.5rem; }

    .btn_style2 { min-width: 5rem; min-height: 2.25rem; font-size: 1rem; }

    :root {
        --header_height: 5rem;
    }

    #header { background: #fff; }
    
	.pc .gnb { display: none; }
    .pc .gnb > ul > li > a { font-size: 1rem; }

    .quickMenu ul li { width: 4rem; margin-top: 10px; }

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

    .grid_box.grid2 { grid-template-columns: repeat(1, 1fr); }
    .grid_box.grid3 { grid-template-columns: repeat(1, 1fr); }

    .tab_btn_style2 { grid-template-columns: repeat(2, 1fr); }
    .tab_btn_style2 > li { padding: 1rem; }
    .tab_btn_style2 > li br { display: none; }
    .tab_btn_style2 > li > button { font-size: 1rem; }

    .tab_btn_style3 { padding: .75rem; }
    .tab_btn_style3 > li { border-radius: .94rem; }


    ul.ul_disc > li { padding: 0 1rem; }
    ul.ul_disc > li::before { top: .625rem; }

    ol.ol_num > li { padding: 0 1.5rem; } 
    ol.ol_num > li::before { top: 2px; width: 1.25rem; height: 1.25rem; font-size: .81rem; } 
	

	.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; }

	.paging { gap: 5px; }
	.paging a { width: 30px; height: 30px; line-height: 30px; font-size: 16px; font-weight: 500; border-radius: 8px; }

}


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

	h3.h3_tit { font-size: 2rem; }
	h4.h4_tit { font-size: 1.5rem; }
	

    #drawer .container { max-width: 70vw; }
    

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

	.flex_box > .third, .flex_box > .quarter { width: 100%; }
	.flex_box > .third + .third, .flex_box > .quarter + .quarter { margin-top: 10px; }
    .grid_box.grid4 { grid-template-columns: repeat(1, 1fr); }


	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% - 3rem); font-size: 1rem; padding-right: 0; gap: 0; }
	table.board_list tbody tr td.date { width: 100%; height: 30px; font-size: .94rem; color: #999; line-height: 25px; text-align: right; }
	table.board_list tbody tr td.date::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); }
	
	h4.deco::after {top:1.1rem;}


	
}

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

    :root {
        --header_height: 60px;
    }

	#drawer .inner { width: 100%; }

    .quickMenu ul li { width: 3rem; margin-top: 8px; }


	.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; }

    .tab_btn_style1 { justify-content: center; }
    .tab_btn_style1 > li > button { font-size: 1rem; }

	.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; }


    .slide_list > dt a { font-size: 1.125rem; }
    .slide_list > dt a, .slide_list > dd { padding: 1.25rem 4rem; }
    .slide_list > dt::before, .slide_list > dd::before { left: 1.5rem; }
}


@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; }


	
}