@charset 'utf-8';
.popup { position: fixed; width: 100%; height: 100vh; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.6); overflow: auto; z-index: 10; }
.popup-area { width: 65.71428rem; font-size: 1.28571rem; position: absolute; top: 7.14285rem; left: 50%; margin-left: -32.85714rem; border-radius: 3.42857rem; overflow: hidden; padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom); }
.popup-area * { word-break: keep-all; word-wrap: break-word; }
.popup-area button, .popup-area a { color: #000; }
.popup-area button > .planet-accordion-title { color: #000; }
.popup-area button.btn-acco > em { color: #000; }
.popup-area .popup-footer .btn-link > span { color: #000; }
.popup-area.tech-area {width: 34.2857rem;}
.popup-area.tech-area {top: 50%; left: 50%; transform: translate(-50%,-50%); margin-left: 0;}
.popup-area.tech-area .popup-body {padding-bottom: 0;}


/* //2023-07-25 Global > Home 페이지 팝업 */
.ir-pm { overflow: hidden; font-size: 0; line-height: 0; text-indent: -9999px; }
.popup-area.tech-area .popup-body .img-area {position: relative;}
.popup-area.tech-area .popup-body .img-area a {position: absolute; top: 59%; left: 50%; transform: translateX(-50%); width: 52%; height: 4.2rem; border-radius: 33px; }
.popup-area.tech-area .popup-body .img-area img {width: 100%; max-width: 100%;vertical-align: top;}
.popup-area.tech-area .btn-wrap {height: 4.28571rem; display: flex; text-align: center; justify-content: center;}
.popup-area.tech-area .btn-wrap button {text-decoration: underline;font-size: 1rem;font-weight: bold;  }
@media screen and (max-width: 535px) {
  .popup-area.tech-area {border-radius: 30px; top: 45%;left: 50%;margin-left: 0;transform: translate(-50%,-50%);width: calc( 100vw - 40px );}
  .popup-area.tech-area .popup-body .img-area a {height: 8%;}
  .popup-area.tech-area .btn-wrap {height: 40px;}
  .popup-area.tech-area .btn-wrap button {font-size: 14px; }
}
/* 2023-07-25 Global > Home 페이지 팝업// */

/*@media screen and ( min-width: 721px ) {*/
/*  .popup-area.on { animation: onPop .2s ease-in both; }*/
/*  .popup-area.off { animation: offPop .2s ease-out both; }*/
/*}*/

/*@keyframes onPop {*/
/*  from { top: calc(100vh + 100px); }*/
/*  to { top: 100px; }*/
/*}*/

/*@keyframes offPop {*/
/*  from { top: 100px; }*/
/*  to { top: calc(100vh + 100px); }*/
/*}*/

.popup-area .go-top { width: 3.42857rem; height: 3.42857rem; background: url("/global/sustainability/assets/img/common/gototop.png") no-repeat 0 0; background-size: contain; position: fixed; right: 50%; margin-right: calc(-32.85714rem + 2.28571rem); bottom: 1.71428rem; z-index: 12; line-height: 1; display: none; }
.popup-area .go-top:hover, .popup-area .go-top:focus, .popup-area .go-top:active { background: url("/global/sustainability/assets/img/common/gototop-on.png") no-repeat 0 0; background-size: contain; }

.popup-area .popup-close { position: absolute; top: 3.21428rem; right: 3.78571rem; width: 2.14285rem; height: 2.14285rem; background: url('/sec/sustainability/assets/img/common/close.png') no-repeat center/contain; }
.popup-header { position: relative; height: 17.28571rem; background: #555 url('/sec/sustainability/assets/img/pc/common/pop/popup_header.png') no-repeat left/contain; }
.popup-header .popup-header-title { position: absolute; left: 3.42857rem; bottom: 3.42857rem; right: 3.42857rem; color: #fff; }
.popup-header .popup-header-location { font-size: 1.28571rem; line-height: 1.71428rem; margin-bottom: 0.57142rem; }
.popup-header .popup-header-location > span { display: block; line-height: 1.71428rem; }
.popup-header .popup-sub-title { font-size: 2.28571rem; font-weight: 700; line-height: 3rem; }
.popup-body { padding-bottom: 2.57142rem; background-color: #fff; color: #000; }
.popup-body .popup-wrap { padding: 0 3.42857rem; }
.popup-body .popup-content { padding-top: 4.57142rem; }
.popup-body .popup-update { text-align: right; margin-top: 4.57142rem; }
.popup-body .popup-update span { font-size: 1rem; line-height: 1.35714rem; font-weight: 700; color: #757575; }
.popup-body .popup-update span.update-date { margin-left: 0.35714rem; }
.popup-body .popup-update span.update-date:after, .popup-body .popup-update span.update-month:after { content: ''; }
.popup-footer { background-color: #fff; }
.popup-footer .popup-body-bottom { background-color: #F7F7F7; }
.popup-footer .popup-body-bottom ul { display: table; width: auto; margin: 0 auto; }
.popup-footer .popup-body-bottom ul > * { display: table-cell; vertical-align: middle; float: none; }
.popup-footer .popup-body-bottom ul > li { white-space: nowrap; }
.popup-footer .popup-body-bottom li > button { margin: 0 auto; font-size: 1rem; }
.popup-footer .popup-body-bottom ul > li + li { padding-left: 2.92857rem; display: none; } /* pdf 다운로드 hidden 처리 */
.popup-footer .btn-link, .popup-footer .btn-download { font-size: 1rem; font-weight: 700; height: 5.71428rem; line-height: 5.71428rem; width: auto; }
.popup-footer .btn-link::after { content: ""; display: inline-block; width: 1rem; height: 1rem; vertical-align: -2px; background: url('/sec/sustainability/assets/img/common/copylink.png') no-repeat center/contain;  margin-left: 0.35714rem; }
.popup-footer .btn-download::after { content: ""; display: inline-block; width: 1rem; height: 1rem; vertical-align: -2px; background: url('/sec/sustainability/assets/img/common/download.png') no-repeat center/contain; margin-left: 0.35714rem; }

.popup-area .popup-content .btn-wrap {display: flex; justify-content: center; margin-top: 4.571rem; }
.popup-area .popup-content .btn-wrap .more-btn {display: block; margin: 0 auto; height: 2.857rem; padding: 0.714rem 3.143rem 0.786rem 1.714rem; font-size: 1rem; line-height: 1.357rem; font-weight: 700; color: #fff; background: url('/sec/sustainability/assets/img/common/planet/pop/icon-more.png') no-repeat center right 1.714rem / 1.143rem #000000; border-radius: 35.714rem;}

@media screen and ( max-width: 535px ) {
  .popup-area { font-size: 1rem; width: 100%; min-width: 320px; border-radius: 0; top: 0; left: 0; margin-left: 0; transform: none; }
  .popup-area .go-top { width: 3rem; height: 3rem; right: 1rem; margin-right: 0; bottom: 1rem; }
  .popup-area .popup-close { top: 1.25rem; right: 1.5rem; width: 1.5rem; height: 1.5rem; }
  .popup-header { height: auto; background: #555 url('/sec/sustainability/assets/img/mo/common/pop/mobile_popup_header.png') no-repeat right center/cover; padding: 4rem 1.25rem 1.5rem; }
  .popup-header .popup-header-title { position: static; }
  .popup-header .popup-header-location { font-size: 0.875rem; line-height: 1.1875rem; margin-bottom: 0.5rem; }
  .popup-header .popup-header-location > span { line-height: 1.1875rem; }
  .popup-header .popup-sub-title { font-size: 1.375rem; line-height: 1.875rem; }
  .popup-body { padding-bottom: 1.5rem; }
  .popup-body .popup-wrap { padding: 0 1.25rem; }
  .popup-body .popup-content { padding-top: 3rem; }
  .popup-body .popup-summary { font-size: 1rem; font-weight: 400; line-height: 1.375rem; }
  .popup-body .popup-sub-title { margin-bottom: 1.5rem; }
  .popup-body .popup-update { text-align: right; margin-top: 3rem; }
  .popup-body .popup-update > span { font-size: 0.75rem; }
  .popup-body .popup-update span.update-date { margin-left: 0.3125rem; }
  .popup-footer .btn-link, .popup-footer .btn-download { font-size: 0.875rem; font-weight: 700; height: 4.5rem; line-height: 4.5rem; }
  .popup-footer .btn-link > span, .popup-footer .btn-download > span { font-size: 0.875rem; }
  .popup-footer .btn-link::after, .popup-footer .btn-download::after { vertical-align: -0.1875rem; }

  .popup-area .popup-content .btn-wrap {display: flex; justify-content: center; margin-top: 1.714rem; }
  .popup-area .popup-content .btn-wrap .more-btn { background: url('/sec/sustainability/assets/img/common/planet/pop/icon-more.png') no-repeat center right 1.714rem / 1.143rem #000000; border-radius: 35.714rem;}
}