@charset "utf-8";

.trans_3{-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}

/* basic start */
#wrap{overflow: hidden; width: 100%;position: relative;}

/*250121 content.css에서 옮김*/
.container_sub{width: 100%; overflow: hidden; z-index: 2;}
#page-contents { min-height: 100vh;}

.cf::after {
  content: '';
  clear: both;
  display: block;
}
.blind{font-size: 0; line-height: 0; visibility: hidden; position: absolute; left: 0; top: 0; width: 0; height: 0; opacity: 0;}
.greybox { width: 100%; height: auto; margin-top: 60px; padding: 35px; background: #eeeeee;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block; line-height: 1.66;
}
.bluebox { width: 100%; height: auto; margin-top: 60px; padding: 35px; background: #05507d; color: #fff;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block; line-height: 1.66;
}
.greybox p {margin-top: 10px;}

/*250121 content.css에서 옮김*/
.inr-c{max-width: 1446px; width: 90%; margin-left: auto; margin-right: auto;}
.inr-c2{max-width: 1260px; width: 90%; margin-left: auto; margin-right: auto;}

.inr-c3{max-width: 1460px; width: 90%; margin-left: auto; margin-right: auto; box-sizing: border-box; }
.inr-c4{max-width: 1332px; margin-left: auto; margin-right: auto; box-sizing: border-box; padding-left: 40px; padding-right: 40px;}
.inr-c5{max-width: 1080px; margin-left: auto; margin-right: auto; box-sizing: border-box; /*padding-left: 40px; padding-right: 40px;*/}

/* basic end */

/* flex start */
.d-flex{display: flex;}
.d-iflex{display: inline-flex;}
.ai-c{align-items: center !important;}
.ai-e{align-items: flex-end !important;}
.fl-d{flex-direction: column;}
.jc-sb{justify-content: space-between;} 
.jc-e{justify-content: flex-end;}
.flw-w{flex-wrap: wrap;} 
.ff-en{ font-family: 'Metropolis', sans-serif; }
.ff-en2{ font-family: 'Roboto', sans-serif; }

.d-iflex{display: inline-flex !important;}
.ai-c{align-items: center !important;}

/* flex end */

/* padding&margin start */
.mb0{margin-bottom: 0px !important;} .mb5{margin-bottom: 5px !important;} .mb10{margin-bottom: 10px !important;} .mb15{margin-bottom: 15px !important;} .mb20{margin-bottom: 20px !important;} .mb25{margin-bottom: 25px !important;} .mb30{margin-bottom: 30px !important;} .mb35{margin-bottom: 35px !important;} .mb40{margin-bottom: 40px !important;} .mb45{margin-bottom: 45px !important;} .mb50{margin-bottom: 50px !important;} .mb55{margin-bottom: 55px !important;} .mb60{margin-bottom: 60px !important;} .mb65{margin-bottom: 65px !important;} .mb70{margin-bottom: 70px !important;} .mb75{margin-bottom: 75px !important;} .mb80{margin-bottom: 80px !important;} .mb85{margin-bottom: 85px !important;} .mb90{margin-bottom: 90px !important;} .mb95{margin-bottom: 95px !important;} .mb100{margin-bottom: 100px !important;} .mt0{margin-top: 0px !important;} .mt5{margin-top: 5px !important;} .mt10{margin-top: 10px !important;} .mt15{margin-top: 15px !important;} .mt20{margin-top: 20px !important;} .mt25{margin-top: 25px !important;} .mt30{margin-top: 30px !important;} .mt35{margin-top: 35px !important;} .mt40{margin-top: 40px !important;} .mt45{margin-top: 45px !important;} .mt50{margin-top: 50px !important;} .mt55{margin-top: 55px !important;} .mt60{margin-top: 60px !important;} .mt65{margin-top: 65px !important;} .mt70{margin-top: 70px !important;} .mt75{margin-top: 75px !important;} .mt80{margin-top: 80px !important;} .mt85{margin-top: 85px !important;} .mt90{margin-top: 90px !important;} .mt95{margin-top: 95px !important;} .mt100{margin-top: 100px !important;} .ml0{margin-left: 0px !important;} .ml5{margin-left: 5px !important;} .ml10{margin-left: 10px !important;} .ml15{margin-left: 15px !important;} .ml20{margin-left: 20px !important;} .ml25{margin-left: 25px !important;} .ml30{margin-left: 30px !important;} .ml35{margin-left: 35px !important;} .ml40{margin-left: 40px !important;} .ml45{margin-left: 45px !important;} .ml50{margin-left: 50px !important;} .ml55{margin-left: 55px !important;} .ml60{margin-left: 60px !important;} .ml65{margin-left: 65px !important;} .ml70{margin-left: 70px !important;} .ml75{margin-left: 75px !important;} .ml80{margin-left: 80px !important;} .ml85{margin-left: 85px !important;} .ml90{margin-left: 90px !important;} .ml95{margin-left: 95px !important;} .ml100{margin-left: 100px !important;} .mr0{margin-right: 0px !important;} .mr5{margin-right: 5px !important;} .mr10{margin-right: 10px !important;} .mr15{margin-right: 15px !important;} .mr20{margin-right: 20px !important;} .mr25{margin-right: 25px !important;} .mr30{margin-right: 30px !important;} .mr35{margin-right: 35px !important;} .mr40{margin-right: 40px !important;} .mr45{margin-right: 45px !important;} .mr50{margin-right: 50px !important;} .mr55{margin-right: 55px !important;} .mr60{margin-right: 60px !important;} .mr65{margin-right: 65px !important;} .mr70{margin-right: 70px !important;} .mr75{margin-right: 75px !important;} .mr80{margin-right: 80px !important;} .mr85{margin-right: 85px !important;} .mr90{margin-right: 90px !important;} .mr95{margin-right: 95px !important;} .mr100{margin-right: 100px !important;}

.pb0{padding-bottom: 0px !important;} .pb5{padding-bottom: 5px !important;} .pb10{padding-bottom: 10px !important;} .pb15{padding-bottom: 15px !important;} .pb20{padding-bottom: 20px !important;} .pb25{padding-bottom: 25px !important;} .pb30{padding-bottom: 30px !important;} .pb35{padding-bottom: 35px !important;} .pb40{padding-bottom: 40px !important;} .pb45{padding-bottom: 45px !important;} .pb50{padding-bottom: 50px !important;} .pb55{padding-bottom: 55px !important;} .pb60{padding-bottom: 60px !important;} .pb65{padding-bottom: 65px !important;} .pb70{padding-bottom: 70px !important;} .pb75{padding-bottom: 75px !important;} .pb80{padding-bottom: 80px !important;} .pb85{padding-bottom: 85px !important;} .pb90{padding-bottom: 90px !important;} .pb95{padding-bottom: 95px !important;} .pb100{padding-bottom: 100px !important;} .pt0{padding-top: 0px !important;} .pt5{padding-top: 5px !important;} .pt10{padding-top: 10px !important;} .pt15{padding-top: 15px !important;} .pt20{padding-top: 20px !important;} .pt25{padding-top: 25px !important;} .pt30{padding-top: 30px !important;} .pt35{padding-top: 35px !important;} .pt40{padding-top: 40px !important;} .pt45{padding-top: 45px !important;} .pt50{padding-top: 50px !important;} .pt55{padding-top: 55px !important;} .pt60{padding-top: 60px !important;} .pt65{padding-top: 65px !important;} .pt70{padding-top: 70px !important;} .pt75{padding-top: 75px !important;} .pt80{padding-top: 80px !important;} .pt85{padding-top: 85px !important;} .pt90{padding-top: 90px !important;} .pt95{padding-top: 95px !important;} .pt100{padding-top: 100px !important;} .pl0{padding-left: 0px !important;} .pl5{padding-left: 5px !important;} .pl10{padding-left: 10px !important;} .pl15{padding-left: 15px !important;} .pl20{padding-left: 20px !important;} .pl25{padding-left: 25px !important;} .pl30{padding-left: 30px !important;} .pl35{padding-left: 35px !important;} .pl40{padding-left: 40px !important;} .pl45{padding-left: 45px !important;} .pl50{padding-left: 50px !important;} .pl55{padding-left: 55px !important;} .pl60{padding-left: 60px !important;} .pl65{padding-left: 65px !important;} .pl70{padding-left: 70px !important;} .pl75{padding-left: 75px !important;} .pl80{padding-left: 80px !important;} .pl85{padding-left: 85px !important;} .pl90{padding-left: 90px !important;} .pl95{padding-left: 95px !important;} .pl100{padding-left: 100px !important;} .pr0{padding-right: 0px !important;} .pr5{padding-right: 5px !important;} .pr10{padding-right: 10px !important;} .pr15{padding-right: 15px !important;} .pr20{padding-right: 20px !important;} .pr25{padding-right: 25px !important;} .pr30{padding-right: 30px !important;} .pr35{padding-right: 35px !important;} .pr40{padding-right: 40px !important;} .pr45{padding-right: 45px !important;} .pr50{padding-right: 50px !important;} .pr55{padding-right: 55px !important;} .pr60{padding-right: 60px !important;} .pr65{padding-right: 65px !important;} .pr70{padding-right: 70px !important;} .pr75{padding-right: 75px !important;} .pr80{padding-right: 80px !important;} .pr85{padding-right: 85px !important;} .pr90{padding-right: 90px !important;} .pr95{padding-right: 95px !important;} .pr100{padding-right: 100px !important;}

.d-b{display: block !important;}
.d-ib{display: inline-block !important;}
.maw90p{max-width: 90%;}
.pos-r{position: relative;}

.w10p{width: 10% !important;}.w15p{width: 15% !important;}.w20p{width: 20% !important;}.w25p{width: 25% !important;}.w30p{width: 30% !important;}.w35p{width: 35% !important;}.w40p{width: 40% !important;}.w45p{width: 45% !important;}.w50p{width: 50% !important;}.w55p{width: 55% !important;}.w60p{width: 60% !important;}.w65p{width: 65% !important;}.w70p{width: 70% !important;}.w75p{width: 75% !important;}.w80p{width: 80% !important;}.w85p{width: 85% !important;}.w90p{width: 90% !important;}.w95p{width: 95% !important;}.w100p{width: 100% !important;}

.pr-mb-25{margin-bottom: 25px !important;}
.pr-mt-25{margin-top: 25px !important;}
.pr-mb-30{margin-bottom: 30px !important;}
.pr-mt-30{margin-top: 30px !important;}
.pr-mb-40{margin-bottom: 40px !important;}
.pr-mt-40{margin-top: 40px !important;}
.pr-mb-70{margin-bottom: 70px !important;}
.pr-mt-70{margin-top: 70px !important;}
.pr-mb-110{margin-bottom: 110px !important;}
.pr-mt-110{margin-top: 110px !important;}

.pr-pb-25{padding-bottom: 25px !important;}
.pr-pt-25{padding-top: 25px !important;}
.pr-pb-30{padding-bottom: 30px !important;}
.pr-pt-30{padding-top: 30px !important;}
.pr-pb-40{padding-bottom: 40px !important;}
.pr-pt-40{padding-top: 40px !important;}
.pr-pb-70{padding-bottom: 70px !important;}
.pr-pt-70{padding-top: 70px !important;}
.pr-pb-110{padding-bottom: 110px !important;}
.pr-pt-110{padding-top: 110px !important;}

@media screen and (max-width: 1520px) {
  .pr-mb-25{margin-bottom: 15px !important;}
  .pr-mt-25{margin-top: 15px !important;}
  .pr-mb-30{margin-bottom: 20px !important;}
  .pr-mt-30{margin-top: 20px !important;}
  .pr-mb-40{margin-bottom: 30px !important;}
  .pr-mt-40{margin-top: 30px !important;}
  .pr-mb-70{margin-bottom: 40px !important;}
  .pr-mt-70{margin-top: 40px !important;}
  .pr-mb-110{margin-bottom: 60px !important;}
  .pr-mt-110{margin-top: 60px !important;}

  .pr-pb-25{padding-bottom: 15px !important;}
  .pr-pt-25{padding-top: 15px !important;}
  .pr-pb-30{padding-bottom: 20px !important;}
  .pr-pt-30{padding-top: 20px !important;}
  .pr-pb-40{padding-bottom: 30px !important;}
  .pr-pt-40{padding-top: 30px !important;}
  .pr-pb-70{padding-bottom: 40px !important;}
  .pr-pt-70{padding-top: 40px !important;}
  .pr-pb-110{padding-bottom: 60px !important;}
  .pr-pt-110{padding-top: 60px !important;}
 
}

/* padding&margin end */

/* font start */
sub{font-size: small;}

.fz_14{font-size: 14px; font-size: 0.875em; line-height: 1.7857;}
.fz_16{font-size: 16px; font-size: 1em; line-height: 1.5625;}
.fz_18{font-size: 18px; font-size: 1.125em; line-height: 1.6667; /*30*/}
.fz_20{font-size: 20px; font-size: 1.25em;}
.fz_22{font-size: 22px; font-size: 1.375em;}
.fz_25{font-size: 25px; font-size: 1.5625em; line-height: 1.4; /*35*/}
.fz_35{font-size: 35px; font-size: 2.1875em; line-height: 1.3;}

.lh_13{line-height: 1.3;}

.fw-n{font-weight: 500;}
.fw-l{font-weight: 600;}

.c_gray{color: #8e8e8e !important;}
.c_black{color: #222 !important;}
.c_blue2{color: #0066cc !important;}
.c_blue3{color: #0058aa !important;}
.c_blue4{color: #099de8 !important;}
.c_blue_40{color: #50667d !important;}
.td-u{text-decoration: underline;}

.blue{color: #005c9c!important;}
.dark{color: #222!important;}

.td-u{text-decoration: underline;  text-underline-position: under;}
.wb-k{word-break: keep-all;}

.title_1{font-size: 55px; font-size: 3.4375em; line-height: 70px; line-height: 1.2727; font-weight: 600; color: #222;}

.c_blue{color: #4e86ff !important;}
.c_green{color: #62c0c1 !important;}

/**  250103 content.css 에서 옮김 start  **/
.pr-mb-n{margin-bottom: 50px !important;}
.title0{font-size: 45px; font-weight: 600; color: #162941; line-height: 1.2;}
.title1{font-size: 30px; line-height: 1.2; font-weight: 600; color: #222222; margin-bottom: 55px; }
.title1.flex{display:flex; flex-wrap: wrap;}
.title1.flex > *{flex: none;}
.title1.flex .i-txt{margin-top: 2px;}
.title1.flex .txt{width: 90%;}
.title2{font-size: 18px; font-weight: 500; color: #222222; margin-bottom: 9px; }
.title3{font-size: 20px; font-weight: 500; color: #222222; margin-bottom: 25px; }

.group_txt1{line-height: 1.75; word-break: keep-all;}

/**  250103 content.css 에서 옮김 end  **/

/* font end */

/* align start */

.ta-c{text-align: center !important;}
.ta-l{text-align: left !important;}
.ta-r{text-align: right !important;}

/* align end */


.none-content{min-height: 400px; display: flex; align-items: center; justify-content: center; font-size: 3vw; color: #666; font-weight: bold;} /*230503 font-size: 60px에서 3vw로 수정*/


.box-textarea{ height: 400px; background-color: #fff; overflow-x: hidden; overflow-y: scroll; border: 1px solid #9e9e9e; padding: 40px 50px; }
.box-textarea > .inner { white-space: pre-line }
.box-textarea::-webkit-scrollbar {
    width: 3px;  /* 스크롤바의 너비 */
}

.box-textarea::-webkit-scrollbar-thumb {
    height: 30%; /* 스크롤바의 길이 */
    background: #838383; /* 스크롤바의 색상 */
    border-radius: 50px;
    /*margin-right: 5px;*/
    
    border-radius: 10px;
}

.box-textarea::-webkit-scrollbar-track {
    background: rgba(33, 122, 244, 0);  /*스크롤바 뒷 배경 색상*/
}


.btn_bot{padding-top: 40px;margin-top: 40px;border-top: 1px solid #222;text-align: center;display: flex;align-items: center;justify-content: center;}
.btn_bot > *{margin: 0 6px;}

/* button start */
button[class*="btn_type"]{border: 0;  cursor: pointer; }
[class*="btn_type"]{display: inline-flex; justify-content: center; align-items: center; line-height: 1; box-sizing: border-box;}
[class*="btn_type"].wa{width: auto;}
[class*="btn_type"].w1{width: 160px;}
[class*="btn_type"].w2{width: 220px;}
[class*="btn_type"].bdrs_5{border-radius: 5px;}
[class*="btn_type"].bdrs_8{border-radius: 8px;}
[class*="btn_type"].bdrs_hf{border-radius: 500px;}
[class*="btn_type"].h45{height: 45px;}
[class*="btn_type"].h50{height: 50px;}
[class*="btn_type"].h60{height: 60px;}
[class*="btn_type"].h85{height: 85px;}
[class*="btn_type"].pv35{width: auto; padding:0 35px;}
[class*="btn_type"].pv60{width: auto; padding:0 60px;}

/*230809 추가*/
[class*="btn_type"].black:focus,
[class*="btn_type"].black2:focus{outline-offset:3px; border: 3px dashed; }

[class*="btn_type"].white{background-color: #fff; color: #666; border: 1px #9e9e9e solid;}
@media (hover: hover) {
  [class*="btn_type"].white:where(:hover, :focus){opacity: 0.8;}
}
[class*="btn_type"].white_rev{background-color: transparent; color: #fff; border: 1px #fff solid;}
@media (hover: hover) {
  [class*="btn_type"].white_rev:where(:hover, :focus){ background-color: #fff; color: #222;  }
}
[class*="btn_type"].black{background-color: #222; color: #fff; border: 0;outline-offset: 3px;}
@media (hover: hover) {
  [class*="btn_type"].black:where(:hover, :focus){opacity: 0.8;}
}
[class*="btn_type"].black2{background-color: #333; color: #fff; border: 0;}
@media (hover: hover) {
  [class*="btn_type"].black2:where(:hover, :focus){opacity: 0.8;}
}

[class*="btn_type"].ctype1{background-color: #099de8; color: #fff; border: 0;}
@media (hover: hover) {
  [class*="btn_type"].ctype1:where(:hover, :focus){opacity: 0.8;}
}
[class*="btn_type"].ctype2{background-color: #fff; border: 1px solid #9a9a9a; color: #222; font-size: 20px; font-size: 1.25em;}
[class*="btn_type"].ctype2 i{margin-left: 13px;color: #099de8;font-size: 35px;}
@media (hover: hover) {
  [class*="btn_type"].ctype2:where(:hover, :focus){opacity: 0.8; border-color: #099de8;}
}
[class*="btn_type"].ctype3{background-color: #fff; border: 1px solid #9e9e9e; color: #222; font-size: 16px;}
[class*="btn_type"].ctype3 i.lft{margin-right: 13px;}
@media (hover: hover) {
  [class*="btn_type"].ctype3:where(:hover, :focus){opacity: 0.8; border-color: #099de8;}
}

[class*="btn_type"].ico_rgh{display: inline-flex; align-items: center; }
[class*="btn_type"].ico_rgh i{ margin-left: 10px;  margin-top: 1px;}

/**  250103 content.css 에서 옮김 start  **/
.btn_type1{
  width: auto; height: 46px; border: 1px #c4c4c4 solid;  border-radius: 100px; display: inline-flex;justify-content: center;align-items: center;  font-size: 13px;
  transition: all 300ms cubic-bezier(0.615, 0.000, 0.320, 1.000);
  transition-timing-function: cubic-bezier(0.615, 0.000, 0.320, 1.000); 
}
.btn_type1 .inr{
  display: inline-block; width: 0; overflow: hidden; color: #fff;
  transition: all 300ms cubic-bezier(0.615, 0.000, 0.320, 1.000);
  transition-timing-function: cubic-bezier(0.615, 0.000, 0.320, 1.000); 
  font-family: 'Metropolis'; line-height: 1; margin-top: 1px;
}
.btn_type1 .circle{ width: 46px; height: 46px; border-radius: 50%; display:inline-flex; align-items: center; justify-content: center; }
.btn_type1 .circle i{-webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  -o-transform: rotate(315deg);
  -ms-transform: rotate(315deg);
  transform: rotate(315deg);
  transition: all 300ms cubic-bezier(0.615, 0.000, 0.320, 1.000);
  transition-timing-function: cubic-bezier(0.615, 0.000, 0.320, 1.000); 
  font-size: 1.6em;margin-top: -2px;
}
.btn_type1:where(:hover, :focus){background-color: #00a5e5; /*230607 주석*//*padding: 0 15px;*/ border-color: #00a5e5;}
.btn_type1:where(:hover, :focus) .inr{ padding: 0 0 0 15px;}
.btn_type1:where(:hover, :focus) .circle{}
.btn_type1:where(:hover, :focus) .circle i{color: #fff;}

/**  250103 content.css 에서 옮김 end  **/

.btn_type2{}

.btn_txt1{font-size: 20px; color: #099de8; font-weight: 400;} 
.btn_txt1 .circle{margin-left: 10px; width: 50px; height: 50px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #cecece; border-radius: 50%; }
@media (hover: hover) {
  .btn_txt1:where(:hover, :focus) {color: #005386;}
  .btn_txt1:where(:hover, :focus) .circle{background-color: #005386; border-color: #005386; }
}

.btn_down1{  min-width: 180px; height: 40px; padding: 0 15px; margin-right: 10px; margin-bottom: 10px; border: 1px solid #d6d6d6; background-color: #eaeaea; display: inline-flex; align-items: center; justify-content: space-between; line-height: 1; }
.btn_down1.h50{height: 50px;}
.btn_down1 i{margin-left: 10px;}
@media (hover: hover) {
  .btn_down1:where(:hover, :focus){  background-color: #fafafa; border-color: #222;  }
}
.i-txt{height: 27px; padding: 0 10px; border: 1px solid #536783;  display: inline-flex; justify-content: center; align-items: center; font-size: 16px; color: #536783;}

.i-txt2{min-width: 104px; height: 30px; padding: 0 10px; background-color: #24487e; display: inline-flex; justify-content: center; align-items: center; font-size: 14px; line-height: 1; color: #fff; box-sizing: border-box; border-radius: 500px; font-weight: 300;}

.btn_txt2 {display: inline-block; position: relative; line-height: 1; padding-right: 50px;}
.btn_txt2 > *{display: block;}
.btn_txt2 .t1{ color: #099de8; font-weight: 500;}
.btn_txt2 .t2{ margin-top: 6px; color: #333; font-weight: 500; }
.btn_txt2 .arr{position: absolute; right: 0; top: 0; width: 35px; height: 35px; border-radius: 35px; display: flex; justify-content: center; align-items: center; background-color: #e6f6fc; color: #135a85; }
.btn_txt2:where(:hover, :focus) .arr{background-color: #57a9da; color: #fff; }

.btn_txt3{font-size: 18px; color: #222; font-weight: 400; display: inline-flex; line-height: 1; align-items: center;} 
.btn_txt3 .t{ padding-top:2px; display:block; }
.btn_txt3 .circle{margin-left: 8px; width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #a9a9aa; border-radius: 50%; }
@media (hover: hover) {
  .btn_txt3:where(:hover, :focus){color: #222; opacity: 0.8;}
}


/*240229 top버튼 기존 스타일
.btn_top_fix{position: absolute; right: 30px; bottom: auto; top: -110px; width: 65px; height: 65px; border-radius: 8px; border: 1px solid #c9c9c9; line-height: 1; background-color: #fff; display: flex; align-items: center; justify-content: center;  box-sizing: border-box; z-index: 3; -webkit-box-shadow: 4px 5px 12px -1px rgba(0,0,0,0.15); box-shadow: 4px 5px 12px -1px rgba(0,0,0,0.15); opacity: 0; visibility: hidden;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.btn_top_fix.show{ visibility: visible; opacity: 1;}
.btn_top_fix.fixed{position: fixed; right: 30px; bottom: 60px; top: auto;}
.btn_top_fix .inr > *{display: block; text-align: center;}
.btn_top_fix .inr i{font-size: 1.2em;}
.btn_top_fix .inr .t{margin-top: 0px; font-size: 12px; font-size: 0.75em;}*/

/*240229 탑버튼 스타일 수정*/
.btn_top_fix{position: absolute; right: 54px; bottom: auto; top: -110px; width: 65px; height: 65px; border-radius: 2rem; line-height: 1; background-color: #514E53; display: flex; align-items: center; justify-content: center;  box-sizing: border-box; z-index: 3; -webkit-box-shadow: 4px 5px 12px -1px rgba(0,0,0,0.15); box-shadow: 4px 5px 12px -1px rgba(0,0,0,0.15); opacity: 0; visibility: hidden;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.btn_top_fix.show{ visibility: visible; opacity: 1;}
.btn_top_fix.fixed{position: fixed; right: 54px; bottom: 54px; top: auto;}
.btn_top_fix .inr{display: flex; flex-direction: column; align-items: center; } 
.btn_top_fix .inr .ico{width: 21px; height: 12px; background: url(../images/common/top_arr_point.png) no-repeat center; margin-bottom: 5px; background-size: cover; }
.btn_top_fix .inr .t{margin-top: 0px; font-size: 14px; font-size: 0.81em; color: #fff;}

/* 230407 홀딩스 바로가기 fixed 버튼 추가 (기존 스타일 주석)
.flt_banner {position: fixed; width: 116px; height: 268px; right: 45px; top: 50%; margin-top: -134px; z-index: 10;  background:url(../images/common/link_banner.jpg
) no-repeat; }*/
/*.flt_banner img {width: 100%;}
.flt_banner:where(:hover, :focus) {top: 65px;}
header.sub .flt_banner {width: 120px; top: 70px;}
header.sub .flt_banner:where(:hover, :focus) {top: 65px;} 230822 삭제 */
/*
.flt_banner ul {width: 100%; height: 100%;}
.flt_banner ul li {width: 100%; height: 50%;}
.flt_banner ul li > a {display: block; width: 100%; height: 134px; padding-top: 70px; color: #fff; font-size: 15px; text-align: center; line-height: 1.4; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; }
.flt_banner ul li:first-child > a {background: url(../images/common/link_banner_holdings.png) no-repeat center 17px;}
.flt_banner ul li:first-child span {position: absolute; display: inline-block; left: 16px; width: 84px; height: 1px; background-color: #fff;}
.flt_banner ul li:last-child > a {background: url(../images/common/link_banner_site.png) no-repeat center 22px;}
*/

/*241002 미디어센터 바로가기 스타일 추가*/
.btn_mc_fix{transition: all .3s; position: fixed; right: -40px; top: 19%; z-index: 10;}
.btn_mc_fix a.mc_banner_img{display: block; width: 14.8vw; height: 14.8vw; max-height: 137px; max-width: 136px; background:url(../images/common/mediacenter_icon.png
) no-repeat; background-size: cover;  }
.btn_mc_fix:hover{right: 0px; }

.btn_mc_fix a.mc_banner_img:focus {outline: 2px dotted #000; }
:focus {outline-offset: 2px;}

#header.sub .btn_mc_fix{top: 30.5%;}
#header.sub .btn_mc_fix a.mc_banner_img{width: 129px; height: 130px;}

.btn_mc_fix .mc_close_toggle{ border: none; position: absolute; top: -11px; right: 0px;  z-index: 11; width: 5vw; height: 5vw; max-width: 53px; max-height: 53px; background:url(../images/common/mediacenter_floating_close.png
) no-repeat; background-size: cover; }

/*240229 바로가기 스타일 수정*/
.flt_banner.close{height: 85px; background: none; border: 1px solid rgba(0,0,0,0); }
.flt_banner.close ul{height: 0; visibility: hidden;}

.flt_banner {position: fixed; width: 85px; right: 44px; bottom: 133px; z-index: 10;  background-color: rgba(255,255,255,.75); border: 1px solid #ddd; border-radius: 4rem; padding: 10px 7px; box-sizing: border-box;overflow: hidden; transition: all 0.5s ease;} 
.flt_banner ul {display: flex; flex-direction: column; gap: 12px; width: 100%; margin-top: 7px; transition: all 0.5s ease;overflow: hidden; margin-bottom: 75px; visibility: visible;}
.flt_banner ul li {width: 100%;}
.flt_banner ul li > a {display: flex; flex-direction: column; align-items: center; gap: 5px; text-align: center;  width: 100%; color: #333; font-size: 13px; line-height: 1.066em; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; }

/*240716 웹접근성 수정으로 인한 추가*/
.flt_banner .close_toggle:focus,.flt_banner ul li > a:focus{outline-style: dashed; outline-width: 3px; outline-offset: -3px;}
.flt_banner .close_toggle:focus, .btn_top_fix:focus{outline-color: #fff; outline-offset: -5px;}

.flt_banner ul li > a::before{ display: block; content: ''; width: 30px; height: 30px; background-position: center; background-size: cover; }
.flt_banner ul li.holdings > a::before {background-image: url(../images/common/link_banner_holdings.png);}
.flt_banner ul li.sitemap > a::before {background-image: url(../images/common/link_banner_site.png);}
.flt_banner ul li.job > a::before {background-image: url(../images/common/link_banner_job.png);}
.flt_banner ul li.vision > a::before {background-image: url(../images/common/link_banner_vision.png);}
.flt_banner ul li.esg > a::before {background-image: url(../images/common/link_banner_esg.png);}
.flt_banner ul li.culture > a::before {background-image: url(../images/common/link_banner_culture.png);}
.flt_banner ul li.login > a::before {background-image: url(../images/common/link_banner_login.png);}
.flt_banner ul li.product > a::before {background-image: url(../images/common/link_banner_product.png);}

.flt_banner .close_toggle{position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; justify-content: center; align-items: center; width: 65px; height: 65px; border-radius: 4rem; background-color: #514E53; border: none; cursor: pointer; }
.flt_banner .close_toggle span {color: #fff; font-size: 0.81em; letter-spacing: -0.036em}
.flt_banner .close_toggle::before{display: block; content: ''; background: url(../images/common/quick_close.png) no-repeat center; background-size: cover; transition: all 0.5s ease;}
/*
.flt_banner .close_toggle.open span:first-child{display: none;}
.flt_banner .close_toggle.close span:first-child{display: block;}
*/
.flt_banner .close_toggle.open::before{width: 18px; height: 18px;}
.flt_banner .close_toggle.close::before{width: 13px; height: 13px; transform: rotate(135deg); }


.lst_table1{ border-top: 1px solid #e5e5e5; padding:25px 0 35px; }
.lst_table1 .area_tr{display: flex;flex-wrap: wrap;align-items: stretch; margin-top:5px;}
.lst_table1 .area_th,
.lst_table1 .area_td{flex: none; line-height:2.1;}
.lst_table1 .area_th{width:120px; font-weight:500; }
.lst_table1 .area_td{width:calc(100% - 150px); margin-left:30px;}

.link_video{ }
.link_video:before{position: absolute; left: 50%; top: 50%; background:url(../images/common/ico_common.png) no-repeat; background-position: -192px -11px; width: 74px; height: 74px; margin-top: -37px; margin-left: -37px; content:""; z-index: 1;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  z-index: 2;
}
.thumb-pos.link_video:after{
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
  z-index: 1;
  opacity: 0.25;

}
.link_video:where(:hover, :focus):after{
  opacity: 0.1;
}
.link_video:where(:hover, :focus):before{
-webkit-transform: scale(1.3);
-moz-transform: scale(1.3);
-o-transform: scale(1.3);
-ms-transform: scale(1.3);
transform: scale(1.3);
/*230728 주석
	opacity: 0.5;*/
	outline: 2px dashed white;
	outline-offset: 5px;
}

.linl_motion1 > .link_thumb1 {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
.thumb-pos.link_thumb1:after{
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  z-index: 1;
  opacity: 0;
}
.linl_motion1:where(:hover, :focus) > .link_thumb1{ 
-webkit-transform: rotate(-0.001deg) scale(1.05);
-moz-transform: rotate(-0.001deg) scale(1.05);
-o-transform: rotate(-0.001deg) scale(1.05);
-ms-transform: rotate(-0.001deg) scale(1.05);
transform: rotate(-0.001deg) scale(1.05);
 }

.link_thumb1:where(:hover, :focus):after{
  opacity: 0.5;
}


.hv_motion{cursor: pointer;}
.hv_motion .link_thumb2 {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}
.thumb-pos.link_thumb2:before{
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  position: absolute; left: 0; top: 0; width: 100%; height: 100%;
  background: rgb(0,0,0);
background: -moz-linear-gradient(0deg, rgba(0,0,0,0.8477766106442577) 0%, rgba(0,0,0,0.20351890756302526) 23%, rgba(0,0,0,0.12228641456582634) 100%);
background: -webkit-linear-gradient(0deg, rgba(0,0,0,0.8477766106442577) 0%, rgba(0,0,0,0.20351890756302526) 23%, rgba(0,0,0,0.12228641456582634) 100%);
background: linear-gradient(0deg, rgba(0,0,0,0.8477766106442577) 0%, rgba(0,0,0,0.20351890756302526) 23%, rgba(0,0,0,0.12228641456582634) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
z-index: 0; content: ""; opacity: 1;
}
.thumb-pos.link_thumb2:after{
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  position: absolute; left: 0; top: 0; width: 100%; height: 100%;
background: rgb(0,184,255);
background: -moz-linear-gradient(0deg, rgba(0,184,255,0.9150035014005602) 0%, rgba(0,184,255,0.6993172268907564) 27%, rgba(0,184,255,0.04665616246498594) 67%, rgba(0,184,255,0) 100%);
background: -webkit-linear-gradient(0deg, rgba(0,184,255,0.9150035014005602) 0%, rgba(0,184,255,0.6993172268907564) 27%, rgba(0,184,255,0.04665616246498594) 67%, rgba(0,184,255,0) 100%);
background: linear-gradient(0deg, rgba(0,184,255,0.9150035014005602) 0%, rgba(0,184,255,0.6993172268907564) 27%, rgba(0,184,255,0.04665616246498594) 67%, rgba(0,184,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#099de8",endColorstr="#099de8",GradientType=1);
z-index: 0; content: ""; opacity: 0;
}
.hv_motion:where(:hover, :focus) .link_thumb2{ 
-webkit-transform: rotate(-0.001deg) scale(1.05);
-moz-transform: rotate(-0.001deg) scale(1.05);
-o-transform: rotate(-0.001deg) scale(1.05);
-ms-transform: rotate(-0.001deg) scale(1.05);
transform: rotate(-0.001deg) scale(1.05);
 }

.hv_motion:where(:hover, :focus) .thumb-pos.link_thumb2:before{
  opacity: 0;
}
.hv_motion:where(:hover, :focus) .thumb-pos.link_thumb2:after{
  opacity: 1;
}


/* button end */



/* ico start */
.ico_{display: inline-block; position: relative; background-repeat: no-repeat; background-position: 0 0; background-image: url(../images/common/ico_common.png);} 
.ico_.link1{background-position: -17px -14px; min-width: 12px; height: 12px;}
.active > a > .ico_.link1{background-position: -17px -34px;}
@media (hover: hover) {
  a:where(:hover, :focus) > .ico_.link1{background-position: -17px -34px;}
}

.ico_.link2{background-position: -33px -58px; min-width: 10px; height: 10px;}
.ico_.link3{background-position: -18px -75px; min-width: 10px; height: 10px;}
.active .ico_.link2{background-position: -33px -75px;}
.active .ico_.link3{background-position: -33px -75px;}
@media (hover: hover) {
    a:where(:hover, :focus) .ico_.link2{background-position: -33px -75px;}
    a:where(:hover, :focus) .ico_.link3{background-position: -33px -75px;}
    }

.ico_.blank2{background-position: -61px -14px; min-width: 18px; height: 18px;}
.active .ico_.blank2{background-position: -61px -37px;}
@media (hover: hover) {
  a:where(:hover, :focus) .ico_.blank2{background-position: -61px -37px;}
}
.ico_.blank3{background-position: -90px -16px; min-width: 17px; height: 17px;}


.ico_.mark1{background-position: -13px -186px; min-width: 21px; height: 29px;}
.ico_.arr_rgh1{background-position: -55px -195px; min-width: 30px; height: 12px;}
.ico_.alert1{background-position: -117px -45px; min-width: 24px; height: 24px;}
.ico_.alert2{background-position: -145px -43px; min-width: 33px; height: 35px;}
.ico_.download1{background-position: -121px -16px; min-width: 14px; height: 16px;}
.ico_.download2{background-position: -146px -15px; min-width: 17px; height: 17px;}

.ico_.youtube{background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35.95 25.17'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M36,7.89A7.89,7.89,0,0,0,28.06,0H7.89A7.89,7.89,0,0,0,0,7.89v9.39a7.89,7.89,0,0,0,7.89,7.89H28.06A7.89,7.89,0,0,0,36,17.28Zm-11.86,5.4-9,4.47c-.35.19-1.56-.06-1.56-.47V8.11c0-.41,1.22-.67,1.57-.47l8.66,4.72C24.07,12.56,24.46,13.09,24.09,13.29Z'/%3E%3C/svg%3E"); width: 18px; height: 14px;}
.ico_.linkedin{background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36.89 33.54'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Cg id='LinkedIn'%3E%3Crect class='cls-1' x='0.93' y='10.75' width='7.19' height='22.78'/%3E%3Cpath class='cls-1' d='M27.77,10.54c-4.12,0-6.7,2.23-7.18,3.79V10.75H12.51c.1,1.9,0,22.79,0,22.79h8.08V21.21a5.36,5.36,0,0,1,.17-1.86,4.13,4.13,0,0,1,3.9-2.8c2.8,0,4.08,2.11,4.08,5.2V33.54h8.15V20.87C36.89,13.81,32.88,10.54,27.77,10.54Z'/%3E%3Cpath class='cls-1' d='M4.39,0C1.74,0,0,1.71,0,4A4,4,0,0,0,4.29,7.9h0C7,7.9,8.73,6.16,8.73,4A4,4,0,0,0,4.39,0Z'/%3E%3C/g%3E%3C/svg%3E"); width: 16px; height: 14px;}
.ico_.facebook{background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18.95 35.38'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M17.71,19.9l1-6.4H12.55V9.34c0-1.75.86-3.46,3.61-3.46H19V.43A34.18,34.18,0,0,0,14,0C8.93,0,5.62,3.07,5.62,8.62V13.5H0v6.4H5.62V35.38h6.93V19.9Z'/%3E%3C/svg%3E"); width: 9px; height: 17px;}
.ico_.insta{background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 35.38 35.38'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M27.06,6.32a2.08,2.08,0,1,0,2.07,2.07A2.08,2.08,0,0,0,27.06,6.32Z'/%3E%3Cpath class='cls-1' d='M17.84,9a8.71,8.71,0,1,0,8.71,8.71A8.73,8.73,0,0,0,17.84,9Zm0,14.29a5.58,5.58,0,1,1,5.58-5.58A5.59,5.59,0,0,1,17.84,23.27Z'/%3E%3Cpath class='cls-1' d='M24.75,35.38H10.63A10.64,10.64,0,0,1,0,24.75V10.63A10.64,10.64,0,0,1,10.63,0H24.75A10.64,10.64,0,0,1,35.38,10.63V24.75A10.64,10.64,0,0,1,24.75,35.38ZM10.63,3.33a7.3,7.3,0,0,0-7.3,7.3V24.75a7.3,7.3,0,0,0,7.3,7.3H24.75a7.3,7.3,0,0,0,7.3-7.3V10.63a7.3,7.3,0,0,0-7.3-7.3Z'/%3E%3C/svg%3E"); width: 18px; height: 18px;}

.ico-gray{background-color: #f0f0f0; padding: 5px 15px; border-radius: 500px; line-height: 1; color: #222; display: inline-flex; align-items: center;}
.ico-gray i{margin-right: 10px;}

.txt-flex {display: flex; color: #8e8e8e;}
.txt-flex > *{flex: none;}
.txt-flex .ico{ margin-right: 15px; }
.txt-flex .txt{display: block; margin-top: 3px; color: #222; font-weight: 400;}

.p-dot1{position: relative; padding-left: 10px;}
.p-dot1 .dot{position: absolute; left: 0; top: 0;}
.p-dot1.fz_18{padding-left: 15px;}
.p-num1{position: relative; padding-left: 20px;}
.p-num1 .num{position: absolute; left: 0; top: 0;}
.p-num1.fz_18{padding-left: 25px;}

.group_cen_line{display: flex; flex-wrap: wrap;}
.group_cen_line > .line{position: relative; }
.group_cen_line > .line + .line { padding-left: 50px; margin-left: 50px; }
.group_cen_line > .line + .line:after{position: absolute;left: 0;top: calc(50% - 25px);width: 2px;height: 50px;background-color: #eee;content: "";}

.wrap_pr_type1{display: flex; justify-content: space-between; flex-wrap: wrap; text-align: left;}
.wrap_pr_type1 > .area_head,
.wrap_pr_type1 > .area_cont{ flex:none; width: 100%; word-break: keep-all; }
.wrap_pr_type1 > .area_cont .title2 {font-size: 1em;}
.wrap_pr_type1 > .area_cont .p-dot1 {font-size: 1em;}
.wrap_pr_type1 > .area_head{width: 240px;}
.wrap_pr_type1 > .area_cont{ width: calc(100% - 270px); padding-top: 35px;  border-top: 2px solid #666666;}


/* ico end */


/* bg start */
.bg_type2{background-color: #f8f8f8; padding: 75px 0;}

/* bg end */


/* input start */
.wrap_inptxt_type1{width: 100%;display: inline-flex;justify-content: space-between;}
.wrap_inptxt_type1 .inp,
.wrap_inptxt_type1 .btn{height: 54px;}
.wrap_inptxt_type1 .inp{border: 1px solid #d5d5d5;border-radius: 7px;width: calc(100% - 170px);display: inline-flex;align-items: center;overflow: hidden;}
.wrap_inptxt_type1 .inp input{
    width: 100%;
    box-sizing: border-box;
    padding: 5px 20px;
    line-height: 1;
    border: 0;
    height: 100%;
    font-size: 1em;
}
.wrap_inptxt_type1 .inp input:focus{border: 0; outline: 0;}
.wrap_inptxt_type1 .inp input::placeholder {color: #cbcbcb; font-weight: 400;   font-size: 1em;}
.wrap_inptxt_type1 button{width: 160px;font-size: 1em;line-height: 1;padding-top: 3px;}

.box-gray{background-color: #f7f7f7;}
.box-gray > .inner{ padding: 45px 35px; }
.box-blue{background-color: #eceff6;}
.box-blue > .inner{ padding: 45px 45px; }
.box-gray.ph_l > .inner,
.box-blue.ph_l > .inner{padding-left: 55px; padding-right: 55px;}
.box-gray.bdrs,
.box-blue.bdrs{border-radius: 10px; border: 1px solid #e1e1e1;}

/* input end */

/* table start */
table caption { font-size: 0; height: 0; line-height: 0; width: 0; overflow: hidden; }
.table_type1 table { border-top: 2px solid #333; width: 100%; margin-top: 30px; }
.table_type1  table th { border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; padding: 20px 30px; color: #333; font-weight: 700; background: #f5f5f5; vertical-align: middle; text-align: center; line-height: 22px; }
.table_type1  table tbody th { background: none; }
.table_type1  table tbody th.bg { background: rgba(0, 88, 145, 0.08); }
.table_type1  table tbody th.left { text-align: left; }
.table_type1  table td { border-bottom: 1px solid #e5e5e5; border-right: 1px solid #e5e5e5; padding: 20px 15px; vertical-align: middle; text-align: center; line-height: 24px; }
.table_type1  table td .stroke { display: inline-block; line-height: 43px; border: 1px solid #005891; color: #005891; font-weight: 700; padding: 0 30px; float: right; }
.table_type1  table td.bg { background: rgba(0, 88, 145, 0.08); }
.table_type1  table td.title { text-align: left; font-weight: 700; color: #333; }
.table_type1  table td.left { text-align: left; padding: 20px 30px; }
.table_type1  table th:last-child, .table_type1  table td:last-child { border-right: none; }
.table_type1  table th.boR, .table_type1  table td.boR { border-right: 1px solid #e5e5e5; }
.table_type1  table td.bdright { border-right: 1px solid #e5e5e5; }
.table_type1  table tfoot td { background: rgba(0, 88, 145, 0.08); }

/* table end */

/* list start */
.dotdot{
 overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-wrap: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical; 
}

/*
2:1 : padding-top: 50%
1:2 : padding-top: 200%
4:3 : padding-top: 75%
16:9 : padding-top: 56.25%
*/

.thumb-pos-ori{position: absolute; left: 0; top: 0;  width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%;
  -webkit-transform: rotate(-0.001deg);
  -moz-transform: rotate(-0.001deg);
  -o-transform: rotate(-0.001deg);
  -ms-transform: rotate(-0.001deg);
  transform: rotate(-0.001deg);
}

.thumb-pos{position: absolute; left: 0; top: 0;  width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: 50% 50%;
  -webkit-transform: rotate(-0.001deg) scale(1);
  -moz-transform: rotate(-0.001deg) scale(1);
  -o-transform: rotate(-0.001deg) scale(1);
  -ms-transform: rotate(-0.001deg) scale(1);
  transform: rotate(-0.001deg) scale(1);
  -webkit-transform-origin: 50% 100%;
  -moz-transform-origin: 50% 100%;
  -o-transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  outline-offset: -2px;
}

.thumb-pos.v2-1{padding-top: 50%}
.thumb-pos.v1-2{padding-top: 200%}
.thumb-pos.v4-3{padding-top: 75%}
.thumb-pos.v16-9{padding-top: 56.25%}

.thumb-pos:after{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 1); opacity: 0; content: "";}
.thumb-pos ,
.thumb-pos:after{
  -webkit-transition: all 1s cubic-bezier(0.630, 0.005, 0.360, 0.990);
  -moz-transition: all 1s cubic-bezier(0.630, 0.005, 0.360, 0.990);
  -o-transition: all 1s cubic-bezier(0.630, 0.005, 0.360, 0.990);
  transition: all 1s cubic-bezier(0.630, 0.005, 0.360, 0.990);
}
.hov-img:where(:hover, :focus) .thumb-pos{
  -webkit-transform: rotate(-0.001deg) scale(1.05);
  -moz-transform: rotate(-0.001deg) scale(1.05);
  -o-transform: rotate(-0.001deg) scale(1.05);
  -ms-transform: rotate(-0.001deg) scale(1.05);
  transform: rotate(-0.001deg) scale(1.05);
}
.hov-img:where(:hover, :focus) .thumb-pos:after{opacity: 0.4;}

/* 견학안내 리스트 페이지 (.lst-thumb-type1) */
.lst-thumb-type1{}
.lst-thumb-type1 > .item{border-top: 3px solid #000; padding: 60px 0; display: flex; }
.lst-thumb-type1 > .item .lft { width: 320px; flex: none; display:flex;flex-direction: column;justify-content: space-between; padding-right: 30px; }
.lst-thumb-type1 > .item .rgh { width: 100%; }
.lst-thumb-type1 .thumb{ margin-left: auto; max-width: 840px; height: 380px; position: relative; overflow: hidden; border-radius: 20px;  background-color: #e1e1e1; }

.lst-thumb-type1 .item .t1{font-size: 20px; font-size: 1.1em; line-height: 35px; line-height: 1.75; color: #666; margin-top: 25px;}
.lst-thumb-type1 .item .t2{font-size: 55px; font-size: 3em; line-height: 42px; line-height: 1.3095; color: #222; font-weight: 600;}
.lst-thumb-type1 .item .t3{color: #333; font-weight: 600;}


.lst-thumb{display: flex; flex-wrap: wrap;}
.lst-thumb > *{flex:none;}
/*1460 470 3*/

.lst-thumb.col2 > *{width:48.5%; margin-left:3%;  margin-top:40px; box-sizing: border-box;}
.lst-thumb.col2 > *:nth-child(2n+1){margin-left:0;}
.lst-thumb.col2 > *:nth-child(-n+2){margin-top:0;}

.lst-thumb.col3 > *{ width:32.19178082191781%; margin-left:1.7123287671232876%; margin-top:100px;}
.lst-thumb.col3.ma-2 > *{width: 450px; margin-left: 55px; width: 30.8219%; margin-left: 3.7671%; margin-top:50px;}
.lst-thumb.col3 > *:nth-child(3n+1){margin-left:0;}
.lst-thumb.col3 > *:nth-child(-n+3){margin-top:0;}

.lst-thumb.col4 > *{width: 327px; width: 22.3973%; margin-left:3.4703%; margin-top:50px;}
.lst-thumb.col4 > *:nth-child(4n+1){margin-left:0;}
.lst-thumb.col4 > *:nth-child(-n+4){margin-top:0;}
/*option*/
.lst-thumb.col4 > .box_item_type1:nth-last-child(-n+4) { border-bottom: 0; }


.lst-thumb .item .thumb{position: relative; width: 100%; height: 306px; overflow:hidden;  border-radius:20px;}
.lst-thumb .item .cont{margin-top: 33px;}
.lst-thumb .item .cont .h1{ color:#222; font-size:25px; font-size:1.5625em; line-height:35px; line-height:1.4; }
.lst-thumb .item .cont .t1{ color:#666;margin-top: 11px;}

.box_item_type1{padding-bottom: 50px; border-bottom: 1px solid #ddd;}
.box_item_type1 .thumb{position: relative; width: 100%; height: 450px; overflow:hidden; border: 1px solid #e0e0e0;}
.box_item_type1 .cont{margin-top: 30px;}
.box_item_type1 .cont .year{margin-bottom: 5px;}
.box_item_type1 .cont .h1{ max-height: 56px; color:#162941; font-size:20px; font-size: 1.25em; line-height:1.4; font-weight: 500; word-break: keep-all; -webkit-line-clamp: 2;}
.box_item_type1 .cont .t1{ 
  font-size: 14px; font-size: 0.875em; line-height: 25px; line-height: 1.7857;  color:#50667d; margin-top: 22px; max-width: 90%; word-break: keep-all;
}

.box_item_type2{border-bottom: 1px solid #ddd; position: relative;}
.box_item_type2 .thumb{position: relative; width: 100%; height: 445px; overflow:hidden; z-index: 1;}
.box_item_type2 .cont{position: absolute;left: 0;bottom: 0;width: 100%;z-index: 2;padding: 35px 40px;box-sizing: border-box;}
.box_item_type2 .cont .data{margin-bottom: 5px;}
.box_item_type2 .cont .h1{max-height: 67px; color:#162941; font-size:25px;line-height: 34px;font-size: 1.5625em; line-height:1.36;font-weight: 500;word-break: keep-all;-webkit-line-clamp: 2;color: #fff;width: 100%;box-sizing: border-box;}
.box_item_type2 .cont .data{ margin-top: 29px; line-height: 1; color: #fff;}

/* 문화행사 리스트 스타일 (.box_item_type3) */
.box_item_type3{background-color: #fff; position: relative; border: 1px solid #fff; display: flex; flex-wrap: wrap; }
.box_item_type3 .thumb{flex: none; position: relative; width: 200px; height: 282px; overflow:hidden; z-index: 1;} /* 230508 width: 247px; height: 348px; 에서 수정*/
.box_item_type3 .cont{flex: none; width: calc(100% - 200px); z-index: 2; padding: 30px 120px 30px 60px; box-sizing: border-box;} /* 230508 width: calc(100% - 247px);에서 수정 */
.box_item_type3 .cont > .inner{display: flex;flex-direction: column; /*justify-content: space-between;*/ height: 100%;} /*230508 justify-content 삭제*/
.box_item_type3 .cont > .inner .top .circle{ width:70px; height:70px; position:absolute; right:20px; top:20px; background:#e8e8e8;line-height: 1.2;border-radius: 50%;display: flex;align-items: center;justify-content: center;color: #222;}
.box_item_type3 .cont > .inner .top .circle.on{background:#1a285d; color:#fff;}
.box_item_type3 .cont > .inner .cate{color:#162941; opacity:0.56; margin-bottom:15px; line-height:1;}
.box_item_type3 .cont > .inner .h1{color:#162941; font-size:25px; font-size:1.5625em; font-weight:600; -webkit-line-clamp:4; max-height: none; }
/*.box_item_type3 .cont > .inner .t1,
.box_item_type3 .cont > .inner .data{ color:#50667d; font-size:15px; font-size:0.9375em;} 230508 삭제*/
.box_item_type3 .cont > .inner .t1{margin-top:5px;}
.box_item_type3 .cont > .inner .bot{margin-top: 30px;}
/*.box_item_type3 .cont .data{margin-bottom: 5px;} 230508 삭제*/
.box_item_type3 .cont > .inner .bot dl {margin-bottom: 10px;} /*230508 추가*/
.box_item_type3 .cont > .inner .bot dl dt {font-weight: bold; font-size: 16px; } /*230508 추가*/
.box_item_type3 .cont > .inner .bot dl dd {font-size: 15px; } /*230508 추가*/
.box_item_type3 .cont .h1{max-height: 67px; color:#162941; font-size:25px;line-height: 34px;font-size: 1.5625em; line-height:1.36;font-weight: 500;word-break: normal;-webkit-line-clamp: 2;color: #fff;width: 100%;box-sizing: border-box;} /*240507 word-break: keep-all; 삭제 */
/*.box_item_type3 .cont .data{ margin-top: 29px; line-height: 1; color: #fff;} 230508 삭제*/
.box_item_type3:where(:hover, :focus){border-color: #1a285d;}



.txt_label1{font-size: 20px; font-size: 1.25em; color: #8e8e8e; font-weight: 400;}


.t_req{color: #0066cc!important;}
.inp_txt{ height: 45px; width: 100%; border: 1px solid #9e9e9e; padding: 0 22px; box-sizing: border-box; color: #222;  }
.inp_txt::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #737373;
}
.inp_txt::-moz-placeholder {
  /* Firefox 19+ */
  color: #737373;
}
.inp_txt:-ms-input-placeholder {
  /* IE 10+ */
  color: #737373;
}
.inp_txt:-moz-placeholder {
  /* Firefox 18- */
  color: #737373;
}
.inp_txt.readonly1{outline: 0; border: 0; padding-left: 0;  background-color: transparent; cursor: auto;}
.inp_txt.readonly1:where(:hover, :focus),
.inp_txt.readonly1:focus{outline:0; border: 0; background-color: transparent;}

.inp_txt + .wrap_search2 { margin-left: 5px; }


input[type="file"] { padding: 0; margin: 0px; background: #fff; border: 1px solid #9e9e9e; width: 50%; min-width: 300px; height: 45px; position: relative; line-height: 45px; padding-left: 20px; box-sizing: border-box;  }

input[type="file"]::-webkit-file-upload-button { appearance: none; -webkit-appearance: none; -moz-appearance: none; box-sizing: border-box; color: #fff; border: 0; background: #6c6c6c; line-height: 45px; position: absolute; right: 0; top: 0; margin: 0px; width: 100px; cursor: pointer; }

input[type="file"]::-ms-value { border: 0; height: 45px; }

input[type="file"]::-ms-browse { color: #fff; border: 0; background: #343f4e; width: 100px; }

a.btn_image_add { margin-left: 20px; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; overflow: hidden; font-size:22px; vertical-align: middle; color:#666; border: 1px solid #666; border-radius: 50%; }
a.btn_remove { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; margin-left: 4px; overflow: hidden; font-size:22px; vertical-align: middle;; color:#666; border: 1px solid #666; border-radius: 50%; }
a.btn_image_add:where(:hover, :focus),
a.btn_remove:where(:hover, :focus){border-color: #222; color: #222;}

body.darkMode a.btn_image_add {}
body.darkMode a.btn_remove {}


.textarea1{border: 1px solid #9e9e9e; line-height: 0;}
.textarea1 textarea{width: 100%; height: 220px; padding:15px 22px; box-sizing: border-box; border: 0; margin: 0; line-height: 1.3;}


.area_select1{display: flex; /*position: relative;*/}
.area_select1 .w2{min-width: 280px;}



.area_select1:after{
/*     use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

/*     Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    right: 75px;
    top: 50%;
    content: "\e90a";
    margin-top: -11px;
    font-size: 25px;
    color: #222;
}

/*
.area_select1  > select {
    min-width: 175px;
    height: 45px;
    padding: 0 0 0 20px;
    border: 1px solid #9e9e9e;
    font-size: 16px;
    font-size: 1em;
    line-height: 1;
    color: #222;
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    -o-appearance:none;
    background:none\9;
    background-color: transparent;
    font-weight: 300;
    cursor: pointer;
  }

.area_select1 > select::-ms-expand {display:none;}
.area_select1:where(:hover, :focus) > select,
.area_select1 > select:focus {border:1px solid #000;}
*/

.area_select1 button { width: 60px; height: 45px; font-size: 0.88em;}
.area_select1 label {margin-right: 10px; line-height: 45px; min-width: 70px;}

.area_select1 .select_box {display: flex; align-items: center;}
.area_select1 .select_box select {width:120px; height: 45px; font-size: 1em; padding:5px;}



.w_chk{display: inline-flex; align-items: center; position: relative;}
.w_chk:focus{border:1px solid #000;}
.w_chk > label{margin-left:9px; font-size:15px; color:#838c97; cursor: pointer;}


/* iCheck plugin Square skin, black
----------------------------------- */
.icheckbox_square,
.iradio_square{
  display: inline-block;
  margin: 0;
  padding: 0;
  cursor: pointer;
  vertical-align: middle;
  border: none;
  background: url(../images/common/ico_ick.png) no-repeat;
  *display: inline;
}

.icheckbox_square {
 background-size: 100% auto;
 background-image: url('data:image/svg+xml,%3Csvg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 140.69 140.69"%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D.cls-2%7Bfill:%23cacaca;%7D%3C/style%3E%3C/defs%3E%3Cg id="_1_copy" data-name=" 1 copy"%3E%3Crect class="cls-1" x="2.97" y="2.97" width="134.76" height="134.76"/%3E%3Cpath class="cls-2" d="M137.72,140.69H3a3,3,0,0,1-3-3V3A3,3,0,0,1,3,0H137.72a3,3,0,0,1,3,3V137.72A3,3,0,0,1,137.72,140.69ZM5.93,134.76H134.76V5.93H5.93Z"/%3E%3C/g%3E%3C/svg%3E');
  width: 25px;
  height: 25px;
}
.icheckbox_square.hover {
  background-size: 100% auto;
  background-image: url('data:image/svg+xml,%3Csvg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 140.69 140.69"%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D.cls-2%7Bfill:%23cacaca;%7D%3C/style%3E%3C/defs%3E%3Cg id="_1_copy" data-name=" 1 copy"%3E%3Crect class="cls-1" x="2.97" y="2.97" width="134.76" height="134.76"/%3E%3Cpath class="cls-2" d="M137.72,140.69H3a3,3,0,0,1-3-3V3A3,3,0,0,1,3,0H137.72a3,3,0,0,1,3,3V137.72A3,3,0,0,1,137.72,140.69ZM5.93,134.76H134.76V5.93H5.93Z"/%3E%3C/g%3E%3C/svg%3E');
}
.icheckbox_square.checked {
  background-size: 100% auto;
  background-image: url('data:image/svg+xml,%3Csvg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 134.76 134.76"%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23099de8;%7D.cls-2%7Bfill:%23fff;fill-rule:evenodd;%7D%3C/style%3E%3C/defs%3E%3Crect class="cls-1" width="134.76" height="134.76"/%3E%3Cpolygon class="cls-2" points="39.19 56.86 29.23 66.66 57.13 95.01 109.2 43.24 99.35 33.33 57.28 75.16 39.19 56.86"/%3E%3C/svg%3E');
}
.icheckbox_square.disabled {
  background-size: 100% auto;
  background-image: url('data:image/svg+xml,%3Csvg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 140.69 140.69"%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D.cls-2%7Bfill:%23cacaca;%7D%3C/style%3E%3C/defs%3E%3Cg id="_1_copy" data-name=" 1 copy"%3E%3Crect class="cls-1" x="2.97" y="2.97" width="134.76" height="134.76"/%3E%3Cpath class="cls-2" d="M137.72,140.69H3a3,3,0,0,1-3-3V3A3,3,0,0,1,3,0H137.72a3,3,0,0,1,3,3V137.72A3,3,0,0,1,137.72,140.69ZM5.93,134.76H134.76V5.93H5.93Z"/%3E%3C/g%3E%3C/svg%3E');
  cursor: default;
}
.icheckbox_square.checked.disabled {
  background-size: 100% auto;
  background-image: url('data:image/svg+xml,%3Csvg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 140.69 140.69"%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D.cls-2%7Bfill:%23cacaca;%7D%3C/style%3E%3C/defs%3E%3Cg id="_1_copy" data-name=" 1 copy"%3E%3Crect class="cls-1" x="2.97" y="2.97" width="134.76" height="134.76"/%3E%3Cpath class="cls-2" d="M137.72,140.69H3a3,3,0,0,1-3-3V3A3,3,0,0,1,3,0H137.72a3,3,0,0,1,3,3V137.72A3,3,0,0,1,137.72,140.69ZM5.93,134.76H134.76V5.93H5.93Z"/%3E%3C/g%3E%3C/svg%3E');
  cursor: default;
}



.iradio_square {
  /*background-position:  -10px -10px;*/
  width: 25px;
  height: 25px;
  background-size: 100% auto;
 background-image: url('data:image/svg+xml,%3Csvg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 154.18 154.18"%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D.cls-2%7Bfill:%23cacaca;%7D%3C/style%3E%3C/defs%3E%3Cg id="_2" data-name=" 2"%3E%3Ccircle class="cls-1" cx="77.09" cy="77.09" r="74.13"/%3E%3Cpath class="cls-2" d="M77.09,154.18a77.09,77.09,0,1,1,77.09-77.09A77.17,77.17,0,0,1,77.09,154.18Zm0-148.25a71.16,71.16,0,1,0,71.16,71.16A71.24,71.24,0,0,0,77.09,5.93Z"/%3E%3C/g%3E%3C/svg%3E');
}
.iradio_square.hover {
  /*background-position: -10px -10px;*/
  background-size: 100% auto;
 background-image: url('data:image/svg+xml,%3Csvg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 154.18 154.18"%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D.cls-2%7Bfill:%23cacaca;%7D%3C/style%3E%3C/defs%3E%3Cg id="_2" data-name=" 2"%3E%3Ccircle class="cls-1" cx="77.09" cy="77.09" r="74.13"/%3E%3Cpath class="cls-2" d="M77.09,154.18a77.09,77.09,0,1,1,77.09-77.09A77.17,77.17,0,0,1,77.09,154.18Zm0-148.25a71.16,71.16,0,1,0,71.16,71.16A71.24,71.24,0,0,0,77.09,5.93Z"/%3E%3C/g%3E%3C/svg%3E');
}
.iradio_square.checked {
  /*background-position: -70px -10px;*/
  background-size: 100% auto;
  background-image: url('data:image/svg+xml,%3Csvg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 183.83 183.83"%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bopacity:0;%7D.cls-2%7Bfill:%23099de8;%7D%3C/style%3E%3C/defs%3E%3Cg class="cls-1"%3E%3Ccircle cx="91.92" cy="91.92" r="74.13"/%3E%3C/g%3E%3Cpath class="cls-2" d="M91.92,183.83a91.92,91.92,0,1,1,91.91-91.91A92,92,0,0,1,91.92,183.83Zm0-148.25a56.34,56.34,0,1,0,56.33,56.34A56.4,56.4,0,0,0,91.92,35.58Z"/%3E%3C/svg%3E');
}
.iradio_square.disabled {
  /*background-position: -100px -10px;*/
  cursor: default;
  background-size: 100% auto;
  background-image: url('data:image/svg+xml,%3Csvg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 154.18 154.18"%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D.cls-2%7Bfill:%23cacaca;%7D%3C/style%3E%3C/defs%3E%3Cg id="_2" data-name=" 2"%3E%3Ccircle class="cls-1" cx="77.09" cy="77.09" r="74.13"/%3E%3Cpath class="cls-2" d="M77.09,154.18a77.09,77.09,0,1,1,77.09-77.09A77.17,77.17,0,0,1,77.09,154.18Zm0-148.25a71.16,71.16,0,1,0,71.16,71.16A71.24,71.24,0,0,0,77.09,5.93Z"/%3E%3C/g%3E%3C/svg%3E');

}
.iradio_square.checked.disabled {
  /*background-position: -130px -10px;*/
  cursor: default;
  background-size: 100% auto;
  background-image: url('data:image/svg+xml,%3Csvg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 154.18 154.18"%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23fff;%7D.cls-2%7Bfill:%23cacaca;%7D%3C/style%3E%3C/defs%3E%3Cg id="_2" data-name=" 2"%3E%3Ccircle class="cls-1" cx="77.09" cy="77.09" r="74.13"/%3E%3Cpath class="cls-2" d="M77.09,154.18a77.09,77.09,0,1,1,77.09-77.09A77.17,77.17,0,0,1,77.09,154.18Zm0-148.25a71.16,71.16,0,1,0,71.16,71.16A71.24,71.24,0,0,0,77.09,5.93Z"/%3E%3C/g%3E%3C/svg%3E');
}

.iradio_square.checked:focus {border: 1px solid #000;}


::placeholder {color: #777;}


.box_item_type1{}  



/*list end*/



/* spot sub start */
.spot_sub{height: 510px; position: relative; display: flex; align-items: center; }
.spot_sub > .bg{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; z-index: 0;}
.spot_sub > .inner{ width: 92%; max-width: 1460px; margin-left: auto; margin-right: auto; position: relative; z-index: 1;  }
.spot_sub .h1{color: #ffffff;font-size: 60px;font-weight: 600;text-align: left;line-height: 1;margin-top: 110px;}


/**  모달 스타일 start  **/
.btn-close-popup{ width: 56px; height: 56px; position: fixed; left: 50%; top: 20vh;  border: 1px solid #acacac; border-radius: 50%; overflow: hidden; display: flex; align-items: center; justify-content: center; background: #fff;color: #333;font-size: 20px;z-index: 10;margin-left: 540px; opacity: 0;
  -webkit-transition: all 0.5s ease-in;
  -moz-transition: all 0.5s ease-in;
  -o-transition: all 0.5s ease-in;
  transition: all 0.5s ease-in;
  transition-delay: 0.3s;
  cursor: pointer;

}
.pop-Open .btn-close-popup{opacity: 1;}

.popup-type2{position: fixed; left: 0; top: 0; width: 100%; height: 100vh; z-index: 10;}
.popup-type2 .cover{ position: fixed; left: 0; top: 0; width: 100%; height: 100vh; background-color: rgba(245,245,247,.6); -webkit-backdrop-filter:blur(24px); backdrop-filter:blur(24px); z-index: 1; }

.popup-type2 .content-wrapper{ margin: 0 auto; max-width: 1260px; z-index: 5; position: relative; padding-bottom: 15vh;}
.popup-type2 .modal-content{background-color: #fff; overflow: hidden; width: 100%; margin-top: 17vh; min-height: 85vh; border-radius: 18px; box-shadow:0px 0px 16px 0px rgb(0, 0, 0, 0.1); opacity: 0; }
.popup-type2 .modal-inner{ max-width: 920px; margin: 120px auto; padding: 0 30px; }

.popup-type2 .cover{
  opacity: 0;
  -webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-o-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
-webkit-transition: all 0.6s ease-in;
-moz-transition: all 0.6s ease-in;
-o-transition: all 0.6s ease-in;
transition: all 0.6s ease-in;
}


.pop-Open.popup-type2{display: block;}

.pop-Open.popup-type2 .cover{
  opacity: 1;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-o-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
  opacity: 1;
}

.popup-type2 .modal-content{
  opacity: 0;
-webkit-transform: scale(0.9) translate(0px, 100vh);
-moz-transform: scale(0.9) translate(0px, 100vh);
-o-transform: scale(0.9) translate(0px, 100vh);
-ms-transform: scale(0.9) translate(0px, 100vh);
transform: scale(0.9) translate(0px, 100vh);
transition: all 500ms cubic-bezier(0.760, -0.005, 0.395, 0.990); /* custom */

transition-timing-function: cubic-bezier(0.760, -0.005, 0.395, 0.990); /* custom */
}

.pop-Open.popup-type2 .modal-content{
  
    opacity: 1;
        -webkit-transform: scale(1) translate(0px, 0);
        -moz-transform: scale(1) translate(0px, 0);
        -o-transform: scale(1) translate(0px, 0);
        -ms-transform: scale(1) translate(0px, 0);
        transform: scale(1) translate(0px, 0);

  /*-webkit-animation: popContMotion 0.6s cubic-bezier(0.455, 0.030, 0.515, 0.955) 0 both;
  animation: popContMotion 0.6s cubic-bezier(0.455, 0.030, 0.515, 0.955) 0 both;*/
}

/*@-webkit-keyframes popContMotion {

}

@-moz-keyframes popContMotion {

}*/

@keyframes popContMotion {
    0% {
        
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1) translate(0px, 0);
        -moz-transform: scale(1) translate(0px, 0);
        -o-transform: scale(1) translate(0px, 0);
        -ms-transform: scale(1) translate(0px, 0);
        transform: scale(1) translate(0px, 0);

    }
}

.modal_section{position: fixed; left: 0; bottom: 0; width: 100%;  background-color: #000; z-index: 120; height: 100vh; overflow: hidden;
  /*-webkit-transition: all 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000);
  -moz-transition: all 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000);
  -o-transition: all 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000);
  transition: all 0.5s cubic-bezier(0.815, 0.000, 0.295, 1.000);*/
}

body.modalVideoOpen #wrap{ margin-top:-50vh;}
body.modalVideoOpen .modal_section{height: 100vh;}
.modal_section .inner{position:relative;}
.modal_section .inner .title{position:absolute; left:50%; top: 1%;transform: translateX(-50%); font-size: 22px; color:#fff; z-index:10;text-align: center;}
.modal_section .inner .close{position:absolute; right:20px; top:20px; border:0; background:transparent; color:#fff; font-size:40px; cursor:pointer;}
.modal_section .inner .close:where(:hover, :focus){opacity:0.8;}
.modal_section .inner .video{position:relative; left:0; top:0; width:100%; height:100vh;}
.modal_section .inner .video iframe,
.modal_section .inner .video video,
.modal_section .inner .video #popupVidoTy1{position:absolute; left:50%; top: 6%; width:87%; height:81%;transform: translateX(-50%);}

/*230728 추가*/
.modal_section .inner .text {
	position: absolute;
    bottom: 20px;
    /* color: white; */
    background: white;
    height: 10%;
    font-size: 16px;
    line-height: 18px;
    width: 90%;
    border-radius: 2px;
    left: 5%;
    overflow: auto;
	z-index: 5;
}

/**  모달 스타일 end  **/


/**  팝업 한개 Start  **/
#modal-wrap { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); position: fixed; z-index: 100; left: 0; top: 0; display: none; }
#modal-wrap .modal-con { border: 4px solid #222; padding: 0 40px; position: absolute; left: 50%; top: 50%; padding: 0 ; background: #fff; display: none; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
#modal-wrap .modal-con .modal-close { display: block; width: 21px; height: 21px; position: absolute; top: 30px; right: 30px; background: url(/docs/kor6/jsp/_images/common/header_close.png) no-repeat 0 0; }
@media screen and (max-width: 740px) { 
    #modal-wrap .modal-con { padding: 0; }
    #modal-wrap .modal-con .modal-close { width: 14px; height: 14px; position: absolute; top: 15px; right: 15px; background-size: contain; } 
}
/*   Modal   */
.main-modal { position: absolute; left: 50%; top: 50%; margin-left: -250px; margin-top: -259px; }
.main-modal .image {position: relative; width: 500px; height: 518px;}
.main-modal .image a {display: block; height: 518px;}
.main-modal .image a > img {width: 100%; }
.main-modal .image .modal-btn {position:absolute; top:365px; left:50%; transform: translate(-50%,0);}
.main-modal .image .modal-btn .mdbtn { display: block; margin-right: 10px; float: left;}
.main-modal .image .modal-btn .mdbtn:last-child { margin-right:0;}
.main-modal .foot-close {height: 50px; line-height: 50px; background: #222;}
.main-modal .foot-close .input { float: left; margin-left: 20px; }
.main-modal .foot-close .input label { color: #fff; margin-left: 10px; }
.main-modal .foot-close a { float: right; color: #fff; padding: 0 20px; }

 /**  팝업 한개 End  **/

/**  팝업두개 (181018 수정ver) Start  **
#modal-wrap { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.25); position: fixed; z-index: 100; left: 0; top: 0; display: none; }
#modal-wrap .modal-con { border: 4px solid #222; padding: 0 40px; position: absolute; left: 50%; top: 50%; background: #fff; display: none; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
#modal-wrap .modal-con .modal-close { display: block; width: 21px; height: 21px; position: absolute; top: 30px; right: 30px; background: url(/docs/kor6/jsp/_images/common/header_close.png) no-repeat 0 0; }
#modal-wrap02 { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.25); position: fixed; z-index: 100; left: 0; top: 0; display: none; }
#modal-wrap02 .modal-con { border: 4px solid #222; padding: 0 40px; position: absolute; left: 50%; top: 50%; background: #fff; display: none; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
#modal-wrap02 .modal-con .modal-close { display: block; width: 21px; height: 21px; position: absolute; top: 30px; right: 30px; background: url(/docs/kor6/jsp/_images/common/header_close.png) no-repeat 0 0; }
@media screen and (max-width: 960px) { #modal-wrap .modal-con { padding: 0; }
#modal-wrap .modal-con .modal-close { width: 14px; height: 14px; position: absolute; top: 15px; right: 15px; background-size: contain; } 
#modal-wrap02 .modal-con .modal-close { width: 14px; height: 14px; position: absolute; top: 15px; right: 15px; background-size: contain; } }
/*     Modal    *
.main-modal { position: absolute; left: 50%; top: 50%; margin-left: -505px; margin-top: -285px; z-index:200;}
.main-modal .image {position: relative;}
.main-modal .image .modal-btn {position:absolute; width: 440px; top:173px; left:50%; transform: translate(-50%,0);}
.main-modal .image .modal-btn .mdbtn { display: block; margin-right: 10px; float: left;}
.main-modal .image .modal-btn .mdbtn:last-child { margin-right:0;}
.main-modal .image .modal-btn2 {position:absolute; width: 288px; top:434px; left:32px;}
.main-modal .foot-close { height: 50px; line-height: 50px; background: #222; margin-top: -11px;}
.main-modal .foot-close .input { float: left; margin-left: 20px;}
.main-modal .foot-close .input label { color: #fff; margin-left: 10px; }
.main-modal .foot-close a { float: right; color: #fff; padding: 0 20px; }
.main-modal02 { position: absolute; left: 50%; top: 50%; margin-left: 5px; margin-top: -285px; z-index:200;}
.main-modal02 .image .modal-btn {position:absolute; top:415px; left:108px;}
.main-modal02 .image .modal-btn a { width: 335px; height: 50px; display:block;}
.main-modal02 .foot-close { height: 50px; line-height: 50px; background: #222; margin-top: -11px;}
.main-modal02 .foot-close .input { float: left;  margin-left: 20px; }
.main-modal02 .foot-close .input label { color: #fff; margin-left: 10px; }
.main-modal02 .foot-close a { float: right; color: #fff; padding: 0 20px; }
@media screen and (max-width: 1020px) { 
.main-modal02 {display: none!important;}
.main-modal {left: 50%; top: 50%; margin-left:-250px; margin-top: -285px;}
#modal-wrap02 {display: none!important;} }
@media screen and (max-width: 600px) { 
.main-modal { width: 80%; margin-left: -40%; margin-top: -40%; }
.main-modal .image .modal-btn { width: 86%; top: 32.5%;}
.main-modal .image .modal-btn .mdbtn { width: 32%; margin-right: 2%;}
.main-modal .image .modal-btn2 { width: 57.6%; top: 83.6%; left: 6.4%;}

.main-modal img { width: 100%; }
.main-modal02 .image .modal-btn {width: 56%;top:80%; left:22%;}
.main-modal02 .image .modal-btn a { width: 100%; height: 100%; display:block;} }
/**  팝업두개 (181018 수정ver) End  **/

/*   모바일 팝업 안뜨게 Start   *
@media screen and (max-width: 960px) { 
    #modal-wrap {display: none!important;} 
    #modal-wrap02 {display: none!important;} 
    .main-modal02 {display: none!important;}
    .main-modal {display: none!important;}
    .main-modal {left: 50%; top: 50%; margin-left:-250px; margin-top: -285px;}
/*   모바일 팝업 안뜨게 End   */

/*   link 230623 추가   */
.link2 { color: #0000ff; border-bottom: 1px solid #0000ff; margin-right: 30px; position: relative; }
.link2:after { content: ''; width: 17px; height: 17px; margin-left: 5px; background: url(../images/ico/ico_link_blu.png) center no-repeat; background-size: contain; position: absolute; left: 100%; top: 0; }

/*231107 팝업 focus시 테두리 제거. 웹접근성 시 제거하기*/
.main-modal02:focus {outline: none;}


/**  탭메뉴 스타일 start  **/
/* 250116 content.css 에서 옮김. */
.tab.ty2{}
.tab.ty2 > ul{display: flex;}
.tab.ty2 > ul > li{} 
.tab.ty2 > ul > li > a{
    display: block;
    position: relative;
    padding: 10px 30px 25px;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.01em;
    line-height: 1;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    color: #999;
} 
.tab.ty2 > ul > li a:after{
  position: absolute;
  left: 1px;
  top: 50%;
  width: 1px;
  height: 20px;
  background-color: #ddd;
  content: "";
  /*position: absolute;left: 50%;top: -8px;width: 6px;height: 6px;border-radius: 50%;background-color: #099de8;content: "";margin-left: -3px;
    opacity: 0;*/
  margin-top: -17px;
}
.tab.ty2 > ul > li.on > a,
.tab.ty2 > ul > li > a:where(:hover, :focus){ color:#099de8;} 

.tab.ty2 > ul > li.on > a:before{ position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background-color: #099de8; content: "";} 
/*

.tab.ty2 > ul > li.on a:after{
    opacity: 1;
    -webkit-animation: bounce-in-top 1.1s both;
            animation: bounce-in-top 1.1s both;
}*/

.tab.ty3{}
.tab.ty3 > ul{display: flex;}
.tab.ty3 > ul > li{
    margin-left: 30px;
} 
.tab.ty3 > ul > li > a{
    display: block;
    position: relative;
    padding: 10px 10px 0;
    font-size: 25px;
    font-weight: 300;
    letter-spacing: -0.01em;
    line-height: 1;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
} 
.tab.ty3 > ul > li a:after{
  position: absolute;left: 50%;top: -8px;width: 6px;height: 6px;border-radius: 50%;background-color: #099de8;content: "";margin-left: -3px;
    opacity: 0;
}
.tab.ty3 > ul > li.on > a,
.tab.ty3 > ul > li > a:where(:hover, :focus){ color:#099de8;} 


.tab.ty3 > ul > li.on a:after{
    opacity: 1;
    -webkit-animation: bounce-in-top 1.1s both;
            animation: bounce-in-top 1.1s both;
}


.tab.ty6{}
.tab.ty6 > ul{display: flex; position:relative;}
.tab.ty6 > ul > li{
    flex: none;
    width: 28%;
    position:
    relative;
    z-index:0;
    background: #fff;
} 
.tab.ty6 > ul > li > a{
    display: block;
    position: relative;
    padding:  0 10px;
    font-size: 20px;
    font-weight: 300;
    letter-spacing: -0.01em;
    line-height: 1;
    /*-webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;*/
    color: #a9a9a9;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-style: solid;
    border-width: 1px 1px 0;
    border-color: #a9a9a9;
    margin-left: -1px;
    border-radius: 10px 10px 0 0;
    font-weight: 600;
} 
.tab.ty6 > ul:after{
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background-color: #008ed0;
  content: "";
  z-index: 1;
}
.tab.ty6 > ul > li.on{z-index:3;}
.tab.ty6 > ul > li.on > a{color: #008ed0;border-color: #008ed0;z-index: 2;border-width: 2px 2px 0;} 
.tab.ty6 > ul > li > a:where(:hover, :focus){color: #008ed0;}

.tab.ty6.full.n2 > ul > li{ width: 50%;} 
.tab.ty6.full.n3 > ul > li{ width: 33.3332%;} 



@-webkit-keyframes bounce-in-top {

}
@keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-30px);
            transform: translateY(-30px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateY(-15px);
            transform: translateY(-15px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}



.tab.ty4 {  }
.tab.ty4 > ul{display: flex; margin-left: -5px;}
.tab.ty4 > ul > li{ padding-left: 5px; box-sizing: border-box; } 
.tab.ty4 > ul > li > a{ display: flex; align-items: center; justify-content: center; position: relative; padding: 0 20px; min-width: 200px; height: 60px; color: #928786; font-weight: 500; letter-spacing: -0.01em; line-height: 1; background-color: #eee;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  box-sizing: border-box; border-radius: 500px; text-align: center; } 

.tab.ty4 > ul > li.on > a,
.tab.ty4 > ul > li > a:where(:hover, :focus){ color:#fff; background-color: #099de8;} 
.tab.ty4 > ul > li.on > a { text-decoration: underline; text-underline-position: under;text-align: center; }

.tab.ty5{}
.tab.ty5 > ul{display: flex;}
.tab.ty5 > ul > li{ flex: none; margin-left: 40px; } 
.tab.ty5 > ul > li:first-child{margin-left: 0;}
.tab.ty5 > ul > li > a{position: relative;  display: block; position: relative; padding-bottom: 25px; color: #666; font-weight: 400; letter-spacing: -0.03em; line-height: 1;  box-sizing: border-box; border-bottom: 3px solid transparent; font-size: 18px; font-size: 1.125em; line-height: 1;}  
.tab.ty5 > ul > li > a:after{position: absolute;}
.tab.ty5 > ul > li.on > a,
.tab.ty5 > ul > li > a:where(:hover, :focus){border-bottom: 3px solid #222; color: #222; font-weight: 500;} 


.inner_step3{ position: relative; }
.inner_step3 > .tab-type1{ position: absolute; left: 0; top: 40px; width: 100%;  z-index: 5;}
.inner_step3 > .tab-type1 a{background:rgba(255,255,255,0.8);}
.inner_step3 > .tab-type1 li.active,
.inner_step3 > .tab-type1 a:where(:hover, :focus){background:rgba(255,255,255,1);}

.tab-type1{margin-bottom: 50px;}
.tab-type1 > ul{display: flex;align-items: center;justify-content: center;flex-wrap: wrap;}
.tab-type1 > ul >li{margin: 0 3px;}
.tab-type1 > ul >li > a{width: 360px; height: 95px; border: 2px solid #d8d7da; display: inline-flex; align-items: center; flex-direction: column; justify-content: center; color: #00578a; font-weight: 500;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.tab-type1 > ul >li> a:where(:hover, :focus),
.tab-type1 > ul >li.on > a{border-color: #00578a;}

/**  탭메뉴 스타일 end  **/