vanillaJS module

vanillaJS module

common_module

/** common_module */
document
  .querySelector('html')
  .setAttribute('data-country', window.location.pathname.split('/')[1]);

var pluginObject = {};
var globalObject = {};
var eventObject = {};
var pluginReference = {};
var fo = {
  addPlugin: function (fn, selector) {
    !pluginObject[fn.name] ? (pluginObject[fn.name] = fn) : null;
  },
  addGlobal: function (object, name) {
    if (typeof object === 'object') {
      !globalObject[name] ? (globalObject[name] = object) : null;
    }
  },
  addEvent: function (object, name) {
    if (typeof object === 'object') {
      //!eventObject[name] ? eventObject[name] = object : null;
      $.extend(eventObject, object);
    }
  },
};

var customModule = {
  readyModule: [
    { selector: '.M01_A', plugin: 'M01_A' },
    { selector: '.M01_B', plugin: 'M01_B' },
    { selector: '.M01_C', plugin: 'M01_C' },
    { selector: '.M01_D', plugin: 'M01_D' },
    { selector: '.M04_B', plugin: 'M04_B' },
    { selector: '.M04_D', plugin: 'M04_D' },
    { selector: '.M05_A', plugin: 'M05_A' },
    { selector: '.M06_A', plugin: 'M06_A' },
    { selector: '.M06_B', plugin: 'M06_B' },
    { selector: '.M06_C', plugin: 'M06_C' },
    { selector: '.M07_A', plugin: 'M07_A' },
    { selector: '.M09_A', plugin: 'M09_A' },
    { selector: '.M09_B', plugin: 'M09_B' },
    { selector: '.M11_A', plugin: 'M11_A' },
    { selector: '.M21_A', plugin: 'M21_A' },
    { selector: '.M21_B', plugin: 'M21_B' },
    { selector: '.M22_A', plugin: 'M22_A' },
    { selector: '.M26_A', plugin: 'M26_A' },
    { selector: '.M22_A .txt_ty', plugin: 'M21_B' }, // 예외 케이스: 이미 개발 전달된 내용이라 바꿀 수 없음
  ],
  loadModule: [
    // { selector: ".M01_A", plugin: "M01_A" },
    { selector: '.M26_B', plugin: 'M26_B' },
  ],
};

$(document).ready(function () {
  var country = $('html').attr('data-country') || 'en';
  if (
    country === 'us' ||
    country === 'eu' ||
    country === 'in' ||
    country === 'vn'
  ) {
    changeOnclickStr();
    changeAnchorTarget();
  }

  $('[data-fn]').each(function (i, el) {
    var fnName = $(this).data('fn');
    if (!$(this).data('plugin')) {
      if (pluginObject.hasOwnProperty(fnName)) {
        $(this).data('plugin', new pluginObject[fnName]($(el)));
      }
    }
  });

  if (!customModule.readyModule.length) return;

  customModule.readyModule.map(function (module) {
    $(module.selector).each(function (i, el) {
      var fnName = module.plugin;
      if (!$(this).data('plugin')) {
        if (pluginObject.hasOwnProperty(fnName)) {
          $(this).data('plugin', new pluginObject[fnName]($(el)));
        }
      }
    });
  });
  /* 210510 | 접근성 | 리소스 모바일일때 title 추가 */
  function setResourceTitle() {
    var lang = $('html').attr('lang') || 'en';
    const offering = $('.filterContainer #resource_tab .btn').eq(0);
    const content = $('.filterContainer #resource_tab .btn').eq(1);
    const title = {
      ko: ['오퍼링 선택하기', '콘텐츠 유형 선택하기'],
      en: ['Choose an offerings', 'Choose a content types'],
    };
    offering.attr(
      'title',
      `${title[lang][0]} - ${langSet[lang].layerPop.layerOpen}`,
    );
    content.attr(
      'title',
      `${title[lang][1]} - ${langSet[lang].layerPop.layerOpen}`,
    );
  }
  function removeResourceTitle() {
    var lang = $('html').attr('lang') || 'en';
    $('.filterContainer #resource_tab .btn').attr('title', '');
  }

  if ($(window).innerWidth() < 1024) {
    setResourceTitle();
  } else {
    removeResourceTitle();
  }

  // window resize
  $(window).on('resize', function () {
    if ($(window).innerWidth() < 1024) {
      setResourceTitle();
    } else {
      removeResourceTitle();
    }
  });
  /* //210510 | 접근성 | 리소스 모바일일때 title 추가 */

  /* 2023-04 접근성 수정 시작 */
  /* let _clickEventTimer = null;

    $('.grp_dropdown_category').find('.link_comm').on('click', function () {
        const $this = $(this);

        if (!_clickEventTimer) {
            _clickEventTimer = setTimeout(function () {
                _clickEventTimer = null;

                if (!$this.hasClass('active')) {
                    $this.addClass('active').attr({ 'aria-expanded': true });
                } else {
                    $this.removeClass('active').attr({ 'aria-expanded': false });
                }
            }, 100);
        }
    }).on('keydown', function (event) {
        const keyCode = event.keyCode ? event.keyCode : event.which;

        if (keyCode === 9 && event.shiftKey) {
            $(this).removeClass('active').attr({ 'aria-expanded': false });
        }
    });

    $('.list_dropdown_category .link_dropdown_category').on('click', function () {
        let lang = $('html').attr('lang');

        $(this).closest('.list_dropdown_category').find('.link_dropdown_category').attr({ 'aria-selected': false }).removeClass('current');
        $(this).closest('.list_dropdown_category').find('.link_dropdown_category').find('.blind').remove();

        $(this).addClass('current').attr({ 'aria-selected': true }).append(`<span class="blind">${lang === 'ko' ? '선택됨' : 'selected'}</span>`);

        $(this).closest('.grp_dropdown_category').find('.link_comm').find('.txt_l').text($(this).find('.txt_l').text()).end().removeClass('active');
        $(this).closest(".grp_dropdown_category").find(".link_comm").focus();
    });

    $('.list_dropdown_category .item_dropdown_category:last-child .link_dropdown_category').on('keydown', function (event) {
        const keyCode = event.keyCode ? event.keyCode : event.which;

        if ((keyCode === 9) !== (event.shiftKey && keyCode === 9)) {
            $(this).closest('.grp_dropdown_category').find('.link_comm').removeClass('active').attr({ 'aria-expanded': false });
        }
    }); */
  /* // 2023-04 접근성 수정 끝 */

  /* 202403 웹접근 작업 */
  var headSkip = $('#skip_navi'),
    headSkip_li = headSkip.find('li');

  if (headSkip_li.find('button').length) {
    headSkip_li
      .find('button')
      .contents()
      .unwrap()
      .wrap('<a href="#container"></a>');
    return false;
  }
  /* //202403 웹접근 작업 */
});

$(window).load(function () {
  var country = $('html').attr('data-country') || 'en';
  if (
    country === 'us' ||
    country === 'eu' ||
    country === 'in' ||
    country === 'vn'
  ) {
    changeOnclickStr();
    changeAnchorTarget();
  }

  $('[data-load-fn]').each(function (i, el) {
    var fnName = $(this).data('loadFn');
    if (!$(this).data('plugin')) {
      if (pluginObject.hasOwnProperty(fnName)) {
        $(this).data('plugin', new pluginObject[fnName]($(el)));
      }
    }
  });

  if (!customModule.loadModule.length) return;
  customModule.loadModule.map(function (module) {
    $(module.selector).each(function (i, el) {
      var fnName = module.plugin;
      if (!$(this).data('plugin')) {
        if (pluginObject.hasOwnProperty(fnName)) {
          $(this).data('plugin', new pluginObject[fnName]($(el)));
        }
      }
    });
  });

  /* 210412 | 웹접근성 | 동영상 대체텍스트 추가 */
  if ($('.img .btn_vod, .is_showPopup').length) {
    /* 210419 | 예외처리 case 추가 */
    var lang = $('html').attr('lang') || 'en';
    var country = $('html').attr('data-country') || 'en';

    $('.img .btn_vod, .is_showPopup').each(function () {
      /* 210416 | 접근성 | class 추가 */
      var $btnMovieDataTxt = $(this).parent().next().find('a:first').text();
      var $MakeblindTxt =
        "<span class='blind'>" +
        $btnMovieDataTxt +
        ' ' +
        langSet[lang].video.play +
        '</span>';

      //$(this).attr("title", langSet[lang].layerPop.layerOpen);

      //20220411 접근성 대응
      if ($(this).data('src') == undefined) {
        $(this).attr('title', langSet[lang].layerPop.layerOpen);
      } else {
        if (
          $(this).data('watch') != undefined &&
          $(this).data('watch') == 'y'
        ) {
          $(this).attr('title', langSet[lang].layerPop.VideoOpen);
        } else {
          $(this).attr('title', langSet[lang]['openWindow']);
        }
      }

      /* 210419 | 예외처리 case 추가, 210428 | btn_m 예외 추가 */
      if (!$(this).is('.btn_arrow, .btn_m, .btn_btm .btn')) {
        $(this).find('.blind').remove();
        $(this).append($MakeblindTxt);
      }
      /* //210419 | 예외처리 case 추가 */
    });
  }

  if ($('.is_NewWinVideo').length) {
    var lang = $('html').attr('lang') || 'en';
    var country = $('html').attr('data-country') || 'en';
    $('.is_NewWinVideo').each(function () {
      $(this).attr('title', langSet[lang]['openWindow']);
    });
  }
  /* //210412 | 웹접근성 | 동영상 대체텍스트 추가 */

  /* 20220418 모바일 웹 접근성 : 디테일 페이지 이미지 대체 텍스트 */
  // var detail_textWrap = $('.txt_wrap'),
  //     detail_textWrapImgContent = detail_textWrap.find('.im');

  // detail_textWrapImgContent.each(function(i){
  //     var $this = $(this),
  //         imgAlt = $this.find('img'),
  //         imgBlind = $this.find('.blind'),
  //         imgBlindTxt = $this.find('.blind').text();

  //     if(imgBlind.length && imgAlt.attr('alt') == ""){
  //         imgAlt.attr('alt', imgBlindTxt);
  //     }
  // })
  /* //20220418 모바일 웹 접근성 : 디테일 페이지 이미지 대체 텍스트 */

  /* 210412 | 웹접근성 | 공유 아이콘 팝업 열림 텍스트 추가 */
  if ($('.md_btn_share').length) {
    var lang = $('html').attr('lang') || 'en';
    var $mdBtnShare = $('.md_btn_share');
    $mdBtnShare.attr('title', langSet[lang].layerPop.layerOpen);
  }
  /* //210412 | 웹접근성 | 공유 아이콘 팝업 열림 텍스트 추가 */

  /* 210714 : img mask add */
  $('.md_link').on('focus mouseover', function () {
    var mask_over = $(this).find('.mask_over');

    if (!$(mask_over).length) {
      return;
    }
    $(this).addClass('on');
  });

  $('.md_link').on('focusout mouseleave', function () {
    var mask_over = $(this).find('.mask_over');

    if (!$(mask_over).length) {
      return;
    }
    $(this).removeClass('on');
  });
  /* //210714 : img mask add */

  function checkCube() {
    var _cubeEl = $('.M01_E_cont.cube');
    var _cubeBan = $('.M01_E_cont.cube .md_visual');
    var _cubeTabHeight = $('.cube_tab').outerHeight();
    var _originHeight = $(window).height() - $('.M00_A').height();
    var _replaceHeight = _originHeight - _cubeTabHeight;

    if (!_cubeEl.length) return;
    _cubeBan.css('height', _replaceHeight);
  }
  checkCube();

  $(window).on('resize', function () {
    checkCube();
  });
});

/* Timer Constructor */
function Timer(func, delay) {
  this.handle = 0;
  this.func = func;
  this.delay = delay;
}
Timer.prototype.start = function (newDelay) {
  if (typeof newDelay !== 'undefined') {
    this.delay = newDelay;
  }
  this.stop();
  this.handle = setTimeout(this.func, this.delay);
  return this;
};
Timer.prototype.stop = function (newDelay) {
  if (this.handle) {
    clearTimeout(this.handle);
    this.handle = 0;
  }
  return this;
};

/* String Function */
String.prototype.dashToCamel = function () {
  return this.replace(/(\-[a-z])/g, function ($1) {
    return $1.toUpperCase().replace('-', '');
  });
};

String.prototype.camelToDash = function () {
  return this.replace(/([A-Z])/g, function ($1) {
    return '-' + $1.toLowerCase();
  });
};

String.prototype.camelToUnderscore = function () {
  return this.replace(/([A-Z])/g, function ($1) {
    return '_' + $1.toLowerCase();
  });
};

/* XML Parsing, XML selector */
function OBJtoXML(obj) {
  var xml = '';
  for (var prop in obj) {
    xml += obj[prop] instanceof Array ? '' : '<' + prop + '>';
    if (obj[prop] instanceof Array) {
      for (var array in obj[prop]) {
        xml += '<' + prop + '>';
        xml += OBJtoXML(new Object(obj[prop][array]));
        xml += '</' + prop + '>';
      }
    } else if (typeof obj[prop] == 'object') {
      xml += OBJtoXML(new Object(obj[prop]));
    } else {
      xml += obj[prop];
    }
    xml += obj[prop] instanceof Array ? '' : '</' + prop + '>';
  }
  var xml = xml.replace(/<\/?[0-9]{1,}>/g, '');
  return xml;
}

function getChildByNodeName(node, nodeName) {
  var children = node.childNodes;
  if (children.length) {
    for (var i = 0; i < children.length; i++) {
      if (children[i].nodeName == nodeName) {
        return children[i];
      }
    }
    return false;
  } else {
    return false;
  }
}

/* mobile check */
function isMobileDevice() {
  return (isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(
    navigator.userAgent,
  )
    ? true
    : false);
}

/* checkEnvironment */
function checkEnvironment() {
  const elem = $('html');
  const userAgent = navigator.userAgent;
  const mobile =
    /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i;
  const ios = /iPhone|iPad|iPod/i;
  const aos = /Android/i;

  elem.removeAttr('data-device').removeAttr('data-os');

  mobile.test(userAgent)
    ? elem.attr('data-device', 'mobile')
    : elem.attr('data-device', 'pc');
  ios.test(userAgent) ? elem.attr('data-os', 'ios') : null;
  aos.test(userAgent) ? elem.attr('data-os', 'aos') : null;
}
checkEnvironment();
window.onload = () => {
  checkEnvironment();
  window.addEventListener('resize', checkEnvironment);
};

/* url check (onclick) */
function changeOnclickStr() {
  var lang = $('html').attr('lang') || 'en';
  var selector = document.querySelectorAll('*[onclick]');
  var reg = new RegExp("(window\.location\.href='\/en\/)(.*)(.html')", 'gi');

  for (var index = 0; index < selector.length; index++) {
    var element = selector[index];
    var onclickStr = element.getAttribute('onclick');

    // 정규식 통과하지않으면 다음 for 문으로 넘어감
    if (onclickStr.match(reg) === null) {
      continue;
    }
    // Example
    // asis : outbound('/en/ai/ai.html','');window.location.href='/en/ai/ai.html'
    // tobe : outbound('/en/ai/ai.html','');window.open('/en/ai/ai.html', '_blank')
    var changeStr = onclickStr.replace(reg, function (match, p1, p2, p3) {
      return "window.open('/en/" + p2 + "', '_blank');";
    });

    // 기존 이벤트 삭제
    element.onclick = null;
    // 신규 이벤트 추가
    element.setAttribute('onclick', changeStr);
    // title="new window"
    element.setAttribute('title', langSet[lang]['openWindow']);
  }
}

/* url check (href) */
function changeAnchorTarget() {
  var lang = $('html').attr('lang') || 'en';
  var selector = document.querySelectorAll('*[href]');

  for (var index = 0; index < selector.length; index++) {
    var element = selector[index];
    var hrefStr = element.getAttribute('href');

    // href 가 "/en/" 으로 시작하지않으면 다음 for 문으로 넘어감
    if (hrefStr.indexOf('/en/') !== 0) {
      continue;
    }

    // target="_blank"
    element.setAttribute('target', '_blank');
    // title="new window"
    element.setAttribute('title', langSet[lang]['openWindow']);
  }
}

/* tab_swiper */
function tabSwiper(el) {
  _proto = tabSwiper.prototype;
  this.$el = el;
  this.data = this.$el.data();
  this.addEventFlag = false;
  this.slide;
  this.$container = this.$el.hasClass('swiper-container')
    ? this.$el
    : this.$el.find('.swiper-container');
  this.$wrapper = this.$container.find('.swiper-wrapper');
  this.$items = this.$container.find('.swiper-slide');
  this.$prevBtn = this.$container.find('.btn_prev');
  this.$nextBtn = this.$container.find('.btn_next');
  this.key = Math.floor(this.$el.offset().top); //210510 | 접근성 | tabswiper focus

  var _this = this; // tab_swiper
  var deviceType; // "PC", "TABLET", "MOBILE" // 2023-04 접근성 수정

  _proto.init = function () {
    // Swiper bug { slidesPerView: "auto" }
    // Get an array of wrong numbers: slidesGrid / slidesSizesGrid / snapGrid
    // document ready(X), window load(O)
    // Set Swiper
    if (this.$el.hasClass('gnb_rolling')) {
      setSwiperGnb(this);
    } else {
      setSwiper(this);
    }
    // Add Event
    if (!this.addEventFlag) {
      this.addEvent();
    }
  };

  // Add Event
  _proto.addEvent = function () {
    // Device type check
    deviceType = checkDeviceType(); // 2023-04 접근성 수정
    // "onSliderMove"
    // Callback function, will be executed when user touch and move finger over Swiper and move it. Receives swiper instance and 'touchmove' event as an arguments.
    _this.slide.on('onSliderMove', function (swiper, event) {
      setControlStyle(_this, swiper);
    });

    // "onTransitionEnd"
    // Callback function, will be executed after transition. Receives slider instance as an argument.
    _this.slide.on('onTransitionEnd', function (swiper) {
      setControlStyle(_this, swiper);
      /* 2023-04 접근성 수정 시작 */
      if (deviceType.toLowerCase() === 'pc') return;

      if (!_this.$el.hasClass('category_swiper')) {
        // 고객 사례, 미디어갤러리 카테고리 탭이 아닙니다.
        return;
      }
      _this.$el
        .filter('.category_swiper')
        .find('.swiper-slide')
        .attr({ tabindex: -1, 'aria-hidden': true })
        .find('a, button')
        .attr({ tabindex: -1, 'aria-hidden': true });

      setTimeout(function () {
        let _eqValue =
          _this.$el.filter('.category_swiper').find('.swiper-slide-visible')
            .length - 1;
        _this.$el
          .filter('.category_swiper')
          .find('.swiper-slide')
          .filter('.swiper-slide-visible')
          .removeAttr('tabindex aria-hidden')
          .find('a, button')
          .removeAttr('tabindex aria-hidden');

        _this.$el
          .filter('.category_swiper')
          .find('.swiper-slide')
          .filter('.swiper-slide-visible')
          .eq(_eqValue)
          .attr({ tabindex: -1, 'aria-hidden': true })
          .find('a, button')
          .attr({ tabindex: -1, 'aria-hidden': true });

        if (
          _this.$items
            .eq(_this.$items.length - 1)
            .hasClass('swiper-slide-visible')
        ) {
          _this.$items
            .eq(_this.$items.length - 1)
            .removeAttr('tabindex aria-hidden')
            .find('a, button')
            .removeAttr('tabindex aria-hidden');
        }
      }, 1);
      /* // 2023-04 접근성 수정 끝 */
    });

    /* 2023-04 접근성 수정 시작 */
    _this.slide.on('sliderMove', function () {
      if (deviceType.toLowerCase() === 'pc') return;
      if (!_this.$el.hasClass('category_swiper')) {
        // 고객 사례, 미디어갤러리 카테고리 탭이 아닙니다.
        return;
      }
      _this.$el
        .filter('.category_swiper')
        .find('.swiper-slide')
        .attr({ tabindex: -1, 'aria-hidden': true })
        .find('a, button')
        .attr({ tabindex: -1, 'aria-hidden': true });

      setTimeout(function () {
        let _eqValue =
          _this.$el.filter('.category_swiper').find('.swiper-slide-visible')
            .length - 1;

        _this.$el
          .filter('.category_swiper')
          .find('.swiper-slide')
          .filter('.swiper-slide-visible')
          .removeAttr('tabindex aria-hidden')
          .find('a, button')
          .removeAttr('tabindex aria-hidden');

        _this.$el
          .filter('.category_swiper')
          .find('.swiper-slide')
          .filter('.swiper-slide-visible')
          .eq(_eqValue)
          .attr({ tabindex: -1, 'aria-hidden': true })
          .find('a, button')
          .attr({ tabindex: -1, 'aria-hidden': true });

        if (
          _this.$items
            .eq(_this.$items.length - 1)
            .hasClass('swiper-slide-visible')
        ) {
          _this.$items
            .eq(_this.$items.length - 1)
            .removeAttr('tabindex aria-hidden')
            .find('a, button')
            .removeAttr('tabindex aria-hidden');
        }
      }, 1);
    });

    // prev button click
    _this.$prevBtn.on('click', function () {
      _this.slide.slidePrev();
      // var position = _this.slide.translate + _this.slide.size;
      // _this.slide.setWrapperTranslate(_this.slide.translate);

      // if(position < 0){
      //     _this.slide.isEnd = false;
      //     _this.slide.translate = position;
      //     _this.$wrapper.css({
      //         "transform": "translate3d("+ position +"px, 0px, 0px)",
      //         "transition": "transform 0.4s"
      //     });
      // }else{
      //     _this.slide.slideTo(0);
      // }

      // setControlStyle(_this, _this.slide);
    });

    // next button click
    _this.$nextBtn.on('click', function () {
      _this.slide.slideNext();
      // var position = _this.slide.translate - _this.slide.size;
      // var lastTranslate = -1 * _this.slide.snapGrid[_this.slide.snapGrid.length-1];
      // _this.slide.setWrapperTranslate(_this.slide.translate);

      // if(position > lastTranslate){
      //     _this.slide.isEnd = false;
      //     _this.slide.translate = position;
      //     _this.$wrapper.css({
      //         "transform": "translate3d("+ position +"px, 0px, 0px)",
      //         "transition": "transform 0.4s"
      //     });
      // }else{
      //     _this.slide.slideTo(_this.$items.length);
      // }

      // setControlStyle(_this, _this.slide);
    });

    _this.slide.on('reachEnd', function () {
      if (deviceType.toLowerCase() === 'pc') return; // 2023-04 접근성 수정
    });
    /* // 2023-04 접근성 수정 끝 */

    // window resize
    $(window).on('resize', function () {
      if (_this.$el.hasClass('gnb_rolling')) {
        setGnbRolling(_this, _this.slide);
      } else {
        setSlideStyle(_this, _this.slide);
      }
      /* 2023-04 접근성 수정 시작 */
      var currentDeviceType = checkDeviceType();

      if (deviceType !== currentDeviceType) {
        deviceType = currentDeviceType;
        if (deviceType.toLowerCase() === 'pc') {
          _this.$el
            .filter('.category_swiper')
            .find('.swiper-slide')
            .removeAttr('tabindex aria-hidden')
            .find('a, button')
            .removeAttr('tabindex aria-hidden');
        }
      }
      /* // 2023-04 접근성 수정 끝 */
    });
  };

  // Set Swiper
  function setSwiper(_plugin) {
    _plugin.slide = new Swiper(_plugin.$container, {
      a11y: true,
      loop: false,
      centeredSlides: false,
      slidesPerView: 'auto',
      freeMode: true,
      watchSlidesVisibility: true,
      keyboardControl: true,
      slidesOffsetBefore: 0,
      slidesOffsetAfter: 0,
      /* S: Tab메뉴 시 슬라이더 오류: 불러올 때마다 새로 고침 해 주는 역할 2022.10.18 Add */
      observer: true,
      observeParents: true,
      /* E: 2022.10.18 Add */
      onInit: function (swiper) {
        setSlideStyle(_this, swiper);
        setControlStyle(_this, swiper);
      },
    });
  }

  // Set Swiper
  function setSwiperGnb(_plugin) {
    _plugin.slide = new Swiper(_plugin.$container, {
      a11y: true,
      loop: false,
      centeredSlides: false,
      slidesPerView: 'auto',
      freeMode: true,
      watchSlidesVisibility: true,
      keyboardControl: true,
      slidesOffsetBefore: 0,
      slidesOffsetAfter: 0,
      observer: true,
      observeParents: true,
      onInit: function (swiper) {
        setSlideStyle(_this, swiper);
        setControlStyle(_this, swiper);
      },
    });
  }

  //Offering Gnb Rolling
  function setGnbRolling(_plugin, swiper) {
    var slideWidth = 0;
    swiper.slidesSizesGrid.map(function (width) {
      slideWidth += 246;
    });
    if (slideWidth <= swiper.size) {
      // fixed wrapper
      //_plugin.$wrapper.not(".isFixed") && _plugin.$wrapper.addClass("isFixed").css("transform", "translate3d(0px, 0px, 0px);");
      // button disabled
      _plugin.$prevBtn.not('[disabled]') &&
        _plugin.$prevBtn
          .removeAttr('disabled', 'disabled')
          .removeClass('disabled');
      _plugin.$nextBtn.not('[disabled]') &&
        _plugin.$nextBtn
          .removeAttr('disabled', 'disabled')
          .removeClass('disabled');
    }
  }

  // slide, prev button, next button style
  function setSlideStyle(_plugin, swiper) {
    var slideWidth = 0;
    swiper.slidesSizesGrid.map(function (width) {
      slideWidth += width;
    });
    if (slideWidth <= swiper.size) {
      // fixed wrapper
      _plugin.$wrapper.not('.isFixed') &&
        _plugin.$wrapper
          .addClass('isFixed')
          .css('transform', 'translate3d(0px, 0px, 0px);');
      // button disabled
      _plugin.$prevBtn.not('[disabled]') &&
        _plugin.$prevBtn.addClass('disabled');
      _plugin.$nextBtn.not('[disabled]') &&
        _plugin.$nextBtn.addClass('disabled');
    } else {
      // fixed wrapper
      _plugin.$wrapper.is('.isFixed') &&
        _plugin.$wrapper
          .removeClass('isFixed')
          .css('transform', 'translate3d(0px, 0px, 0px);');
      // button disabled
      _plugin.$prevBtn.is('[disabled]') &&
        _plugin.$prevBtn.removeAttr('disabled').removeClass('disabled');
      _plugin.$nextBtn.is('[disabled]') &&
        _plugin.$nextBtn.removeAttr('disabled').removeClass('disabled');
    }
  }

  // prev button, next button style
  function setControlStyle(_plugin, swiper) {
    // prev button
    if (swiper.translate >= 0) {
      _plugin.$prevBtn.addClass('disabled');
    } else {
      _plugin.$prevBtn.removeAttr('disabled').removeClass('disabled');
    }

    // next button
    if (swiper.isEnd) {
      _plugin.$nextBtn.addClass('disabled');
    } else {
      _plugin.$nextBtn.removeAttr('disabled').removeClass('disabled');
    }
  }

  /* 2023-04 접근성 수정 시작 */
  function checkDeviceType() {
    if (window.innerWidth > 1023) {
      return 'PC';
    } else if (window.innerWidth > 600) {
      return 'TABLET';
    } else {
      return 'MOBILE';
    }
  }
  /* // 2023-04 접근성 수정 끝 */
  this.init();
}

fo.addPlugin(tabSwiper);

/* imgLiquid */
$(document).ready(function () {
  var option = {
    fill: true,
    horizontalAlign: 'center',
    verticalAlign: 'center',
  };
  $('.module_ty').find('.img .img_p, .img .img_m').imgLiquid(option);
  $('.visual_img').find('.img_p, .img_m').imgLiquid(option);
  $('.board_ty').find('.img .img_p').imgLiquid(option);

  /* 210406 | 웹접근성 | 이미지 대체텍스트 추가 */
  var lang = $('html').attr('lang') || 'en';
  var parentClass = $('.module_ty, .visual_img, .board_ty');
  var parentClass2 =
    $('.vision_carousel'); /* 210525 |지속가능경영 | case 추가 */

  if (!parentClass.length) return;

  parentClass.find('.md_link .img_p, .md_link .img_m').each(function (e) {
    var $this = $(this);
    var imgAlt = $this.find('img').attr('alt');
    var thisTit = $this.closest('.item, .li').find('.txt a').first().text();
    var thisTarget = $this.closest('.md_link');

    $this.find('img').attr('aria-hidden', 'true');

    if (thisTarget.attr('target') == '_blank' && !thisTarget.attr('title')) {
      thisTarget.attr('title', langSet[lang]['openWindow']);
    }
    if (!$this.hasClass('img_m')) {
      //PC를 기준으로 alt값 출력 | alt값 없을시 md_tit값 출력
      if (imgAlt) {
        thisTarget.append('<div class="blind">' + imgAlt + '</div>');
      } else {
        thisTarget.append('<div class="blind">' + thisTit + '</div>');
      }
    }
  });
  /* //210406 | 웹접근성 | 이미지 대체텍스트 추가 */

  /* 210525 |지속가능경영 | case 추가 */
  if (!parentClass2.length) return;

  parentClass2.find('.img_p').each(function (e) {
    var $this = $(this);
    var imgAlt = $this.find('img').attr('alt');
    var thisTarget = $this.closest('.visual_img');

    $this.find('img').attr('aria-hidden', 'true');
    if (imgAlt) {
      thisTarget.append('<div class="blind">' + imgAlt + '</div>');
    }
  });
  /* 210525 |지속가능경영 | case 추가 */

  /* 210525 | 탭 클릭시 실행 추가 */
  $('#tab_sel_list').on('click', function () {
    if (!$('.module_ty')) {
      return;
    }
    moduleAlign();
  });
  /* 210525 | 탭 클릭시 실행 추가 */
});

/* moduleAlign(matchHeight) */
$(function () {
  // var moduleAlignResizeTimer = new Timer(function(){
  //     moduleAlign();
  // }, 200);
  $(document).ready(function () {
    moduleAlign();
  });
  $(window).resize(function () {
    //moduleAlignResizeTimer.start();
    moduleAlign();
  });
});

function moduleAlign() {
  if ($('.module_ty').length < 1) return;

  var $module_ty = $('.module_ty');
  var option = {
    initial: {
      tbyRow: true,
      remove: false,
    },
    remove: {
      remove: true,
    },
  };
  if (window.innerWidth < 601) {
    $module_ty.each(function () {
      $(this).find('.md_tit').matchHeight(option.remove);
      $(this).find('.md_tit02').matchHeight(option.remove);
      $(this).find('.md_txt').matchHeight(option.remove);
      $(this).find('.md_txt02').matchHeight(option.remove);
    });
  } else {
    $module_ty.each(function () {
      $(this).find('.md_tit').matchHeight(option.initial);
      $(this).find('.md_tit02').matchHeight(option.initial);
      $(this).find('.md_txt').matchHeight(option.initial);
      $(this).find('.md_txt02').matchHeight(option.initial);
    });
  }
}

/** like, share **/
$(function () {
  // 참고
  // 1. $shareBox 여는 부분은 ion_common 또는 html 내부에 존재
  // 2. 하단 md_pop_share, md_pop_share02, md_pop_share03 사용되는곳 없는것으로 추정됨
  // 3. $shareBox.on("focusin") setTimeout 사용 이유: $shareBox 포커스 들어오는 시점이 각각 다름
  var lang =
    $('html').attr('lang') || 'en'; /* 210412 | 접근성 | 대체텍스트 추가 */
  var $shareBox = $('.md_share_box');
  var $shareDim = $('.md_share_dimd');
  var $shareCloseBtn = $('.md_btn_share_close');

  /* 210412 | 접근성 | 대체텍스트 추가 */
  $shareBox
    .find('a')
    .not($shareCloseBtn)
    .attr('title', langSet[lang]['openWindow']);
  $shareBox.find('.tit').text(langSet[lang].share.shareOpen).toString();
  $shareCloseBtn.find('span').text(langSet[lang].share.shareClose).toString();
  /* //210412 | 접근성 | 대체텍스트 추가 */

  var resizeTimer = new Timer(function () {
    mdShareClose();
  }, 100);

  // share dim
  $shareDim.click(function () {
    mdShareClose();
    return false;
  });

  // share close
  $shareCloseBtn.on({
    click: function () {
      mdShareClose();
      return false;
    },
    keydown: function (e) {
      if (e.keyCode == 9) {
        $shareBox.focus();
        return false;
      }
    },
  });

  $shareBox.on('focusin', function (e) {
    e.stopPropagation();
    e.preventDefault();
    setTimeout(function () {
      $('.md_btn_share.on').length &&
        $('.md_btn_share.on').addClass('isShareBoxTarget');
      $('.btn_md_share.on').length &&
        $('.btn_md_share.on').addClass('isShareBoxTarget');
      $('.add_share.on').length &&
        $('.add_share.on').addClass('isShareBoxTarget');
    }, 0);
  });

  // share box
  $shareBox.keydown(function (e) {
    e.stopPropagation();
    var isShift = window.event.shiftKey ? true : false;
    var $focusItems = $shareBox
      .parent()
      .find('a:visible, button:visible, [tabindex]');
    if ($focusItems.first().is($(e.target))) {
      if (e.keyCode == 9 && isShift) $focusItems.last().focus();
    }
    if ($focusItems.last().is($(e.target))) {
      if (e.keyCode == 9 && !isShift) $focusItems.first().focus();
    }
  });
  $(window).on({
    resize: function () {
      resizeTimer.start();
    },
    scroll: function () {
      resizeTimer.start();
    },
  });
});

function md_pop_share(obj) {
  if ($(obj).hasClass('on')) {
    $(obj).removeClass('on');
    $('.md_share_area').removeClass('on').removeClass('off');
    $('.md_btn_share').removeClass('on');
  } else {
    var offsetPosition = $(obj).offset();
    var w = ($(window).width() - $('#wrap').width()) * 0.5;
    var x = offsetPosition.left + 30 - w;
    var y = offsetPosition.top - 2;
    $('#md_share_area').addClass('on');
    $('#md_share_area').css('left', x).css('top', y);
    $('.md_share_box').attr('tabindex', 0);
    $('.md_share_box').focus();
    $('.md_btn_share').removeClass('on');
    $(obj).addClass('on');
  }
  return false;
}
function md_pop_share02(obj) {
  if ($(obj).hasClass('on')) {
    $(obj).removeClass('on');
    $('.md_share_area').removeClass('on').removeClass('off');
    $('.btn_md_share').removeClass('on');
  } else {
    var offsetPosition = $(obj).offset();
    var w = ($(window).width() - $('#wrap').width()) * 0.5;
    var x = $(window).width() - offsetPosition.left + 10 - w;
    var y = offsetPosition.top - 23;
    $('#md_share_area').addClass('on');
    $('#md_share_area').css('right', x).css('top', y);
    $('.md_share_box').attr('tabindex', 0);
    $('.md_share_box').focus();
    $('.btn_md_share').removeClass('on');
    $(obj).addClass('on');
  }
  return false;
}
function md_pop_share03(obj) {
  if ($(obj).hasClass('on')) {
    $(obj).removeClass('on');
    $('.md_share_area').removeClass('on').removeClass('off');
    $('.btn_md_share').removeClass('on');
  } else {
    var offsetPosition = $(obj).offset();
    var x = offsetPosition.left + 160;
    var y = offsetPosition.top - 0;
    $('#md_share_area').addClass('on');
    $('#md_share_area').css('left', x).css('top', y);
    $('.md_share_box').attr('tabindex', 0);
    $('.md_share_box').focus();
    $('.btn_md_share').removeClass('on');
    $(obj).addClass('on');
  }
  return false;
}

function mdShareClose() {
  var lang =
    $('html').attr('lang') || 'en'; /* 210412 | 접근성 | 대체텍스트 추가 */
  if (!$('.md_share_area').hasClass('on')) return;
  if ($('.md_share_area').hasClass('off')) return;
  $('.md_share_area').addClass('off');
  $('.md_btn_share')
    .find('.blind')
    .text(langSet[lang].share.shareOpen)
    .toString(); /* 210412 | 접근성 | 대체텍스트 추가 */
  $('.isShareBoxTarget').length && $('.isShareBoxTarget').focus();
  setTimeout(function () {
    $('.md_btn_share.on').length && $('.md_btn_share.on').removeClass('on');
    $('.btn_md_share.on').length && $('.btn_md_share.on').removeClass('on');
    $('.add_share.on').length && $('.add_share.on').removeClass('on');
    $('.isShareBoxTarget').length &&
      $('.isShareBoxTarget').removeClass('isShareBoxTarget');
  }, 0);
  setTimeout(function () {
    $('.md_share_area').removeClass('on').removeClass('off');
  }, 250);
}

/** 접근성 **/
$(function () {
  //$('#container .cont').attr('tabindex', 0); //220325 | 접근성 오류 수정
  /** Footer **/
  var $footer = $('#footer');
  var $lang = $('.etc_lang, .etc_toggle');
  var $drop = $('.etc_drop');

  function footerRez() {
    if (!$lang.hasClass('on')) return;
    $lang.removeClass('on');
    $lang.find('.sub_menu').hide();
  }

  // 실제 사용되지않는 코드
  // function footerEvent(){
  //     $drop.find("a,button,[tabindex]").on("focusout", function(e){
  //         if(!$drop.find(e.relatedTarget).length && $drop.hasClass("on")){
  //             $drop.removeClass('on');
  //             $drop.find('.in').hide();
  //         }
  //     })
  //     $lang.find("a,button,[tabindex]").on("focusout", function(e){
  //         if(!$lang.find(e.relatedTarget).length && $lang.hasClass("on")){
  //             $lang.removeClass('on');
  //             $lang.find('.sub_menu').hide();
  //         }
  //     })
  // }

  var footerRez_resizeTimer = new Timer(function () {
    footerRez();
  }, 100);

  $(document).ready(function () {
    // footerEvent();
    footerRez();
  });
  $(window).resize(function () {
    footerRez_resizeTimer.start();
  });
});

/* 페이지 내 스크롤 앵커 (btn_anchor) */
$(function () {
  $('.btn_anchor').click(function (e) {
    e.preventDefault();
    var t = $(this).attr('href');
    if ($(t).length) {
      $('html, body')
        .stop()
        .animate(
          {
            scrollTop: $(t).offset().top - 50,
          },
          800,
          function () {
            $(t).get(0).focus({ preventScroll: false });
            $('html,body').scrollTop($(t).offset().top - 50);
          },
        );
    }
  });
});

/* 상단 띠배너 */
function initTailBox() {
  if (!$('.tail_wrap').length) return;
  var tailResizeTImer = new Timer(function () {
    $('.tail_wrap:visible').closest('body').addClass('tail_chk');
  }, 100);

  $(window).on('resize', function () {
    tailResizeTImer.start();
  });

  $('.tail_wrap .btn_close').click(function (e) {
    e.preventDefault();
    $('.tail_wrap').hide();
    $('body').removeClass('tail_chk');
    $('.M01_A_cont').trigger('initHeight');
    if (window['GNB']) GNB.setHeightRightContainer();
    if ($('#seelater').is(':checked')) {
      $.cookie('tailboxSeeLater', 'Y', { expires: 1, path: '/' });
    }
  });
  $('.tail_wrap:visible').closest('body').addClass('tail_chk');
  //$(window).scrollTop(0);
  if (window['GNB']) GNB.setSticky();
}

/* M15_A | location hash | index class */
$(function () {
  if (!$('.M15_A').length) return;
  var M15_A_array;
  $('#container').each(function () {
    M15_A_array = $(this).find('.M15_A');
  });
  M15_A_array.map(function (key, value) {
    if (!$(value).find('.tab_list .tab_btn').length) return;
    var contIdx = key + 1;
    $(value)
      .find('.tab_list .tab_btn')
      .each(function (index) {
        var btnIdx = index + 1;
        var classKey = contIdx + '_' + btnIdx;
        $(this).addClass('tab_link_' + classKey);
      });
  });
});

/* Lang Set */ /* 210412 | 웹접근성 | 데이터 추가 */
// sample:
// var lang = $("html").attr("lang") || "en";
// langSet[lang]["slide"]["playStr"]
var langSet = {
  ko: {
    countryCode: 'kr',
    history: {
      activeStr: '최근방문기록 열기',
      title: 'Visit History',
      desc: '최근방문한 페이지가 최대 30개 저장됩니다.',
      clearall: '전체삭제',
      close: '최근방문기록 닫기',
      emptyHistory: '방문한 이력이 없습니다.',
    },
    search: {
      activeStr: '검색창 열기',
      placeholder: '검색어를 입력하세요',
      search: '검색',
      close: '검색창 닫기',
      clear: '검색어 삭제',
    },
    rnb: {
      activeStr: '전체메뉴 열기',
      inactiveStr: '전체메뉴 닫기',
    },
    menuState: {
      activeStr: '메뉴열기',
      inactiveStr: '메뉴닫힘',
    },
    words: {
      summary: '개요',
    },
    slide: {
      prevStr: '이전',
      nextStr: '다음',
      playStr: '재생',
      pauseStr: '멈춤',
      soundOn: 'ON',
      soundOff: 'OFF',
      selected: '현재위치',
    },
    expanded: {
      trueStr: '숨기기',
      falseStr: '더보기',
      trueStr_M08_B: '자료 숨기기',
      falseStr_M08_B: '자료 더보기',
    },
    share: {
      share: '공유하기',
      shareOpen: '공유하기 열기',
      shareClose: '공유하기 닫기',
    },
    video: {
      play: '동영상 보러가기',
    },
    layerPop: {
      layerOpen: '레이어 팝업 열림',
      layerClose: '레이어 팝업 닫힘',
      VideoOpen: '레이어 팝업에서 이 동영상 재생',
    },
    calenderDate: {
      dateStart: '시작일',
      dateEnd: '종료일',
    },
    seeLater: '오늘 하루 보지 않기',
    openWindow: '새창열림',
    ReadMore: '자세히 보기',
    downLoad: '다운로드',
  },
  en: {
    countryCode: 'en',
    history: {
      activeStr: 'Open History',
      title: 'Visit History',
      desc: 'Up to 30 recently visited pages are logged.',
      clearall: 'Clear All',
      close: 'Close History',
      emptyHistory: 'No Visit history.',
    },
    search: {
      activeStr: 'Open search',
      placeholder: 'Search',
      search: 'Search',
      close: 'Close Search',
      clear: 'Clear',
    },
    rnb: {
      activeStr: 'Open Right Global Navigator',
      inactiveStr: 'Close Right Global Navigator',
    },
    menuState: {
      activeStr: 'Open Menu',
      inactiveStr: 'Close Menu',
    },
    words: {
      summary: 'Summary',
    },
    slide: {
      prevStr: 'Prev',
      nextStr: 'Next',
      playStr: 'Play',
      pauseStr: 'Stop',
      soundOn: 'ON',
      soundOff: 'OFF',
      selected: 'selected',
    },
    expanded: {
      trueStr: 'Close',
      falseStr: 'See more',
      trueStr_M08_B: 'Close',
      falseStr_M08_B: 'See more',
    },
    share: {
      share: 'share',
      shareOpen: 'Share Open',
      shareClose: 'Share Close',
    },
    video: {
      play: 'Play Video',
    },
    layerPop: {
      layerOpen: 'Layer pop-up open',
      layerClose: 'Layer pop-up Close',
      VideoOpen: 'Play this video on the layer pop-up',
    },
    calenderDate: {
      dateStart: 'START DATE',
      dateEnd: 'END DATE',
    },
    seeLater: 'Check to not see again',
    openWindow: 'new window',
    ReadMore: 'Read More',
    downLoad: 'download',
  },
  zh: {
    countryCode: 'cn',
    history: {
      activeStr: '打开',
      title: 'Visit History',
      desc: '最多记录30个最近访问的页面。',
      clearall: '删除所有',
      close: '关闭',
      emptyHistory: '没有访问历史.',
    },
    search: {
      activeStr: '打开',
      placeholder: '搜索',
      search: '关键词搜索',
      close: '关闭',
      clear: '删除',
    },
    rnb: {
      activeStr: 'open right global navigator',
      inactiveStr: 'close right global navigator',
    },
    menuState: {
      activeStr: '打开',
      inactiveStr: '关闭',
    },
    words: {
      summary: '概括',
    },
    slide: {
      prevStr: 'Prev',
      nextStr: 'Next',
      playStr: 'Play',
      pauseStr: 'Stop',
      soundOn: 'ON',
      soundOff: 'OFF',
    },
    expanded: {
      trueStr: 'Close',
      falseStr: 'See more',
      trueStr_M08_B: 'Close',
      falseStr_M08_B: 'See more',
    },
    share: {
      share: 'share',
      shareOpen: 'Share Open',
      shareClose: 'Share Close',
    },
    video: {
      play: 'Play Video',
    },
    layerPop: {
      layerOpen: 'Layer pop-up open',
      layerClose: 'Layer pop-up Close',
      VideoOpen: 'Play this video on the layer pop-up',
    },
    calenderDate: {
      dateStart: '起始日期',
      dateEnd: '结束日期',
    },
    seeLater: 'Check to not see again',
    openWindow: 'new window',
    ReadMore: 'Read More',
    downLoad: 'download',
  },
  pt: {
    countryCode: 'pt',
    history: {
      activeStr: 'história aberta',
      title: 'Visit History',
      desc: 'Até 30 páginas visitadas recentemente são registradas.',
      clearall: 'limpar tudo',
      close: 'história próxima',
      emptyHistory: 'sem histórico de visitas.',
    },
    search: {
      activeStr: 'busca aberta',
      placeholder: 'buscar',
      search: 'buscar',
      close: 'fechar busca',
      clear: 'limpar',
    },
    rnb: {
      activeStr: 'open right global navigator',
      inactiveStr: 'close right global navigator',
    },
    menuState: {
      activeStr: 'open Menu',
      inactiveStr: 'close Menu',
    },
    words: {
      summary: 'summary',
    },
    slide: {
      prevStr: 'Prev',
      nextStr: 'Next',
      playStr: 'Play',
      pauseStr: 'Stop',
      soundOn: 'ON',
      soundOff: 'OFF',
    },
    expanded: {
      trueStr: 'Close',
      falseStr: 'See more',
      trueStr_M08_B: 'Close',
      falseStr_M08_B: 'See more',
    },
    share: {
      shareOpen: 'Share Open',
      shareClose: 'Share Close',
    },
    video: {
      play: 'Play Video',
    },
    layerPop: {
      layerOpen: 'Layer pop-up open',
      layerClose: 'Layer pop-up Close',
      VideoOpen: 'Play this video on the layer pop-up',
    },
    calenderDate: {
      dateStart: 'DATA INICIO',
      dateEnd: 'DATA FIM',
    },
    seeLater: 'Check to not see again',
    openWindow: 'Abrir uma nova',
    ReadMore: 'Read More',
    downLoad: 'download',
  },
};
/* Lang Set */ /* 210412 | 웹접근성 | 데이터 추가 */

function handleRnbScrollControl(e) {
  if ($('body').is('[class *= "rnb-active"]')) {
    let $otrOfrngRnb = null;
    let $inerOfrngRnb = null;
    let $scrlEl = null;

    const $rnb = $('.rnb');
    const $firstMenuItem = $rnb.find('li');
    const $firstMenuItemActive = $firstMenuItem.filter('.on');
    // const $secondMenu = $firstMenuItemActive.find('.depth-sub .scroll-wrapper.depth2');
    const $secondMenu = $firstMenuItemActive.find('.depth-sub .scroll-wrapper');
    const $secondMenuItem = $secondMenu.find('ul.depth2 > li');

    if ($('body').hasClass('rnb-active-second')) {
      // 오른쪽 메뉴
      if ($firstMenuItemActive.find('.renewal_offering_rnb').length > 0) {
        // 신규 스타일 메뉴
        $otrOfrngRnb = $firstMenuItemActive
          .find('.renewal_offering_rnb')
          .outerHeight();
        $inerOfrngRnb = $firstMenuItemActive
          .find('.renewal_offering_rnb .inner_offering_rnb')
          .outerHeight();
        $scrlEl = $firstMenuItemActive.find(
          '.renewal_offering_rnb .scroll-element.scroll-y .scroll-bar',
        );
      } else {
        // 기존 스타일 메뉴
        let title_height =
          $secondMenu.find('.md_tit').length > 0
            ? $secondMenu
                .find('.md_tit')
                .toArray()
                .map((currentValue) => $(currentValue).outerHeight(true))
                .reduce(
                  (accumulator, currentValue) => accumulator + currentValue,
                )
            : null;
        $otrOfrngRnb = $secondMenu.outerHeight();
        $inerOfrngRnb =
          $secondMenuItem
            .toArray()
            .map((currentValue) => $(currentValue).outerHeight(true))
            .reduce((accumulator, currentValue) => accumulator + currentValue) +
          title_height; // 배열의 높이 + (.md_title이 있을경우) 총 합한값
        $scrlEl = $secondMenu.find('.scroll-element.scroll-y .scroll-bar');
      }
    } else {
      // 왼쪽 메뉴
      $otrOfrngRnb = $rnb
        .find('.depth-main > .scroll-wrapper > .scroll-content')
        .outerHeight();
      $inerOfrngRnb =
        $rnb.find('.depth-main ul.depth1_ul').outerHeight() *
        $rnb.find('.depth-main ul.depth1_ul').length;
      $scrlEl = $rnb.find(
        '.depth-main > .scroll-wrapper > .scroll-element.scroll-y .scroll-bar',
      );
    }

    if (e.originalEvent.wheelDelta > 0 || e.originalEvent.detail < 0) {
      if ($scrlEl.css('top') === 'auto' || parseInt($scrlEl.css('top')) <= 0) {
        // 플러그인 스크롤바는 더 이상 위로 이동할 수 없는 상태입니다.
        e.preventDefault();
        return false;
      }
    } else {
      if (
        $scrlEl.css('top') === 'auto' ||
        parseInt($scrlEl.css('top')) >= $inerOfrngRnb - $otrOfrngRnb - 0
      ) {
        // 플러그인 스크롤바는 더 이상 아래로 이동할 수 없는 상태입니다.
        e.preventDefault();
        return false;
      }
    }
  } else {
    e.preventDefault();
    return false;
  }
}

$(function () {
  // gnb.html이 준비됐을 때 각 영역의 첫 번째 메뉴를 활성화
  let _checkElement = setInterval(() => {
    let $wrapper = $('.renewal_offering');

    if ($wrapper.length) {
      clearInterval(_checkElement);
      $wrapper.each(function (index, element) {
        let $group = $(element).find('[class *= "group_offering"]');
        let $depth1 = $group
          .filter('[data-offering-depth = "1"]')
          .find('.item_offering_depth1');
        let $depth2 = $group
          .filter('[data-offering-depth = "2"]')
          .find('.inner_offering_depth2');
        /* 20231030 삭제 */
        // $depth1.eq(0).addClass('current');
        // $depth2.eq(0).addClass('active');
      });
    }
  }, 40);

  let rnbActive = null;
  $(document)
    .on(
      'mouseenter',
      '.rnb .depth-main .depth1_ul .dep1, .rnb .renewal_offering_rnb, .rnb .depth-sub',
      function (event) {
        if (!rnbActive)
          rnbActive = /renewal_offering_rnb|depth-sub/.test(
            event.currentTarget.className,
          )
            ? 'rnb-active-second'
            : 'rnb-active';
        if ($('.rnb').has(event.currentTarget).length)
          $('body').addClass(rnbActive);
      },
    )
    .on(
      'mouseleave',
      '.rnb .depth-main .depth1_ul .dep1, .rnb .renewal_offering_rnb, .rnb .depth-sub',
      function () {
        $('body').removeClass(rnbActive);

        rnbActive = null;
      },
    );
});

const slide = {
  setSlideItemAttr(module, data) {
    const { carousel, slides, activeSlides } = data;

    carousel.removeAttr('tabindex');
    Array.from(slides).forEach((a) => {
      $(a).removeAttr('tabindex aria-hidden');
      $(a).find('a, button').attr({ tabindex: -1, 'aria-hidden': true });
    });
    Array.from(activeSlides).forEach((a) => {
      $(a).find('a, button').removeAttr('tabindex aria-hidden');
    });
  },
  setTabSlideAttr(module, data) {
    const {
      carousel,
      type,
      key,
      tablist,
      tablists,
      tabpanel,
      tabpanels,
      activeIdx,
      clonePanelActiveIdx,
    } = data;
    const { setting, orientation } = type;

    const activePanelIndex = clonePanelActiveIdx || activeIdx; // clonePanelActiveIdx 값 여부에 따라 탭 패널의 active index 변경

    if (setting) {
      $(tablist).attr({ role: 'tablist' });
      $(tablist).find('li').attr({ role: 'presentation' });

      Array.from(tablists).forEach((a, i) => {
        $(a).attr({
          id: `tab_btn_${key}`,
          role: 'tab',
          'aria-controls': `tab_panel_${key}`,
          'aria-selected': false,
          'aria-hidden': true,
          tabindex: -1,
        });
      });

      Array.from(tabpanels).forEach((a, i) => {
        $(a).attr({
          id: `tab_panel_${key}`,
          role: 'tabpanel',
          'aria-labelledby': `tab_btn_${key}`,
          'aria-hidden': true,
          tabindex: -1,
        });
        $(a).find('a, button').attr({ 'aria-hidden': true, tabindex: -1 });
      });
    }

    // orientation
    $(tablist).attr({ 'aria-orientation': orientation });

    $(tablists)
      .removeClass('active')
      .attr({ 'aria-hidden': true, tabindex: -1 })
      .attr({ 'aria-selected': false });

    $(tablists)
      .eq(activeIdx)
      .addClass('active')
      .removeAttr('aria-hidden tabindex')
      .attr({ 'aria-selected': true });

    $(tabpanels)
      .removeClass('active')
      .attr({ 'aria-hidden': true, tabindex: -1 })
      .find('a, button')
      .attr({ 'aria-hidden': true, tabindex: -1 });

    $(tabpanels)
      .eq(activePanelIndex)
      .addClass('active')
      .removeAttr('aria-hidden tabindex')
      .find('a, button')
      .removeAttr('aria-hidden tabindex');
  },
  setPagn(module, data) {
    const { carousel, slides, activeIdx, element, clone: getClone } = data;
    const { st, ed, bar } = element;
    let clone = getClone || 0;

    let edNum = slides / (clone + 1);
    let stNum = (activeIdx % edNum) + 1;
    let barNum = (100 / edNum) * stNum;

    st.text(String(stNum).padStart(2, 0));
    ed.text(String(edNum).padStart(2, 0));
    bar.css('width', `${barNum}%`);
  },
  setControlAttr(module, data) {
    const { carousel, option, changeFocus, element } = data;
    const { wrap, playBtn, stopBtn } = element;

    switch (option) {
      case 'PLAY':
        $(wrap).removeClass('on');
        $(playBtn).attr({ 'aria-hidden': true, tabindex: -1 });
        $(stopBtn).removeAttr('aria-hidden tabindex');
        if (changeFocus) $(stopBtn).focus();
        break;
      case 'STOP':
        $(wrap).addClass('on');
        $(stopBtn).attr({ 'aria-hidden': true, tabindex: -1 });
        $(playBtn).removeAttr('aria-hidden tabindex');
        if (changeFocus) $(playBtn).focus();
        break;
      default:
    }
  },
  setSelectedPagn(module, data) {
    const lang = $('html').attr('lang') || 'en';
    const { carousel, items, activeIdx, element } = data;
    const { wrap } = element;

    $(items).removeAttr('aria-selected title class').removeClass('selected');
    $(items)
      .eq(activeIdx)
      .attr({ 'aria-selected': true, title: langSet[lang].slide.selected })
      .addClass('selected');
  },
  setTabDragEvent(module, data) {
    const { element } = data;

    const slider = element;
    let isDown = false;
    let startX;
    let scrollLeft;

    slider.addEventListener('mousedown', (e) => {
      isDown = true;
      slider.classList.add('drag');
      startX = e.pageX - slider.offsetLeft;
      scrollLeft = slider.scrollLeft;
    });

    slider.addEventListener('mouseleave', () => {
      isDown = false;
      slider.classList.remove('drag');
    });

    slider.addEventListener('mouseup', () => {
      isDown = false;
      slider.classList.remove('drag');
    });

    slider.addEventListener('mousemove', (e) => {
      if (!isDown) return;
      e.preventDefault();
      const x = e.pageX - slider.offsetLeft;
      const walk = x - startX;
      slider.scrollLeft = scrollLeft - walk;
    });
  },
  setTabScroll(module, data) {
    const { tabSlideArea, tab, tabItems, activeIdx } = data;
    if (isNaN(activeIdx)) return;

    const tabSlideAreaW = tabSlideArea.width();

    const a = $(tabItems[activeIdx]);
    const li = a.parent('li');

    tab.css({ position: 'relative' });
    li.css({ position: 'initial' });

    const aLeft = a.position().left;
    const aW = a.innerWidth();

    tab.css({ position: '' });
    li.css({ position: '' });

    const scrollLeft = Math.round(aLeft - tabSlideAreaW / 2 + aW / 2);
    tabSlideArea.stop().animate({ scrollLeft: scrollLeft });
  },
};

sample2

$(document).ready(function () {
  var country = $('html').attr('data-country') || 'en';
  if (country === 'us' || country === 'eu' || country === 'in') {
    changeOnclickStr();
    changeAnchorTarget();
  }

  $('[data-fn]').each(function (i, el) {
    var fnName = $(this).data('fn');
    if (!$(this).data('plugin')) {
      //console.log("Create data-plugin:: "+fnName);
      if (pluginObject.hasOwnProperty(fnName)) {
        $(this).data('plugin', new pluginObject[fnName]($(el))); // Mn_# 모듈을 초기화합니다.
      }
    }
  });

  if (!customModule.readyModule.length) return;
  customModule.readyModule.map(function (module) {
    $(module.selector).each(function (i, el) {
      var fnName = module.plugin;
      if (!$(this).data('plugin')) {
        //console.log("Create data-plugin:: "+fnName);
        if (pluginObject.hasOwnProperty(fnName)) {
          $(this).data('plugin', new pluginObject[fnName]($(el)));
        }
      }
    });
  });
  /* 210510 | 접근성 | 리소스 모바일일때 title 추가 */
  function setResourceTitle() {
    var lang = $('html').attr('lang') || 'en';
    $('.filterContainer #resource_tab .btn').attr(
      'title',
      langSet[lang].layerPop.layerOpen,
    );
  }

  function removeResourceTitle() {
    var lang = $('html').attr('lang') || 'en';
    $('.filterContainer #resource_tab .btn').attr('title', '');
  }

  if ($(window).innerWidth() < 1024) {
    setResourceTitle();
  } else {
    removeResourceTitle();
  }

  // window resize
  $(window).on('resize', function () {
    if ($(window).innerWidth() < 1024) {
      setResourceTitle();
    } else {
      removeResourceTitle();
    }
  });
  /* //210510 | 접근성 | 리소스 모바일일때 title 추가 */

  /* 2023-04 접근성 수정 시작 */
  /* let _clickEventTimer = null;

    $('.grp_dropdown_category').find('.link_comm').on('click', function () {
        const $this = $(this);

        if (!_clickEventTimer) {
            _clickEventTimer = setTimeout(function () {
                _clickEventTimer = null;

                if (!$this.hasClass('active')) {
                    $this.addClass('active').attr({ 'aria-expanded': true });
                } else {
                    $this.removeClass('active').attr({ 'aria-expanded': false });
                }
            }, 100);
        }
    }).on('keydown', function (event) {
        const keyCode = event.keyCode ? event.keyCode : event.which;

        if (keyCode === 9 && event.shiftKey) {
            $(this).removeClass('active').attr({ 'aria-expanded': false });
        }
    });

    $('.list_dropdown_category .link_dropdown_category').on('click', function () {
        let lang = $('html').attr('lang');

        $(this).closest('.list_dropdown_category').find('.link_dropdown_category').attr({ 'aria-selected': false }).removeClass('current');
        $(this).closest('.list_dropdown_category').find('.link_dropdown_category').find('.blind').remove();

        $(this).addClass('current').attr({ 'aria-selected': true }).append(`<span class="blind">${lang === 'ko' ? '선택됨' : 'selected'}</span>`);

        $(this).closest('.grp_dropdown_category').find('.link_comm').find('.txt_l').text($(this).find('.txt_l').text()).end().removeClass('active');
        $(this).closest(".grp_dropdown_category").find(".link_comm").focus();
    });

    $('.list_dropdown_category .item_dropdown_category:last-child .link_dropdown_category').on('keydown', function (event) {
        const keyCode = event.keyCode ? event.keyCode : event.which;

        if ((keyCode === 9) !== (event.shiftKey && keyCode === 9)) {
            $(this).closest('.grp_dropdown_category').find('.link_comm').removeClass('active').attr({ 'aria-expanded': false });
        }
    }); */
  /* // 2023-04 접근성 수정 끝 */
});

sample3

$(window).load(function () {
  var country = $('html').attr('data-country') || 'en';
  if (country === 'us' || country === 'eu' || country === 'in') {
    changeOnclickStr();
    changeAnchorTarget();
  }

  $('[data-load-fn]').each(function (i, el) {
    var fnName = $(this).data('loadFn');
    if (!$(this).data('plugin')) {
      //console.log("Create data-load-plugin:: "+fnName);
      if (pluginObject.hasOwnProperty(fnName)) {
        $(this).data('plugin', new pluginObject[fnName]($(el)));
      }
    }
  });

  if (!customModule.loadModule.length) return;
  customModule.loadModule.map(function (module) {
    $(module.selector).each(function (i, el) {
      var fnName = module.plugin;
      if (!$(this).data('plugin')) {
        //console.log("Create data-plugin:: "+fnName);
        if (pluginObject.hasOwnProperty(fnName)) {
          $(this).data('plugin', new pluginObject[fnName]($(el)));
        }
      }
    });
  });

  /* 210412 | 웹접근성 | 동영상 대체텍스트 추가 */
  if ($('.img .btn_vod, .is_showPopup').length) {
    /* 210419 | 예외처리 case 추가 */
    var lang = $('html').attr('lang') || 'en';
    var country = $('html').attr('data-country') || 'en';

    $('.img .btn_vod, .is_showPopup').each(function () {
      /* 210416 | 접근성 | class 추가 */
      var $btnMovieDataTxt = $(this).parent().next().find('a:first').text();
      var $MakeblindTxt =
        "<span class='blind'>" +
        $btnMovieDataTxt +
        ' ' +
        langSet[lang].video.play +
        '</span>';

      //$(this).attr("title", langSet[lang].layerPop.layerOpen);

      //20220411 접근성 대응
      if ($(this).data('src') == undefined) {
        $(this).attr('title', langSet[lang].layerPop.layerOpen);
      } else {
        if (
          $(this).data('watch') != undefined &&
          $(this).data('watch') == 'y'
        ) {
          $(this).attr('title', langSet[lang].layerPop.layerOpen);
        } else {
          $(this).attr('title', langSet[lang]['openWindow']);
        }
      }

      /* 210419 | 예외처리 case 추가, 210428 | btn_m 예외 추가 */
      if (!$(this).is('.btn_arrow, .btn_m, .btn_btm .btn')) {
        $(this).find('.blind').remove();
        $(this).append($MakeblindTxt);
      }
      /* //210419 | 예외처리 case 추가 */
    });
  }

  if ($('.is_NewWinVideo').length) {
    var lang = $('html').attr('lang') || 'en';
    var country = $('html').attr('data-country') || 'en';
    $('.is_NewWinVideo').each(function () {
      $(this).attr('title', langSet[lang]['openWindow']);
    });
  }
  /* //210412 | 웹접근성 | 동영상 대체텍스트 추가 */

  /* 20220418 모바일 웹 접근성 : 디테일 페이지 이미지 대체 텍스트 */
  // var detail_textWrap = $('.txt_wrap'),
  //     detail_textWrapImgContent = detail_textWrap.find('.im');

  // detail_textWrapImgContent.each(function(i){
  //     var $this = $(this),
  //         imgAlt = $this.find('img'),
  //         imgBlind = $this.find('.blind'),
  //         imgBlindTxt = $this.find('.blind').text();

  //     if(imgBlind.length && imgAlt.attr('alt') == ""){
  //         imgAlt.attr('alt', imgBlindTxt);
  //     }

  // })
  /* //20220418 모바일 웹 접근성 : 디테일 페이지 이미지 대체 텍스트 */

  /* 210412 | 웹접근성 | 공유 아이콘 팝업 열림 텍스트 추가 */
  if ($('.md_btn_share').length) {
    var lang = $('html').attr('lang') || 'en';
    var $mdBtnShare = $('.md_btn_share');

    $mdBtnShare.attr('title', langSet[lang].layerPop.layerOpen);
  }
  /* //210412 | 웹접근성 | 공유 아이콘 팝업 열림 텍스트 추가 */

  /* 210714 : img mask add */
  $('.md_link').on('focus mouseover', function () {
    var mask_over = $(this).find('.mask_over');

    if (!$(mask_over).length) {
      return;
    }
    $(this).addClass('on');
  });

  $('.md_link').on('focusout mouseleave', function () {
    var mask_over = $(this).find('.mask_over');

    if (!$(mask_over).length) {
      return;
    }
    $(this).removeClass('on');
  });
  /* //210714 : img mask add */

  function checkCube() {
    var _cubeEl = $('.M01_E_cont.cube'); // real Summit 공통 추가
    var _cubeBan = $('.M01_E_cont.cube .md_visual'); // real Summit 공통 추가
    var _cubeTabHeight = $('.cube_tab').outerHeight(); // real Summit 공통 추가
    var _originHeight = $(window).height() - $('.M00_A').height();
    var _replaceHeight = _originHeight - _cubeTabHeight;

    if (!_cubeEl.length) return;
    _cubeBan.css('height', _replaceHeight);
  }
  checkCube();

  $(window).on('resize', function () {
    checkCube();
  });
});

sample4

/** Page | MP_brityauto */
function MP_brityauto(el) {
  _proto = MP_brityauto.prototype;

  this.$el = el;
  this.data = this.$el.data();
  this.addEventFlag = false;

  this.$tab = {
    key: Math.floor(this.$el.offset().top),
    fixed: this.$el.find('.fixed_tab'),
    ul: this.$el.find('.fixed_tab .tab_inner ul'),
    li: this.$el.find('.fixed_tab .tab_inner li'),
    btn: this.$el.find('.fixed_tab .tab_inner li a'),
    panel: this.$el.find('.art'),
    beforeActive: 99,
    active: null,
    isClick: false,
    isFixed: false,
  };

  let _this = this;
  let $hd = $('.M00_A');

  _proto.init = function () {
    //console.log("init:: MP_brityauto");
    setTabFixed();
    setTabAttr('init');

    // Event binding
    if (!this.addEventFlag) {
      this.addEventFlag = true;
      this.addEvent();
    }
  };

  _proto.addEvent = function () {
    _this.$tab.btn.on('click', function () {
      _this.$tab.isClick = true;

      let idx = $(this).parents('li').index();
      let panelT = parseInt(_this.$tab.panel.eq(idx).offset().top);

      let headH = $(document).find('#header').outerHeight(true);
      let headT = Math.abs($hd.position().top);
      let brandColorH =
        $('.brandcolor').is(':hidden') || $('.brandcolor').hasClass('normal')
          ? 0
          : $('.brandcolor').outerHeight(true);
      let tabH = _this.$tab.fixed.outerHeight(true);
      let scrollTop = panelT - tabH - (headH - headT - brandColorH);

      _this.$tab.active = idx;
      _this.$tab.li.removeClass('active').eq(idx).addClass('active');
      _this.$tab.btn
        .attr({ 'aria-selected': false })
        .eq(idx)
        .attr({ 'aria-selected': true });

      $('html, body')
        .stop()
        .animate({ scrollTop: scrollTop }, 500, () => {
          let afterHeadT = Math.abs($hd.position().top);
          scrollTop = scrollTop - (headT - afterHeadT);
          $('html, body')
            .stop()
            .animate({ scrollTop: scrollTop }, 500, () => {
              _this.$tab.isClick = false;
            });
        });
    });

    $(window).on('scroll resize', () => {
      setTabFixed();
      setTabActive();
      animateInViewElements();
    });
  };

  const setTabFixed = function () {
    let tabT = _this.$tab.fixed.offset().top;
    $(window).scrollTop() >= tabT
      ? _this.$tab.fixed.addClass('fixed')
      : _this.$tab.fixed.removeClass('fixed');
  };

  const setTabActive = function () {
    if (_this.$tab.isClick) return;

    let headT = Math.abs($hd.position().top);
    let headH = $hd.outerHeight(true) - headT;
    let tabH = _this.$tab.fixed.outerHeight(true);
    let active = null;

    _this.$tab.panel.each((idx, item) => {
      let offsetTop = parseInt($(item).offset().top) - (headH + tabH);
      if ($(window).scrollTop() >= offsetTop) active = idx;
    });

    _this.$tab.active = active;
    setTabAttr();
  };

  const setTabAttr = function (init) {
    let isFirst = init == 'init' ? true : false; // 처음 setting 시에만 'init' 전달
    let active = _this.$tab.active;

    let beforeActive = _this.$tab.beforeActive;
    if (active == beforeActive) return;
    _this.$tab.beforeActive = _this.$tab.active;

    _this.$tab.li.removeClass('active');
    _this.$tab.btn.attr({ 'aria-selected': false });

    if (typeof active == 'number') {
      _this.$tab.li.eq(active).addClass('active');
      _this.$tab.btn.eq(active).attr({ 'aria-selected': true });
    }

    if (!isFirst) return;

    _this.$tab.ul
      .attr('role', 'tablist')
      .find('li')
      .attr('role', 'presentation');

    _this.$tab.btn.each(function (index) {
      var key = `${_this.$tab.key}_${index}`;
      $(this).attr({
        role: `tab`, // 202304-01 웹접근 : 삭제
        id: `tab_btn_${key}`,
        'aria-controls': `tab_panel_${key}`,
        'aria-selected': index == active ? true : false, // changeable
      });
    });
    _this.$tab.panel.each(function (index) {
      var key = `${_this.$tab.key}_${index}`;
      $(this).attr({
        role: `region`,
        id: `tab_panel_${key}`,
        'aria-labelledby': `tab_btn_${key}`,
      });
    });
  };

  function animateInViewElements() {
    let animationElements = $('.ban');
    let winT = $(window).scrollTop();
    // let winB = winT + ( $(window).height() / 2 );
    let winB = winT + $(window).height() / 1;

    animationElements.each((idx, item) => {
      var element = $(item);
      var elementHeight = $(element).outerHeight(true);
      var elementTop = $(element).offset().top;

      if (elementTop <= winB) {
        if (!element.hasClass('in-view')) element.addClass('in-view');
      } else if (elementTop > winB + elementHeight / 2) {
        element.removeClass('in-view');
      }
    });
  }

  this.init();
}
fo.addPlugin(MP_brityauto);
© 2026 aluvy. Some rights reserved.