@charset "UTF-8";

#contents { padding: 5rem 4rem 7rem; /* border-left: 1px solid #e6e6e6; border-right: 1px solid #e6e6e6; */ border: none; font-family: 'NanumSquareNeo', 'NotoSansKR', sans-serif; color: #000; line-height: 1.6; }
#contents .h2box { margin-bottom: 2rem; background: url(../images/h2bg.png) no-repeat; background-position: right 3.7rem; }
#contents .h2box h2.ti1 { display: inline-block; position: relative; padding: 1rem 5rem 1rem 0; background-color: #fff; font-size: 3rem; font-weight: 800; color: #2f2f2f; }
#contents .h2box h2.ti1  span { font-family: sans-serif; font-weight: 700; }
#contents .h2box h2.ti1:before { position: absolute; top: 0; left: 11%; transform: translateX(-50%); width: 4.4rem; height: 1rem; background: url(../images/title-obj.png) no-repeat center / contain; content: ""; }
#contents .h2box h2.ti1.type2 { padding: 1rem 5rem 1rem 1.5rem; }
#contents .h2box h2.ti1.type2:after { left: 0; width: .6rem; height: 2.3rem; }
#contents h3.ti1 { position: relative; padding: 1rem 0 0; margin-bottom: 1.5rem; background-color: #fff; font-size: 2.8rem; font-weight: 800; color: #19389a; letter-spacing: -0.15rem;}
#contents h3.ti1:before { position: absolute; top: 0; left: 0; width: 4.5rem; height: 1px; background-color: #828282; content: ''; }
#contents h3.ti2 { max-width: 32.5rem; padding: 0 2rem 0 2rem; margin-bottom: 2rem; border-radius: 2rem; background-image: -webkit-gradient(linear, left top, right top, from(#48b7e5), to(#78d85d)); background-image: linear-gradient(to right, #48b7e5, #78d85d); font-size: 2.1rem; font-weight: 700; color: #fff; line-height: 3.5rem; }

#contents p.t1 { margin: .5rem 0 1rem;   word-break: break-all; color: #000;  font-size: 1.7rem;  line-height: 2.8rem;  text-align: justify;}
#contents p.t2 {  margin: 2.5rem 0 3rem;  word-break: keep-all; font-size: 2.3rem;font-weight: 500; color: #3b3b3b; color: #00558b !important;letter-spacing: -0.28rem; line-height: 3.7rem;}
#contents p.t1 strong { font-size: 2.5rem; color: #3173cd; line-height: 3rem; text-align: right; float: right;font-weight: 700;/*  word-break: keep-all;  */}
#contents p.t1 strong span { font-size: 1.85rem; color: #333; line-height: 3rem; text-align: right; float: right;font-weight: 700;/*  word-break: keep-all;  */}
#contents p.t2 strong { font-size: 2.5rem; color: #3173cd; line-height: 2.5rem; /* word-break: keep-all; */ }
#contents p.t3 { word-break: break-all; /* margin: .5rem 0 1rem;  */ font-size: 2.3rem; color: #3b3b3b;line-height: 3.5rem; text-align: justify; }
#contents p.t4 { margin: 14.5rem 0rem 0 1rem; word-break: break-all; font-size: 2.1rem; font-weight: 400; color: #3b3b3b; letter-spacing: -0.07rem;line-height: 3.3rem;  text-align: justify; }
#contents p.t5 { word-break: break-all; /* margin: .5rem 0 1rem;  */ font-size: 2.5rem; color: #3b3b3b; letter-spacing: -0.15rem; text-align: justify; }
#contents p.t6 { word-break: break-all; font-size: 1.7rem; font-weight: 500; color: #3173cd;  letter-spacing: -0.15rem;line-height: 3rem; text-align: justify;}
#contents p.t6 b { word-break: break-all; font-size: 1.7rem; font-weight: 800; color: #3173cd;  letter-spacing: -0.15rem;line-height: 3rem; text-align: justify;}
#contents p.t7 { word-break: break-all; font-size: 2.3rem;font-weight: 800; /* margin: .5rem 0 1rem;  */ color: #3b3b3b; letter-spacing: -0.18rem; text-align: justify; }
#contents p.t8 { padding-left: 20px; border-left: 3px solid #141414; word-break: break-all; font-size: 2.5rem;  font-weight: 600; color: #3b3b3b;  letter-spacing: -1.5px;line-height: 3.5rem;  text-align: justify;}
#contents p.t9 { word-break: break-all; font-size: 1.6rem; color: #3b3b3b; letter-spacing: -0.18rem; text-align: justify; }
#contents p.t1 a { margin: .5rem 0 1rem;   word-break: break-all;color: #898989; letter-spacing: -0.07rem; line-height: 2.8rem;  text-align: justify;}
#contents p.t10 { margin: .5rem 0 2rem;   word-break: break-all; color: #525252;  font-size: 1.5rem;  line-height: 2.4rem;  text-align: justify;}
#contents p.t10 a { color: #525252; }

#contents p.t11 { padding: 1rem 1rem; word-break: break-all;  font-size: 2.05rem;  line-height: 2.8rem;  background-color:#1f456f; color:#fff; text-align:center; font-weight:700;letter-spacing: -0.1rem;}

#contents p.t1  .view  { text-align: right; margin-left: 1rem; font-size: 1.5rem; color: #00aeef; }
#contents span.title { font-family: "GyeonggiBatang";  color: #333;  font-size:  24px; line-height: 1.6;   padding-bottom: 0; display: inline-block; margin: .5rem 0 1rem;   word-break: break-all;}


#contents span.fss { font-family: sans-serif; }

#contents .pbox1 { padding: 1rem 1.5rem; margin: .5rem 0; border: 1px solid #d5d9da; border-radius: 2px; background-color: #f6f6f6;word-break: break-word; font-size: 1.6rem; color: #3b3b3b; }
#contents .pbox2 { padding: 2.5rem 1.5rem 0rem 1rem; margin: .5rem 0; border: 1px solid #dfdf8f; border-radius: 2px; background-color: #ffffe7;word-break: break-word; font-size: 1.5rem; color: #3b3b3b; }
#contents .pbox2 b {font-weight:800;font-size: 1.6rem; }
#contents .pbox2 span {line-height: 300%;}
#contents .pbox3 { padding: 1rem 1.5rem; margin: .5rem 0; border: 1px solid #d5d9da; border-radius: 2px; background-color: #f6f6f6; font-size: 1.6rem; color: #000; }
#contents .pbox3  li span { display: table-cell;min-width: 8.5rem; font-size: 1.8rem;font-weight: 500; letter-spacing: -0.05em; }
#contents .pbox3  li span::before { margin-right: 4px;content: "·";}
#contents .pbox3  li p{ display: table-cell;min-width: 8.5rem;word-break: keep-all; font-size: 1.8rem; letter-spacing: -0.05em;}


#contents .pbox2.waterdrop { width: 100%;  font-size: 1.6rem;}
#contents .pbox2.waterdrop .drop { width:35%; float:left; }
#contents .pbox2.waterdrop .txt {  width: calc(100% - 37%); padding: 3rem 0 0 2rem;  line-height: 2.6rem;  text-align: justify;  float: left;}
#contents .pbox2.waterdrop .txt .title { margin-bottom: 2rem; font-size: 2rem;}
#contents .pbox2.waterdrop:after{ display: block;content: ''; clear: both;}



#contents .img100 { margin: 3rem 0; }
#contents .img101 { margin: 3rem 0 0 0; }
#contents .img102 { margin: 1rem 0 3rem  0; }
#contents .img103 { margin: 3rem 0 0 0; border: 1px solid #dbdbdb;}
#contents .img104 {border: 1px solid #dbdbdb;}
#contents .img105 { margin: 0rem 0  4rem 0; }
 

#contents .bullistbox { padding: 2rem 2rem; margin-bottom: 2rem; border: 1px solid #87cae4; border-radius: .2rem; background-color: #ecf7fb; }
#contents .bullistbox li { position: relative; padding: .2rem 0 .2rem 1rem;word-break: keep-all; font-size: 1.8rem; font-weight: 400; color: #000; }
#contents .bullistbox li:before { position: absolute; top: 1.2rem; left: 0; width: .5rem; height: .5rem; border-radius: 50%; background-color: #00aeef; content: ''; }

.storyWrap .story_tab { margin: 4rem 0 4rem 0; text-align: center; }
.storyWrap .story_tab ul { text-align: center; }
.storyWrap .story_tab ul li { display: inline-block; margin: 0 .3rem; }
.storyWrap .story_tab ul li a { display: inline-block; min-width: 18rem; width: 100%; height: 4rem; padding: 0 2rem; border-radius: 2rem; background-color: #bbb; font-size: 1.7rem; font-weight: 700; color: #fff; line-height: 4rem; }
.storyWrap .story_tab ul li a.on { position: relative; background-color: #004e9e; }
.storyWrap .story_tab ul li a.on:after { position: absolute; bottom: -1rem; left: 50%; -webkit-transform: rotate(45deg) translateX(-50%); transform: rotate(45deg) translateX(-50%); width: 1rem; height: 1rem; background: #fff; content: ''; }
.storyWrap .story_tab ul li a:hover { background-color: #004e9e; -webkit-transition: all .3s; transition: all .3s; }
.storyWrap .storyTwrap { padding-top: 2rem;  }
.storyWrap .storyTwrap .storyOwrap1 { background: url(../images/greeting_bg.png) no-repeat; background-position: right top; }
.storyWrap .storyTwrap .storyOwrap1 .textWrap { width: calc(100% - 20rem); padding: 8rem 4rem 0rem 0; word-break: keep-all; float: left; }
.storyWrap .storyTwrap .storyOwrap1 .textWrap .title { position: relative; }
.storyWrap .storyTwrap .storyOwrap1 .textWrap .title:before { position: absolute; top: -.6rem; left: 0; width: 2px; max-height: 80%; height: 8rem; background-color: #e1e1e1; content: ''; }
.storyWrap .storyTwrap .storyOwrap1 .textWrap .title img { padding: 0 0 3.5rem 2rem; }
.storyWrap .storyTwrap .storyOwrap1 .textWrap .cont { line-height: 2.8rem; }
.storyWrap .storyTwrap .storyOwrap1 .photoWrap { width: 20rem; padding-top: 5rem; float: left; }
.storyWrap .storyTwrap .storyOwrap1 .photoWrap > img { display: block; margin: 0 auto 1rem; -webkit-box-shadow: 0rem 0.2rem 1rem rgba(0, 0, 0, 0.1); box-shadow: 0rem 0.2rem 1rem rgba(0, 0, 0, 0.1); }
.storyWrap .storyTwrap .storyOwrap1 .photoWrap .name { text-align: right; }
.storyWrap .storyTwrap .storyOwrap1 .textWrap2 { width: 100%; padding: 0; }
.storyWrap .storyTwrap .storyOwrap1:after { display: block; content: ''; clear: both; }
.storyWrap .storyTwrap .storyOwrap2 .iframebox { width: 40rem; padding-top: 2.5rem; float: left; }
.storyWrap .storyTwrap .storyOwrap2 .iframebox iframe { width: 100%; height: 22.5rem;  -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.3); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.3); }
.storyWrap .storyTwrap .storyOwrap2 .textbox { width: calc(100% - 40rem); padding: 5rem 0 3rem 4rem; background: url(../images/blur_bg.png) no-repeat; float: left; }
.storyWrap .storyTwrap .storyOwrap2 .textbox .title { margin-bottom: 1rem; font-size: 2rem; font-weight: 700; color: #0a0a0a; }
.storyWrap .storyTwrap .storyOwrap2 .textbox a { display: inline-block; padding: .6rem 1rem; background-color: #838793; font-size: 1.4rem; color: #fff; vertical-align: middle; float: right; }
.storyWrap .storyTwrap .storyOwrap2:after { display: block; content: ''; clear: both; }
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .summary { display: block; }
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .summary a { margin-left: 1rem; font-size: 1.3rem; color: #00aeef; }
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .summary a span { font-size: 1.1rem; }
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .totalWrap { display: none; }
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .totalWrap a { display: block; font-size: 1.3rem; color: #00aeef; text-align: right; }
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .totalWrap a span { font-size: 1.1rem; }
.storyWrap .storyTwrap .storyOwrap3 .detalWrap.active .summary { display: none; }
.storyWrap .storyTwrap .storyOwrap3 .detalWrap.active .totalWrap { display: block; }
.storyWrap .storyTwrap .storyOwrap3 .listMore li .title { position: relative; }
.storyWrap .storyTwrap .storyOwrap3 .listMore li .title a { display: block; padding: 1rem 3rem 1rem 2rem; margin-top: 1rem; background-color: #f0f1f2; font-size: 1.8rem; font-weight: 700; color: #0a0a0a; }
.storyWrap .storyTwrap .storyOwrap3 .listMore li .title:after { position: absolute; top: 50%; right: 1.5rem; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 2rem; height: 2rem; font-family: "xeicon"; font-size: 2rem; color: #bcadad; line-height: 2rem; text-align: center; content: ''; }
.storyWrap .storyTwrap .storyOwrap3 .listMore li .moreWrap { display: block; opacity: 0; max-height: 0; overflow: hidden; overflow-y: auto; visibility: hidden; }
.storyWrap .storyTwrap .storyOwrap3 .listMore li.active .title:after { color: #00aeef; }
.storyWrap .storyTwrap .storyOwrap3 .listMore li.active .moreWrap { opacity: 1; max-height: 300rem; visibility: visible; padding: 4rem 2rem 2rem; -webkit-transition: all .5s ease; transition: all .5s ease; }
.storyWrap .storyTwrap .storyOwrap3 .listMore li:hover .title:after { color: #00aeef; }
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .datatable {border-top: 2px solid #616b77; border-bottom: 1px solid #ddd;}
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .datatable table {margin-bottom: -2px;}
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .datatable thead th {padding: 0.8rem;border-bottom: 1px solid #ddd; background-color: #f1feff;   font-size: 1.6rem;}
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .datatable td {padding: 0.5rem;border-bottom: 1px solid #ddd; font-size: 1.4rem;}
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .datatable .bg th,
.storyWrap .storyTwrap .storyOwrap3 .detalWrap .datatable .bg td {background-color: #fbfbfb;}

.storyWrap .storyTwrap .storyOwrap3 .detalWrap .totalWrap .view { text-align: right; color: #00aeef; font-size: 1.5rem; display: block; }






 #contents .focusWrap .datatable {border-top: 2px solid #616b77; }
#contents .focusWrap .datatable table {margin-bottom: 1px;}
#contents .focusWrap .datatable thead th {padding: 1.2rem; background-color: #f1feff;   font-size: 1.5rem;border-bottom: 1px solid #ddd;border-right: 1px solid #ddd;}
#contents .focusWrap .datatable td {padding: 0.5rem; font-size: 1.5rem;border-bottom: 1px solid #ddd;border-right: 1px solid #ddd;}
#contents .focusWrap .datatable  th,td{text-align:center;}
#contents .focusWrap .datatable .bg {font-weight:600;}
#contents .focusWrap .datatable .bg2 {background-color: #fff; text-align:center; padding: 1rem  1.5rem;}
#contents .focusWrap .datatable .bg3 {background-color: #fbfbfb; }
#contents .focusWrap .datatable td:last-child {border-right: none;  !important;}  
#contents .focusWrap .datatable thead th:last-child {border-right: none;  !important;}  


 #contents .focusWrap .datatable2 {border-top: 2px solid #616b77; }
#contents .focusWrap .datatable2 table {margin-bottom: 1px;}
#contents .focusWrap .datatable2 thead th {padding: 1.2rem; background-color: #eeeeee;   font-size: 1.5rem;border-bottom: 1px solid #ddd;border-right: 1px solid #ddd;}
#contents .focusWrap .datatable2 td {padding: 0.5rem; font-size: 1.5rem;border-bottom: 1px solid #ddd;border-right: 1px solid #ddd;}
#contents .focusWrap .datatable2  th,td{text-align:center;}
#contents .focusWrap .datatable2 .bg {font-weight:600;}
#contents .focusWrap .datatable2 .bg2 {background-color: #fff; text-align:center; padding: 1rem  1.5rem;}
#contents .focusWrap .datatable2 .bg3 {background-color: #fbfbfb; }
#contents .focusWrap .datatable2 td:last-child {border-right: none;  !important;}  
#contents .focusWrap .datatable2 thead th:last-child {border-right: none;  !important;}  


.iframebox2 {width: 100%; padding-top: 2.5rem;}
.iframebox2 iframe { width: 100%; height: 45rem;  -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.3); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.3); }
.wr_info{margin-bottom: 3rem;}
.wr_info:after{ display: block;content: ''; clear: both;}
.photo{width: 14rem; margin-left: 2rem; float: right;}
.title_wrap{width: calc(100% - 16rem); margin-top: 2rem; text-align: right; float: left;}
.title_wrap .write{margin-top: 9rem;}

.goodwaterWrap img.title { margin: 4rem 0  0rem 0rem; }
.goodwaterWrap .datatable {border-top: 2px solid #616b77; border-bottom: 1px solid #ddd;}
.goodwaterWrap .datatable table {margin-bottom: -2px;}
.goodwaterWrap .datatable thead th {padding: 0.8rem;border-bottom: 1px solid #ddd; border-right: 1px solid #ddd;background-color: #f1feff;   font-size: 1.6rem;}
.goodwaterWrap .datatable td {padding: 1rem;border-bottom: 1px solid #ddd; border-right: 1px solid #ddd;font-size: 1.4rem; text-align:center;}
.goodwaterWrap .datatable .bg th,
.goodwaterWrap .datatable .bg td {background-color: #fbfbfb;}
.goodwaterWrap .datatable td:last-child {border-right: none;  !important;}  
.goodwaterWrap .datatable thead th:last-child {border-right: none;  !important;}  


.goodwater-box {
    background: url(../images/goodwater-bg.png) no-repeat  left;
    text-align: center;
    padding: 5rem 6rem;
}


@media (max-width: 680px) {
  .datatable {
    position: relative;
    margin-top: 8rem;
  }
  .datatable>div {
    overflow-x: auto;
  }
  .datatable table {
    width: 820px;
    margin-bottom: 0 !important;
  }
  .datatable::before {
    content: '\eafa';
    font-family: 'xeicon';
    font-size: 4rem;
    color: #004e9e;
    position: absolute;
    top: -6rem; right: 0;
    animation: tableScroll01 1.8s ease-out infinite, tableScroll02 1.8s ease-in infinite;
  }
  
  @keyframes tableScroll01 {
    0% {
        transform: translateX(0);
    }
    70% {
        transform: translateX(-2.6rem);
    }
    100% {
        transform: translateX(-2.6rem);
    }
  }
  
  @keyframes tableScroll02 {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 1;
    }
    80% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
  }
}

.waterdrop { width: 100%;  }
.waterdrop .drop { width:16%; float:left; }
.waterdrop .txt {  width: calc(100% - 18%); padding: 0rem 0 0 2rem;  line-height: 2.6rem;  text-align: justify;  float: left;}
.waterdrop .txt .title { margin-bottom: 2rem; font-size: 2rem;}
.waterdrop:after{ display: block;content: ''; clear: both;}


.txt_info {padding: 1.5rem 2.0rem;background-color:#eff2f7;word-break: keep-all;font-size: 1.5rem;color: #333;letter-spacing:-0.01em;line-height: 2.0rem;}
.pb30 { margin-bottom: 30px;}


/* 이미지 리스트 추가 */
.img-list-wrap > div:after{
  display: block;
  content: '';
  clear: both;
}
.img-list-wrap > div > div{
  width: 49%;
  margin-right: 2%;
  float: left;
}
.img-list-wrap > div > div:last-child{
  margin-right: 0;
}
.img-list-wrap > div > div > img{
  width: 100%;
}

.br-mo {
    display: none;
}

/* 반응형 */

@media (max-width: 768px) {
  #contents { padding: 4rem 2rem 7rem; }
  #contents .h2box { margin-bottom: 1rem; }
  #contents .h2box h2.ti1 { font-size: 2.7rem; }
  #contents h3.ti1 { font-size: 2.5rem; }

  .storyWrap .story_tab ul li { display: block; margin-bottom: 1rem; }
  .storyWrap .story_tab ul li a { min-width: auto; }
  .storyWrap .storyTwrap .storyOwrap1 { background-size: 60%; }
  .storyWrap .storyTwrap .storyOwrap1 .textWrap { width: calc(100% - 16rem); padding: 6rem 0 0; }
  .storyWrap .storyTwrap .storyOwrap1 .photoWrap { width: 16rem; padding-top: 4rem; padding-left: 2rem; }
  .storyWrap .storyTwrap .storyOwrap1 .photoWrap > img { width: 15rem; margin-right: 0; }
  .storyWrap .storyTwrap .storyOwrap1 .textWrap2 { width: 100% !important; padding: 0; }
  .storyWrap .storyTwrap .storyOwrap2 .iframebox { width: 100%; padding-top: 0; }
  .storyWrap .storyTwrap .storyOwrap2 .iframebox iframe { display: block; max-width: 100%; width: 40rem; margin: 0 auto; }
  .storyWrap .storyTwrap .storyOwrap2 .textbox { width: 100%; padding: 5rem 0 3rem; background-size: 15rem; }
  
  .goodwaterWrap { background-position: center 8rem; background-size: auto 13rem; }
  .goodwaterWrap img.title { margin: 0rem 0 0rem 0rem;}
  .goodwaterWrap .intro_txt br{display: none;}

  .focusPho { padding-top: 18rem; background-size:125px; }
  .focusPho img .title{ margin: 0rem 0 14rem 0rem;}
  .focusPho .title{margin: 0 0 3rem;}
  .focusPho2{ padding-top: 18rem;background-size: 125px;}
  .focusPho2 .title{margin: 0 0 3rem;}



  .iframebox2 { width: 100%; padding-top: 0; }
  .iframebox2 iframe { display: block; max-width: 100%; width: 40rem; margin: 0 auto; }
}

@media (max-width: 840px){
  .img-list-wrap > div > div > .txt_info { font-size: 1.3rem; }
}

@media (max-width: 640px){
  .img-list-wrap > div > div{ width: 100%; margin-right: 0; float: none; }
  .img-list-wrap > div > div > .txt_info { font-size: 1.5rem; }
}

@media (max-width: 500px) { 
  .storyWrap .storyTwrap .storyOwrap1 .textWrap { width: calc(100% - 11rem); padding: 3rem 0 0; }
  .storyWrap .storyTwrap .storyOwrap1 .photoWrap { width: 11rem; padding-left: 1.5rem; } 

  .wr_info{position: relative;}
  .photo{ position: absolute;top: 8.5rem;left: 50%; transform: translateX(-50%);width: 8rem;}
  .title_wrap{width: 100%; text-align: center;}
  .title_wrap .write{margin-top: 13rem;}
  
  .waterdrop{position: relative;}
  .waterdrop .drop{position: absolute;left: 60%;transform: translateX(-50%);width: 20rem;}
  .waterdrop .drop img{margin: 1rem 0 4rem 0 !important;}
  .waterdrop .txt{width: 100%;padding: 18rem 0 0rem;}
  .waterdrop .txt .title{padding-left: 9rem; }

  #contents p.t1 strong{ display: block;text-align: center; float: none;}
  .photo{margin-left: 0;}

    #contents p.t1 strong span{ display: block;text-align: center; float: none;}
  .photo{margin-left: 0;}

}


.ucc-box {
    padding: 4rem 3rem 3.2rem;
    background: url(../images/ucc-bg.png) no-repeat center / cover;
    text-align: center;
}
.ucc-box>strong {
    display: inline-block;
    position: relative;
    z-index: 1;
    margin: 1rem 0 2.6rem;
    font-family: 'Gmarket Sans';
    font-size: 2.3rem;
    font-weight: 600;
    letter-spacing: -0.05em;
}
.ucc-box>strong::before {
    position: absolute;
    top: -1rem; left: 50%;
    transform: translateX(-50%);
    z-index: -1;
    width: 28.4rem; height: 6.8rem;
    background: url(../images/ucc-bubble.png) no-repeat center / contain;
    content: "";
}
.ucc-box>h4 {
    position: relative;
    margin: 1rem 0;
    word-break: keep-all;
    font-family: 'Gmarket Sans';
    font-size: 6.5rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.05em;
    line-height: 9rem;
}
.ucc-box>h4::before {
    position: absolute;
    top: -6rem; right: 1rem;
    width: 6rem; height: 5.8rem;
    background: url(../images/ucc-title.png) no-repeat center / contain;
    content: "";
}
.ucc-box>h4>span {
    color: #fff600;
}
.ucc-box>p {
    display: inline-block;
    padding: .8rem 2.4rem 0;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    word-break: keep-all;
    font-family: 'Gmarket Sans';
    font-size: 2.8rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.05em;
}
.ucc-list {
    display: inline-block;
    margin: 2rem auto;
    text-align: left;
}
.ucc-list li {
    position: relative;
    padding-left: 1rem;
    word-break: keep-all;
    font-family: 'Gmarket Sans';
    font-size: 1.9rem;
    font-weight: 500;
    letter-spacing: -0.05em;
    line-height: 3.5rem;
}
.ucc-list li::before {
    position: absolute;
    top: 0; left: 0;
    content: "·";
}

.img-right {
  margin-bottom: 1rem;
  margin-left: 2rem;
  text-align: center;
  float: right;
}
.img-right>span {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: #525252;
}

@media (max-width: 450px) {
    .ucc-box>h4 {
        font-size: 6rem;
        line-height: 7.4rem;
    }
    .ucc-box>h4::before {
        top: -2rem;
    }
    .ucc-box>strong::before {
        top: -.7rem;
    }
    .ucc-box>p {
        padding: .8rem 2.4rem .6rem;
    }
}

.sec05.sec-box {
    padding-top: 8rem;
    padding-bottom: 10rem;
    background: url(../images/sec05-bg.png) no-repeat center / cover;
    text-align: center;
}
.sec05.sec-box h3 {
    display: inline-block;
    position: relative;
}
.sec05.sec-box h3 img {
    margin-right: 4rem;
}
.sec05.sec-box h3::before {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 43.4rem; height: 11.6rem;
    background: url(../images/sec05-title-bg.png) no-repeat center / contain;
    content: "";
}
.sec05.sec-box h3::after {
    position: absolute;
    bottom: 0; right: -2rem;
    width: 5.2rem; height: 6.4rem;
    background: url(../images/sec05-title-icon.png) no-repeat center / contain;
    content: "";
}
.sec05-con {
    margin-top: 8rem;
}
.sec05-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
            align-items: center;
    color: #fff;
    text-align: left;
    -webkit-box-align: center;
        -ms-flex-align: center;
}
.sec05-item:nth-child(2) {
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
    margin-top: 6rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
}
.sec05-img {
        flex-shrink: 0;
    -ms-flex-negative: 0;
}
.sec05-text {
            flex-grow: 1;
    padding-left: 1.4rem;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
}
.sec05-item:nth-child(2) .sec05-text {
    padding-left: 4rem;
}
.sec05-text strong {
    display: block;
    margin-bottom: 1rem;
    font-size: 2.5rem;
    color: #b8c5ff;
    letter-spacing: -0.05em;
    line-height: 3.3rem;
}
.sec05-list li {
    display: table;
}
.sec05-list li span::before {
    margin-right: 4px;
    content: "·";
}
.sec05-list li span,
.sec05-list li p {
    display: table-cell;
    min-width: 7.8rem;
    font-size: 1.6rem;
    letter-spacing: -0.05em;
}
.sec05-list li span {
    font-weight: 500;
}



/* 이웃 / 구독 이벤트 */
.sec-event.sec-box { position: relative; z-index: 0; padding-top: 7rem; padding-bottom: 8rem; }
.sec-event::before { position: absolute; top: -9rem; left: 0; z-index: -3; width: 100%; height: calc(100% + 10rem); background: url(../images/sec-event-bg.png) no-repeat center / cover; content: ""; }
.sec-event::after { position: absolute; top: 15rem; left: 1rem; z-index: -2; max-width: 110%; width: 98rem; height: 51.4rem; background: url(../images/event-confetti.png) no-repeat center / contain; content: ""; }
.sec-event.sec-box h3 { padding-right: 9rem; }
.sec-event .arrow-link { opacity: .5; border-bottom: 1px solid #fff; }
.sec-event .arrow-link::before { background-color: #fff; }
.sec-event .event-obj.obj01 { position: absolute; position: absolute; top: 27rem; left: 0; z-index: -1; width: 20.1rem; height: 17.8rem; background: url(../images/event-obj01.png) no-repeat center / contain; content: ""; }
.sec-event .event-obj.obj02 { position: absolute; position: absolute; top: 21rem; right: 0; z-index: 1; width: 15.2rem; height: 21.2rem; background: url(../images/event-obj02.png) no-repeat center / contain; content: ""; }
.sec-event .event-title-wrap { margin-top: 5rem; text-align: center; }
.sec-event .event-title-wrap .event-main-title { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin: 1rem 0 2.4rem; }
.sec-event .event-title-wrap .event-main-title img { margin: .8rem .6rem; }
.sec-event .event-con { position: relative; padding: 1.4rem 3.6rem; padding-right: 5rem; margin: 3.2rem 2rem 0; border-radius: 4rem; background-color: #fff; }
.sec-event .event-con::before,
.sec-event .event-con::after { position: absolute; top: 50%; transform: translateY(-50%); content: ""; }
.sec-event .event-con::before { left: 1.2rem; width: 1.2rem; height: 5.6rem; background: url(../images/event-tablet-top.png) no-repeat center / contain; }
.sec-event .event-con::after { right: 1rem; width: 3rem; height: 3rem; border-radius: 50%; background: #eef0ff; }
.sec-event .event-con>div { position: relative; padding: .6rem 3.2rem 3rem; border: 1px solid #dfdfe3; border-radius: 4rem; background-color: #f7f7f7; }
.sec-event .event-con>div::before { position: absolute; bottom: -12rem; left: -9rem; width: 22.8rem; height: 26.3rem; background: url(../images/event-people01.png) no-repeat center / contain; content: ""; }
.sec-event .event-con>div::after { position: absolute; bottom: -9rem; right: -10rem; width: 23rem; height: 27.2rem; background: url(../images/event-people02.png) no-repeat center / contain; content: ""; }
.sec-event .event-con .event-con-item { display: flex; padding: 2rem 0; }
.sec-event .event-con .event-con-item:first-of-type { border-bottom: 2px dashed #cfcfcf; }
.sec-event .event-con .event-con-item>a { display: flex; justify-content: center; align-items: center; flex-shrink: 0; width: 12rem; padding: 2.6rem 2rem; margin-right: 2.4rem; border-radius: 2rem 2rem 0 2rem; color: #fff; text-align: center; }
.sec-event .event-con .event-con-item:first-of-type>a { background-color: #49a72d; }
.sec-event .event-con .event-con-item:last-of-type>a { background-color: #e96168; }
.sec-event .event-con .event-con-item>a p { margin-bottom: 1.4rem; font-family: 'Gmarket Sans'; font-size: 2rem; font-weight: 700; letter-spacing: -0.075em; line-height: 2.4rem; }
.sec-event .event-con .event-con-item>a span { display: block; position: relative; padding-right: 2.4rem; font-family: 'Gmarket Sans'; font-size: 1.3rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1; }
.sec-event .event-con .event-con-item>a span::before { position: absolute; top: 40%; right: 0; transform: translateY(-50%); width: 2rem; height: .8rem; background: url(../images/event-link-arrow.png) no-repeat center / contain; content: ""; }
.sec-event .event-con .event-con-item>div { display: flex; align-items: center; }
.sec-event .event-con .event-con-item ul li { display: flex; }
.sec-event .event-con .event-con-item ul li>span { display: inline-block; flex-shrink: 0; position: relative; width: 8.6rem; font-size: 1.6rem; font-weight: 700; }
.sec-event .event-con .event-con-item ul li>span::before { position: absolute; top: .6rem; right: 0; width: 1px; height: 1.6rem; background-color: #d2d2d2; content: ""; }
.sec-event .event-con .event-con-item ul li>p { padding-left: 1.6rem; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.05em; line-height: 2.6rem; }
.sec-event .event-con .event-con-item ul li>p strong { display: block; position: relative; opacity: .8; padding-left: 1.6rem; font-size: 1.4rem; font-weight: 400; line-height: 2rem;}
.sec-event .event-con .event-con-item ul li>p strong:last-child { margin-bottom: .4rem; }
.sec-event .event-con .event-con-item ul li>p strong::before { position: absolute; top: 0; left: 0; content: "※"; }
.sec-event .event-con>div>p { padding-left: 8rem; padding-right: 6rem; margin-top: .6rem; font-size: 1.8rem; font-weight: 500; color: #077a7c; letter-spacing: -0.075em; line-height: 2.5rem; text-align: center; }
.sec-event .event-con>div>p .icon { display: inline-block; margin-left: 4px; vertical-align: 2px; }

.sec-event.sub { width: calc(100% + 8rem); padding: 3rem 3rem 12rem; margin-left: -4rem; background-color: #099fa1; }
.sec-event.sub::before { display: none; }
.sec-event.sub h3 { padding-right: 0; }


@media (max-width: 790px) {
    .sec-event .event-obj.obj01 { top: 33rem; }
    .sec-event .event-obj.obj02 { top: 27rem; }
    .sec-event .event-title-wrap .event-main-title img { margin: 0.8rem 100%; }
    .sec-event .event-con .event-con-item { flex-direction: column-reverse; }
    .sec-event .event-con .event-con-item>a { width: 100%; padding: 1.4rem 2rem; margin-top: 1.4rem; margin-right: 0; }
    .sec-event .event-con .event-con-item>a p { margin-bottom: .8rem; }
    .sec-event .event-con .event-con-item>a p br { display: none; }
}

@media (max-width: 768px) {
    .sec-event.sub { width: calc(100% + 4rem); margin-left: -2rem; }
}

@media (max-width: 640px) {
    .sec-event::after,
    .sec-event .event-con>div::before,
    .sec-event .event-con>div::after,
    .sec-event .event-obj { display: none; }

    .sec-event .event-con { padding: 3.6rem 1.4rem 5rem; }
    .sec-event .event-con::before { top: -1rem; left: 50%; transform: translateY(0) translateX(-50%) rotate(90deg); }
    .sec-event .event-con::after { top: auto; bottom: 1.2rem; right: 50%; transform: translateY(0) translateX(50%); }
    .sec-event .arrow-link { width: 5.4rem; }
    .sec-event .arrow-link:hover { width: 7.4rem; }
    .sec-event .event-con>div>p { padding: 0; }
    .sec-event .event-con { margin: 3.2rem 0; }

    .sec-event.sub { padding: 3rem 3rem !important; }
}

@media (max-width: 540px) {
    .sec-event::before { top: -13rem; height: calc(100% + 12rem); }
    .sec-event.sec-box { padding-top: 0; }
    .sec-event .arrow-link { top: 0; }
}

@media (max-width: 480px) {
    .sec-event .event-con>div { padding: .6rem 2.4rem 3rem; }
    .sec-event .event-con .event-con-item ul li { display: block; margin-bottom: .4rem; }
    .sec-event .event-con .event-con-item ul li:last-child { margin-bottom: 0; }
    .sec-event .event-con .event-con-item ul li>p { padding-left: 0; }
}