@charset "utf-8";
/*
@font-face {
  font-family: '210Omnigothic';
  src: url('/fonts/210_omnigothic.woff2') format('woff2'),
       url('/fonts/210_omnigothic.woff') format('woff'),
       url('/fonts/210_omnigothic.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}*/
@font-face {
  font-family: "OngleleafRadioBallpen";
  src: url("https://cdn.jsdelivr.net/gh/wefonts/OngleleafRadioBallpen/OngleleafRadioBallpen.woff2") format("woff2"),
       url("https://cdn.jsdelivr.net/gh/wefonts/OngleleafRadioBallpen/OngleleafRadioBallpen.woff") format("woff"),
       url("https://cdn.jsdelivr.net/gh/wefonts/OngleleafRadioBallpen/OngleleafRadioBallpen.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}


@font-face {
    font-family: 'SpoqaHanSansNeo';
    font-weight: 400;
    src: url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoR.woff2") format("woff2"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoR.woff") format("woff"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoR.ttf") format("truetype");
}

@font-face {
    font-family: "SpoqaHanSansNeo";
    font-weight: 500;
    src: url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoM.woff2") format("woff2"),
    url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoM.woff") format("woff"),
    url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoM.ttf") format("truetype");
}

@font-face {
    font-family: "SpoqaHanSansNeo";
    font-weight: 700;
    src: url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoB.woff2") format("woff2"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoB.woff") format("woff"),
        url("/assets/common/fonts/spoqahan-sans-neo/SpoqaHanSansNeoB.ttf") format("truetype");
}
/*
@font-face {
     font-family: 'SeoulHangangM';
     src: url('https://cdn.jsdelivr.net/gh/fontbee/font@main/Seoul/SeoulHangangM.woff') format('woff');
     font-weight: normal;
     font-style: normal;
}*/
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 700;
  src: url('https://fonts.gstatic.com/s/oswald/v53/TK3iWkUHHAIjg752FD8GhehCUOGz7vYGh680lGh-uXM.woff2') format('woff2');
}
/*********reset*********/
* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html, body {font-family: 'ONE-Mobile-Regular'; font-size:16px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; line-height:normal; color:#222; overflow-x: hidden; background: #fff;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-use-select: none;
  user-select: none;
}
body {overflow-x:auto;}
body, input, textarea, select, button, table{font-size:1rem; letter-spacing:-0.05em}
a, button, select{cursor:pointer}
iframe{border:0;margin:0;padding:0;}

/*********공통*********/
input, textarea, select{outline: none;}
/*input*/
input { height:48px;padding: 12px 16px; box-sizing: border-box; border:none; font-size: 1rem; font-weight:500;color:#888; background:none ; }
input::placeholder{color: #888 !important}
input::-webkit-input-placeholder{color: #888 !important}
input::-moz-placeholder {color: #888 !important}
input:-ms-input-placeholder { color: #888  !important}

/*textarea*/
textarea{padding: 12px 16px; box-sizing: border-box; background: none; border:1px solid #CBCFD2; border-radius:6px; line-height:1.5;color: #888; }

/*select*/
.select select{ width:201px;padding: 12px 16px;height: 48px; border: 1px solid #CBCFD2;border-radius: 6px; color: #888;font-weight:500; appearance: none; -webkit-appearance: none;-moz-appearance: none;background: url('/webPub/hereIAm/img/ico_select.png') no-repeat right 12px center;background-size:24px; padding-right:12px }

/*checkbox*/
.checkbox {
    display: inline-block;
    position: relative;
    padding-left: 28px;
    min-height: 20px;
    font-weight: 500;
    color:#000;
}
.checkbox input[type=checkbox], .checkbox input[type=radio] {
    position: absolute;
    top: 0;
    right: 0;
    width: 20px;
    height: 20px;
    opacity: 0;
}
.checkbox .chk{
    display: block;
    position: absolute;
    top: 1px;
    left: 0;
    width: 20px;
    height: 20px;
    background: url('/webPub/hereIAm/img/checkbox-round_off.png') no-repeat;
    background-size:20px
}
.checkbox input[type=checkbox]:checked ~ .chk, .checkbox input[type=radio]:checked ~ .chk {
    background: url('/webPub/hereIAm/img/checkbox-round_on.png') no-repeat;
    background-size:20px
}

.rel{position:relative}
/*font*/
.thin {font-weight: 100;}
.light {font-weight: 300;}
.reg {font-weight: 400;}
.md {font-weight: 500;}
.bold {font-weight: 600;}
.semi {font-weight: 700;}
.extra {font-weight: 800;}
.black {font-weight: 900;}
.fff {color: #fff;}
.red {color: #DA291C;}

/*= TYPOGRAPY =*/
.txt-h01 {font-size:90px;}
.txt-h02 {font-size:70px;}
.txt-body01 {font-size:40px;font-weight:300;}
.txt-body02 {font-size:26px;font-weight:300;}
.txt-body03 {font-size:20px;font-weight:300;}
.txt-caption01 {font-size:16px;font-weight:300;}
.bold {font-weight:700!important;}


.flex {display: flex; align-items: center;}


/* 프로모션 외부 공통 */
#footer {background: #fffbf7; border-top: 2px solid #ed425a;}
#footer .inner {width: 1000px; margin: 0 auto; position: relative; min-height: 72px; padding-top: 22px;}
/* white-gnb */
.emergency_relief_cnts_top { height: 30px; }
.emergency_relief_cnts_top {height: 30px; background:#fff; border-bottom-color: #dadada;}
.emergency_relief_cnts_top ul.util_right .save_user {color: #7f7f7f; font-size: 12px; line-height: 19px;}
.emergency_relief_cnts_top ul.util_right .save_user strong {color: #7f7f7f;}
.emergency_relief_cnts_top ul.util_right li a{color:#7f7f7f;}
.CampaignList ul {padding: 6px 14px !important;}
.CampaignList ul li {margin-bottom: 7px;}

/*버튼*/
.popBtn{margin:40px 0; text-align:center; display:flex; align-items: center;justify-content: center; gap:10px}
.btn-big{
    min-width:210px;
    display: inline-block;
    height: 60px;
    line-height: 60px;
    font-weight: 700;
    color: #fff !important;
    letter-spacing: -0.01em;
    border-radius:6px;
    font-size:1.125rem;
    box-sizing: border-box;
    background:#555;
}
.btn-point{ background: #DA291C !important;  color: #fff; }
.btn-detail{ height:34px;padding:4px 12px;margin-left:14px; display: inline-flex;box-sizing: border-box;align-items: center; background:#fff; border:1px solid #CBCFD2;border-radius:17px; font-size:0.875rem;letter-spacing: 0; }

/*플로팅 버튼*/
.floating-box {position:fixed;bottom:0;width:100%;max-width:1920px;min-width:1250px;margin:0 auto;z-index:20;opacity:0;transition:all linear 0.3s;}
.floating-box:not(.show) {pointer-events:none;}
.floating-box.show {opacity:1;}
.floating-box.on {bottom:0;}
.floating-box .box-inner {position:absolute;right:40px;bottom:63px;}
.floating-box .btn__go-form {display:block;width:188px;height:183px;border-radius: 20px 20px 0 0; ;background:rgba(0, 0, 0, .8);/*transform-origin: center bottom;animation:swing 10s infinite;*/}
.floating-box .btn__go-form a {display:flex;flex-direction:column; align-items: center; justify-content: space-between; height:100%; padding-top:20px; text-align:center; font-size:0}
.floating-box .btn__go-form a .txt-sign{content: "";
    display: block;
    width: 107px;
    height: 28px;
    background: url(/webPub/hereIAm/img/txt_sign.png) no-repeat center;
    font-size:0
}
.floating-box .candle{content:'';display:block;width:20px;height:83px; background:url('/webPub/hereIAm/img/img_candle.png')}
.floating-box .flame {
    position: absolute;
    top: 60px;
    left: 94px;
    width: 57px;
    height: 39px;
    background: url(/webPub/hereIAm/img/img_fire.png);
    background-size:cover;
    border-radius: 50% 50% 50% 50%;
    opacity: 0.9;
    animation: flicker 6s infinite ease-in-out alternate;
    transform:scale(0.8);
}

@keyframes flicker {
  0% {
    transform: translateX(-50%) scale(1) rotate(0deg);
    opacity: 0.9;
  }
  25% {
    transform: translateX(-56%) scale(1.05) rotate(-5deg);
    opacity: 1;
  }
  50% {
    transform: translateX(-44%) scale(0.95) rotate(5deg);
    opacity: 0.8;
  }
  75% {
    transform: translateX(-54%) scale(1.03) rotate(-4deg);
    opacity: 1;
  }
  100% {
    transform: translateX(-46%) scale(1) rotate(4deg);
    opacity: 0.85;
  }
}

/*
.floating-box .txt-sign {flex:1 0 auto;display:flex;flex-direction:column;justify-content:center;padding-bottom:15px;font-size:40px;font-weight:700;color:#fff;}*/
.txt-hover {overflow:hidden;display:block;height:0;border-top:1px solid transparent;color:#fff;line-height:1.25;transition:all ease-in-out 1s;}
.txt-hover b {font-size:30px;font-weight:700;}
.floating-box .btn__go-form:hover .txt-sign::before {margin-bottom:8px;}
.floating-box .btn__go-form:hover .txt-hover {height:82px;padding-top:18px;border-color:#fff;}
.floating-box .btn-area {position:relative; width:188px; height:60px; display:flex;justify-content:center;background:url('/webPub/hereIAm/img/btn_floating.png')}

.floating-box .btn-fix_black.top {position:absolute; top:0; left:0; width:50%; height:100%; font-size:0 }
.floating-box .btn-fix_black.share {position:absolute; top:0; right:0; width:50%; height:100%;font-size:0}

/*share-popup*/
.share-popup {display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:99999;}
.share-popup .popBg {position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);}
.share-popup__inner {position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;min-height:298px;background:#fff;padding:13px 40px;}
.share-popup__header {display:flex;justify-content:space-between;align-items:center;width:100%;height:67px;border-bottom:1px solid #000;}
.share-popup__header .tit {max-width:calc(100% - 40px);font-size:20px;color:#000;font-weight:bold;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.share-popup__header .poup-close {flex:0 0 20px;display:block;width:20px;height:20px;text-indent:-9999px;font-size:0px;background:url('/webPub/sc_2025/sign4cdr/images/ico-share/ico-close.png')no-repeat center / cover;}
.share-popup__list {display:flex;justify-content:space-between;padding:50px 0 35px;}
.share-popup__list .share-btn {flex:0 0 87px;display:block;width:87px;}
.share-popup__list .share-btn p {font-size:16px;color:#000;font-weight:bold;text-align:center;}
.share-popup__list .share-btn p::before {content:'';display: block;width:87px;height:87px;margin-bottom:18px;background-size:cover;background-repeat:no-repeat;background-position:center;}
.share-popup__list .share-btn.kakao p::before {background-image:url('/webPub/sc_2025/sign4cdr/images/ico-share/share-kakao.png');}
.share-popup__list .share-btn.facebook p::before {background-image:url('/webPub/sc_2025/sign4cdr/images/ico-share/share-facebook.png');}
.share-popup__list .share-btn.twitter-x p::before {background-image:url('/webPub/sc_2025/sign4cdr/images/ico-share/share-twitter-x.png');}
.share-popup__list .share-btn.naver-blog p::before {background-image:url('/webPub/sc_2025/sign4cdr/images/ico-share/share-naver-blog.png');}
.share-popup__list .share-btn.url-copy p::before {background-image:url('/webPub/sc_2025/sign4cdr/images/ico-share/share-url-copy.png');}



/*********** 캠페인메인페이지 ***********/
#wrap {
    margin: 0 auto;
    max-width: 1920px;
    min-width: 1440px;
    overflow: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-smooth: never;
     letter-spacing:-0.05em
}

.section{ width:100%;margin-inline:auto;}
.sec-inner {width:1250px;  margin: 0 auto; position:relative}
/*
.section .red-bar {position:absolute;display:block;height:23px;background:#da291c;}
.section .bar-txt {position:relative;z-index:10;}
.section .bar-box {position:relative;display:inline-block;}
.section .bar-box .red-bar {left:0;bottom:0;width:100%;}
*/
/*= sec1 =*/
#section1 {height:782px;background:url('/webPub/hereIAm/img/bg-section01.jpg')no-repeat top / cover;}
#section1 .sec-inner {position:relative;padding-top:62px;padding-left:12px;}
#section1 .txt-01{ position:relative; font-size:1.5rem; color:#fff; font-weight: 600;}
#section1 p.txt-01{    width: fit-content;}
#section1 .txt-01 span:not(.bar){position:relative; z-index:2}
#section1 .txt-01 .bar.red{top: 2px;bottom:auto;left:-4px; width:0px; height:34px; background:#da291c;will-change: width; animation: expandWidth 1.3s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;animation-delay: 1.5s;}

@keyframes expandWidth {
  from {
    width: 0;
  }
  to {
    width: calc(100% + 8px);
  }
}
#section1 .tit-01{margin-top:30px;}
#section1 .tit-02{margin-top:45px;font-size:53px;}
#section1 .txt-02{ font-family: "Noto Sans KR"; color:#000;font-size:1.25rem; line-height: 1.7;}
#section1 .txt-point{color:#fff; position:relative;z-index:10;}
#section1 .bar {position:absolute;display:block; left:-2px; bottom:0;width:calc(100% + 4px);height:26px;background:#000}
.swift-i {
  display: inline-block;
  opacity: 0;
  transform: translateY(50px);
  animation: fadeUp .5s ease-out forwards;
  font-style: normal;
}

@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/** section2 ********************/
#section2{ margin-top:-26px;padding-top:136px; text-align:center; height:805px;background:url('/webPub/hereIAm/img/bg-section02.png')no-repeat top / cover;}

/** section3 ********************/
#section3{ z-index: 1; position: relative; background:#dfdfdf; text-align: center;     }

#section3 .top-box{ position:relative; opacity: 0;padding-top:20px; font-size:1.375rem    }
#section3 .tit-01{position:relative; opacity: 1; margin-top:36px;}
#section3 .tit-01 img{display:block; margin: 0 auto; position:relative; z-index:3}
#section3 .red-bar{ z-index: 1; position:absolute; top:235px; left:285px; width:360px; height:62px;     }
#section3 .red-bar span{ position:absolute; top:0; left:0; width:0; height:100%; overflow: hidden;     }
#section3 .red-bar span:after{ content:""; position:absolute; top:0; left:0; width:360px; height:100%; background: #da291c;}
#section3 .txt-box{opacity: 0}
#section3 .txt-box p.txt-01{  margin-top:50px; font-family: "Noto Sans KR"; color:#333;font-size:1.375rem}

#section3 .bottom-box{ position:relative; margin-top:70px ; padding-bottom:10px; min-height:1160px;opacity:0}
#section3 .tab-buttons{ display:flex; justify-content:space-between;}
#section3 .tab-btn span{ color:#777; font-family: "Noto Sans KR";  font-size:1.625rem ; font-weight:bold; letter-spacing:-0.025em}
#section3 .tab-btn span:before{ content:""; display:block; margin: 0 auto 15px; width:75px; height:75px; border-radius:37.5px }
#section3 .tab-btn:nth-child(1) span:before{ background-color:#777 ;  background-image:url('/webPub/hereIAm/img/tab01.png') }
#section3 .tab-btn:nth-child(2) span:before{ background-color:#777 ;  background-image:url('/webPub/hereIAm/img/tab02.png') }
#section3 .tab-btn:nth-child(3) span:before{ background-color:#777 ;  background-image:url('/webPub/hereIAm/img/tab03.png') }
#section3 .tab-btn:nth-child(4) span:before{ background-color:#777 ;  background-image:url('/webPub/hereIAm/img/tab04.png') }
#section3 .tab-btn:nth-child(5) span:before{ background-color:#777 ;  background-image:url('/webPub/hereIAm/img/tab05.png') }
#section3 .tab-btn.active span{color:#333}
#section3 .tab-btn.active span:before{background-color:#da291c ;}

#section3 .tab-content:before{content:"";position:absolute;top:160px; left:-200px; display:block; width:832px; height:974px; background:url('/webPub/hereIAm/img/img_envelope.png') ;}
#section3 .letter-content:before{content:"";position:absolute;z-index:9; top:76px; right:10px; display:block; width:234px; height:367px; background:url('/webPub/hereIAm/img/img_pen.png') ;}

#section3 .letter-content-wrap{ position:relative; background:url('/webPub/hereIAm/img/img_letter_bot.png') no-repeat  center bottom}
#section3 .letter-content{ position: relative; margin:150px auto 0 ;max-height: calc(1.5em * 6);overflow: hidden; min-height:500px;letter-spacing: -0.025em; font-size:1.5rem; line-height: 1.5em;transition: max-height 0.3s ease;color:#333; white-space: pre-line; font-family: "OngleleafRadioBallpen", sans-serif;; }
#section3 .letter-content.expanded { max-height:fit-content;transition: max-height 0.3s ease;}
#section3 .letter-content p{ padding:50px 0 30px; font-size:3rem;  color:#922900 ; font-family: "OngleleafRadioBallpen", sans-serif;}
#section3 .letter-content p:after{content:"";position:absolute;top:0 ; right:139px; width:93px; height:330px; background:url('/webPub/hereIAm/img/img_letter_top_point.png') no-repeat right 0 }
#section3 .letter-bot{  position: relative; padding-bottom:120px  }
#section3 .dim-wh{position:absolute; bottom:0px;left: 146px;display: block;width: 930px;height:100px; border-radius: 0 0 90px;
    background:
        linear-gradient(to right,
        transparent 0%,
        transparent calc(100% - 200px),
        rgba(229, 229, 229, 1) 100%),  /* 우측 30px 그라데이션 */
      #eaeaea; /* 기본 배경 */

    /* mask: 상단과 좌우 처리 (좌측은 완전 투명, 우측은 일부만 mask로 투명) */
    -webkit-mask-image:
      linear-gradient(to right,
        transparent 0px,
        black 30px,
        black calc(100% - 70px),
        transparent 100%),
      linear-gradient(to bottom,
        transparent 0px,
        black 90px,
        black 100%);
    mask-image:
      linear-gradient(to right,
        transparent 0px,
        black 30px,
        black calc(100% - 30px),
        transparent 100%),
      linear-gradient(to bottom,
        transparent 0px,
        black 90px,
        black 100%);

    -webkit-mask-composite: intersect;
    mask-composite: intersect;

    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
}
#section3 .toggle-btn{position:relative; width:230px; height:60px;margin: 0 auto; display: flex ; align-items:center; gap:8px; justify-content: center; border-radius:10px; background:#777; color:#fff; font-family: "Noto Sans KR"; font-size:1.25rem}
#section3 .toggle-btn:after{content:''; transform:rotate(180deg); margin-top: 4px; display:block; width:17px; height:11px; background: url(/webPub/hereIAm/img/ico_arrow_up.png) no-repeat center;}
#section3 .toggle-btn.on:after{transform:rotate(0);transition: ease-out .35s;}

#section3 .tab-content { display: none; }
#section3 .tab-content.active { display: block;}
#section3 .txt-s{margin-top:172px}
#section3 .t_point{color:#922900}


/** section4 ********************/
#section4{ z-index: 1; position: relative; height:557px; background: url(/webPub/hereIAm/img/bg_section4.png) no-repeat  top / cover;; }
#section4 .div_sign{text-align:center; padding-top:160px}
#section4 .txt-01{  margin-top:30px; font-family: "Noto Sans KR"; color:#000; font-size:1.5rem; font-weight:400}

#section4 .btn{ margin:40px auto;display: flex;align-items: center;justify-content: center;gap:10px; width:430px; height:92px; border-radius:10px; font-size:0; }
#section4 .btn:before{ content:""; display:block;  width:37px; height:38px; background:url('/webPub/hereIAm/img/icon_sign.png') no-repeat  center}
#section4 .btn:after{ content:""; display:block;  width:107px; height:28px;  background:url('/webPub/hereIAm/img/txt_sign.png') no-repeat  center}
/** section5 ********************/
#section5 {  background:#333}
#section5 .div_signlist{width:1250px;  position:relative ; margin: 0 auto;padding-bottom:100px; text-align:left; color:#fff}

#section5 .top-box{ position:relative; opacity: 0;padding-top:20px; font-size:1.375rem    }
#section5 .txt-01 + .txt-01{position:relative; opacity: 1; margin-top:30px;}
#section5 .txt-01 img{display:block;position:relative; z-index:3}
#section5 .red-bar{ z-index: 1; position:absolute; top:142px; left:1px; width:310px; height:62px;     }
#section5 .red-bar span{ position:absolute; top:0; left:0; width:0; height:100%; overflow: hidden;     }
#section5 .red-bar span:after{ content:""; position:absolute; top:0; left:0; width:360px; height:100%; background: #da291c;}
.stamp {
position:absolute; top:108px; right:194px;
  opacity: 0;
  transform: scale(0.2);
  transition: transform 0.3s ease;
  display: inline-block;
  width: 105px; /* 원하는 크기 */
  height: auto;
  margin: 10px;
}
.stamp2 {
position:absolute; top:70px; right:70px;
  opacity: 0;
  transform: scale(0.2);
  transition: transform 0.3s ease;
  display: inline-block;
  width: 7; /* 원하는 크기 */
  height: auto;
  margin: 10px;
}
#section5 .txt-02{position:relative; opacity: 1; margin-top:50px; color:#d0d0d0; font-size:1.25rem}
/*서명의견 리스트*/
#commentListContainer{margin-top:60px;}
#commentListContainer >div{position:relative; display: flex ; flex-direction: column-reverse; gap: 10px; padding:37px 146px; background:#fff; color:#333; font-weight:300; font-size:1.25rem}
#commentListContainer >div + div{margin-top:20px;}
#commentListContainer >div:before{content:""; position:absolute; left:51px; top:42px; display:block;  width:56px; height:43px; background:url('/webPub/hereIAm/img/img_quotation_l.png') no-repeat  center}
#commentListContainer >div:after{content:"";position:absolute; right:51px;bottom:41px; display:block;  width:56px; height:43px; background:url('/webPub/hereIAm/img/img_quotation_r.png') no-repeat  center}
#commentListContainer >div div:nth-child(1){font-size:1rem; color:#777; letter-spacing:0; font-size:1.125rem}
.txt-writer{ display: flex;align-items: center;font-size:1rem; color:#777; letter-spacing:0;  font-size:1.125rem}
.txt-writer .bar{ display: inline-flex ; width: 2px;  height: 13px; background: #cbc9c8; margin: 0 15px;}
/*서명의견 pagination*/
.paginationContainer {display: flex ;align-items: center;justify-content: center;margin-top: 45px; gap:5px;}
.paginationContainer button{ width:38px; height:38px; color:#fff ; font-weight:700; font-family: "Noto Sans KR"; }
.paginationContainer button:disabled{ background:#fff; color:#000; border-radius:19px}
.paginationContainer .first, .paginationContainer .prev, .paginationContainer .next, .paginationContainer .last{font-size:0;}
.paginationContainer button.first{ position:relative; background:url('/webPub/hereIAm/img/ico_arrow_wh.png') no-repeat; background-position: calc(50% - 3px) center;}
.paginationContainer button.first:before{content:""; width:38px; height:38px; position:absolute; left:0; top:0; background:url('/webPub/hereIAm/img/ico_arrow_wh.png') no-repeat ; background-position: calc(50% + 3px) center; }
.paginationContainer button.prev{ background:url('/webPub/hereIAm/img/ico_arrow_wh.png') no-repeat center}
.paginationContainer button.next{ transform:rotate(180deg); font-size:0; background:url('/webPub/hereIAm/img/ico_arrow_wh.png') no-repeat center}
.paginationContainer button.last{ transform:rotate(180deg); font-size:0; background:url('/webPub/hereIAm/img/ico_arrow_wh.png') no-repeat ; background-position: calc(50% - 6px) center;}
.paginationContainer button.last:before{ content:""; width:38px; height:38px; position:absolute; left:0; top:0; background:url('/webPub/hereIAm/img/ico_arrow_wh.png') no-repeat  center; }
.paginationContainer button:not([class]) {
    margin:0 4.5px;
}

#section6{background:#f3f3f3}
#section6 .div_qna{width:1250px;  margin:0 auto; padding:97px 0 60px; position:relative ; text-align:left; color:#fff}
#section6 .list{ margin-top:40px;box-shadow: 1px 1px 5px 3px rgba(164, 164, 164, 0.66); border-radius:10px; overflow:hidden}
.question{  display: flex;align-items: flex-start;gap: 17px;  padding:25px 0 25px 39px; background:#fff; color:#333 ;font-size:1.25rem; cursor:pointer}
.question:before{ content:""; display:inline-flex; flex-shrink: 0;  width:21px; height:18px;margin-top: 7px; background:url('/webPub/hereIAm/img/txt_q.png') no-repeat }
.toggle-qna {
    position: absolute;
    right:42px;
    display: inline-block;
    width: 60px;
    height: 28px;
}
.toggle-qna .slider {
    position: absolute;
    cursor: pointer;
    inset: 0px;
    background-color: rgb(241, 244, 246);
    transition: all 0.4s ease 0s;
    border-radius: 34px;
}
.toggle-qna .slider::before {
    position: absolute;
    content: "";
    width: 22px;
    height: 22px;
    left: 2px;
    bottom: 3px;
    background-color: white;
    transition: all 0.4s ease 0s;
    border-radius: 50%;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 4px 0px;
}
.item.open .toggle-qna .slider { background-color: #da291c;}
.item.open .toggle-qna .slider::before { transform: translateX(33px);}
.answer{display: flex;align-items: flex-start;gap: 17px;padding:25px 50px 25px 39px; background:#ececec; color:#333 ;font-size:1.25rem; line-height:1.7}
.answer:before{ content:""; display:inline-flex;flex-shrink: 0;  width:21px; height:18px;margin-top: 7px; background:url('/webPub/hereIAm/img/txt_a.png') no-repeat }

.txt-s{color:#bcb8b8; font-size:0.875rem}

/*********** 팝업공통 ***********/
.popupWrap_new{display:none;position:fixed;top:0;left:0;overflow-y: scroll;width:100%;height:100%;z-index:99999;line-height:1.5;letter-spacing: -0.02em ; color:#333 }
.popupWrap_new .popup *{ font-family:SpoqaHanSansNeo;}
.popupWrap_new .popBg{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);}
.popupWrap_new .popup{width:640px; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); background:#fff; border-radius: 4px;font-size:1rem;}
.popupWrap_new .popup_top{ position:relative; width:100%; border:none ; padding:40px; box-sizing: border-box;}
.popupWrap_new .closeBtn{position: absolute;top:45px;right: 40px;margin: auto;width: 18px;height: 18px;background: url(/webPub/hereIAm/img/ico_pop_close.png);background-size: 18px;}
.popupWrap_new .title_area01{ font-size: 1.375rem; font-weight: 700 ; }
.required{color:#DA291C; font-weight:normal}
.txt-st01{margin-top:40px; color:#999; text-align:center}


/***서명하기 팝업***/
.popupWrap  .title_area01{  letter-spacing:0 !important }
.popupWrap .txt-st01{ color:#999; font-size:0.875rem;}
/*사용자 정보 입력*/
.petition-sign__input {margin:0 40px 40px;}
.petition-sign__input li{position:relative}
.petition-sign__input li + li {margin-top:40px;}
.petition-sign__input li::after {content:'';visibility:hidden;display:block;clear:both;}
.petition-sign__input .th {position:relative; font-weight:500;line-height:1.5;}
.petition-sign__input .th:after{content:''; display:inline-flex;width:4px; height:4px;margin-top: 2px; margin-left: 4px; vertical-align: text-top;border-radius:2px; background:#DA291C; }
.petition-sign__input .td {margin-top:8px; width:560px !important; max-width:100%}
/*사용자 정보 입력-input*/
.petition-sign__input .td input {width: 100%;max-width:100%; }
.petition-sign__input .td input::placeholder{color: #888 !important}
.petition-sign__input .td input::-webkit-input-placeholder{color: #888 !important}
.petition-sign__input .td input::-moz-placeholder {color: #888 !important}
.petition-sign__input .td input:-ms-input-placeholder { color: #888  !important}
.petition-sign__input .input-name input { border:1px solid #CBCFD2; border-radius:6px; }
.petition-sign__input .input-email{position:relative ; border:none !important}
.petition-sign__input .input-email:before{content:'';  display:block; position:absolute; top:0; left:0; width: 352px; height:48px; box-sizing: border-box; border:1px solid #CBCFD2; border-radius:6px}
.petition-sign__input .input-email input{width:166px;position:relative}
.petition-sign__input .select {position:absolute; right:0; top:0px;}
/*의견남기기*/
.petition-sign__input .th:has(span){ display: flex;justify-content: space-between;}
.petition-sign__input .th:has(span):after{display:none}
.petition-sign__input .th span{ font-size: 0.875rem; font-weight:400; color:#777 }
.petition-sign__input .input-comment textarea { width:560px; height: 139px;}
.petition-sign-table-name-p {width:100%;margin-top:10px;color:#DA291C;text-align:left;}
/*사용자 정보 입력-전체동의*/
.petition-sign__agree{background:#FAFAFA; padding:40px; border-radius: 0 0 4px 4px}
.agree-list-wrap + .btn-big{margin-top:40px; width:100%}
.agree-list-wrap  label{cursor: pointer;}
.agree-list li{margin:15px 0 0 28px;}
.agree-list li:has(.btn-detail) .checkbox { vertical-align: -1px;}

/***약관동의 팝업***/
.popupWrapAgm .popup_top{padding-top:80px ; text-align:center}
.popupWrapAgm .popup_top .title_area01{ font-size:1rem; font-weight:500}
.popupWrapAgm .popup_top .title_area02{ font-size:1.75rem; font-weight:700; letter-spacing:0 !important}
/*약관정보*/
.term_box{margin:0 40px; padding:20px 24px; background:#F5F5F5}
.term_list{position:relative; padding-left:12px; font-weight:500 }
.term_list strong{font-weight:700}
.term_list + .term_list{margin-top:8px}
.term_list:before{content:''; position:absolute; top :10px; left:0; width:4px; height:4px; background:#555555; border-radius:2px;}
.term_list_dash li{position:relative; padding-left:12px;}
.term_list_dash li:first-child{margin-top:8px}
.term_list_dash li + li{ margin-top:4px}
.term_list_dash li:before{content:''; position:absolute; top :10px; left:0; width:4px; height:1px; background:#555555; }

/***서명완료 팝업***/
.popupWrapComplate .popup_top{padding:80px 40px 10px; text-align:center}
.popupWrapComplate .popup_top .title_area01{ font-size:1.5rem}
.popupWrapComplate .popupComp_middle{padding:0 40px; text-align:center}
.popupWrapComplate .popupComp_middle img{ width:100%; display:block;}

.img_container{width: 560px; /*height: 302px;*/ margin-top:40px; overflow: hidden;}
.img_container img {width: 100%;height: auto; object-fit: cover;display: block; }


/*
.petition-sign__input .input-name input {border:0;}
.input-name .petition-sign__input-name {max-width:100%;}
.petition-sign__input .input-email {max-width:100%;}
.petition-sign__input .input-email:after {right:149px;}
.petition-sign__input .input-email .email1 {width:200px;}
.petition-sign__input .input-email .email3 {width:148px;height:62px;}
.petition-sign__input .input-number {max-width:568px;height:62px;background:#fff;line-height:62px;color:#999;}
.petition-sign__input .input-number input {width:calc(33.3333% - 12px);float:left;height:62px;border:none;text-align:center;}
.petition-sign__input .input-number span {float:left;}
*/
/*********** 공통 ***********/
#sec1, #sec3, #sec4, #sec5, #sec6 {position: relative;}
#sec1::after,
#sec3::after,
#sec4::after,
#sec5::after,
#sec6::after {content: ""; display: block; width: 80px; height: 80px; background: transparent url(/webPub/childrenAct/img/page_bt.svg) no-repeat right center; background-size: 100%; position: absolute; bottom: 12px; right: 0; z-index: 0;}
#sec1::before,
#sec3::before,
#sec4::before,
#sec5::before,
#sec6::before {content: ""; display: block; width: 100%; height: 12px; background: transparent url(/webPub/childrenAct/img/page_line.png) repeat-x center center; background-size: contain; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 1;}
