@charset "utf-8";

/* 가이드화면 위치잡기 */
.smple_box{display: flex; align-items: center; justify-content: flex-start; }
.smple_box > li{margin: 10px; }
.smple_box .process{width: 200px; }

/* 스크롤바 안보이게 하기 */
body{-ms-overflow-style: none; }
::-webkit-scrollbar{display: none; }

/* ::-webkit-scrollbar{width: 5px;}
::-webkit-scrollbar-track{background: #F1F1F1; }
::-webkit-scrollbar-thumb{background: #F1EF79; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover{background: #555555; }
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment{width: 5px; height: 5px; background: #F1EF79; } */

/* 스크롤바 보이게 하기 */
.scrollbar::-webkit-scrollbar{display: block; width: 6px; height: 6px; }
.scrollbar::-webkit-scrollbar-track{background: rgba(0,0,0,0.08); border-radius: 3px; }
.scrollbar::-webkit-scrollbar-thumb{background: #C1C1C1; background-clip: padding-box; border: 0px solid transparent; border-radius: 10px; }
/* .scrollbar::-webkit-resizer{background-color: #FFFFFF; border-radius: 3px; }
.scrollbar::-webkit-scrollbar-corner{background-color: #FFFFFF; } */


/* Flex Style **********************************************************************************************/
.flex{display: flex; }
.flex_column{flex-direction: column !important; }

.flex_align_baseline{align-items: baseline !important; }
.flex_align_start{align-items: flex-start !important; }
.flex_align_center{align-items: center !important; }
.flex_align_end{align-items: flex-end !important; }

.flex_just_start{justify-content: flex-start !important; }
.flex_just_center{justify-content: center !important; }
.flex_just_between{justify-content: space-between !important; }

.flex_baseline_start{display: flex; align-items: baseline; justify-content: flex-start; }
.flex_center_start{display: flex; align-items: center; justify-content: flex-start; }
.flex_center_center{display: flex; align-items: center; justify-content: center; }
.flex_center_between{display: flex; align-items: center; justify-content: space-between; }
.flex_end_between{display: flex; align-items: flex-end; justify-content: space-between; }


/* 화면분할 **************************************************************************************************/
/* 좌우 화면분할 : 공통 */
.division_wrap{display: flex; align-items: stretch; justify-content: space-between; width: 100%; overflow-y: auto; }
.boxStyle_topline{background-color: #FFFFFF; border: 1px solid #C8C8C8; border-top: 2px solid #333333; overflow-y: auto; }
.boxStyle_line{background-color: #FFFFFF; border: 1px solid #C8C8C8; overflow-y: auto; }
.boxStyle_radius4{background-color: #FFFFFF; border: 1px solid #C8C8C8; border-radius: 4px; overflow: hidden; }
.boxStyle_radius10{background-color: #FFFFFF; border: 1px solid #C8C8C8; border-radius: 10px; overflow: hidden; }
.boxStyle_radius4_bg{background-color: #F2F3F9; border-radius: 4px; }
.boxStyle_radius10_bg{background-color: #F2F3F9; border-radius: 10px; }

/* 좌우 화면분할 */
.division_wrap .divi_leftBox.w200{width: 200px; }
.division_wrap .divi_leftBox.w200 + .divi_rightBox{width: calc(100% - (200px + 10px)); }

.division_wrap .divi_leftBox.w220{width: 220px; }
.division_wrap .divi_leftBox.w220 + .divi_rightBox{width: calc(100% - (220px + 10px)); }

.division_wrap .divi_leftBox.w240{width: 240px; }
.division_wrap .divi_leftBox.w240 + .divi_rightBox{width: calc(100% - (240px + 10px)); }

.division_wrap .divi_leftBox.w260{width: 260px; }
.division_wrap .divi_leftBox.w260 + .divi_rightBox{width: calc(100% - (260px + 10px)); }

.division_wrap .divi_leftBox.w280{width: 280px; }
.division_wrap .divi_leftBox.w280 + .divi_rightBox{width: calc(100% - (280px + 10px)); }

.division_wrap .divi_leftBox.w300{width: 300px; }
.division_wrap .divi_leftBox.w300 + .divi_rightBox{width: calc(100% - (300px + 10px)); }

.division_wrap .divi_leftBox.w320{width: 320px; }
.division_wrap .divi_leftBox.w320 + .divi_rightBox{width: calc(100% - (320px + 10px)); }

.division_wrap .divi_leftBox.w340{width: 340px; }
.division_wrap .divi_leftBox.w340 + .divi_rightBox{width: calc(100% - (340px + 10px)); }

.division_wrap .divi_leftBox.w360{width: 360px; }
.division_wrap .divi_leftBox.w360 + .divi_rightBox{width: calc(100% - (360px + 10px)); }

.division_wrap .divi_leftBox.w380{width: 380px; }
.division_wrap .divi_leftBox.w380 + .divi_rightBox{width: calc(100% - (380px + 10px)); }

.division_wrap .divi_leftBox.w400{width: 400px; }
.division_wrap .divi_leftBox.w400 + .divi_rightBox{width: calc(100% - (400px + 10px)); }

.division_wrap .divi_leftBox.w420{width: 420px; }
.division_wrap .divi_leftBox.w420 + .divi_rightBox{width: calc(100% - (420px + 10px)); }

.division_wrap .divi_leftBox.w440{width: 440px; }
.division_wrap .divi_leftBox.w440 + .divi_rightBox{width: calc(100% - (440px + 10px)); }

.division_wrap .divi_leftBox.w460{width: 460px; }
.division_wrap .divi_leftBox.w460 + .divi_rightBox{width: calc(100% - (460px + 10px)); }

.division_wrap .divi_leftBox.w480{width: 480px; }
.division_wrap .divi_leftBox.w480 + .divi_rightBox{width: calc(100% - (480px + 10px)); }

.division_wrap .divi_leftBox.w500{width: 500px; }
.division_wrap .divi_leftBox.w500 + .divi_rightBox{width: calc(100% - (500px + 10px)); }

.division_wrap .divi_leftBox.w10p{width: calc(10% - 5px) !important; }
.division_wrap .divi_leftBox.w10p + .divi_rightBox{width: calc(100% - (10% + 5px)); }

.division_wrap .divi_leftBox.w20p{width: calc(20% - 5px) !important; }
.division_wrap .divi_leftBox.w20p + .divi_rightBox{width: calc(100% - (20% + 5px)); }

.division_wrap .divi_leftBox.w30p{width: calc(30% - 5px) !important; }
.division_wrap .divi_leftBox.w30p + .divi_rightBox{width: calc(100% - (30% + 5px)); }

.division_wrap .divi_leftBox.w40p{width: calc(40% - 5px) !important; }
.division_wrap .divi_leftBox.w40p + .divi_rightBox{width: calc(100% - (40% + 5px)); }

.division_wrap .divi_leftBox.w50p{width: calc(50% - 5px) !important; }
.division_wrap .divi_leftBox.w50p + .divi_rightBox{width: calc(100% - (50% + 5px)); }

.division_wrap .divi_leftBox.w60p{width: calc(60% - 5px) !important; }
.division_wrap .divi_leftBox.w60p + .divi_rightBox{width: calc(100% - (60% + 5px)); }

.division_wrap .divi_leftBox.w66p{width: calc(66.8% - 5px) !important; }
.division_wrap .divi_leftBox.w66p + .divi_rightBox{width: calc(100% - (66.8% + 5px)); }

.division_wrap .divi_leftBox.w70p{width: calc(70% - 5px) !important; }
.division_wrap .divi_leftBox.w70p + .divi_rightBox{width: calc(100% - (70% + 5px)); }

.division_wrap .divi_leftBox.w80p{width: calc(80% - 5px) !important; }
.division_wrap .divi_leftBox.w80p + .divi_rightBox{width: calc(100% - (80% + 5px)); }

.division_wrap .divi_leftBox.w90p{width: calc(90% - 5px) !important; }
.division_wrap .divi_leftBox.w90p + .divi_rightBox{width: calc(100% - (90% + 5px)); }

.division_wrap .divi_leftBox.w100p + .divi_rightBox{display: none; }

.division_wrap .divi_rightBox > section:not(:first-child){margin-top: 10px; }

/* 좌우 화면분할(연결스타일) */
.boxStyle_topline > .divi_leftBox{position: relative; border-right: 1px solid #A1A1A1; }

.division_wrap.boxStyle_topline .divi_leftBox.w300{width: 300px; }
.division_wrap.boxStyle_topline .divi_leftBox.w300 + .divi_rightBox{width: calc(100% - (300px - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w320{width: 320px; }
.division_wrap.boxStyle_topline .divi_leftBox.w320 + .divi_rightBox{width: calc(100% - (320px - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w340{width: 340px; }
.division_wrap.boxStyle_topline .divi_leftBox.w340 + .divi_rightBox{width: calc(100% - (340px - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w360{width: 360px; }
.division_wrap.boxStyle_topline .divi_leftBox.w360 + .divi_rightBox{width: calc(100% - (360px - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w380{width: 380px; }
.division_wrap.boxStyle_topline .divi_leftBox.w380 + .divi_rightBox{width: calc(100% - (380px - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w400{width: 400px; }
.division_wrap.boxStyle_topline .divi_leftBox.w400 + .divi_rightBox{width: calc(100% - (400px - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w420{width: 420px; }
.division_wrap.boxStyle_topline .divi_leftBox.w420 + .divi_rightBox{width: calc(100% - (420px - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w440{width: 440px; }
.division_wrap.boxStyle_topline .divi_leftBox.w440 + .divi_rightBox{width: calc(100% - (440px - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w460{width: 460px; }
.division_wrap.boxStyle_topline .divi_leftBox.w460 + .divi_rightBox{width: calc(100% - (460px - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w480{width: 480px; }
.division_wrap.boxStyle_topline .divi_leftBox.w480 + .divi_rightBox{width: calc(100% - (480px - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w500{width: 500px; }
.division_wrap.boxStyle_topline .divi_leftBox.w500 + .divi_rightBox{width: calc(100% - (500px - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w10p{width: calc(10% + 1px) !important; }
.division_wrap.boxStyle_topline .divi_leftBox.w10p + .divi_rightBox{width: calc(100% - (10% - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w20p{width: calc(20% + 1px) !important; }
.division_wrap.boxStyle_topline .divi_leftBox.w20p + .divi_rightBox{width: calc(100% - (20% - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w30p{width: calc(30% + 1px) !important; }
.division_wrap.boxStyle_topline .divi_leftBox.w30p + .divi_rightBox{width: calc(100% - (30% - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w40p{width: calc(40% + 1px) !important; }
.division_wrap.boxStyle_topline .divi_leftBox.w40p + .divi_rightBox{width: calc(100% - (40% - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w50p{width: calc(50% + 1px) !important; }
.division_wrap.boxStyle_topline .divi_leftBox.w50p + .divi_rightBox{width: calc(100% - (50% - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w60p{width: calc(60% + 1px) !important; }
.division_wrap.boxStyle_topline .divi_leftBox.w60p + .divi_rightBox{width: calc(100% - (60% - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w70p{width: calc(70% + 1px) !important; }
.division_wrap.boxStyle_topline .divi_leftBox.w70p + .divi_rightBox{width: calc(100% - (70% - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w80p{width: calc(80% + 1px) !important; }
.division_wrap.boxStyle_topline .divi_leftBox.w80p + .divi_rightBox{width: calc(100% - (80% - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w90p{width: calc(90% + 1px) !important; }
.division_wrap.boxStyle_topline .divi_leftBox.w90p + .divi_rightBox{width: calc(100% - (90% - 1px)); }

.division_wrap.boxStyle_topline .divi_leftBox.w100p{border-right: none; }
.division_wrap.boxStyle_topline .divi_leftBox.w100p + .divi_rightBox{display: none; }

.division_wrap.boxStyle_topline .divi_rightBox{border-left: 1px solid #A1A1A1; margin-left: -1px; }
.division_wrap.boxStyle_topline .divi_rightBox.w100p{border: none; margin-left: 0px; }

.boxStyle_topline > .box_titArea + .division_wrap.boxStyle_topline{border: none; border-top: 1px solid #A1A1A1; }
.boxStyle_topline > .box_titArea + .division_wrap.boxStyle_topline section > .editArea{border-top: none; }
.boxStyle_topline > .box_titArea + .division_wrap.boxStyle_topline section > .box_titArea + .editArea{border-top: 1px solid #A1A1A1; }

/* Resizer */
.resizer{position: absolute; z-index: 1; background-color: #FFFFFF; }

.resizer[data-direction='horizontal'],
.horizontalResizer{width: 10px; min-height: 100%; background-image: url(../images/ico/more/more_style1_v_gray.svg); background-repeat: no-repeat; background-position: 50% 50%; cursor: ew-resize; }
.resizer[data-direction='horizontal']:hover,
.horizontalResizer:hover{background-color: #F9F9F9; background-image: url(../images/ico/more/more_style1_v.svg); }

.resizer[data-direction='vertical'],
.verticalResizer{width: 100%; height: 10px; background-image: url(../images/ico/more/more_style1_h_gray.svg); background-repeat: no-repeat; background-position: 50% 50%; cursor: ns-resize; }
.resizer[data-direction='vertical']:hover,
.verticalResizer:hover{background-color: #F9F9F9; background-image: url(../images/ico/more/more_style1_h.svg); }

.division_wrap_resizer .division_wrap .divi_leftBox{position: relative; margin-right: 10px; }
.division_wrap_resizer .division_wrap.boxStyle_topline .divi_rightBox{margin-left: 0px; }


/* Column Style ********************************************************************************************/
.item{background: #D8D8D8; }
.column{margin: 3px 5px; }

.grid_items,
.grid_items_fixing{display: flex; flex-wrap: wrap; width: calc(100% + 10px); margin-left: -5px; }

.grid_items .column.one{width: calc(100%/12 - 10px); }
.grid_items .column.two{width: calc(100%/6 - 10px); }
.grid_items .column.three{width: calc(100%/4 - 10px); }
.grid_items .column.four{width: calc(100%/3 - 10px); }
.grid_items .column.five{width: calc(100%/2.4 - 10px); }
.grid_items .column.six{width: calc(100%/2 - 10px); }
.grid_items .column.seven{width: calc((100% - (100%/2.4)) - 10px); }
.grid_items .column.eight{width: calc(100%/1.5 - 10px); }
.grid_items .column.ten{width: calc(100%/1.2 - 10px); }
.grid_items .column.full{width: calc(100% - 10px); }

.grid_items .column.divi_5{width: calc(100%/5 - 10px); }

.grid_items_fixing.column_max1{max-width: calc((128px * 2) * 1); }
.grid_items_fixing.column_max2{max-width: calc((128px * 2) * 2); }
.grid_items_fixing.column_max3{max-width: calc((128px * 2) * 3); }
.grid_items_fixing.column_max4{max-width: calc((128px * 2) * 4); }
.grid_items_fixing.column_max5{max-width: calc((128px * 2) * 5); }
.grid_items_fixing.column_max6{max-width: calc((128px * 2) * 6); }
.grid_items_fixing.column_max7{max-width: calc((128px * 2) * 7); }
.grid_items_fixing.column_max8{max-width: calc((128px * 2) * 8); }
.grid_items_fixing.column_max9{max-width: calc((128px * 2) * 9); }
.grid_items_fixing.column_max10{max-width: calc((128px * 2) * 10); }
.grid_items_fixing.column_max11{max-width: calc((128px * 2) * 11); }
.grid_items_fixing.column_max12{max-width: calc((128px * 2) * 12); }

.grid_items_fixing .column.nth1{width: calc(128px - 10px); }
.grid_items_fixing .column.nth2{width: calc(128px*2 - 10px); }
.grid_items_fixing .column.nth3{width: calc(128px*3 - 10px); }
.grid_items_fixing .column.nth4{width: calc(128px*4 - 10px); }
.grid_items_fixing .column.nth5{width: calc(128px*5 - 10px); }
.grid_items_fixing .column.nth6{width: calc(128px*6 - 10px); }
.grid_items_fixing .column.nth7{width: calc(128px*7 - 10px); }
.grid_items_fixing .column.nth8{width: calc(128px*8 - 10px); }
.grid_items_fixing .column.nth9{width: calc(128px*9 - 10px); }
.grid_items_fixing .column.nth10{width: calc(128px*10 - 10px); }
.grid_items_fixing .column.nth11{width: calc(128px*11 - 10px); }
.grid_items_fixing .column.nth12{width: calc(128px*12 - 10px); }

.grid_items_fixing.label_13 .column.nth1{width: calc(140px - 10px); }
.grid_items_fixing.label_13 .column.nth2{width: calc(140px*2 - 10px); }
.grid_items_fixing.label_13 .column.nth3{width: calc(140px*3 - 10px); }
.grid_items_fixing.label_13 .column.nth4{width: calc(140px*4 - 10px); }
.grid_items_fixing.label_13 .column.nth5{width: calc(140px*5 - 10px); }
.grid_items_fixing.label_13 .column.nth6{width: calc(140px*6 - 10px); }
.grid_items_fixing.label_13 .column.nth7{width: calc(140px*7 - 10px); }
.grid_items_fixing.label_13 .column.nth8{width: calc(140px*8 - 10px); }
.grid_items_fixing.label_13 .column.nth9{width: calc(140px*9 - 10px); }
.grid_items_fixing.label_13 .column.nth10{width: calc(140px*10 - 10px); }
.grid_items_fixing.label_13 .column.nth11{width: calc(140px*11 - 10px); }
.grid_items_fixing.label_13 .column.nth12{width: calc(140px*12 - 10px); }

.grid_items_fixing.label_16 .column.nth1{width: calc(152px - 10px); }
.grid_items_fixing.label_16 .column.nth2{width: calc(152px*2 - 10px); }
.grid_items_fixing.label_16 .column.nth3{width: calc(152px*3 - 10px); }
.grid_items_fixing.label_16 .column.nth4{width: calc(152px*4 - 10px); }
.grid_items_fixing.label_16 .column.nth5{width: calc(152px*5 - 10px); }
.grid_items_fixing.label_16 .column.nth6{width: calc(152px*6 - 10px); }
.grid_items_fixing.label_16 .column.nth7{width: calc(152px*7 - 10px); }
.grid_items_fixing.label_16 .column.nth8{width: calc(152px*8 - 10px); }
.grid_items_fixing.label_16 .column.nth9{width: calc(152px*9 - 10px); }
.grid_items_fixing.label_16 .column.nth10{width: calc(152px*10 - 10px); }
.grid_items_fixing.label_16 .column.nth11{width: calc(152px*11 - 10px); }
.grid_items_fixing.label_16 .column.nth12{width: calc(152px*12 - 10px); }

.grid_items_fixing.label_20 .column.nth1{width: calc(180px - 10px); }
.grid_items_fixing.label_20 .column.nth2{width: calc(180px*2 - 10px); }
.grid_items_fixing.label_20 .column.nth3{width: calc(180px*3 - 10px); }
.grid_items_fixing.label_20 .column.nth4{width: calc(180px*4 - 10px); }
.grid_items_fixing.label_20 .column.nth5{width: calc(180px*5 - 10px); }
.grid_items_fixing.label_20 .column.nth6{width: calc(180px*6 - 10px); }
.grid_items_fixing.label_20 .column.nth7{width: calc(180px*7 - 10px); }
.grid_items_fixing.label_20 .column.nth8{width: calc(180px*8 - 10px); }
.grid_items_fixing.label_20 .column.nth9{width: calc(180px*9 - 10px); }
.grid_items_fixing.label_20 .column.nth10{width: calc(180px*10 - 10px); }
.grid_items_fixing.label_20 .column.nth11{width: calc(180px*11 - 10px); }
.grid_items_fixing.label_20 .column.nth12{width: calc(180px*12 - 10px); }
.grid_items_fixing.label_20 .column.nth4 .label_h div input{width: 110px;}
.grid_items_fixing.label_20 .column.nth4 .label_h input{width: 110px;}
.grid_items_fixing.label_20 .column.nth4 .label_h label{justify-content: left; padding-left: 15px; }
.grid_items_fixing.label_20 .column.nth4 .label_h textarea{width: 80%; }
.grid_items_fixing.label_20 .column.nth4 textarea{width: 80%; }
.grid_items_fixing.label_20 .column.nth4 .label_h textarea .textarea_line10{width: 80%; }
.grid_items_fixing.label_20 .column.nth4 .label_h textarea .textarea_line10 scrollbar{width: 80%; }
.grid_items_fixing.label_20 .column.nth4 .label_h div {width: 110px; }
.grid_items_fixing.label_20 .column.nth4 .label_h div p {width: 110px; }
.grid_items_fixing.label_20 .column.nth4 .label_h .input_bgStyle {width: 110px; }
.grid_items_fixing.label_20 .column.nth4 .label_h .input_bgStyle .text {width: 110px; }

.block{margin: 10px; }

.grid_square{display: flex; flex-wrap: wrap; width: calc(100% + 20px); margin: 10px; }
.grid_square .block > div{margin-bottom: 20px; }
.grid_square .w_1{width: calc(110px * 1); }
.grid_square .w_2{width: calc((110px * 2) + ((20px * 2) - 20px)); }
.grid_square .w_3{width: calc((110px * 3) + ((20px * 3) - 20px)); }
.grid_square .w_4{width: calc((110px * 4) + ((20px * 4) - 20px)); }
.grid_square .w_5{width: calc((110px * 5) + ((20px * 5) - 20px)); }
.grid_square .w_6{width: calc((110px * 6) + ((20px * 6) - 20px)); }
.grid_square .w_7{width: calc((110px * 7) + ((20px * 7) - 20px)); }
.grid_square .w_8{width: calc((110px * 8) + ((20px * 8) - 20px)); }
.grid_square .w_9{width: calc((110px * 9) + ((20px * 9) - 20px)); }
.grid_square .w_10{width: calc((110px * 10) + ((20px * 10) - 20px)); }
.grid_square .w_11{width: calc((110px * 11) + ((20px * 11) - 20px)); }
.grid_square .w_12{width: calc((110px * 12) + ((20px * 12) - 20px)); }

.grid_square .h_1{height: calc(110px * 1); }
.grid_square .h_2{height: calc((110px * 2) + ((20px * 2) - 20px)); }
.grid_square .h_3{height: calc((110px * 3) + ((20px * 3) - 20px)); }
.grid_square .h_4{height: calc((110px * 4) + ((20px * 4) - 20px)); }
.grid_square .h_5{height: calc((110px * 5) + ((20px * 5) - 20px)); }
.grid_square .h_6{height: calc((110px * 6) + ((20px * 6) - 20px)); }
.grid_square .h_7{height: calc((110px * 7) + ((20px * 7) - 20px)); }
.grid_square .h_8{height: calc((110px * 8) + ((20px * 8) - 20px)); }
.grid_square .h_9{height: calc((110px * 9) + ((20px * 9) - 20px)); }
.grid_square .h_10{height: calc((110px * 10) + ((20px * 10) - 20px)); }
.grid_square .h_11{height: calc((110px * 11) + ((20px * 11) - 20px)); }
.grid_square .h_12{height: calc((110px * 12) + ((20px * 12) - 20px)); }


/* Form Style **********************************************************************************************/
.formStyle label{display: inline-block; font-size: 13px; line-height: 18px; color: #333333; }

/* label과 input이 좌, 우로 위치 */
.formStyle .label_h{display: flex; flex-wrap: wrap; align-items: stretch; }
.formStyle .label_h:not(:last-child){margin-bottom: 6px; }

.formStyle .grid_items .label_h,
.formStyle .grid_items_fixing .label_h{margin-bottom: 0px; }

.formStyle .label_h.label_hfull label{height: auto !important; }

/* label 오른쪽 정렬 */
.formStyle .label_h label{display: flex; align-items: center; justify-content: flex-end; height: 24px; line-height: 15px; text-align: right; word-break: break-all; padding-right: 7px; margin-bottom: 0; }

/* label 필수표시 */
.formStyle .label_h label .required{background-image: url(../images/ico/bullet/vital_blue.svg); background-repeat: no-repeat; background-position: 0 2px; padding-left: 10px; padding-right: 0px; }

/* label 연결표시 : 다른곳에 입력되어있는 데이터를 가져온 경우 표시 */
.formStyle .label_h label .link{text-decoration: underline #4176FF; text-underline-position: under; }

/* label 크기조절 */
.formStyle .label_h label{width: 100px; }
.formStyle .label_13 .label_h label{width: 130px; }
.formStyle .label_16 .label_h label{width: 160px; }
.formStyle .label_20 .label_h label{width: 380px; }

/* label + 데이터영역 크기조절 */
.formStyle .label_v > div,
.formStyle .label_h > div{position: relative; display: flex; justify-content: flex-start; align-items: flex-start; }
.formStyle .label_h > div span{min-width: 14px; font-size: 13px; line-height: 20px; padding: 2px 4px; }

.formStyle .label_h > div .div_error,
.formStyle .label_h .div_error > div{width: 100%; }
.formStyle .label_h .div_error{flex-direction: column; }
.formStyle .label_h .div_error .logging_level{margin-left: 0px !important; }

.formStyle .label_h input + input,
.formStyle .label_h label + input,
.formStyle .label_h label + select,
.formStyle .label_h label + textarea,
.formStyle .label_h label + .datetime,
.formStyle .label_h label + .input_bgStyle,
.formStyle .label_h label + .radio_area,
.formStyle .label_h label + .check_area,
.formStyle .label_h label + div{width: calc(100% - 100px); }
.formStyle .label_h > input:first-child{width: calc(100px - 4px); margin-right: 4px; }
.formStyle .label_h .logging_level{margin-left: 100px; }

.formStyle .label_13 .label_h input + input,
.formStyle .label_13 .label_h label + input,
.formStyle .label_13 .label_h label + select,
.formStyle .label_13 .label_h label + textarea,
.formStyle .label_13 .label_h label + .datetime,
.formStyle .label_13 .label_h label + .input_bgStyle,
.formStyle .label_13 .label_h label + .radio_area,
.formStyle .label_13 .label_h label + .check_area,
.formStyle .label_13 .label_h label + div{width: calc(100% - 130px); }
.formStyle .label_13 .label_h > input:first-child{width: calc(130px - 4px); }
.formStyle .label_13 .label_h .logging_level{margin-left: 130px; }

.formStyle .label_16 .label_h input + input,
.formStyle .label_16 .label_h label + input,
.formStyle .label_16 .label_h label + select,
.formStyle .label_16 .label_h label + textarea,
.formStyle .label_16 .label_h label + .datetime,
.formStyle .label_16 .label_h label + .input_bgStyle,
.formStyle .label_16 .label_h label + .radio_area,
.formStyle .label_16 .label_h label + .check_area,
.formStyle .label_16 .label_h label + div{width: calc(100% - 160px); }
.formStyle .label_16 .label_h > input:first-child{width: calc(160px - 4px); }
.formStyle .label_16 .label_h .logging_level{margin-left: 160px; }

.formStyle .label_20 .label_h {justify-content: left; padding-left: 15px; }
.formStyle .label_20 .label_h label + select,
.formStyle .label_20 .label_h label + textarea,
.formStyle .label_20 .label_h label + .datetime,
.formStyle .label_20 .label_h label + .input_bgStyle,
.formStyle .label_20 .label_h label + .check_area,
.formStyle .label_20 .label_h label + div{width: calc(100% - 200px); }
.formStyle .label_20 .label_h label + .radio_area{width: 200px; }
.formStyle .label_20 .label_h input + input{width: 110px; }
.formStyle .label_20 .label_h label + input{width: 110px; }
.formStyle .label_20 .label_h label div + input{width: 110px; }
.formStyle .label_20 .label_h > input:first-child{width: calc(380px - 4px); }
.formStyle .label_20 .label_h .logging_level{margin-left: 380px; }

.formStyle .label_h .label20 > div{position: relative; display: flex; justify-content: left; align-items: flex-start; }

.formStyle .label_h > div .wnth2{width: 146px; }
.formStyle .label_h > div .wnth2 + div,
.formStyle .label_h > div .wnth2 + input,
.formStyle .label_h > div .wnth2 + p.text{display: flex; width: calc(100% - (146px + 4px)); }

.formStyle .label_13 .label_h > div .wnth2{width: 140px; }
.formStyle .label_13 .label_h > div .wnth2 + div,
.formStyle .label_13 .label_h > div .wnth2 + input,
.formStyle .label_13 .label_h > div .wnth2 + p.text{display: flex; width: calc(100% - (140px + 4px)); }

.formStyle .label_16 .label_h > div .wnth2{width: 134px; }
.formStyle .label_16 .label_h > div .wnth2 + div,
.formStyle .label_16 .label_h > div .wnth2 + input,
.formStyle .label_16 .label_h > div .wnth2 + p.text{display: flex; width: calc(100% - (134px + 4px)); }

.formStyle .label_20 .label_h > div .wnth2{width: 134px; }
.formStyle .label_20 .label_h > div .wnth2 + div,
.formStyle .label_20 .label_h > div .wnth2 + p.text{display: flex; width: calc(100% - (134px + 4px)); }
.formStyle .label_20 .label_h > div + input{width: 110px; }

.formStyle .label_h > div .digit_15{width: 180px; }
.formStyle .label_h > div .digit_15 + div,
.formStyle .label_h > div .digit_15 + input,
.formStyle .label_h > div .digit_15 + p.text{display: flex; width: calc(100% - (180px + 4px)); }

.formStyle .label_h > div .digit_20{width: 220px; }
.formStyle .label_h > div .digit_20 + div,
.formStyle .label_h > div .digit_20 + input,
.formStyle .label_h > div .digit_20 + p.text{display: flex; width: calc(100% - (220px + 4px)); }

.formStyle .label_h > div .digit_25{width: 260px; }
.formStyle .label_h > div .digit_25 + div,
.formStyle .label_h > div .digit_25 + input,
.formStyle .label_h > div .digit_25 + p.text{display: flex; width: calc(100% - (260px + 4px)); }

/* 에러 메시지 */
.formStyle .logging_level{width: 100%; flex-wrap: wrap; }
.formStyle .logging_level p{width: 100%; font-size: 11px; line-height: 14px; text-align: left; border-radius: 3px; padding: 0px 5px; margin-top: 2px; }
.formStyle .logging_level .error_fatal{color: #980000; background: #EACCCC; }
.formStyle .logging_level .error_error{color: #F23030; background: #F4D8DB; }
.formStyle .logging_level .error_warn{color: #FF6F00; background: #FFE2CC; }
.formStyle .logging_level .error_info{color: #FDA60E; background: #FFEDCF; }
.formStyle .logging_level .error_debug{color: #23B447; background: #D3F0DA; }
.formStyle .logging_level .error_trace{color: #1B59FA; background: #D1DEFE; }

/* 혼합  - 텍스트 + input + input_bgStyle */
.formStyle .label_h > div.mix{align-items: baseline; }
.formStyle .label_h > div .mix{display: flex; flex-wrap: wrap; align-items: center; }

.formStyle .label_h .mix p:not(.input_bgStyle > p),
.formStyle .label_h .mix p + div{white-space: nowrap; margin: 1px 5px 1px 0; }

.formStyle .label_h .mix + .logging_level p{margin-top: 1px; }

/* 역방향 */
.formStyle .label_h .reverse{flex-direction: row-reverse; }
.formStyle .label_h .reverse .mr04{margin-left: 4px; margin-right: 0px !important; }

/* 주소표시 : 세로형 */
.formStyle .label_h .row{flex-direction: column; }
.formStyle .label_h .row > div:not(:last-child){margin-bottom: 6px; }
.formStyle .label_h .row > div:not(.wnth2){width: 100% !important; }

/* 데이터영역 - 입력 */
.formStyle input,
.formStyle select,
.formStyle textarea,
.formStyle .textareaComment,
.formStyle .select{width: 100%; height: 24px; font-size: 13px; line-height: 18px; background-color: #FFFFFF; border: 1px solid #C8C8C8; border-radius: 4px; box-sizing: border-box; padding: 2px 5px; transition: all 0.3s ease; }
.formStyle select,
.formStyle .select{background: #FFFFFF url(../images/ico/arrow/select_down2.svg) no-repeat calc(100% + 1px) 50%; padding: 2px 34px 3px 5px; }
.formStyle textarea{height: calc((16px * 4) + 8px); }
.formStyle textarea.textarea_line1{min-height: calc((16px * 1) + 8px); max-height: calc((16px * 1) + 8px); }
.formStyle textarea.textarea_line2{min-height: calc((16px * 2) + 8px); max-height: calc((16px * 2) + 8px); }
.formStyle textarea.textarea_line3{min-height: calc((16px * 3) + 8px); max-height: calc((16px * 3) + 8px); }
.formStyle textarea.textarea_line4{min-height: calc((16px * 4) + 8px); max-height: calc((16px * 4) + 8px); }
.formStyle textarea.textarea_line5{min-height: calc((16px * 5) + 8px); max-height: calc((16px * 5) + 8px); }
.formStyle textarea.textarea_line6{min-height: calc((16px * 6) + 8px); max-height: calc((16px * 6) + 8px); }
.formStyle textarea.textarea_line7{min-height: calc((16px * 7) + 8px); max-height: calc((16px * 7) + 8px); }
.formStyle textarea.textarea_line8{min-height: calc((16px * 8) + 8px); max-height: calc((16px * 8) + 8px); }
.formStyle textarea.textarea_line9{min-height: calc((16px * 9) + 8px); max-height: calc((16px * 9) + 8px); }
.formStyle textarea.textarea_line10{min-height: calc((16px * 10) + 8px); max-height: calc((16px * 10) + 8px); }
.formStyle textarea.textarea_line15{min-height: calc((16px * 15) + 8px); max-height: calc((16px * 15) + 8px); }
.formStyle textarea.textarea_line20{min-height: calc((16px * 20) + 8px); max-height: calc((16px * 20) + 8px); }
.formStyle textarea.textarea_line25{min-height: calc((16px * 25) + 8px); max-height: calc((16px * 25) + 8px); }
.formStyle textarea.textarea_line30{min-height: calc((16px * 30) + 8px); max-height: calc((16px * 30) + 8px); }
.formStyle textarea.textarea_line35{min-height: calc((16px * 35) + 8px); max-height: calc((16px * 35) + 8px); }
.formStyle textarea.textarea_line40{min-height: calc((16px * 40) + 8px); max-height: calc((16px * 40) + 8px); }
.formStyle textarea.textarea_line45{min-height: calc((16px * 45) + 8px); max-height: calc((16px * 45) + 8px); }
.formStyle textarea.textarea_line50{min-height: calc((16px * 50) + 8px); max-height: calc((16px * 50) + 8px); }

.formStyle textarea::-webkit-scrollbar{display: block; }

.formStyle input:focus,
.formStyle select:focus,
.formStyle textarea:focus,
.formStyle .select:focus,
.formStyle .select:hover{background-color: #FFFFFF; border-color: #4176FF; outline: none; }

.formStyle input.error, .formStyle input.error:focus,
.formStyle select.error, .formStyle select.error:focus,
.formStyle textarea.error, .formStyle textarea.error:focus,
.formStyle .select.error, .formStyle .select.error:focus,
.formStyle .select.error, .formStyle .select.error:hover{border-color: #E02447; }

/* Select Div */
.formStyle .select + .option{display: none; position: absolute; z-index: 1; top: 26px; flex-direction: column; width: 100%; background: #FFFFFF; border: 1px solid #C8C8C8; border-radius: 4px; overflow: hidden; }
.formStyle .select + .option li{height: 24px; font-size: 13px; line-height: 24px; padding: 0px 5px; }
.formStyle .select.on + .option{display: block; }

.formStyle .select + .option li:hover{opacity: 0.9; }

/* Input + 우측정렬 */
.formStyle input.tr{text-align: right; }
.formStyle .clearInput input.tr{padding: 2px 5px; }
.formStyle .clearInput input.tr + button{left: 4px; }

/* Input + Icon */
.formStyle .icon_left input{background-repeat: no-repeat; background-position: 6px 50%; background-size: 16px; padding-left: 29px; }
.formStyle .icon_right input{background-repeat: no-repeat; background-position: calc(100% - 6px) 50%; background-size: 16px; padding-right: 29px; }

.formStyle .ico_user{background-image: url(../images/ico/user/user_style1.svg); }
.formStyle .ico_mail{background-image: url(../images/ico/mail/mail_style2.svg); }

/* Input + Span : 입력(원, m²) */
.formStyle .inputText{position: relative; display: flex; align-items: center; }
.formStyle .inputText input{text-align: right; padding: 2px 24px 2px 5px; }
.formStyle .inputText > span{position: absolute; right: 0px; width: 24px; color: #666666; text-align: center; }
.formStyle .inputText > span.unit_kor{text-align: right; padding: 2px 6px 2px 0px; }
.formStyle .inputText > span.unit_eng{text-align: right; padding: 2px 10px 2px 0px; }
.formStyle .inputText > span.unit_eng sup{position: absolute; top: 11px; }
.formStyle .inputText + .logging_level{margin-left: 0px; }

/* Input Clear */
.formStyle .clearInput{position: relative; }
.formStyle .clearInput input{padding: 2px 22px 2px 5px; }
.formStyle .clearInput button{display: none; position: absolute; right: 4px; top: 4px; display: block; overflow: hidden; text-indent: -999em; width: 16px; height: 16px; background: #C8C8C8 url(../images/ico/cross/cross_8_white.svg) no-repeat 50% 50%; border-radius: 50%; }
.formStyle .clearInput button:hover{background-color: #666666; }
.formStyle .clearInput input:focus + button{display: block; }

.formStyle .inputBtn .clearInput input{padding: 2px 51px 2px 5px; }
.formStyle .inputBtn .clearInput button{right: 33px; }

.formStyle .clearInput .inputText input{padding: 2px 24px 2px 22px; }
.formStyle .clearInput .inputText + button{left: 4px; }

/* Input + Button */
.formStyle .inputBtn{position: relative; }
.formStyle .inputBtn input{padding: 2px 34px 2px 5px; }

.formStyle .inputBtn > .date + div button,
.formStyle .inputBtn > button,
.formStyle .inputBtn > a{position: absolute; top: 1px; right: 0px; display: block; overflow: hidden; text-indent: -999em; width: 30px; height: 22px; background-repeat: no-repeat; background-position: 50% 50%; background-size: 16px; border-left: 1px solid #C8C8C8; cursor: pointer; }

/* Input + Button + Icon */
/* 검색 */
.formStyle .search + button{background-image: url(../images/ico/search/search_style1.svg); }
.formStyle .search + button:focus,
.formStyle .search:focus + button{background-image: url(../images/ico/search/search_style1_blue.svg); }

/* 달력 */
.formStyle .date + button,
.formStyle .date + div button{background-image: url(../images/ico/calendar/calendar_style1.svg); }
.formStyle .date + button:focus,
.formStyle .date + div button:focus,
.formStyle .date:focus + button,
.formStyle .date:focus + div button{background-image: url(../images/ico/calendar/calendar_style1_blue.svg); }

/* 전화걸기 */
.formStyle .phone + button,
.formStyle .phone + a{width: 29px; background-image: url(../images/ico/phone/phone_style2_fill.svg); }
.formStyle .phone + button:focus,
.formStyle .phone:focus + button,
.formStyle .phone + a:focus,
.formStyle .phone:focus + a{background-image: url(../images/ico/phone/phone_style2_fill_blue.svg); }

/* 달력 - 달력 */
.formStyle .cldDash{display: flex; width: auto !important; }

/* 달력 - 년 + 월 + 일 */
.formStyle .cld_day > div{width: 130px !important; }
.formStyle .cld_day > div.input_bgStyle{width: calc(130px - 40px) !important; }

/* 달력 - 년 + 월 */
.formStyle .cld_month > div{width: 110px !important; }
.formStyle .cld_month > div.input_bgStyle{width: calc(110px - 40px) !important; }

/* 달력 - 년 */
.formStyle .cld_year > div{width: 90px !important; }
.formStyle .cld_year > div.input_bgStyle{width: calc(90px - 40px) !important; }

/* 달력 + 날일표시 */
.formStyle .countDay{width: auto !important; margin-left: 4px; }

/* Input + btnArea */
.formStyle .inputBtnArea{display: flex; justify-content: space-between; }
.formStyle .inputBtnArea .clearInput{width: calc(100% - (80px + 4px)); }
.formStyle .inputBtnArea .clearInput + .btnArea{margin: 0; }
.formStyle .inputBtnArea .clearInput + .btnArea button{width: 80px; margin: 0; }

/* Textarea - 댓글 */
.formStyle .textareaComment{height: auto; }
.formStyle .textareaComment p{margin-bottom: 2px; }
.formStyle .textareaComment textarea{border-style: dashed; padding: 2px 0; }
.formStyle .textareaComment .btnArea{justify-content: flex-end; margin: 2px -2px 0 0; }

/* 파일첨부 Drag */
.formStyle .flex_column .btnArea button span{padding: 0px; }

.formStyle .fileDragArea{width: 100%; min-height: 120px; margin: 2px 0 3px; }
.formStyle .fileDragArea > div,
.formStyle .fileDragArea > section{border: 1px solid #C8C8C8; border-radius: 4px; overflow: hidden; }
.formStyle .fileDragArea > div:hover,
.formStyle .fileDragArea > section:hover{border: 1px solid #4176FF; }

/* 파일첨부 Drag - 비활성 */
.formStyle .fileDragArea .placeholder{display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; cursor: pointer; }
.formStyle .fileDragArea .placeholder span{font-size: 14px; color: #888888; background: url(../images/ico/doc/doc_plus_style1_gray.svg) no-repeat 0 50%; padding-left: 34px; }
.formStyle .fileDragArea .placeholder:hover span{color: #4176FF; background-image: url(../images/ico/doc/doc_plus_style1_blue.svg); }

/* 파일첨부 Drag - 테이블 스타일 */
.formStyle .fileDragArea .file_tableList ul{position: relative; align-items: center; height: 30px; }
.formStyle .fileDragArea .file_tableList ul li{line-height: 18px; padding: 6px 0px; }

.formStyle .fileDragArea .file_tableList .thead{background: #FAFAFC; padding: 0 10px 0 11px; }
.formStyle .fileDragArea .file_tableList .tbody > div{height: 100px; overflow-x: hidden; overflow-y: scroll; }
.formStyle .fileDragArea .file_tableList .tbody ul{padding: 0 4px 0 11px; }

/* type_doc : 확대보기 버튼 없음 */
.formStyle .fileDragArea .file_tableList.type_doc ul li.file_title{width: calc(100% - (16px + 100px + 60px)); }

/* type_img */
.formStyle .fileDragArea .file_tableList.type_img ul li.file_title{width: calc(100% - (16px + 100px + 60px + 60px)); }

.formStyle .fileDragArea .file_tableList ul li.file_delete{display: flex; align-items: center; justify-content: center; width: 16px; }
.formStyle .fileDragArea .file_tableList ul li.file_title{min-width: 100px; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-left: 10px; }
.formStyle .fileDragArea .file_tableList ul li.file_volume{width: 100px; text-align: right; padding-right: 10px; }
.formStyle .fileDragArea .file_tableList ul li.file_expand,
.formStyle .fileDragArea .file_tableList ul li.file_download{display: flex; align-items: center; justify-content: center; width: 60px; }

.formStyle .fileDragArea .file_tableList ul li button{display: block; overflow: hidden; text-indent: -999em; }
.formStyle .fileDragArea .file_tableList ul li.file_delete button{width: 12px; height: 12px; background: url(../images/ico/cross/cross_8_gray.svg) no-repeat 50% 50%; background-size: 12px; }
.formStyle .fileDragArea .file_tableList .tbody ul li.file_delete button{background-image: url(../images/ico/cross/cross_8.svg); }
.formStyle .fileDragArea .file_tableList .tbody ul li.file_expand button,
.formStyle .fileDragArea .file_tableList .tbody ul li.file_download button{width: 20px; height: 20px; background-color: #FFFFFF; background-repeat: no-repeat; background-position: 50% 50%; background-size: 12px; border: 1px solid #A8A8A8; border-radius: 4px; }
.formStyle .fileDragArea .file_tableList .tbody ul li.file_expand button{background-image: url(../images/ico/interface/expand_style1.svg); }
.formStyle .fileDragArea .file_tableList .tbody ul li.file_download button{background-image: url(../images/ico/download/download_style2.svg); }
.formStyle .fileDragArea .file_tableList .tbody ul li.file_expand button:hover,
.formStyle .fileDragArea .file_tableList .tbody ul li.file_download button:hover{border-color: #666666; }

.formStyle .fileDragArea .file_tableList .tbody ul.delete{background: rgba(245,101,101,0.05)/* #F56565 */; }
.formStyle .fileDragArea .file_tableList .tbody ul.delete li.file_delete button{width: 16px; height: 16px; background: url(../images/ico/refresh/refresh_style1_red.svg) no-repeat 50% 50%; background-size: 16px;}
.formStyle .fileDragArea .file_tableList .tbody ul.delete li.file_title,
.formStyle .fileDragArea .file_tableList .tbody ul.delete li.file_volume{color: #F56565; text-decoration: line-through; }

/* 파일첨부 Drag - 이미지 스타일 */
.formStyle .fileDragArea .galleryBoxArea ul{margin: 2px; }
.formStyle .fileDragArea .galleryBoxArea ul li{width: 106px; height: 110px; }
.formStyle .fileDragArea .galleryBoxArea ul li dl.img_text dt{width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.formStyle .fileDragArea .galleryBoxArea ul li.delete::after{content: ""; position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; background: rgba(245,101,101,0.3)/* #F56565 */; border: 1px solid #F56565; border-radius: 4px; box-sizing: border-box; }
.formStyle .fileDragArea .galleryBoxArea ul li.delete dl.btn dd.delete a{z-index: 2; background-color: #F56565; background-image: url(../images/ico/refresh/refresh_style1_white.svg); background-size: 14px; }
.formStyle .fileDragArea .galleryBoxArea ul li.delete dl.img_text dt{text-decoration: line-through; }

/* 파일첨부 Drag - Tab 스타일 */
.formStyle .flex_column .tabs{position: relative; overflow: visible; }
.formStyle .flex_column .tabs ul.tabs_btn{position: absolute; right: 0px; top: -24px; display: flex; align-items: center; }

.formStyle .flex_column .tabs ul.tabs_btn li{min-width: 24px; }
.formStyle .flex_column .tabs ul.tabs_btn li a span{display: block; overflow: hidden; text-indent: -999em; width: 24px; height: 24px; background-repeat: no-repeat; background-position: 50% 50%; background-size: 18px; }
.formStyle .flex_column .tabs ul.tabs_btn li:first-child a span{background-image: url(../images/ico/sort/sort_list_gray.svg); }
.formStyle .flex_column .tabs ul.tabs_btn li:last-child a span{background-image: url(../images/ico/sort/sort_block_gray.svg); }
.formStyle .flex_column .tabs ul.tabs_btn li:first-child.tab_current a span{background-image: url(../images/ico/sort/sort_list_blue.svg); }
.formStyle .flex_column .tabs ul.tabs_btn li:last-child.tab_current a span{background-image: url(../images/ico/sort/sort_block_blue.svg); }

.formStyle .flex_column .file_tableList ul li{min-width: auto; }

/* 이중Tab - [Tab] + [Tab: 리스트 & 썸네일] */
.tabs.box_style6 ul.tabs_btn li a{background: none !important; box-shadow: none !important; padding: 0; }

/* 사인입력 */
.formStyle .sign{position: relative; width: 100%; height: 200px; }
.formStyle .sign button{position: absolute; z-index: 1; display: block; overflow: hidden; text-indent: -999em; width: 20px; height: 20px; background-color: rgba(213,213,213,0.5)/* #D5D5D5 */; background-repeat: no-repeat; background-position: 50% 50%; background-size: 14px; border-radius: 4px; }
.formStyle .sign button:nth-child(1){top: 5px; right: 5px; }
.formStyle .sign button:nth-child(2){top: 30px; right: 5px; }
.formStyle .sign button:nth-child(3){top: 55px; right: 5px; }
.formStyle .sign button.btn_file{background-image: url(../images/ico/file/file_style1_gray6.svg); }
.formStyle .sign button.btn_edit{background-image: url(../images/ico/edit/edit_style2_gray6.svg); }
.formStyle .sign button.btn_save{background-image: url(../images/ico/save/save_style1_gray6.svg); }
.formStyle .sign button.btn_file:hover{background-color: #4176FF; background-image: url(../images/ico/file/file_style1_white.svg); }
.formStyle .sign button.btn_edit:hover{background-color: #4176FF; background-image: url(../images/ico/edit/edit_style2_white.svg); }
.formStyle .sign button.btn_save:hover{background-color: #4176FF; background-image: url(../images/ico/save/save_style1_white.svg); }
.formStyle .sign canvas{position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #FFFFFF; background-size: contain; border: 1px solid #C8C8C8; border-radius: 4px; }
.formStyle .sign.input_bgStyle canvas{background-color: #F2F3F9; border: 1px solid #E5E5E5; }

/* 데이터영역 - 상세 */
.formStyle .input_bgStyle{position: relative; width: 100%; }
.formStyle .input_bgStyle .text,
.formStyle .input_bgStyle .textarea,
.formStyle .input_bgStyle .textareaComment{min-height: 24px; text-align: left; background: #F2F3F9; border: 1px solid #E5E5E5; border-radius: 4px; padding: 2px 5px; }
.formStyle .input_bgStyle .textarea{overflow-y: auto; }
.formStyle .input_bgStyle .textarea.textarea_line1{min-height: calc((16px * 1) + 8px); max-height: calc((16px * 1) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line2{min-height: calc((16px * 2) + 8px); max-height: calc((16px * 2) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line3{min-height: calc((16px * 3) + 8px); max-height: calc((16px * 3) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line4{min-height: calc((16px * 4) + 8px); max-height: calc((16px * 4) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line5{min-height: calc((16px * 5) + 8px); max-height: calc((16px * 5) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line6{min-height: calc((16px * 6) + 8px); max-height: calc((16px * 6) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line7{min-height: calc((16px * 7) + 8px); max-height: calc((16px * 7) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line8{min-height: calc((16px * 8) + 8px); max-height: calc((16px * 8) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line9{min-height: calc((16px * 9) + 8px); max-height: calc((16px * 9) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line10{min-height: calc((16px * 10) + 8px); max-height: calc((16px * 10) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line15{min-height: calc((16px * 15) + 8px); max-height: calc((16px * 15) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line20{min-height: calc((16px * 20) + 8px); max-height: calc((16px * 20) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line25{min-height: calc((16px * 25) + 8px); max-height: calc((16px * 25) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line30{min-height: calc((16px * 30) + 8px); max-height: calc((16px * 30) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line35{min-height: calc((16px * 35) + 8px); max-height: calc((16px * 35) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line40{min-height: calc((16px * 40) + 8px); max-height: calc((16px * 40) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line45{min-height: calc((16px * 45) + 8px); max-height: calc((16px * 45) + 8px); }
.formStyle .input_bgStyle .textarea.textarea_line50{min-height: calc((16px * 50) + 8px); max-height: calc((16px * 50) + 8px); }
.formStyle .input_bgStyle .textarea.auto{max-height: fit-content !important; }

.formStyle .input_bgStyle .text em:not(:last-child){border-right: 1px solid #C8C8C8; padding-right: 10px; margin-right: 10px; }

/* Input + Span : 상세 */
.formStyle .text{width: 100%; min-height: 30px; font-size: 13px; line-height: 18px; color: #333333; text-align: left; transition: all 0.3s ease; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.formStyle .textarea{width: 100%; min-height: 30px; font-size: 13px; line-height: 18px; padding: 5px 7px; transition: all 0.3s ease; white-space: pre-wrap; }

/* Input + Span : 상세(원, m²) */
.formStyle .input_bgStyle .text.span{position: relative; text-align: right; padding: 2px 24px 2px 5px; }
.formStyle .input_bgStyle .text.span span{position: absolute; top: -1px; right: -1px; width: 24px; text-align: center; }
.formStyle .input_bgStyle .text.span span.unit_kor{text-align: right; padding: 2px 6px 2px 0px; }
.formStyle .input_bgStyle .text.span span.unit_eng{text-align: right; padding: 2px 10px 2px 0px; }
.formStyle .input_bgStyle .text.span span.unit_eng sup{position: absolute; top: 11px; }

/* Textarea - 댓글 */
.formStyle .input_bgStyle .textareaComment dl{display: flex; align-items: center; margin-bottom: 4px; }
.formStyle .input_bgStyle .textareaComment dd{font-size: 12px; color: #666666; margin-left: 5px; }
.formStyle .input_bgStyle .textareaComment .textarea{min-height: auto; border: none; padding: 0 0; margin: 0; }

/* 파일첨부 : 파일이 없습니다 */
.formStyle .input_bgStyle .text.img{padding: 2px 3px 2px 3px; }
.formStyle .input_bgStyle .text.file{padding: 2px 24px 2px 3px; }
.formStyle .input_bgStyle .text.img.btn_nth2,
.formStyle .input_bgStyle .text.file.btn_nth2{padding: 2px 40px 2px 3px; }
.formStyle .input_bgStyle .text.img.btn_nth2 button.download,
.formStyle .input_bgStyle .text.file.btn_nth2 button.download{right: 23px; }
.formStyle .input_bgStyle .text.img p,
.formStyle .input_bgStyle .text.file p{width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background-repeat: no-repeat; background-position: 0 0; background-size: 16px; padding-left: 19px; }
.formStyle .input_bgStyle .text.img p{background-image: url(../images/ico/picture/picture_style1_blue.svg); }
.formStyle .input_bgStyle .text.file p{background-image: url(../images/ico/file/file_style1_blue.svg); }

/* 파일첨부 : 파일 리스트 */
.formStyle .input_bgStyle .text.file_list p{display: flex; align-items: center; }
.formStyle .input_bgStyle .text.file_list .file_download{padding: 0; margin-right: 6px; }
.formStyle .input_bgStyle .text.file_list .file_download a{display: block; overflow: hidden; text-indent: -999em; width: 20px; height: 20px; background: #FFFFFF url(../images/ico/download/download_style2.svg) no-repeat 50% 50%; background-size: 12px; border: 1px solid #A8A8A8; border-radius: 4px; box-sizing: border-box; }
.formStyle .input_bgStyle .text.file_list .file_download a:hover{border-color: #666666; }
.formStyle .input_bgStyle .text.file_list .file_volume{font-size: 12px; color: #666666; }

/* 파일첨부 : 파일 썸네일 */
.formStyle .input_bgStyle .text.fileDragArea{padding: 0; }
.formStyle .input_bgStyle .text.fileDragArea .galleryBoxArea{border: none; }

/* Text + Button */
.formStyle .input_bgStyle.textBtn{display: flex; }

.formStyle .input_bgStyle.textBtn .text{position: relative; display: flex; align-items: center; justify-content: space-between; width: calc(100% - 29px); border-radius: 4px 0 0 4px !important; }
.formStyle .input_bgStyle.textBtn .text p,
.formStyle .input_bgStyle.textBtn .text ul{width: calc(100% - 24px); }
.formStyle .input_bgStyle.textBtn .text li:not(:last-child){margin-right: 10px; }

.formStyle .input_bgStyle .text button{position: absolute; top: 4px; right: 4px; display: block; overflow: hidden; text-indent: -999em; width: 16px; height: 16px; background-color: #C8C8C8; background-repeat: no-repeat; background-position: 50% 50%; border-radius: 50%; }
.formStyle .input_bgStyle .text button:hover{background-color: #666666; }

.formStyle .input_bgStyle .text button.clearInput{background-image: url(../images/ico/cross/cross_8_white.svg); }
.formStyle .input_bgStyle .text button.download{background-image: url(../images/ico/download/download_style3_white.svg); background-size: 12px; }

.formStyle .input_bgStyle.textBtn .text button.clearInput{right: 3px; top: 3px; }

.formStyle .input_bgStyle.textBtn .text + button,
.formStyle .input_bgStyle.textBtn .text + a{display: block; overflow: hidden; text-indent: -999em; width: 29px; height: 24px; background-repeat: no-repeat; background-position: 50%; background-size: 16px; border: 1px solid #E5E5E5; border-width: 1px 1px 1px 0; border-radius: 0 4px 4px 0; box-sizing: border-box; cursor: pointer; }

.formStyle .input_bgStyle.textBtn button.filter{background-image: url(../images/ico/filter/filter_style1.svg); }
.formStyle .input_bgStyle.textBtn button.filter:hover{background-image: url(../images/ico/filter/filter_style1_blue.svg); }
.formStyle .input_bgStyle.textBtn button.filter.on,
.formStyle .input_bgStyle.textBtn button.filter.on:hover{background-color: #4176FF; background-image: url(../images/ico/filter/filter_style1_white.svg); border-color: #4176FF; }

.formStyle .input_bgStyle.textBtn button.search{background-color: #FFFFFF; background-image: url(../images/ico/search/search_style1.svg); }
.formStyle .input_bgStyle.textBtn button.search:hover{background-image: url(../images/ico/search/search_style1_blue.svg); }
.formStyle .input_bgStyle.textBtn button.search.on{background-color: #4176FF; background-image: url(../images/ico/search/search_style1_white.svg); border-color: #4176FF; }

.formStyle .input_bgStyle.textBtn .phone{background-color: #FFFFFF; background-image: url(../images/ico/phone/phone_style2_fill.svg); }
.formStyle .input_bgStyle.textBtn .phone:hover{background-image: url(../images/ico/phone/phone_style2_fill_blue.svg); }
.formStyle .input_bgStyle.textBtn .phone.on{background-color: #4176FF; background-image: url(../images/ico/phone/phone_style2_fill_white.svg); border-color: #4176FF; }


/* Checkbox Btn & Radio Btn ********************************************************************************/
.formStyle ul{display: flex; flex-wrap: wrap; }
.check_area li,
.radio_area li{display: flex; align-items: center; height: 18px; margin: 3px 15px 3px 0; }
.check_area input,
.radio_area input{display: none; }
.check_area label,
.radio_area label{display: inline-block; width: auto !important; min-height: 18px; font-size: 13px; line-height: 16px; color: #333333; background-repeat: no-repeat; background-position: 0 50%; background-size: 18px !important; padding: 0 0 0 22px !important; cursor: pointer; }
.check_area label.disabled,
.radio_area label.disabled{cursor: default; pointer-events: none; }
/* .check_area input[type="checkbox"]:checked + label,
.radio_area input[type="radio"]:checked + label{color: #4176FF; } */

/* Checkbox Btn */
.check_area.basic.style1 label{background-image: url(../images/btn/check/check_style2_none_gray.svg); }
.check_area.basic.style2 label{background-image: url(../images/btn/check/check_style2_gray.svg); }
.check_area.basic label.disabled{background-image: url(../images/btn/check/check_style2_fill_gray.svg); }
.check_area.basic label.disabled.nocheck{background-image: url(../images/btn/check/check_style2_disabled_gray.svg); }

.check_area.basic input[type="checkbox"]:checked + label{background-image: url(../images/btn/check/check_style2_fill_blue.svg); }

.check_area.round.style1 label{background-image: url(../images/btn/check/check_style1_none_gray.svg); }
.check_area.round.style2 label{background-image: url(../images/btn/check/check_style1_gray.svg); }
.check_area.round label.disabled{background-image: url(../images/btn/check/check_style1_fill_gray.svg); }
.check_area.round label.disabled.nocheck{background-image: url(../images/btn/check/check_style1_disabled_gray.svg); }

.check_area.round input[type="checkbox"]:checked + label{background-image: url(../images/btn/check/check_style1_fill_blue.svg); }

/* Radio Btn */
.radio_area label{background-image: url(../images/btn/check/check_style1_none_gray.svg); }
.radio_area.style3 label{background-image: url(../images/btn/check/check_style1_gray.svg); }

.radio_area.style1 label.disabled{background-image: url(../images/btn/radio/radio_style2_gray.svg); }
.radio_area.style2 label.disabled{background-image: url(../images/btn/radio/radio_style1_gray.svg); }
.radio_area.style3 label.disabled{background-image: url(../images/btn/check/check_style1_fill_gray.svg); }

.radio_area.style1 input[type="radio"]:checked + label{background-image: url(../images/btn/radio/radio_style2_blue.svg); }
.radio_area.style2 input[type="radio"]:checked + label{background-image: url(../images/btn/radio/radio_style1_blue.svg); }
.radio_area.style3 input[type="radio"]:checked + label{background-image: url(../images/btn/check/check_style1_fill_blue.svg); }


/* Button Style ********************************************************************************************/
.btnArea{display: flex; flex-wrap: wrap; align-items: center; }
.btnArea button{position: relative; display: inline-flex; text-align: center; justify-content: center; border-radius: 4px; box-sizing: border-box; margin: 2px; outline: none; cursor: pointer; }

/* Button : 버튼 사이즈 */
.btnArea button.btn_h24{min-width: 64px; padding: 2px 4px; }
.btnArea button.btn_h30{min-width: 64px; padding: 5px 3px; }

.btnArea button.btn_h24 span,
.btnArea button.btn_h30 span{font-size: 13px; line-height: 18px; padding: 0; }

/* Button : 버튼에 아이콘 */
.btnArea button .ico{display: inline-block; background-repeat: no-repeat; }

.btnArea button.btn_h24 .ico{background-size: 16px; }
.btnArea button.btn_h30 .ico{background-size: 18px; }

.btnArea button.btn_h24 .ico.left{background-position: 0px 50%; padding-left: 18px; }
.btnArea button.btn_h30 .ico.left{background-position: 0px 50%; padding-left: 20px; }
.btnArea button.btn_h24 .ico.right{background-position: 100% 50%; padding-right: 18px; }
.btnArea button.btn_h30 .ico.right{background-position: 100% 50%; padding-right: 20px; }

/* Button : 버튼에 아이콘 사이즈 */
.btnArea button.btn_h24 .ico_plus,
.btnArea button.btn_h24 .ico_minus{background-size: 10px; }
.btnArea button.btn_h30 .ico_plus,
.btnArea button.btn_h30 .ico_minus{background-size: 12px; }

.btnArea button.btn_h24 .ico_upload,
.btnArea button.btn_h24 .ico_download{background-size: 14px; }
.btnArea button.btn_h30 .ico_upload,
.btnArea button.btn_h30 .ico_download{background-size: 16px; }

.btnArea button.btn_h24 .ico_up,
.btnArea button.btn_h24 .ico_down,
.btnArea button.btn_h24 .ico_left,
.btnArea button.btn_h24 .ico_right{background-size: 20px; }
.btnArea button.btn_h30 .ico_up,
.btnArea button.btn_h30 .ico_down,
.btnArea button.btn_h30 .ico_left,
.btnArea button.btn_h30 .ico_right{background-size: 22px; }

/* Button : 버튼에 아이콘만 있는경우 */
.btnArea button.btn_h24.ico_only{min-width: 24px; padding: 3px 0px; }
.btnArea button.btn_h30.ico_only{min-width: 30px; padding: 5px 0px; }

.btnArea button.ico_only .ico{display: block; overflow: hidden; text-indent: -999em; line-height: inherit; background-position: 50% 50%; }
.btnArea button.btn_h24.ico_only .ico{width: 16px; height: 16px; }
.btnArea button.btn_h30.ico_only .ico{width: 18px; height: 18px; }

/* Button : 그룹버튼 */
.btnArea .groupBtnArea{display: inline-flex; margin: 2px; }
.btnArea .groupBtnArea button{margin: 0; }
.btnArea .groupBtnArea button:hover{z-index: 3; }
.btnArea .groupBtnArea button:not(:first-child){margin: 0 0 0 -1px; }
.btnArea .groupBtnArea button:not(:first-child),
.btnArea .groupBtnArea button:not(:last-child){border-radius: 0; }
.btnArea .groupBtnArea button:first-child{border-radius: 4px 0 0 4px; }
.btnArea .groupBtnArea button:last-child{border-radius: 0 4px 4px 0; }

/* Button : Dropdown Style */
.btnArea button .dropdown_btn_con{display: none; position: absolute; z-index: 3; right: -1px; border-radius: 4px; box-shadow: 0px 0px 4px rgba(0,0,0,0.2); overflow: hidden; }
.btnArea button .dropdown_btn_con.on{display: block; }

.btnArea button.btn_h24 .dropdown_btn_con{top: 26px; min-width: 87px; }
.btnArea button.btn_h30 .dropdown_btn_con{top: 32px; min-width: 93px; }

.btnArea button .dropdown_btn_con li{position: relative; background: #FFFFFF; border: 1px solid #C8C8C8; }
.btnArea button .dropdown_btn_con li:hover{z-index: 5; background: #F2F2F2; border: 1px solid #A8A8A8; }

.btnArea button .dropdown_btn_con li:first-child{border-radius: 4px 4px 0 0; }
.btnArea button .dropdown_btn_con li:last-child{border-radius: 0 0 4px 4px; }
.btnArea button .dropdown_btn_con li:not(:first-child){margin-top: -1px; }

.btnArea button .dropdown_btn_con li a{display: block; font-size: 13px; text-align: left; line-height: 18px; white-space: nowrap; }
.btnArea button.btn_h24 .dropdown_btn_con li a{padding: 2px 8px; }
.btnArea button.btn_h30 .dropdown_btn_con li a{padding: 5px 8px; }

/* Button : Pagination */
.paging{display: flex; justify-content: center; margin: 20px auto; }
.paging li{margin: 0 2px; }
.paging li a{display: block; font-size: 13px; color: #333333; text-align: center; background-color: #FFFFFF; background-repeat: no-repeat; background-position: 50% 50%; border: 1px solid #D8D8D8; border-radius: 4px; box-sizing: border-box; padding: 0 4px; }
.paging li:hover a{color: #4176FF; border:1px solid #4176FF; }
.paging li.active a{color: #FFFFFF; background: #4176FF; border: 1px solid #4176FF; }

.page_h24 li a{min-width: 24px; height: 24px; line-height: 24px; background-size: 16px; }
.page_h30 li a{min-width: 30px; height: 30px; line-height: 30px; background-size: 18px; }

.paging li.btn-first a{background-image: url(../images/ico/arrow/prev.svg); }
.paging li.btn-prev a{background-image: url(../images/ico/arrow/left.svg); }
.paging li.btn-next a{background-image: url(../images/ico/arrow/right.svg); }
.paging li.btn-last a{background-image: url(../images/ico/arrow/next.svg); }
.paging li.btn-first:hover a{background-image: url(../images/ico/arrow/prev_blue.svg); }
.paging li.btn-prev:hover a{background-image: url(../images/ico/arrow/left_blue.svg); }
.paging li.btn-next:hover a{background-image: url(../images/ico/arrow/right_blue.svg); }
.paging li.btn-last:hover a{background-image: url(../images/ico/arrow/next_blue.svg); }

/* Button : Pagination - paging + viewcount */
.paging_viewcount{position: relative; display: flex; align-items: center; width: 100%; }
.paging_viewcount .viewcount{position: absolute; right: 0px; }
.paging_viewcount .viewcount select{width: 80px; }
.paging_viewcount .page_h30 + .viewcount select{height: 30px; }


/* Switch Style ********************************************************************************************/
.switchArea{position: relative; display: inline-flex; flex-shrink: 0; align-items: center; /* padding: 2px 0; */ }

.switchArea input,
.switchArea label{position: absolute; left: 0; top: 0; }
.switchArea input{width: 0; height: 0; padding: 0; margin: 0; opacity: 0; pointer-events: none; }
.switchArea label{width: 100%; height: 100%; border-radius: 16px; transition: .2s; }

.switchArea .dotImg{position: relative; z-index: 2; left: 2px; border-radius: 50%; transition: left .2s; pointer-events: none; will-change: left; }

/* Switch Style : Switch + Text(켬/끔) */
.switch_text1{margin-right: 16px; }
.switch_text1 .text::before{position: absolute; right: -16px; top: 2px; display: block; content: "끔"; text-align: right; font-size: 12px; color: #666666; }
.switch_text1 input:checked ~ .text::before{content: "켬"; }

/* Switch Style : Window  */
.switch_style1{width: 26px; height: 16px; border-radius: 8px; }
.switch_style1 label{color: transparent; background-color: #D3D3D6; }
.switch_style1 input:checked + label{background-color: #4176FF; }
.switch_style1 input:checked + label + .dotImg{left: calc(100% - 14px); }
.switch_style1 input:focus + label,
.switch_style1 input:active + label{box-shadow: 0 0 0 2px rgba(65,118,255,0.08)/* #4176FF */; }
.switch_style1 input:checked:focus + label,
.switch_style1 input:checked:active + label{box-shadow: 0 0 0 2px rgba(65,118,255,0.2)/* #4176FF */; }

.switch_style1 .dotImg{width: 12px; height: 12px; background-color: #FFFFFF; box-shadow: 0 0 0 2px rgba(0,0,0,0.05); }

/* Switch Style : Mac  */
.switch_style2{width: 36px; height: 14px; border-radius: 7px; margin-top: 3px; }
.switch_style2 label{color: transparent; background-color: rgba(0,0,0,.1); }
.switch_style2 input:checked + label{background-color: rgba(65,118,255,0.2)/* #4176FF */; }
.switch_style2 input:checked + label + .dotImg{left: calc(100% - 22px); background-color: #4176FF; }

.switch_style2 .dotImg{width: 20px; height: 20px; background-color: #F6F8F9; box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 20%), 0 1px 5px 0 rgb(0 0 0 / 12%); }

/* Switch Style : 이미지 or 텍스트  */
.switch_style3{width: calc(36px * 2); background-color: #E5E5E5; border-radius: 12px; }
.switch_style3 li{position: relative; display: inline-block; width: 36px; height: 24px; }
.switch_style3 li label{position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; height: 100%; font-size: 12px; color: #666666; border-radius: 12px; transition: all 0.3s; }
.switch_style3 li label.ico_light,
.switch_style3 li label.ico_dark{background-repeat: no-repeat; background-position: 50% 50%; background-size: 16px; }
.switch_style3 li label.ico_light{background-image: url(../images/ico/weather/sun_style2_gray6.svg); }
.switch_style3 li label.ico_dark{background-image: url(../images/ico/moon/moon_style1_gray6.svg); }
.switch_style3 li input:checked + label{color: #FFFFFF; }
.switch_style3 li input:checked + label.ico_light{background-image: url(../images/ico/weather/sun_style2_white.svg); }
.switch_style3 li input:checked + label.ico_dark{background-image: url(../images/ico/moon/moon_style1_white.svg); }

.switch_style3 li input:checked ~ .dotImg{transform: translateX(100%); }
.switch_style3 .dotImg{position: absolute; z-index: 1; top: 0; left: -100%; width: 36px; height: 24px; background-color: #4176FF; border-radius: 12px; transition: transform 0.3s; }

/* Switch Style : 사각 라운드 텍스트  */
.switch_style4{width: calc(40px * 2); background-color: #FFFFFF; border: 1px solid #4176FF; border-radius: 4px; overflow: hidden; }
.switch_style4 li{position: relative; display: inline-block; width: 40px; height: 24px; }
.switch_style4 li label{position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; height: 100%; font-size: 12px; color: #666666; border-radius: 2px; transition: all 0.3s; }
.switch_style4 li input:checked + label{color: #FFFFFF; }
.switch_style4 li input:checked ~ .dotImg{transform: translateX(100%); }
.switch_style4 .dotImg{position: absolute; z-index: 1; top: 0; left: -100%; width: 40px; height: 24px; background-color: #4176FF; border-radius: 2px; transition: transform 0.3s; }


/* Slider Style ********************************************************************************************/
.slider{display: flex; align-items: flex-start; width: 120px; --slide-thumb-size: 20px; margin: 2px; }

.slider.step1, .slider.step2, .slider.step3, .slider.step4, .slider.step5{width: 120px; }
.slider.step6{width: calc(120px + (10px * 1)); }
.slider.step7{width: calc(120px + (10px * 2)); }
.slider.step8{width: calc(120px + (10px * 3)); }
.slider.step9{width: calc(120px + (10px * 4)); }
.slider.step10{width: calc(120px + (10px * 5)); }
.slider.step11{width: calc(120px + (10px * 6)); }
.slider.step12{width: calc(120px + (10px * 7)); }
.slider.step13{width: calc(120px + (10px * 8)); }
.slider.step14{width: calc(120px + (10px * 9)); }
.slider.step15{width: calc(120px + (10px * 10)); }
.slider.step16{width: calc(120px + (10px * 11)); }
.slider.step17{width: calc(120px + (10px * 12)); }
.slider.step18{width: calc(120px + (10px * 13)); }
.slider.step19{width: calc(120px + (10px * 14)); }
.slider.step20{width: calc(120px + (10px * 15)); }

.slider .slider_range{width: 100%; --slider-fill-value: 0%; --slider-empty-value: 100%; margin-top: 2px; }
.slider .slider_range .slider_input{display: block; width: 100%; appearance: none; }

.slider .slider_range .slider_input::-webkit-slider-thumb{width: 20px; height: 20px; background-color: #FFFFFF; border: none; border-radius: 50%; box-shadow: 0 0px 3px rgba(0,0,0,0.5); margin-top: calc((8px - 20px) * 0.5); appearance: none; cursor: pointer; }
.slider .slider_range .slider_input:focus::-webkit-slider-thumb{box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12),0 3.5px 6px rgba(0, 0, 0, 0.1),0 0 0 3px rgba(65,118,255,0.2)/* #4176FF */; }
.slider .slider_range .slider_input::-webkit-slider-runnable-track{height: 8px; background-image: linear-gradient(to right, #4176FF var(--slider-fill-value), #E5E5E5 var(--slider-fill-value), #E5E5E5 var(--slider-empty-value)); border-radius: 4px; margin-top: calc((20px - 8px) * 0.5); }

.slider .slider_value input{width: 32px; height: 24px; font-size: 13px; text-align: center; border: 1px solid #C8C8C8; border-radius: 4px; margin-left: 4px; }


/* Process Style *******************************************************************************************/
/* Process Bar */
.process{position: relative; width: 100%; height: 10px; line-height: 10px; background: #E2E8F0; border-radius: 4px; margin: 0 auto; }
.process .point{position: absolute; z-index: 2; left: 5px; font-size: 11px; color: #FFFFFF; }
.process.tr .point{right: 5px; }
.process .percent{position: absolute; height: 10px; border-radius: 4px; }

.process.point{height: 20px; line-height: 20px; }
.process.point .percent{height: 20px; }

.process .percent.red{background: #F56565; }
.process .percent.orange{background: #FF9500; }
.process .percent.yellow{background: #FFC126; }
.process .percent.blue{background: #4176FF; }
.process .percent.green{background: #13A850; }
.process .percent.purple{background: #6366F1; }

/* Process Round */
.progress_round{display: flex; align-items: center; justify-content: center; }

.progress_round div{position: relative; }
.progress_round.w80 div{width: 80px; }
.progress_round.w100 div{width: 100px; }

.progress_round div .value{position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); }

.progress_round div svg{display: block; }
.progress_round.w80 div svg{width: 80px; height: 80px; stroke-width: 10px; }
.progress_round.w100 div svg{width: 100px; height: 100px; stroke-width: 10px; }

.progress_round div svg .roundIn{stroke: #E2E8F0; }

.progress_round div svg.red .roundOut{stroke: #F56565; }
.progress_round div svg.orange .roundOut{stroke: #FF9500; }
.progress_round div svg.yellow .roundOut{stroke: #FFC126; }
.progress_round div svg.green .roundOut{stroke: #13A850; }
.progress_round div svg.blue .roundOut{stroke: #4176FF; }
.progress_round div svg.purple .roundOut{stroke: #6366F1; }


/* Table Style *********************************************************************************************/
.table_basic{width: 100%; }
.table_basic thead tr th{height: 33.5px; font-size: 13px; font-weight: normal; line-height: 18px; text-align: center; border: 1px solid #C8C8C8; border-top: 2px solid #333333; border-bottom: 1px solid #A1A1A1; vertical-align: middle; padding: 4px 3px; }

.table_basic tbody tr th,
.table_basic tbody tr td{font-size: 13px; line-height: 18px; font-weight: normal; border: 1px solid #C8C8C8; vertical-align: middle; padding: 4px 3px; }

.table_basic tbody tr:nth-child(odd) td{background-color: #F2F3F9; }
.table_basic tbody tr:nth-child(odd) td:hover{background-color: #E3E4E9; }
.table_basic tbody tr:nth-child(even) td{background-color: #EFF0F7; }
.table_basic tbody tr:nth-child(even) td:hover{background-color: #E0E1E8; }

.table_basic tbody tr td.input,
.table_basic tbody tr td.select,
.table_basic tbody tr td.inputBtn,
.table_basic tbody tr td.textarea{background-color: #FFFFFF; padding: 0px; }

.table_basic tbody tr td.input:hover,
.table_basic tbody tr td.select:hover,
.table_basic tbody tr td.inputBtn:hover,
.table_basic tbody tr td.textarea:hover{background-color: #E7F0FF; border-color: #C8C8C8; }

.table_basic tbody tr td input,
.table_basic tbody tr td select,
.table_basic tbody tr td textarea{width: 100%; font-size: 13px; line-height: 18px; border: none; }

.table_basic tbody tr td input{background-color: transparent; padding: 4px 3px; }
.table_basic tbody tr td.tc input{text-align: center; }
.table_basic tbody tr td.tr input{text-align: right; }

.table_basic tbody tr td select{height: 26px; background: #FFFFFF url(../images/ico/arrow/fill_down_gray6.svg) no-repeat 100% 50%; padding: 3px 24px 3px 3px; }

.table_basic tbody tr td.textarea.rowspan2 textarea{height: calc((27px * 2) - 1px); }
.table_basic tbody tr td.textarea.rowspan3 textarea{height: calc((27px * 3) - 1px); }
.table_basic tbody tr td.textarea.rowspan4 textarea{height: calc((27px * 4) - 1px); }
.table_basic tbody tr td.textarea.rowspan5 textarea{height: calc((27px * 5) - 1px); }
.table_basic tbody tr td.textarea.rowspan6 textarea{height: calc((27px * 6) - 1px); }
.table_basic tbody tr td.textarea.rowspan7 textarea{height: calc((27px * 7) - 1px); }
.table_basic tbody tr td.textarea.rowspan8 textarea{height: calc((27px * 8) - 1px); }
.table_basic tbody tr td.textarea.rowspan9 textarea{height: calc((27px * 9) - 1px); }
.table_basic tbody tr td.textarea.rowspan10 textarea{height: calc((27px * 10) - 1px); }

.table_basic .inputBtn > button{top: 0px; height: 27px; }
.table_basic .inputBtn input{border-radius: 0px; }

/* Input Clear */
.table_basic .clearInput{position: relative; }
.table_basic .clearInput input{padding: 4px 22px 4px 5px; }
.table_basic .clearInput button{display: none; position: absolute; right: 4px; top: 5px; display: block; overflow: hidden; text-indent: -999em; width: 16px; height: 16px; background: #C8C8C8 url(../images/ico/cross/cross_8_white.svg) no-repeat 50% 50%; border-radius: 50%; }
.table_basic .clearInput.date button{right: 34px; top: 4px; }
.table_basic .clearInput button:hover{background-color: #666666; }
.table_basic .clearInput input:focus + button{display: block; }
.table_basic .tc .clearInput input{padding: 4px 22px 4px 22px; }
.table_basic .tr .clearInput button{left: 4px; }
.table_basic .tr .clearInput input{padding: 4px 5px 4px 22px; }

/* Tbody Scroll */
.table_basic.tbody_scroll{border-bottom: 1px solid #C8C8C8; }
.table_basic.tbody_scroll thead tr,
.table_basic.tbody_scroll tbody tr{display: table; width: 100%; }

.table_basic.tbody_scroll tbody{display: block; overflow-y: scroll; }
.table_basic.tbody_scroll tbody.tr2{max-height: calc((27px * 2) - 1px); }
.table_basic.tbody_scroll tbody.tr3{max-height: calc((27px * 3) - 1px); }
.table_basic.tbody_scroll tbody.tr4{max-height: calc((27px * 4) - 1px); }
.table_basic.tbody_scroll tbody.tr5{max-height: calc((27px * 5) - 1px); }
.table_basic.tbody_scroll tbody.tr6{max-height: calc((27px * 6) - 1px); }
.table_basic.tbody_scroll tbody.tr7{max-height: calc((27px * 7) - 1px); }
.table_basic.tbody_scroll tbody.tr8{max-height: calc((27px * 8) - 1px); }
.table_basic.tbody_scroll tbody.tr9{max-height: calc((27px * 9) - 1px); }
.table_basic.tbody_scroll tbody.tr10{max-height: calc((27px * 10) - 1px); }

.table_basic.tbody_scroll tbody tr:first-child th,
.table_basic.tbody_scroll tbody tr:first-child td{border-top: none; }

.table_basic.tbody_scroll tbody tr th,
.table_basic.tbody_scroll tbody tr td{border-bottom: none; }

/* Tbody Scroll 경우 width의 값을 정해줘야 함 - colgroup 기능 불용 */
.table_basic.tbody_scroll td{width: 25%; }

/* Title + Table : 타이틀영역 밑에 Table이 위치한 경우 */
.boxStyle_topline.bord_none > .box_titArea{background-color: #FFFFFF; border: 1px solid #C8C8C8; border-top: 2px solid #333333; border-bottom: none; }
.box_titArea + .table_basic thead tr th{height: 34px; border-top: 1px solid #A1A1A1; }


/* Tab Style ***********************************************************************************************/
.tabs{position: relative; overflow: hidden; width: 100%; }
.tabs ul{position: relative; display: flex; }
.tabs ul li{position: relative; z-index: 1; display: block; text-align: center; }
.tabs ul li a{position: relative; display: block; overflow: hidden; }
.tabs ul li a span{display: block; font-size: 13px; color: #A1A1A1; text-wrap: nowrap; line-height: 16px; }
.tabs ul li a:hover span{color: #666666; }
.tabs ul li.tab_current a span{color: #333333; }

.tabs .check_area li,
.tabs .radio_area li{display: flex; margin: 3px 15px 3px 0 !important; }

/* Tab Content */
.content-wrap{position: relative; }
.content-wrap section{display: none; }
.content-wrap section.content_current{display: block; }
.content-wrap section p.tab_test{font-size: 20px; color: #A1A1A1; background: #F9F9F9; padding: 10px 0; }

/* Tab - Text Style1 : 텍스트만 */
.tabs.text_style1 ul li{text-align: left; margin: 7px 20px 7px 0px; }

.tabs.text_style1 ul li.tab_current a span{color: #333333; }

/* Tab - Text Style2 : 텍스트 + Bar */
.tabs.text_style2 ul li{text-align: left; border-right: 1px solid #C8C8C8; padding-right: 10px; margin: 7px 10px 7px 0px; }

.tabs.text_style2 ul li.tab_current a span{color: #333333; }

/* Tab - Box Style1 : 사각형 모양 */
.tabs.box_style1 ul li:not(:last-child){margin: 0 4px 0 0; }
.tabs.box_style1 ul li a{background-color: #FFFFFF; border: 1px solid #D8D8D8; border-radius: 4px; transition: all 0.1s; padding: 6px 7px; }
.tabs.box_style1 ul li a:hover{border: 1px solid #C8C8C8; }

.tabs.box_style1 ul li.tab_current a{background: #4176FF; border: 1px solid #4176FF; }
.tabs.box_style1 ul li.tab_current a span{color: #FFFFFF; }

/* Tab - Box Style2 : 라운드형 모양 */
.tabs.box_style2 ul li{margin: 0 4px 0 0; }
.tabs.box_style2 ul li a{background-color: #FFFFFF; border: 1px solid #D8D8D8; border-radius: 15px; transition: all 0.1s; padding: 6px 10px; }
.tabs.box_style2 ul li a:hover{border: 1px solid #C8C8C8; }

.tabs.box_style2 ul li.tab_current a{background: #4176FF; border: 1px solid #4176FF; }
.tabs.box_style2 ul li.tab_current a span{color: #FFFFFF; }

/* Tab - Box Style3 */
.tabs.box_style3 ul li a{padding: 7px 10px; }
.tabs.box_style3 ul li a::after{position: absolute; z-index: -1; top: 0; left: 0; content: ''; width: 100%; height: 100%; background-color: #F0F1F7; transition: all 0.3s; transform: perspective(900px) rotate3d(1,0,0,90deg); transform-origin: 50% 100%; perspective-origin: 50% 100%; }

.tabs.box_style3 ul li.tab_current a::after{background-color: #4176FF; transform: perspective(900px) rotate3d(1,0,0,0deg); }
.tabs.box_style3 ul li.tab_current a span{color: #FFFFFF; }

/* Tab - Box Style4 */
.tabs.box_style4 ul li a{padding: 7px 15px 7px 5px; }
.tabs.box_style4 ul li a::after{position: absolute; z-index: -1; top: 0; right: 0; bottom: 0; left: 0; content: ''; border-radius: 8px 8px 0 0; background: #FFFFFF; border: 1px solid #C8C8C8; transform: perspective(4px) rotateX(2deg) translateZ(-1px); transform-origin: 0 0; }

.tabs.box_style4 ul li.tab_current a::after{background: #4176FF; border: 1px solid #4176FF; }
.tabs.box_style4 ul li.tab_current a span{color: #FFFFFF; }

/* Tab - Box Style5 */
.tabs.box_style5 ul li::after{position: absolute; top: 20%; right: 0; z-index: -1; content: ''; width: 1px; height: 60%; background: #C8C8C8; }
.tabs.box_style5 ul li:first-child::before{right: auto; left: 0; }
.tabs.box_style5 ul li a{overflow: visible; padding: 7px 10px; }

.tabs.box_style5 ul li.tab_current{z-index: 2; }
.tabs.box_style5 ul li.tab_current a{background: #4176FF; box-shadow: -1px 0 0 #4176FF; }
.tabs.box_style5 ul li.tab_current a::after{position: absolute; top: 100%; left: 50%; content: ''; width: 0; height: 0; border: 6px solid transparent; border-top-color: #4176FF; pointer-events: none; margin-left: -6px; }
.tabs.box_style5 ul li.tab_current a span{color: #FFFFFF; }

/* Tab - Box Style6 */
.tabs.box_style6 ul li::after{position: absolute; top: 20%; right: 0; z-index: -1; content: ''; width: 1px; height: 60%; background: #C8C8C8; }
.tabs.box_style6 ul li a{overflow: visible; padding: 7px 10px; }

.tabs.box_style6 ul li.tab_current{z-index: 2; }
.tabs.box_style6 ul li.tab_current a{background: #4176FF; box-shadow: -1px 0 0 #4176FF; }
.tabs.box_style6 ul li.tab_current a span{color: #FFFFFF; }

/* Tab - Linebox Style1 */
.tabs.linebox_style1 ul li{margin-right: 10px; }
.tabs.linebox_style1 ul li a{padding: 7px 10px; }
.tabs.linebox_style1 ul li a::after{position: absolute; top: 0; left: 0; z-index: -1; content: ''; width: 100%; height: 100%; background: #C8C8C8; transition: all 0.3s; transition-timing-function: ease, cubic-bezier(0.7,0,0.3,1); transform: translate3d(0,100%,0) translate3d(0,-3px,0); }

.tabs.linebox_style1 ul li.tab_current a::after{transform: translate3d(0,0,0); background: #4176FF; }
.tabs.linebox_style1 ul li.tab_current a span{color: #FFFFFF; }

/* Tab - Topline Style1 */
.tabs.topline_style1 ul li a{background: #FFFFFF; border: 1px solid #C8C8C8; transition: color 0.2s; padding: 6px 10px; }
.tabs.topline_style1 ul li:not(:first-child) a{margin-left: -1px; }

.tabs.topline_style1 ul li.tab_current a{border-top: 3px solid #4176FF; border-bottom: none; padding: 4px 10px 7px; }
.tabs.topline_style1 ul li.tab_current a span{color: #333333; }

/* Tab - Line Style1 */
.tabs.line_style1 ul{box-shadow: inset 0 -2px #C8C8C8; }
.tabs.line_style1 ul li a{color: #4176FF; text-align: left; transition: all 0.3s; box-shadow: inset 0 -2px #C8C8C8; padding: 7px 10px; }
.tabs.line_style1 ul li a:hover{box-shadow: inset 0 -2px #999999; }

.tabs.line_style1 ul li.tab_current a{box-shadow: inset 0 -2px #4176FF; }

/* Tab - Underline Style1 : Underline 아래서 위로 이동 */
.tabs.underline_style1 ul li{background: #FFFFFF; border-right: 1px solid #C8C8C8; }
.tabs.underline_style1 ul li a{padding: 7px 10px; }
.tabs.underline_style1 ul li a::after{position: absolute; bottom: 0; left: 0; content: ''; width: 100%; height: 3px; background: #4176FF; transition: transform 0.3s; transform: translate3d(0, 150%, 0); }

.tabs.underline_style1 ul li.tab_current a::after{transform: translate3d(0,0,0); }
.tabs.underline_style1 ul li.tab_current a span{color: #333333; }

/* Tab - Underline Style2 : Underline 가운데서 양옆으로 이동 */
.tabs.underline_style2 ul li{margin-right: 20px; }
.tabs.underline_style2 ul li::before{position: absolute; bottom: 0px; left: 50%; content: ''; width: 100%; height: 3px; background: #4176FF; transition: transform 0.2s ease-in; transform: scale3d(0,1,1); opacity: 0; margin-left: -50%; }
.tabs.underline_style2 ul li a{display: inline-block; overflow: visible; color: #4176FF; transition: color 0.3s cubic-bezier(0.7,0,0.3,1); padding: 4px 2px 10px; }

.tabs.underline_style2 ul li.tab_current::before{transform: scale3d(1,1,1); opacity: 1; }
.tabs.underline_style2 ul li.tab_current a span{color: #333333; }

/* Tab - Underline Style3 : Underline 좌우로 이동 */
.tabs.underline_style3 ul li:last-child::before{position: absolute; bottom: 0; left: 0; content: ''; width: 100%; height: 3px; background: #4176FF; transition: transform 0.3s; }
.tabs.underline_style3 ul li:first-child.tab_current ~ li:last-child::before{transform: translate3d(-400%,0,0); }
.tabs.underline_style3 ul li:nth-child(2).tab_current ~ li:last-child::before{transform: translate3d(-300%,0,0); }
.tabs.underline_style3 ul li:nth-child(3).tab_current ~ li:last-child::before{transform: translate3d(-200%,0,0); }
.tabs.underline_style3 ul li:nth-child(4).tab_current ~ li:last-child::before{transform: translate3d(-100%,0,0); }

.tabs.underline_style3 ul li a{transition: all 0.3s; padding: 7px 15px; }
.tabs.underline_style3 ul li.tab_current a span{color: #333333; }

/* Tab Scroll Style */
.tabs_scroll{position: relative; width: calc(100% - 10px); overflow-x: auto; margin-right: 10px; }


/* Title Style + Accordion Style ***************************************************************************/
/* Title */
.box_titArea{position: relative; display: flex; align-items: center; justify-content: space-between; width: 100%; height: 33px; padding: 0 2px 0 10px; }
.box_titArea .boxTitle{font-size: 13px; line-height: 16px; }
.box_titArea .boxTitle + div{display: flex; align-items: center; }
.box_titArea .boxTitle + div .formStyle div,
.box_titArea .boxTitle + div .formStyle select{margin: 2px; }

/* Title - Bullet */
.bulletTit{display: flex; align-items: center; }
.bulletTit::before{display: inline-block; content: ""; width: 3px; height: 13px; margin-right: 7px; }
.tit_blue::before{background: #4176FF; }
.tit_green::before{background: #13A850; }
.tit_gray::before{background: #B4B5B7; }

/* Title - Editor */
.eTitle{font-size: 17px; line-height: 1.5; margin: 0 5px 10px -5px; }
.eSubTitle{font-size: 15px; line-height: 1.5; margin: 0 5px 10px -5px; }

/* Title - Tab Style */
/* Tab - Text Style1 : 텍스트만 */
.tabs.text_style1 .box_titArea ul li{margin: 9px 20px 8px 0px; }

/* Tab - Text Style2 : 텍스트 + Bar */
.tabs.text_style2 .box_titArea ul li{margin: 9px 10px 8px 0px; }

/* Tab - Box Style3 */
.tabs.box_style3 .box_titArea{padding: 0 2px 0 0; }
.tabs.box_style3 .box_titArea ul li a{padding: 9px 10px 8px; }

/* Tab - Box Style5 */
.tabs.box_style5 .box_titArea{padding: 0 2px 0 0; }
.tabs.box_style5 .box_titArea ul li a{padding: 9px 10px 8px; }

/* Tab - Box Style6 */
.tabs.box_style6 .box_titArea{padding: 0 2px 0 0; }
.tabs.box_style6 .box_titArea ul li a{padding: 9px 10px 8px; }

/* Tab - Line Style1 */
.tabs.line_style1 .box_titArea{padding: 0 2px 0 0; }
.tabs.line_style1 .box_titArea ul{box-shadow: none; }
.tabs.line_style1 .box_titArea ul li a{box-shadow: inset 0 0px #C8C8C8; padding: 9px 10px 8px; }
.tabs.line_style1 .box_titArea ul li.tab_current a{box-shadow: inset 0 -2px #4176FF; }

/* Tab - Underline Style1 : Underline 아래서 위로 이동 */
.tabs.underline_style1 .box_titArea{padding: 0 2px 0 0; }
.tabs.underline_style1 .box_titArea ul li a{padding: 9px 10px 8px; }
.tabs.underline_style1 .box_titArea ul li a::after{height: 2px; }

/* Tab - Underline Style2 : Underline 가운데서 양옆으로 이동 */
.tabs.underline_style2 .box_titArea li::before{height: 2px; }
.tabs.underline_style2 .box_titArea ul li a{padding: 9px 2px 8px; }

/* Title + Grid Table : 타이틀영역 밑에 Gird가 위치한 경우 */
.box_titArea + .gridArea{border-top: 1px solid #A1A1A1; }

/* Accordion Style */
.accordion{position: relative; overflow: hidden; width: 100%; min-height: auto; }
.accordion .box_titArea .btnArea button.btn_accordion span{display: block; overflow: hidden; text-indent: -999em; background: url(../images/ico/arrow/up.svg) no-repeat 50% 50%; background-size: 20px; }

.accordion .box_titArea .btnArea button.btn_accordion.on span{background-image: url(../images/ico/arrow/down.svg); }

.accordion .panel{display: block; will-change: height; transform: translateZ(0px); }
.accordion .panel p.accordion_test{font-size: 20px; color: #A1A1A1; background: #F9F9F9; padding: 10px 0; }


/* 화면 위치 및 타이틀 & 버튼 영역 ********************************************************************************/
.conWrap .titleArea{display: flex; align-items: center; justify-content: space-between; height: 43px; padding: 0 18px 0 15px; }

/* 화면 위치 및 타이틀 + 즐겨찾기 표시 */
.conWrap .titleArea .localNav{display: flex; flex-wrap: wrap; align-content: center; }
.conWrap .titleArea .localNav li{display: flex; flex-wrap: wrap; align-content: center; }
.conWrap .titleArea .localNav li em{height: 20px; font-size: 14px; color: #888888; line-height: 20px; padding: 1px 0; }
.conWrap .titleArea .localNav li span{width: 20px; height: 20px; background: url(../images/ico/arrow/right_gray.svg) no-repeat 50% 50%; background-size: 20px; }
.conWrap .titleArea .localNav li.screen_tit{display: flex; align-items: center; }
.conWrap .titleArea .localNav li.screen_tit h1{height: 20px; font-size: 14px; color: #333333; font-weight: normal; line-height: 20px; padding: 1px 0; margin-right: 3px; }
.conWrap .titleArea .localNav li.screen_tit .star_favori{margin: -2px 0 0 2px; }
.conWrap .titleArea .localNav li.screen_tit .star_favori label{width: 20px; height: 20px; background-position: 0 1px; background-size: 20px; }


/* Search Style ********************************************************************************************/
.searchBox{position: sticky; z-index: 2; top: 0; display: flex; flex-direction: row-reverse; align-items: flex-start; justify-content: space-between; width: calc(100% + 30px); background: #FFFFFF; border: 1px solid #C8C8C8; border-width: 1px 0; box-shadow: 0 1px 3px rgba(0,0,0,0.1); padding: 6.5px 18px 6.5px 15px; margin: 0 0 15px -15px; }
.searchBox.search_hide{height: 0px; border-width: 1px 0 0; box-shadow: none; overflow: hidden; padding: 0px; }
.searchBox.formStyle .btnArea{margin: 0; }
.searchBox .btnArea button{min-width: 30px !important; margin: 3px 2px; }

/* 확인용 */
.searchBox .btnArea.on button:nth-child(2){background-color: #5C5F6B; border-color: #5C5F6B; }
.searchBox .btnArea.on button:nth-child(2) .ico_filter{background-image: url(../images/ico/filter/filter_style1_white.svg); }

.searchBox .grid_items_fixing{width: calc(100% - 68px); height: 29px; overflow: hidden; }

/* 개발용 */
.searchBox .btnArea button:nth-child(2).on{background-color: #5C5F6B; border-color: #5C5F6B; }
.searchBox .btnArea button:nth-child(2).on .ico_filter{background-image: url(../images/ico/filter/filter_style1_white.svg); }

/* 2줄일때 */
.searchBox .grid_items_fixing.searchBox_line2{height: 60px; }

/* 3줄일때 */
.searchBox .grid_items_fixing.searchBox_line3{height: 90px; }

/* Error일 경우 */
.searchBox .grid_items_fixing.error{height: auto; }

/* 필터 활성화일 경우 */
.searchBox .on + .grid_items_fixing{height: auto; }
.searchBox .grid_items_fixing.on{height: auto; }


/* Gallery Style *******************************************************************************************/
/* 이미지 롤링 + 이미지 썸네일 */
.galleryArea{display: flex; flex-direction: column; align-items: center; }
.galleryArea .gallery_content{position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: calc(100% - 70px); }

.galleryArea .gallery_content p{position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: #F1F3F9; border-radius: 6px; overflow: hidden; }
.galleryArea .gallery_content p a{position: absolute; top: 5px; right: 5px; display: block; overflow: hidden; text-indent: -999em; width: 24px; height: 24px; background: rgba(0,0,0,0.4) url(../images/ico/interface/expand_style1_white.svg) no-repeat 50% 50%; border-radius: 50%; background-size: 14px; }
.galleryArea .gallery_content p a:hover{background-color: rgba(0,0,0,0.7); }
.galleryArea .gallery_content img{display: block; width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: cover; }

.galleryArea .gallery_content li a{position: absolute; display: block; overflow: hidden; text-indent: -999em; width: 24px; height: 48px; background-repeat: no-repeat; background-position: 50% 50%; margin-top: -24px; }
.galleryArea .gallery_content li.btn_before a{left: 0px; background-image: url(../images/ico/arrow/left_gray.svg); border-radius: 0 4px 4px 0; }
.galleryArea .gallery_content li.btn_after a{right: 0px; background-image: url(../images/ico/arrow/right_gray.svg); border-radius: 4px 0 0 4px; }
.galleryArea .gallery_content li a:hover{background-color: rgba(0,0,0,0.4); }
.galleryArea .gallery_content li.btn_before a:hover{background-image: url(../images/ico/arrow/left_white.svg); }
.galleryArea .gallery_content li.btn_after a:hover{background-image: url(../images/ico/arrow/right_white.svg); }

.galleryArea .gallery_thumb{display: flex; align-items: center; justify-content: center; width: 100%; overflow: hidden; margin-top: 10px; }
.galleryArea .gallery_thumb ul{display: inline-flex; overflow-x: auto; overflow-y: hidden; }
.galleryArea .gallery_thumb li{position: relative; width: 60px; height: 60px; flex-shrink:0; opacity: 1; cursor: pointer; }
.galleryArea .gallery_thumb li:not(:last-child){margin-right: 4px; }
.galleryArea .gallery_thumb li img{width: 100%; height: 100%; object-fit: cover; border-radius: 4px; }

.galleryArea .gallery_thumb li.on::after{content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/ico/check/check_style2_white.svg) no-repeat 50% 50%; background-size: 32px; backdrop-filter: blur(2px); border-radius: 4px; }
.galleryArea .gallery_thumb li:hover:not(.on:hover){opacity: 0.7; }

/* Image Card Style */
.galleryBoxArea ul{display: flex; flex-wrap: wrap; width: calc(100% + 4px); margin: -2px 0 0 -2px; }
.galleryBoxArea ul li{position: relative; width: calc((100% / 10) - 4px); min-width: 80px; border-radius: 4px; margin: 2px; overflow: hidden; }

.galleryBoxArea .new a{display: flex; align-items: center; justify-content: center; overflow: hidden; text-indent: -999em; width: 100%; height: 100%; background: url(../images/ico/calculation/plus_8_gray.svg) no-repeat 50% 50%; background-size: 18px; border: 1px solid #C8C8C8; border-radius: 4px; box-sizing: border-box; }
.galleryBoxArea .new a:hover{background-color: #F1F3F9; background-image: url(../images/ico/calculation/plus_8.svg); border-color: #999999; }

/* Image Card Style : 빈 이미지 */
.galleryBoxArea .my_empty,
.galleryBoxArea.full.my_empty{background: #F2F3F9 url(../images/ico/picture/picture_style1_gray.svg) no-repeat 50% 50%; background-size: 44px; border: 1px solid #E5E5E5; }
.galleryBoxArea .my_empty dl.btn dd a:hover{background-color: rgba(65,118,255,0.85)/* #4176FF */; }
.galleryBoxArea .my_empty img{visibility: hidden; }

.galleryBoxArea .my_empty,
.galleryBoxArea .my_photo{width: 146px; height: 150px; }
.grid_items_fixing.label_13 .galleryBoxArea .my_empty,
.grid_items_fixing.label_13 .galleryBoxArea .my_photo{width: 140px; height: 144px; }
.grid_items_fixing.label_16 .galleryBoxArea .my_empty,
.grid_items_fixing.label_16 .galleryBoxArea .my_photo{width: 134px; height: 138px; }

/* Image Card Style : EditArea 이미지 Full일 경우 빈 이미지 */
.galleryBoxArea.full.my_empty{background-size: 100px; }
.galleryBoxArea.full.my_empty img{visibility: hidden; }

/* Image Card Style + Button */
.galleryBoxArea dl.btn dd a{position: absolute; right: 2px; display: block; overflow: hidden; text-indent: -999em; width: 20px; height: 20px; background-color: rgba(0,0,0,0.4); background-repeat: no-repeat; background-position: 50% 50%; border-radius: 50%; padding: 0; }
.galleryBoxArea dl.btn dd a:hover{background-color: rgba(51,51,51,0.85)/* #333333 */; }
.galleryBoxArea dl.btn dd:nth-child(1) a{top: 2px; }
.galleryBoxArea dl.btn dd:nth-child(2) a{top: 24px; }
.galleryBoxArea dl.btn dd:nth-child(3) a{top: 46px; }
.galleryBoxArea dl.btn dd:nth-child(4) a{top: 68px; }
.galleryBoxArea dl.btn dd.delete a{background-image: url(../images/ico/cross/cross_style1_white.svg); background-size: 10px; }
.galleryBoxArea dl.btn dd.download a{background-image: url(../images/ico/download/download_style3_white.svg); background-size: 14px; }
.galleryBoxArea dl.btn dd.expand a{background-image: url(../images/ico/interface/expand_style1_white.svg); background-size: 12px; }
.galleryBoxArea dl.btn dd.file a{background-image: url(../images/ico/file/file_style1_white.svg); background-size: 14px; }

.galleryBoxArea img{width: 100%; height: 100%; object-fit: cover; }

/* Image Card Style + Button : EditArea 이미지 Full일 경우 */
.galleryBoxArea.full {position: relative; width: 100%; height: 100%; }
.galleryBoxArea.full img{width: inherit; height: 100%; object-fit: contain; }

.galleryBoxArea.full dl.btn dd a{right: 5px; padding: 4px; }
.galleryBoxArea.full dl.btn dd:nth-child(1) a{top: 5px; }
.galleryBoxArea.full dl.btn dd:nth-child(2) a{top: 38px; }
.galleryBoxArea.full dl.btn dd:nth-child(3) a{top: 71px; }
.galleryBoxArea.full dl.btn dd:nth-child(4) a{top: 104px; }
.galleryBoxArea.full dl.btn dd.delete a{background-size: 14px; }
.galleryBoxArea.full dl.btn dd.download a{background-size: 18px; }
.galleryBoxArea.full dl.btn dd.expand a{background-size: 14px; }
.galleryBoxArea.full dl.btn dd.file a{background-size: 16px; }

/* Image Card Style + Figure Text : 이미지 타이틀 등 설명글 포함 */
.galleryBoxArea dl.img_text{position: absolute; bottom: 0px; width: 100%; background-blend-mode: multiply; color: #FFFFFF; text-align: left; text-shadow: 0 1px 1px rgba(0,0,0,0.35); padding: 10px 6px 6px; }
.galleryBoxArea dl.gradient{background: linear-gradient(rgba(20,21,26,0.02),rgba(20,21,26,1)); }
.galleryBoxArea dl.dark{background: rgba(20,21,26,0.5); }
.galleryBoxArea dl.light{background: rgba(255,255,255,0.28); }
.galleryBoxArea dl.blur3{backdrop-filter: blur(3px); }
.galleryBoxArea dl.blur6{backdrop-filter: blur(6px); }
.galleryBoxArea dl.blur9{backdrop-filter: blur(9px); }

.galleryBoxArea dl.img_text dt{width: calc(100% - 12px); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.galleryBoxArea dl.img_text dd{font-size: 12px; margin-top: 5px; opacity: 0.7; }

/* Image Card Style + Rolling : 이미지 롤링 */
.galleryBoxArea dl.btn_rolling dd{position: absolute; top: 50%; margin-top: -10px; }
.galleryBoxArea dl.btn_rolling dd.prev{left: 0px; }
.galleryBoxArea dl.btn_rolling dd.next{right: 0px; }
.galleryBoxArea dl.btn_rolling dd a{display: block; overflow: hidden; text-indent: -999em; width: 20px; height: 20px; background-color: rgba(0,0,0,0.4); background-repeat: no-repeat; background-position: 50% 50%; background-size: 20px; }
.galleryBoxArea dl.btn_rolling dd.prev a{background-image: url(../images/ico/arrow/left_white.svg); border-radius: 0 4px 4px 0; }
.galleryBoxArea dl.btn_rolling dd.next a{background-image: url(../images/ico/arrow/right_white.svg); border-radius: 4px 0 0 4px; }
.galleryBoxArea dl.btn_rolling dd a:hover{background-color: rgba(51,51,51,0.85)/* #333333 */; }

/* Form 요소 중 파일첨부  */
.formStyle .btnArea{margin: -2px 0 0 -2px; }

/* Form 요소 중 파일첨부 : 파일이 없습니다 */
.formStyle .fileBoxArea ul{display: flex; flex-wrap: wrap; width: calc(100% + 4px); margin: -2px 0 0 -2px; }
.formStyle .fileBoxArea ul li.input_bgStyle{width: 146px; margin: 2px; overflow: hidden; }
.formStyle .grid_items_fixing.label_13 .fileBoxArea ul li.input_bgStyle{width: 140px; }
.formStyle .grid_items_fixing.label_16 .fileBoxArea ul li.input_bgStyle{width: 134px; }

/* Form 요소 중 파일첨부 : 추가버튼 + 파일 */
.formStyle .btnArea + .fileBoxArea ul{margin: -2px 0 0 0; }
.formStyle .btnArea + .fileBoxArea ul li.input_bgStyle{width: calc(213px - 24px - 4px); }
.formStyle .grid_items_fixing.label_13 .btnArea + .fileBoxArea ul li.input_bgStyle{width: calc(222px - 24px - 4px); }
.formStyle .grid_items_fixing.label_16 .btnArea + .fileBoxArea ul li.input_bgStyle{width: calc(231px - 24px - 4px); }

/* Form 요소 중 파일첨부 : 이미지가 없습니다 */
.formStyle .galleryBoxArea ul li.input_bgStyle{width: 146px; }
.formStyle .grid_items_fixing.label_13 .galleryBoxArea ul li.input_bgStyle{width: 140px; }
.formStyle .grid_items_fixing.label_16 .galleryBoxArea ul li.input_bgStyle{width: 134px; }

/* Form 요소 중 파일첨부 : 추가버튼 + 이미지가 없습니다 */
.formStyle .btnArea + .galleryBoxArea ul li.input_bgStyle{width: calc(213px - 24px - 4px); }
.formStyle .grid_items_fixing.label_13 .btnArea + .galleryBoxArea ul li.input_bgStyle{width: calc(222px - 24px - 4px); }
.formStyle .grid_items_fixing.label_16 .btnArea + .galleryBoxArea ul li.input_bgStyle{width: calc(231px - 24px - 4px); }

/* Form 요소 중 파일첨부 : 추가버튼 + 이미지 */
.formStyle .btnArea + .galleryBoxArea ul{width: calc(100% + 4px); margin: -2px 0 0 0; }
.formStyle .btnArea + .galleryBoxArea ul li:not(.input_bgStyle){width: calc(146px - 24px - 4px); height: 122px; }
.formStyle .grid_items_fixing.label_13 .btnArea + .galleryBoxArea ul li:not(.input_bgStyle){width: calc(140px - 24px - 4px); height: 116px; }
.formStyle .grid_items_fixing.label_16 .btnArea + .galleryBoxArea ul li:not(.input_bgStyle){width: calc(134px - 24px - 4px); height: 110px; }


/* Tree Style **********************************************************************************************/
.treeArea {width: 100%; }
.treeArea ul ul{margin-left: -5px}
.treeArea li{position: relative; background:url(../images/tree/line_tree.svg) no-repeat 12px 0; padding-left: 30px; margin: 0px; }
.treeArea li.last{background-position: 12px -685px; }
.treeArea li > div{display: flex; align-items: center; justify-content: space-between; }
.treeArea li > div:not(.treeArea li button.toggle + div){margin-left: -30px; }

.treeArea li a{display: block; height: 30px; color: #666666; line-height: 30px; }
.treeArea li a:hover,
.treeArea li a:active,
.treeArea li a:focus{color: #999999; }
.treeArea li.active > div > a{color: #4176FF; }

.treeArea button.toggle{position: absolute; top: 2px; left: 0; display: block; overflow: hidden; text-indent: -999em; width: 24px; height: 24px; background-repeat: no-repeat; background-position: 50% 50%; background-size: 20px; }
.treeArea button.toggle.plus{background-image: url(../images/ico/folder/folder_style2_fill_gray6.svg); }
.treeArea button.toggle.minus{background-image: url(../images/ico/folder/folder_style2_open_fill_gray6.svg); }

.treeArea li.active > button.toggle.plus{background-image: url(../images/ico/folder/folder_style2_fill_blue.svg); }
.treeArea li.active > button.toggle.minus{background-image: url(../images/ico/folder/folder_style2_open_fill_blue.svg); }

.treeArea li a:not(.treeArea button.toggle + div > a){background: url(../images/tree/doc_style1_gray6.svg) no-repeat 3px 50%; background-size: 20px; padding-left: 30px; }
.treeArea li.active > div > a:not(.treeArea button.toggle + div > a){background-image: url(../images/tree/doc_style1_blue.svg); }


/* Etc Style ***********************************************************************************************/
/* 즐겨찾기 별모양 표시 */
.star_favori{display: flex; align-items: center; }
.star_favori label{display: inline-block; overflow: hidden; text-indent: -999em; width: 24px; height: 24px; background: url(../images/ico/star/star_style1_gray.svg) no-repeat 50% 50%; cursor: pointer; }
.star_favori input[type="checkbox"]:checked + label{background-image: url(../images/ico/star/star_style1_fill_yellow.svg); }

/* 검색결과 수치 */
.searchNum_view{display: flex; justify-content: space-between; align-items: center; margin: 0 0 5px 0; }
.searchNum_view .search_num{display: flex; align-items: baseline; justify-content: flex-start; height: 16px; font-size: 12px; color: #666666; margin-right: 10px; }
.searchNum_view .search_num em{font-size: 14px; color: #4176FF; font-weight: 700; padding: 0 4px; }

/* 상태표시 ●모양 */
.status_display::before{display: inline-flex; content: ""; width: 12px; height: 12px; border-radius: 50%; vertical-align: middle; margin: 0 5px 2px 0; }
.status_display.red::before{background: #F56565; }
.status_display.blue::before{background: #4176FF; }
.status_display.yellow::before{background: #FFC126; }
.status_display.green::before{background: #13A850; }
.status_display.gray::before{background: #B4B5B7; }
.status_display.red{color: #F56565; }
.status_display.blue{color: #4176FF; }
.status_display.yellow{color: #FFC126; }
.status_display.green{color: #13A850; }
.status_display.gray{color: #B4B5B7; }

/* 범례표시 ●모양 */
.legend_display.legend_style1{display: flex; align-items: center; justify-content: flex-end; height: 12px; margin-right: 4px; }
.legend_display.legend_style1 dt{font-size: 12px; margin-right: 5px; }
.legend_display.legend_style1 ul{display: flex; align-items: center; }
.legend_display.legend_style1 ul li{height: 12px; }
.legend_display.legend_style1 ul li:not(:last-child){border-right: 1px solid #D8D8D8; padding-right: 5px; margin-right: 5px; }
.legend_display.legend_style1 ul li span.status_display{font-size: 12px; color: #666666; }

.legend_display.legend_style2{display: flex; align-items: center; justify-content: center; }
.legend_display.legend_style2 .status_display{display: flex; align-items: center; color: #333333; margin: 0 5px; }
.legend_display.legend_style2 .status_display::before{border-radius: 4px; }

.legend_display.legend_style2.row{flex-direction: column; }
.legend_display.legend_style2.row .status_display{justify-content: space-between; margin: 5px 0; }
.legend_display.legend_style2.row .status_display dt{color: #888888; }
.legend_display.legend_style2.row .status_display dd{font-size: 15px; text-align: right; margin-left: 15px; }

/* Dashbord Box Style */
.dash_style1 dl{display: flex; flex-direction: column; justify-content: space-between; height: 84px; border: 1px solid #D8D8D8; border-radius: 4px; padding: 6px; }
.dash_style1 dt{font-size: 13px; line-height: 18px; }
.dash_style1 dt p{font-size: 12px; color: #888888; }
.dash_style1 dd {font-size: 24px; font-weight: bold; text-align: right; margin-top: 10px; }


/* Map Style ***********************************************************************************************/
.mapArea{position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 10px; }
.mapArea .map_all{position: absolute; z-index: 1; top: 15px; left: 15px; }
.mapArea .map_all a{display: block; width: 28px; font-size: 14px; background: #FFFFFF url(../images/ico/location/location_style1.svg) no-repeat 10px 50%; background-size: 20px; border: 1px solid #C8C8C8; border-radius: 4px; padding: 10px 10px 10px 35px; }
.mapArea .map_all.on a{color: #FFFFFF; background-color: #4176FF; background-image: url(../images/ico/location/location_style1_fill_white.svg); border: 1px solid #4176FF; }

.mapArea .complex_map{position: relative; display: flex; align-items: center; width: 368px; height: 633px; background: url(../images/img/map/map_sq.png) no-repeat 0 0; }
.mapArea .complex_map > img{display: block; }

/* 지도 : 위치배경색 */
.mapArea .map_all.on + .complex_map{background-position: 0px 0px; }
.mapArea .complex_map.seoul{background-position: -368px 0px; }
.mapArea .complex_map.incheon{background-position: -736px 0px; }
.mapArea .complex_map.sejong{background-position: -1104px 0px; }
.mapArea .complex_map.daejeon{background-position: -1472px 0px; }
.mapArea .complex_map.daegu{background-position: 0 -633px; }
.mapArea .complex_map.gwangju{background-position: -368px -633px; }
.mapArea .complex_map.ulsan{background-position: -736px -633px; }
.mapArea .complex_map.busan{background-position: -1104px -633px; }
.mapArea .complex_map.jeju{background-position: -1472px -633px; }
.mapArea .complex_map.gyeonggi{background-position: 0 -1266px; }
.mapArea .complex_map.ganwon{background-position: -368px -1266px; }
.mapArea .complex_map.chungbuk{background-position: -736px -1266px; }
.mapArea .complex_map.chungnam{background-position: -1104px -1266px; }
.mapArea .complex_map.gyeongbuk{background-position: -1472px -1266px; }
.mapArea .complex_map.gyeongnam{background-position: 0 -1899px; }
.mapArea .complex_map.jeonbuk{background-position: -368px -1899px; }
.mapArea .complex_map.jeonnam{background-position: -736px -1899px; }

/* 지도 : 건수 + 지역명 */
.mapArea .region_list > a{position: absolute; display: inline-block; font-size: 13px; text-align: center; }
.mapArea .region_list > a > strong{display: block; width: 100%; color: #333333; text-align: center; }
.mapArea .region_list > a > span{position: absolute; left: 50%; top: -30px; display: block; width: 26px; height: 26px; color: #FFFFFF; line-height: 27px; text-align: center; background: #5C5E6C; border-radius: 100%; margin: 0 0 0 -14px; }
.mapArea .region_list > a.on > span{background: #4176FF; }

.mapArea .region_list > a.seoul{left: 84px; top: 115px; }
.mapArea .region_list > a.incheon{left: 18px; top: 115px; }
.mapArea .region_list > a.sejong{left: 87px; top: 255px; }
.mapArea .region_list > a.daejeon{left: 130px; top: 310px; }
.mapArea .region_list > a.daegu{left: 247px; top: 347px; }
.mapArea .region_list > a.gwangju{left: 80px; top: 469px; }
.mapArea .region_list > a.ulsan{left: 302px; top: 382px; }
.mapArea .region_list > a.busan{left: 280px; top: 440px; }
.mapArea .region_list > a.jeju{left: 30px; top: 607px; }
.mapArea .region_list > a.gyeonggi{left: 112px; top: 184px; }
.mapArea .region_list > a.ganwon{left: 224px; top: 90px; }
.mapArea .region_list > a.chungbuk{left: 160px; top: 224px; }
.mapArea .region_list > a.chungnam{left: 48px; top: 235px; }
.mapArea .region_list > a.gyeongbuk{left: 270px; top: 266px; }
.mapArea .region_list > a.gyeongnam{left: 210px; top: 424px; }
.mapArea .region_list > a.jeonbuk{left: 100px; top: 372px; }
.mapArea .region_list > a.jeonnam{left: 22px; top: 501px; }

.mapArea .region_list > a.on .map_con{display: block; }

.mapArea .map_con{display: none; position: absolute; z-index: 10; left: 60px; top: -35px; width: 230px; background: rgba(255,255,255,0.95); border: 1px solid #4176FF; border-radius: 4px; padding: 10px 15px 15px; box-shadow: 0px 2px 4px rgba(0,0,0,0.2); }
.mapArea .map_con .map_titArea{display: flex; align-items: center; justify-content: space-between; }
.mapArea .map_con .map_titArea .map_tit{font-size: 16px; }
.mapArea .map_con .map_titArea button{display: block; overflow: hidden; text-indent: -999em; width: 32px; height: 32px; background: url(../images/ico/cross/cross_style1.svg) no-repeat 50% 50%; background-size: 20px; margin-right: -8px; }

.mapArea .map_con .mapList{max-height: calc((43px * 4) + 22px); overflow-y: auto; }
.mapArea .map_con .mapList p{display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #D8D8D8; padding: 12px 0; }
.mapArea .map_con .mapList p label{font-size: 14px; color: #666666; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mapArea .map_con .mapList p label:hover,
.mapArea .map_con .mapList p input[type="radio"]:checked + label{color: #333333; }

.mapArea .region_list > a.gyeonggi .map_con{left: 40px; }
.mapArea .region_list > a.chungnam .map_con,
.mapArea .region_list > a.jeonbuk .map_con,
.mapArea .region_list > a.jeonnam .map_con{left: 50px; }
.mapArea .region_list > a.gwangju .map_con{top: auto; bottom: -5px; }
.mapArea .region_list > a.jeonnam .map_con{left: 50px; top: auto; bottom: -5px; }
.mapArea .region_list > a.chungbuk .map_con{left: 50%; top: 15px; margin-left: -115px; }
.mapArea .region_list > a.jeju .map_con{left: 90px; top: auto; bottom: -5px; }
.mapArea .region_list > a.daegu .map_con,
.mapArea .region_list > a.ulsan .map_con,
.mapArea .region_list > a.ganwon .map_con,
.mapArea .region_list > a.gyeongbuk .map_con{left: -236px; }
.mapArea .region_list > a.busan .map_con,
.mapArea .region_list > a.gyeongnam .map_con{left: -236px; top: auto; bottom: -5px; }


/* IOT Style ***********************************************************************************************/
.iotArea{position: relative; width: 100%; height: 100%; }
.iotArea p{position: absolute; display: block; overflow: hidden; text-indent: -999em; width: 32px; height: 32px; background: no-repeat 50% 50% / 20px; border-radius: 50%; box-shadow: 0 2px 5px rgba(0,0,0,0.4); }
.iotArea p.cctv{background-color: #4176FF; background-image: url(../images/ico/video/video_style1_fill_white.svg); }
.iotArea p.cctvmove{background-color: #6366F1; background-image: url(../images/ico/video/video_style2_fill_white.svg); }
.iotArea p.safetyball{background-color: #13A850; background-image: url(../images/ico/safetyball/safetyball_style1_fill_white.svg); }


/* Modal Dialog Style **************************************************************************************/
.modalArea{position: fixed; z-index: 1000; bottom: 0; right: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; width: 100%; height: 100vh; background: rgba(0,0,0,0.5); transition: opacity .3s ease; }

/* Dialog 이동을 위한 클래스 */
.dialog_container{position: absolute; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; width: 100%; }

.modalArea .dialog_area{background: #FFFFFF; border-radius: 6px; box-shadow: 0 2px 4px rgba(0,0,0,0.2); overflow: hidden; margin: 15px; }
.modalArea .dialog_area .dialog_tit{display: flex; align-items: center; justify-content: space-between; height: 50px; background: #4176FF; }
.modalArea .dialog_area .dialog_tit p{font-size: 18px; color: #FFFFFF; margin-left: 20px; }
.modalArea .dialog_area .dialog_tit p.tit_search{background: url(../images/ico/search/search_style1_white.svg) no-repeat -3px 50%; padding-left: 30px; }
.modalArea .dialog_area .dialog_tit button{display: block; overflow: hidden; text-indent: -999em; width: 32px; height: 32px; background: url(../images/ico/cross/cross_style1_white.svg) no-repeat 50% 50%; background-size: 20px; margin-right: 12px; }
.modalArea .dialog_area .dialog_tit button:hover{background-color: #FFFFFF; background-image: url(../images/ico/cross/cross_style1_blue.svg); border-radius: 50%; cursor: pointer; }

.modalArea .dialog_area .dialog_con{display: flex; flex-direction: column; height: calc(100% - (60px + 51px)); max-height: calc(100vh - 200px); overflow-y: auto; background: #FFFFFF; padding: 0 20px; }

/* Tab  */
.modalArea .dialog_area .dialog_con .tabs{width: calc(100% + 40px); margin-left: -20px; }
.modalArea .dialog_area .dialog_con .tabs > ul{background: #FFFFFF; border-bottom: 1px solid #C8C8C8; padding: 9px 20px; }
.modalArea .dialog_area .dialog_con .tabs > ul + .content-wrap{padding: 0 20px; }

/* Tab - 리스트 & 썸네일 : Modal_File.html */
.modalArea .dialog_area .dialog_con .flex_column .tabs{width: 100%; margin: 0; }
.modalArea .dialog_area .dialog_con .flex_column .tabs > ul{border: none; padding: 0; }
.modalArea .dialog_area .dialog_con .flex_column .tabs > ul + .content-wrap{padding: 0; }

/* 상단버튼영역, 검색영역 */
.modalArea .dialog_area .dialog_con .dialog_btnBox,
.modalArea .dialog_area .dialog_con .dialog_searchBox{width: calc(100% + 40px); background: #FFFFFF; border-bottom: 1px solid #C8C8C8; }
.modalArea .dialog_area .dialog_con .dialog_btnBox{padding: 10px 18px 10px 20px; margin: 0 0 0 -20px; }
.modalArea .dialog_area .dialog_con .dialog_btnBox .btnArea{justify-content: flex-end; }

.modalArea .dialog_area .dialog_con .dialog_searchBox{padding: 10px 18px 10px 20px; margin: 0 0 15px -20px; }
.modalArea .dialog_area .dialog_con .dialog_searchBox.bg_gray{background: #F1F3F9; }
.modalArea .dialog_area .dialog_con .dialog_searchBox > div{display: flex; flex-direction: row-reverse; align-items: baseline; justify-content: space-between; }

.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items,
.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items_fixing{height: 28px; overflow: hidden; margin-left: -5px; }
.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items.ico_refresh,
.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items_fixing.ico_refresh{width: calc(100% - (34px - 5px)); }
.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items.ico_refresh.ico_filter,
.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items_fixing.ico_refresh.ico_filter,
.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items.ico_search,
.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items_fixing.ico_search{width: calc(100% - (68px - 5px)); }
.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items.ico_refresh.ico_search,
.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items_fixing.ico_refresh.ico_search{width: calc(100% - (102px - 5px)); }
.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items.ico_refresh.ico_filter.ico_search,
.modalArea .dialog_area .dialog_con .dialog_searchBox .grid_items_fixing.ico_refresh.ico_filter.ico_search{width: calc(100% - (136px - 5px)); }

/* 초기화버튼, 필터버튼 */
.modalArea .dialog_area .dialog_con .dialog_searchBox .btnArea button .ico_refresh,
.modalArea .dialog_area .dialog_con .dialog_searchBox .btnArea button .ico_filter{min-width: 28px !important; }

/* 필터버튼 활성화 - 확인용 */
.modalArea .dialog_area .dialog_con .dialog_searchBox .btnArea.on button:nth-child(2){background-color: #5C5F6B; border-color: #5C5F6B; }
.modalArea .dialog_area .dialog_con .dialog_searchBox .btnArea.on button:nth-child(2) .ico_filter{background-image: url(../images/ico/filter/filter_style1_white.svg); }

.modalArea .dialog_area .dialog_con .dialog_searchBox .btnArea.on + .grid_items,
.modalArea .dialog_area .dialog_con .dialog_searchBox .btnArea.on + .grid_items_fixing{height: auto; }

/* 필터버튼 활성화 - 개발용 */
.modalArea .dialog_area .dialog_con .dialog_searchBox .btnArea button:nth-child(2).on{background-color: #5C5F6B; border-color: #5C5F6B; }
.modalArea .dialog_area .dialog_con .dialog_searchBox .btnArea button:nth-child(2).on .ico_filter{background-image: url(../images/ico/filter/filter_style1_white.svg); }

/* 1줄일때 Error일 경우 */
.modalArea .dialog_area .dialog_con .dialog_searchBox .error{height: 46px; }

/* paging */
.modalArea .dialog_area .dialog_con .paging_viewcount .paging li{min-width: 24px; }
.modalArea .dialog_area .dialog_con .tabs .paging_viewcount .paging li a{line-height: 12px; }
.modalArea .dialog_area .dialog_con .paging_viewcount .paging li.active a{background: #4176FF; border-color: #4176FF; }

/* 하단 버튼영역 */
.modalArea .dialog_area .dialog_btnArea{position: relative; display: flex; align-items: center; justify-content: center; border-top: 1px solid #C8C8C8; padding: 10px 0; }
.modalArea .dialog_area .dialog_btnArea button{display: inline-block; min-width: 64px; font-size: 13px; line-height: 18px; text-align: center; color: #333333; background: #FFFFFF; border: 1px solid #C8C8C8; border-radius: 4px; padding: 5px 4px; margin: 0 2px; }
.modalArea .dialog_area .dialog_btnArea button:hover{background: rgba(92,95,107,0.08)/* #5C5F6B */; border: 1px solid #A1A1A1; }

/* 정보박스 */
.modalArea .dialog_area .dialog_con .infoArea{background: #F9F9F9; border: 1px solid #C8C8C8; border-radius: 4px; padding: 10px; margin-bottom: 15px; }
.modalArea .dialog_area .dialog_con .infoArea p:not(:last-child){margin-bottom: 10px; }

/* 주소검색 */
.modalArea .dialog_area .dialog_con .addr_infoArea{background: #F9F9F9; border: 1px solid #C8C8C8; border-radius: 4px; padding: 10px; margin-bottom: 15px; }
.modalArea .dialog_area .dialog_con .addr_infoArea p{line-height: 14px; }
.modalArea .dialog_area .dialog_con .addr_infoArea p:nth-child(1){letter-spacing: -0.4px; margin-bottom: 6px; }
.modalArea .dialog_area .dialog_con .addr_infoArea p:nth-child(2){color: #888888; margin-bottom: 10px; }
.modalArea .dialog_area .dialog_con .addr_infoArea p:nth-child(3){font-size: 12px; color: #666666; letter-spacing: -0.4px; }
.modalArea .dialog_area .dialog_con .addr_infoArea p em{font-weight: bold; }

.modalArea .dialog_area .dialog_con .addr_resultArea{max-height: calc((57px * 5) + 2px); border-top: 2px solid #333333; border-bottom: 1px solid #C8C8C8; overflow-y: auto; }
.modalArea .dialog_area .dialog_con .addr_resultArea li{display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 10px; }
.modalArea .dialog_area .dialog_con .addr_resultArea li:not(:last-child){border-bottom: 1px solid #C8C8C8; }

.modalArea .dialog_area .dialog_con .addr_resultArea em{width: 50px; }

.modalArea .dialog_area .dialog_con .addr_resultArea dl{width: calc(100% - 50px); }
.modalArea .dialog_area .dialog_con .addr_resultArea dd a{display: flex; align-items: baseline; }
.modalArea .dialog_area .dialog_con .addr_resultArea dd a span{width: 50px; font-size: 12px; color: #666666; text-align: right; padding: 0 10px 0 0; }
.modalArea .dialog_area .dialog_con .addr_resultArea dd a p{width: calc(100% - 50px); font-size: 13px; line-height: 18px; color: #333333; }
.modalArea .dialog_area .dialog_con .addr_resultArea dd a p:hover{text-decoration: underline; }

.modalArea .dialog_area .dialog_con .addr_resultArea li.active{background-color: rgba(65,118,255,0.1)/* #4176FF */; }
.modalArea .dialog_area .dialog_con .addr_resultArea li.active p,
.modalArea .dialog_area .dialog_con .addr_resultArea li.active em{color: #4176FF; }

.modalArea .dialog_area .dialog_con .addr_formArea{margin: 0 0 20px; }
.modalArea .dialog_area .dialog_con .addr_formArea > div{display: flex; align-items: center; margin-bottom: 4px; }
.modalArea .dialog_area .dialog_con .addr_formArea > div .input_bgStyle{width: 80px; margin-right: 4px; }

/* 알람 */
.modalArea .dialog_area.alert_style1{width: 280px; }
.modalArea .dialog_area.alert_style1 .dialog_con ul{display: flex; flex-wrap: wrap; margin: 20px 0 30px; }
.modalArea .dialog_area.alert_style1 .dialog_con .ico{display: none; overflow: hidden; text-indent: -999em; width: 60px; height: 60px; background: #F4F4F4; border-radius: 50%; background-repeat: no-repeat; background-position: 50% 50%; }
.modalArea .dialog_area.alert_style1 .dialog_con .ico_delete{background-image: url(../images/ico/trash/trash_style1_red.svg); }
.modalArea .dialog_area.alert_style1 .dialog_con .ico_search{background-image: url(../images/ico/search/search_style1_blue.svg); }
.modalArea .dialog_area.alert_style1 .dialog_con .ico_info{background-image: url(../images/ico/info/info_style3_orange.svg); }
.modalArea .dialog_area.alert_style1 .dialog_con .ico_check{background-image: url(../images/btn/check/check_style1_green.svg); }
.modalArea .dialog_area.alert_style1 .dialog_con .ico_question{background-image: url(../images/ico/question/question_style1_yellow.svg); }
.modalArea .dialog_area.alert_style1 .dialog_con .text{min-height: 63px; font-size: 16px; line-height: 24px; }
.modalArea .dialog_area.alert_style1 .dialog_btnArea{display: flex; align-items: center; justify-content: flex-end; border: none; padding:30px 18px 15px 20px; }

.modalArea .dialog_area.alert_style2{width: 280px; border: none; }
.modalArea .dialog_area.alert_style2 .dialog_con{padding: 0px; }
.modalArea .dialog_area.alert_style2 .dialog_con ul{display: flex; align-items: center; justify-content: center; }
.modalArea .dialog_area.alert_style2 .dialog_con .ico{display: none; overflow: hidden; text-indent: -999em; width: 100%; height: 50px; background-repeat: no-repeat; background-position: 50% 50%; }
.modalArea .dialog_area.alert_style2 .dialog_con .ico_delete{background-color: #F56565; background-image: url(../images/ico/trash/trash_style1_white.svg); }
.modalArea .dialog_area.alert_style2 .dialog_con .ico_search{background-color: #4176FF; background-image: url(../images/ico/search/search_style1_white.svg); }
.modalArea .dialog_area.alert_style2 .dialog_con .ico_info{background-color: #FF9500; background-image: url(../images/ico/info/info_style3_white.svg); }
.modalArea .dialog_area.alert_style2 .dialog_con .ico_check{background-color: #13A850; background-image: url(../images/btn/check/check_style1_white.svg); background-size: 20px; }
.modalArea .dialog_area.alert_style2 .dialog_con .ico_question{background-color: #FFC126; background-image: url(../images/ico/question/question_style1_white.svg); }
.modalArea .dialog_area.alert_style2 .dialog_con p{border: 1px solid #C8C8C8; border-width: 0 1px; }
.modalArea .dialog_area.alert_style2 .dialog_con .alert_tit{font-size: 16px; line-height: 24px; padding: 30px 20px 0px; }
.modalArea .dialog_area.alert_style2 .dialog_con .alert_tit + .text{min-height: 88px; padding: 5px 20px 20px; }
.modalArea .dialog_area.alert_style2 .dialog_con .text{min-height: 113px; font-size: 14px; line-height: 20px; padding: 30px 20px 20px; }
.modalArea .dialog_area.alert_style2 .dialog_btnArea{border: 1px solid #C8C8C8; border-top: none; border-radius: 0 0 6px 6px; }

/* 이미지뷰어 */
.modalArea .dialog_imgviewer{position: relative; width: auto; height: calc(100% - 200px); background: #969696; border: 1px solid #9C9C9C; border-radius: 6px; box-shadow: 0 2px 4px rgba(0,0,0,0.2); margin: 100px 250px; overflow: hidden; }
.modalArea .dialog_imgviewer ul{position: absolute; display: flex; }
.modalArea .dialog_imgviewer ul:nth-child(1){top: 5px; right: 5px; flex-direction: column; }
.modalArea .dialog_imgviewer ul:nth-child(2){bottom: 5px; right: 5px; }
.modalArea .dialog_imgviewer li a{display: block; width: 20px; height: 20px; background-color: rgba(0,0,0,0.4); background-repeat: no-repeat; background-position: 50% 50%; background-size: 20px; border-radius: 50%; padding: 6px; }
.modalArea .dialog_imgviewer ul:nth-child(1) a{margin-bottom: 5px; }
.modalArea .dialog_imgviewer ul:nth-child(2) a{margin: 0 3px; }
.modalArea .dialog_imgviewer li a:hover{background-color: rgba(0,0,0,0.7); }
.modalArea .dialog_imgviewer li a span{display: block; overflow: hidden; text-indent: -999em; }

.modalArea .dialog_imgviewer li.dialog_btn_close a{background-image: url(../images/ico/cross/cross_style1_white.svg); background-size: 16px; }
.modalArea .dialog_imgviewer li.dialog_btn_zoomin a{background-image: url(../images/ico/search/search_style2_white.svg); }
.modalArea .dialog_imgviewer li.dialog_btn_zoomout a{background-image: url(../images/ico/search/search_style3_white.svg); }
.modalArea .dialog_imgviewer li.dialog_btn_eraser a{background-image: url(../images/ico/eraser/eraser_style1_white.svg); }
.modalArea .dialog_imgviewer li.dialog_btn_save a{background-image: url(../images/ico/save/save_style1_white.svg); }

.modalArea .dialog_imgviewer li.dialog_btn_color a::before{display: block; content: ""; width: 20px; height: 20px; border-radius: 50%; }
.modalArea .dialog_imgviewer li.dialog_btn_color.white a::before{background-color: #FFFFFF; }
.modalArea .dialog_imgviewer li.dialog_btn_color.red a::before{background-color: #F56565; }
.modalArea .dialog_imgviewer li.dialog_btn_color.blue a::before{background-color: #4176FF; }
.modalArea .dialog_imgviewer li.dialog_btn_color.black a::before{background-color: #333333; }

.modalArea .dialog_imgviewer .imgviewer{display: flex; width: 100%; height: 100%; }
.modalArea .dialog_imgviewer .imgviewer img{width: 100%; height: 100%; object-fit: contain; }

/* Dialog 타이틀 커서 클래스 */
.modalArea .dialog_container .dialog_area.dialog_move .dialog_tit {cursor: move; }

/* 공지사항 */
.notice_tit{font-size: 18px; font-weight: bold; line-height: 24px; padding: 20px 0; }
.notice_tit + div{font-size: 15px; line-height: 1.5; margin-bottom: 20px; }
.dialog_btnArea > .check_area{position: absolute; left: 20px; }

/* Spinner */
.spinnerArea{position: fixed; z-index:1000; top: 0; right: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; width: 100%; height: 100vh; transition: opacity .3s ease; }
.spinnerArea .spinnerBg{background: #4176FF; border-radius: 50px; padding: 20px; }
.spinnerArea .spinner{position: relative; transform: rotate(45deg); will-change: transform; animation: circle-spinner .75s infinite ease-in-out; }
.spinnerArea .spinner .circle{width: 50px; height: 50px; border-width: 4px; border-style: solid; border-color: rgba(255,255,255,0.15); border-radius: 50%; }
.spinnerArea .spinner .circle::after{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-width: 4px; border-style: solid; border-color: rgba(255,255,255,0.15); border-top-color: #FFFFFF; border-radius: 50%; box-sizing: inherit; }


@keyframes circle-spinner {
    0% {transform: rotate(45deg); }
    100% {transform: rotate(405deg); }
}

/* 달력 */
.date-picker{margin: 0 10px; }

.date-picker .change-month{display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #D8D8D8; padding: 20px 0; margin-bottom: 15px; }
.date-picker .change-month button{width: 32px; height: 32px; border-radius: 6px; }
.date-picker .change-month button:hover{background-color: #E9E9E9; }
.date-picker .change-month .btn-prev-month{background: url(../images/ico/arrow/left.svg) no-repeat 50% 50%; }
.date-picker .change-month .btn-next-month{background: url(../images/ico/arrow/right.svg) no-repeat 50% 50%; }
.date-picker .change-month div{font-size: 36px; }

.date-picker .calendar{display: flex; flex-direction: column; align-items: center; }
.date-picker .calendar .week-list{display: flex; flex-wrap: wrap; width: calc(46px * 7); margin-bottom: 10px; }
.date-picker .calendar .week-item{width: 44px; margin: 1px; }
.date-picker .calendar .week-item span{display: inline-block; width: 100%; font-size: 10px; color: #A1A1A1; text-align: center; }

.date-picker .calendar .date-list{display: flex; flex-wrap: wrap; width: calc(46px * 7); }
.date-picker .calendar .date-item{width: 44px; height: 44px; margin: 1px; }
.date-picker .calendar .date-item span{display: flex; align-items: center; justify-content: center; width: 100%; height: 44px; line-height: 44px; text-align: center; cursor: pointer; }

.date-picker .calendar .date-item.selected span{width: 40px; height: 40px; color: #FFFFFF; background: #4176FF; border-radius: 50%; }


/* Edit Program Style **************************************************************************************/
.formStyle .label_h > div#editor + div{display: block; }
.formStyle .label_h > div#editor + div .ck.ck-label{display: none; }
.ck.ck-toolbar{width: fit-content; border-radius: 4px 4px 0 0 !important; }
.ck.ck-toolbar .ck.ck-toolbar__separator{padding: 0px; }
.ck-editor__editable{border-radius: 0 0 4px 4px !important; }

.ql-toolbar{border-radius: 4px 4px 0 0; }
.ql-toolbar + .ql-container{width: calc(100% - 100px); border-radius: 0 0 4px 4px; margin-left: 100px; }
.ql-snow .ql-editor h1 span,
.ql-snow .ql-editor h2 span,
.ql-snow .ql-editor h3 span,
.ql-snow .ql-editor h4 span,
.ql-snow .ql-editor h5 span,
.ql-snow .ql-editor h6 span{font-size: inherit !important; }

.ql-toolbar.ql-snow span{padding: 0px !important; }
.ql-snow .ql-color-picker .ql-picker-label,
.ql-snow .ql-icon-picker .ql-picker-label{width: 24px; height: 24px; padding: 0px; }