@charset "utf-8";

/*************************************
*               layout               *
*************************************/

/* Wrap */
.fulidWrap{width:100%;}
.innerWrap{width:1280px; margin: 0 auto; padding-left: 10px; padding-right: 10px;}

.flexRowWrap{display: flex; flex-direction: row;}
.flexColWrap{display: flex; flex-direction: column;}

.inlineWrap{font-size: 0;}
.inlineTop{display: inline-block; vertical-align: top;}
.inlineMid{display: inline-block; vertical-align: middle;}

.videoWrap{width: 100%; height: auto; position: relative; padding-top: 56.25%;}
.videoWrap iframe{width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.videoWrap video{width: 100%; height: 100%; position: absolute; top: 0; left: 0;}

.relativeWrap{position: relative;}
.position-l{position: absolute; left: 0;}
.position-r{position: absolute; right: 0;}
.top0{top: 0;} .top5{top: 5px;} .top10{top: 10px;} .top15{top: 15px;} .top20{top: 20px;}
.bot0{bottom: 0;} .bot5{bottom: 5px;} .bot10{bottom: 10px;}

@media screen and (max-width:1279px){
	.innerWrap{width: 100%; padding: 0 20px;}
}
@media screen and (max-width:767px){
	.mobileHide{display: none;}
}

/* Style */
.float-l{float: left;} .float-r{float: right;}

.overflow-h{overflow: hidden;}
.overflow-xScroll{overflow-x: scroll;}
.overflow-yScroll{overflow-y: scroll;}

.border-b-blk{border-bottom: 1px solid #000;}
.border-t-blk{border-top: 1px solid #000;}
.border-b-gray{border-bottom: 1px solid #cecece;}
.border-t-gray{border-top: 1px solid #cecece;}
.border-b-navy{border-bottom: 1px solid #004098;}

.word-breakAll{word-break: break-all;}
.word-keepAll{word-break: keep-all; line-height: 1.2;}




/***************************************
*                  Box                 *
***************************************/

.bgGrayBox{border: 1px solid #777; background-color: #777; padding: 10px;}
.borderBox{border: 1px solid #121212; background-color: #fff; padding: 10px;}



/***************************************
*        button / select / input       *
***************************************/

.btn{display: inline-block; text-align: center; vertical-align: middle; -webkit-transition: background-color 0.15s; -moz-transition: background-color 0.15s; -o-transition: background-color 0.15s; transition: background-color 0.15s; border-radius: 5px;}

select, option, input[type=text], input[type=date], input[type=number], input[type=email], input[type=password]{height: 36px; display: inline-block; vertical-align: middle; background-color: #fff; border: 1px solid #f0f0f0; line-height: 34px; font-size: 16px; color: #121212; padding: 0 0 0 15px; border-radius: 5px;}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
input[type=checkbox], input[type=radio]{display: inline-block; vertical-align: middle;}
*::placeholder{color: #a9a9a9; font-size: 16px; line-height: 34px;}
input:disabled{background-color: #ccc;}

label{display: inline-block; vertical-align: middle; line-height: 34px; text-align: left; font-size: 16px;}                                                                                                                                            

.btn-sky{background-color:#0081CC; color: #fff; border: 1px solid #0081cc;}
.btn-sky.active, .btn-sky:hover{background-color:#22a3ee; color: #fff; border: 1px solid #22a3ee;}
.btn-navy{background-color:#004098; color: #fff; border: 1px solid #004098;}
.btn-navy.active, .btn-navy:hover{background-color:#2262ba; color: #fff; border: 1px solid #2262ba;}
.btn-beige{background-color:#ECC76E; color: #fff; border: 1px solid #ecc76e;}
.btn-beige.active, .btn-beige:hover{background-color:#fee97f; color: #fff; border: 1px solid #fee97f;}
.btn-brown{background-color:#4c2d00; color: #fff; border: 1px solid #4c2d00;}
.btn-brown.active, .btn-brown:hover{background-color:#6e4f22; color: #fff; border: 1px solid #6e4f22;}
.btn-gray{background-color:#464646; color: #fff; border: 1px solid #464646;}
.btn-gray.active, .btn-gray:hover{background-color:#686868; color: #fff; border: 1px solid #686868;}
.btn-green{background-color: #1c9724; color: #fff; border: 1px solid #1c9724;}
.btn-green.active, .btn-green:hover{background-color:#3eb946; color: #fff; border: 1px solid #3eb946;}
.btn-red{background-color:#dd0000; color: #fff; border: 1px solid #dd0000;}
.btn-red.active, .btn-red:hover{background-color:#ff2222; color: #fff; border: 1px solid #ff2222;}
.btn-silver{background-color:#9c9c9c; color: #fff; border: 1px solid #9c9c9c;}
.btn-silver.active, .btn-silver:hover{background-color:#bebebe; color: #fff; border: 1px solid #bebebe;}
.btn-white{background-color:#fff; color: #171717; border: 1px solid #fff;}
.btn-white.active, .btn-white:hover{background-color:#ddd; color: #050505; border: 1px solid #ddd;}
.btn-black{background-color:#000; color: #fff; border: 1px solid #000;}
.btn-black.active, .btn-black:hover{background-color: #333; border: 1px solid #333;}
.btn-transparent{background-color:transparent;  border: 1px solid #000; color: #171717;}
.btn-transparent.active, .btn-transparent:hover{background-color: rgba(0,0,0,0.1); color: #171717;}

.btn-center{display: block; float: none; margin: 0 auto;}
.btn-leftPosition{position: absolute; top: 0; left: 0;}
.btn-rightPosition{position: absolute; top: 0; right: 0;}

textarea{resize: none; vertical-align: top; border-radius: 5px; border:1px solid #f0f0f0; padding: 5px; line-height: 1.4;}
textarea::placeholder{line-height: 1;}

*:disabled{background-color: #f0f0f0; cursor: not-allowed;}



/***************************************
*            table / paging            *
***************************************/

table{table-layout: fixed; width: 100%; border-collapse: collapse; font-size: 14px;}

/* thead 없는 table 형식 */
table.type1 thead th{background-color: #cecece; border: 1px solid #333; padding: 5px 0; font-weight: bold; font-size: 16px; word-break: break-all; color: #000;}
table.type1 tbody td{background-color: #fff; border: 1px solid #333; padding: 5px 0; font-weight: normal; font-size: 16px; word-break: break-all; color: #000; text-align: center}

/* thead background-color table 형식 */
table.type2 th{border: 1px solid #ccc; background-color: #ccc; font-weight: bold; font-size: 16px; color: #232323; padding: 5px 0;}
table.type2 td{border: 1px solid #ccc; background-color: #fff; word-break: keep-all; color: #232323; text-align: left; padding: 5px 0;}

/* thead border없는 table 형식 */
table.type3 th{border: 1px solid #cecece; background-color: #cecece; font-size: 18px; font-weight: normal; padding: 5px 0;}
table.type3 td{border: 1px solid #cecece; background-color: #fff; font-size: 16px; font-weight: normal; text-align: center; padding: 5px 0;}

table tr.linkRow:hover{background-color: #ccc; cursor: pointer;}

/* 말줄임표 */
.ellipsis{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

/* contenteditable = "true" div */
.editDiv{width: 100%; min-height: 200px; max-height: 300px; overflow-y: auto; border-radius: 5px; padding: 10px; background-color: #fff; text-align: left; color: #000;}
/* Pagination */
.pagingWrap{display: flex; justify-content: center; align-items: center;}
.pagingWrap button{width: 16px; height: 16px; padding: 0; margin: 0 10px;}

ul.paging{display: flex; flex-flow: row wrap; justify-content: center; align-items: center; gap: 20px;}
ul.paging li a{display: block; font-size: 18px; color: #121212; cursor: pointer;}



/*************************************
*             Flex System            *
*************************************/

.flexWrap{display: flex; flex-wrap: wrap;}
.flexWrap.spaceBetween{justify-content: space-between;}
.flexWrap.center{justify-content: center;}
.flexWrap.alignCenter{align-items: center}
.flexWrap.alignStart{align-items: flex-start;}
.flexWrap.row{flex-flow: row wrap;}
.flexWrap.row.right{justify-content: end;}
.flexWrap.row.left{justify-content: start;}
.flexWrap.col{flex-flow: column wrap;}
.flexWrap.col.right{align-items: flex-end;}
.flexWrap.col.left{align-items: flex-start;}

.flexWrap.grid{gap: 20px; justify-content: center; margin-left: -10px; margin-right: -10px;}


@media screen and (max-width:1279px){
	.flexWrap.grid{gap: 16px;  margin-left: -8px; margin-right: -8px;}
}

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

}
.col_lg1{flex: calc(8.3333333% - 20px) 0 0;}
.col_lg2{flex: calc(16.6666667% - 20px) 0 0;}
.col_lg3{flex: calc(25% - 20px) 0 0;}
.col_lg4{flex: calc(33.3333333% - 20px) 0 0;}
.col_lg5{flex: calc(41.6666667% - 20px) 0 0;}
.col_lg6{flex: calc(50% - 20px) 0 0;}
.col_lg7{flex: calc(58.3333333% - 20px) 0 0;}
.col_lg8{flex: calc(66.6666667% - 20px) 0 0;}
.col_lg9{flex: calc(75% - 20px) 0 0;}
.col_lg10{flex: calc(83.3333333% - 20px) 0 0;}
.col_lg11{flex: calc(91.6666667% - 20px) 0 0;}
.col_lg12{flex: calc(100% - 20px) 0 0;}

@media screen and (max-width: 1279px){
	.col_md0{display: none !important;}
	.col_md1{flex: calc(8.3333333% - 16px) 0 0;}
	.col_md2{flex: calc(16.6666667% - 16px) 0 0;}
	.col_md3{flex: calc(25% - 16px) 0 0;}
	.col_md4{flex: calc(33.3333333% - 16px) 0 0;}
	.col_md5{flex: calc(41.6666667% - 16px) 0 0;}
	.col_md6{flex: calc(50% - 16px) 0 0;}
	.col_md7{flex: calc(58.3333333% - 16px) 0 0;}
	.col_md8{flex: calc(66.6666667% - 16px) 0 0;}
	.col_md9{flex: calc(75% - 16px) 0 0;}
	.col_md10{flex: calc(83.3333333% - 16px) 0 0;}
	.col_md11{flex: calc(91.6666667% - 16px) 0 0;}
	.col_md12{flex: calc(100% - 16px) 0 0;}
}

@media screen and (max-width: 767px){
	.col_sm0{display: none !important;}
	.col_sm1{flex: calc(8.3333333% - 16px) 0 0;}
	.col_sm2{flex: calc(16.6666667% - 16px) 0 0;}
	.col_sm3{flex: calc(25% - 16px) 0 0;}
	.col_sm4{flex: calc(33.3333333% - 16px) 0 0;}
	.col_sm5{flex: calc(41.6666667% - 16px) 0 0;}
	.col_sm6{flex: calc(50% - 16px) 0 0;}
	.col_sm7{flex: calc(58.3333333% - 16px) 0 0;}
	.col_sm8{flex: calc(66.6666667% - 16px) 0 0;}
	.col_sm9{flex: calc(75% - 16px) 0 0;}
	.col_sm10{flex: calc(83.3333333% - 16px) 0 0;}
	.col_sm11{flex: calc(91.6666667% - 16px) 0 0;}
	.col_sm12{flex: calc(100% - 16px) 0 0;}
}




/*************************************
*           width / height           *
*************************************/

.w1p{width: 1%;} .w2p{width: 2%;} .w3p{width: 3%;} .w4p{width: 4%;} .w5p{width: 5%;}
.w6p{width: 6%;} .w7p{width: 7%;} .w8p{width: 8%;} .w9p{width: 9%;} .w10p{width: 10%;}
.w11p{width: 11%;} .w12p{width: 12%;} .w13p{width: 13%;} .w14p{width: 14%;} .w15p{width: 15%;}
.w16p{width: 16%;} .w17p{width: 17%;} .w18p{width: 18%;} .w19p{width: 19%;} .w20p{width: 20%;}
.w21p{width: 21%;} .w22p{width: 22%;} .w23p{width: 23%;} .w24p{width: 24%;} .w25p{width: 25%;}
.w26p{width: 26%;} .w27p{width: 27%;} .w28p{width: 28%;} .w29p{width: 29%;} .w30p{width: 30%;}
.w31p{width: 31%;} .w32p{width: 32%;} .w33p{width: 33%;} .w34p{width: 34%;} .w35p{width: 35%;}
.w36p{width: 36%;} .w37p{width: 37%;} .w38p{width: 38%;} .w39p{width: 39%;} .w40p{width: 40%;}
.w41p{width: 41%;} .w42p{width: 42%;} .w43p{width: 43%;} .w44p{width: 44%;} .w45p{width: 45%;}
.w46p{width: 46%;} .w47p{width: 47%;} .w48p{width: 48%;} .w49p{width: 49%;} .w50p{width: 50%;}
.w51p{width: 51%;} .w52p{width: 52%;} .w53p{width: 53%;} .w54p{width: 54%;} .w55p{width: 55%;}
.w56p{width: 56%;} .w57p{width: 57%;} .w58p{width: 58%;} .w59p{width: 59%;} .w60p{width: 60%;}
.w61p{width: 61%;} .w62p{width: 62%;} .w63p{width: 63%;} .w64p{width: 64%;} .w65p{width: 65%;}
.w66p{width: 66%;} .w67p{width: 67%;} .w68p{width: 68%;} .w69p{width: 69%;} .w70p{width: 70%;}
.w71p{width: 71%;} .w72p{width: 72%;} .w73p{width: 73%;} .w74p{width: 74%;} .w75p{width: 75%;}
.w76p{width: 76%;} .w77p{width: 77%;} .w78p{width: 78%;} .w79p{width: 79%;} .w80p{width: 80%;}
.w81p{width: 81%;} .w82p{width: 82%;} .w83p{width: 83%;} .w84p{width: 84%;} .w85p{width: 85%;}
.w86p{width: 86%;} .w87p{width: 87%;} .w88p{width: 88%;} .w89p{width: 89%;} .w90p{width: 90%;}
.w91p{width: 91%;} .w92p{width: 92%;} .w93p{width: 93%;} .w94p{width: 94%;} .w95p{width: 95%;}
.w96p{width: 96%;} .w97p{width: 97%;} .w98p{width: 98%;} .w99p{width: 99%;} .w100p{width: 100%;}

.h100p{height: 100%;}
.min-h200{min-height: 200px;}



/***************************************
*                 font                 *
***************************************/

.font-sky{color:#0391bf;} .font-red{color:#d72800;} .font-blue{color: #0a51a1;}
.font-navy{color: #004376;} .font-gray{color:#777;} .font-blk{color:#000;}

.font-s14{font-size: 14px;} .font-s15{font-size: 15px;} .font-s16{font-size: 16px;} .font-s18{font-size: 18px;}
.font-s20{font-size: 20px;} .font-s22{font-size: 22px;} .font-s24{font-size: 24px;} .font-s28{font-size: 28px;}

.font-bold{font-weight: bold;} .font-normal{font-weight: normal;} .font-lighter{font-weight: lighter;}
.font-italic{font-style: italic;} .txt-underline{text-decoration: underline;}

.small{font-size: 80%;}

.txtCenter{text-align: center;} .txtRight{text-align: right;} .txtLeft{text-align: left;}


/***************************************
*           margin / padding           *
***************************************/

.m0{margin: 0;} .m5{margin: 5px;} .m10{margin: 10px;}

.mt0{margin-top: 0px;} .mt5{margin-top: 5px;} .mt10{margin-top: 10px;} .mt15{margin-top: 15px;}
.mt20{margin-top: 20px;} .mt25{margin-top: 25px;} .mt30{margin-top: 30px;} .mt35{margin-top: 35px;}
.mt40{margin-top: 40px;} .mt45{margin-top: 45px;}  .mt50{margin-top: 50px;} .mt60{margin-top: 60px;} .mt70{margin-top: 70px;}
.mt80{margin-top: 80px;} .mt90{margin-top: 90px;} .mt100{margin-top: 100px;} .mt200{margin-top: 200px;}

.mr0{margin-right: 0px;} .mr5{margin-right: 5px;} .mr10{margin-right: 10px;} .mr20{margin-right: 20px;}
.mr30{margin-right: 30px;} .mr40{margin-right: 40px;} .mr50{margin-right: 50px;}

.mr1p{margin-right: 1%;} .mr2p{margin-right: 2%;} .mr3p{margin-right: 3%;} .mr5p{margin-right: 5%;}
.mr7p{margin-right: 7%;} .mr8p{margin-right: 8%;} .mr10p{margin-right: 10%;} .mr12p{margin-right: 12%;}
.mr15p{margin-right: 15%;} .mr17p{margin-right: 17%;} .mr20p{margin-right: 20%;}

.mb5{margin-bottom: 5px;} .mb10{margin-bottom: 10px;} .mb15{margin-bottom: 15px;} .mb20{margin-bottom: 20px;}
.mb30{margin-bottom: 30px;} .mb40{margin-bottom: 40px;} .mb50{margin-bottom: 50px;}

.ml0{margin-left: 0px;} .ml5{margin-left: 5px;} .ml10{margin-left: 10px;} .ml20{margin-left: 20px;}
.ml30{margin-left: 30px;} .ml40{margin-left: 40px;} .ml50{margin-left: 50px;}

.ml1p{margin-left: 1%;} .ml2p{margin-left: 2%;} .ml3p{margin-left: 3%;} .ml5p{margin-left: 5%;}
.ml7p{margin-left: 7%;} .ml8p{margin-left: 8%;} .ml10p{margin-left: 10%;} .ml12p{margin-left: 12%;}
.ml13p{margin-left: 13%;} .ml15p{margin-left: 15%;} .ml20p{margin-left: 20%;} .ml25p{margin-left: 25%;}
.ml30p{margin-left: 30%;} .ml50p{margin-left: 50%;}

.ml_col1{margin-left: 8.33%;} .ml_col2{margin-left: 16.66%;} .ml_col3{margin-left: 25%;}
.ml_col4{margin-left: 33.33%;} .ml_col5{margin-left: 41.66%;} .ml_col6{margin-left: 50%;}
.ml_col7{margin-left: 58.31%;} .ml_col8{margin-left: 66.64%;} .ml_col9{margin-left: 75%;}
.ml_col10{margin-left: 83.33%;} .ml_col11{margin-left: 91.66%;} .ml_col12{margin-left: 100%;}


@media screen and (max-width: 1279px){
	.md_ml_col0{margin-left: 0;} 
	.md_ml_col1{margin-left: 8.33%;} .md_ml_col2{margin-left: 16.66%;} .md_ml_col3{margin-left: 25%;}
	.md_ml_col4{margin-left: 33.33%;} .md_ml_col5{margin-left: 41.66%;} .md_ml_col6{margin-left: 50%;}
	.md_ml_col7{margin-left: 58.31%;} .md_ml_col8{margin-left: 66.64%;} .md_ml_col9{margin-left: 75%;}
	.md_ml_col10{margin-left: 83.33%;} .md_ml_col11{margin-left: 91.66%;} .md_ml_col12{margin-left: 100%;}
}

@media screen and (max-width: 767px){
	.sm_mt20{margin-top: 20px;}

	.sm_sm_col0{margin-left: 0;}
	.sm_sm_col1{margin-left: 8.33%;} .sm_sm_col2{margin-left: 16.66%;} .sm_sm_col3{margin-left: 25%;}
	.sm_sm_col4{margin-left: 33.33%;} .sm_sm_col5{margin-left: 41.66%;} .sm_sm_col6{margin-left: 50%;}
	.sm_sm_col7{margin-left: 58.31%;} .sm_sm_col8{margin-left: 66.64%;} .sm_sm_col9{margin-left: 75%;}
	.sm_sm_col10{margin-left: 83.33%;} .sm_sm_col11{margin-left: 91.66%;} .sm_sm_col12{margin-left: 100%;}
}


.p0{padding: 0;} .p5{padding: 5px;} .p10{padding: 10px;} .p15{padding: 15px;} .p20{padding: 20px;}
.p25{padding: 25px;} .p30{padding: 30px;} .p35{padding: 35px;} .p40{padding: 40px;} .p50{padding: 50px;}

.pt0{padding-top: 0;} .pt5{padding-top: 5px;} .pt7{padding-top: 7px;} .pt10{padding-top: 10px;}
.pt12{padding-top: 12px;} .pt15{padding-top: 15px;} .pt17{padding-top: 17px;} .pt20{padding-top: 20px;}
.pt25{padding-top: 25px;} .pt30{padding-top: 30px;} .pt40{padding-top: 40px;} .pt50{padding-top: 50px;}
.pt60{padding-top: 60px;} .pt70{padding-top: 70px;} .pt80{padding-top: 80px;} .pt90{padding-top: 90px;} .pt100{padding-top: 100px;}

.pr0{padding-right: 0;} .pr5{padding-right: 5px;} .pr10{padding-right: 10px;}
.pr15{padding-right: 15px;} .pr20{padding-right: 20px;} .pr30{padding-right: 30px;}
.pr40{padding-right: 40px;} .pr50{padding-right: 50px;}

.pb0{padding-bottom: 0px;} .pb5{padding-bottom: 5px;} .pb10{padding-bottom: 10px;}
.pb15{padding-bottom: 15px;} .pb20{padding-bottom: 20px;} .pb25{padding-bottom: 25px;}
.pb30{padding-bottom: 31px;} .pb40{padding-bottom: 41px;} .pb50{padding-bottom: 50px;}
.pb60{padding-bottom: 60px;} .pb70{padding-bottom: 70px;} .pb80{padding-bottom: 80px;}
.pb90{padding-bottom: 90px;} .pb100{padding-bottom: 100px;}
.pb300{padding-bottom: 300px;}

.pl0{padding-left: 0;} .pl5{padding-left: 5px;} .pl10{padding-left: 10px;} .pl15{padding-left: 15px;}
.pl20{padding-left: 20px;} .pl25{padding-left: 25px;} .pl30{padding-left: 30px;} .pl40{padding-left: 40px;}