https://www.genetec.co.jp/assets/js/common.js?ver=202610020604

1const COMMON = {}
2COMMON.COMMON_OBJECT = {
3  scrollPosition: 0,
4  init: function() {
5    this.setParameters()
6    this.setScrollbarWidth()
7    this.isiOS()
8    this.isTouchDevice()  
9  },
10  setParameters: function() {
11    // メディアクエリとヘッダーメディアクエリの設定
12    this.mediaQueryStr = '(min-width: 768px)',
13    this.mediaQuery = window.matchMedia(this.mediaQueryStr),
14    this.mediaQueryMidStr = '(min-width: 1024px)',
15    this.mediaQueryMid = window.matchMedia(this.mediaQueryMidStr)
16  },
17  /**
18   * iOS（iPadOSを含む）かどうかのUA判定
19   * @returns {boolean} iOSの場合はtrue、そうでない場合はfalseを返します。
20   */
21  isiOS: function() {
22    const ua = window.navigator.userAgent
23    const isIOSDevice = /iPhone|iPad|iPod/i.test(ua)
24    const isIPadOS = isIOSDevice && !ua.includes('macintosh')
25  
26    return isIOSDevice || isIPadOS
27  },
28  /**
29   * デバイスがタッチ対応であるかを判断します。
30   * @returns {boolean} タッチ対応の場合はtrue、そうでない場合はfalseを返します。
31   */
32  isTouchDevice: function() {
33    return (
34      "ontouchstart" in window || navigator.maxTouchPoints > 0 || window.matchMedia('(pointer:coarse)').matches
35    )
36  },
37  /**
38   * スクロールバーの幅を計算してカスタムプロパティの値を更新する
39   */
40  setScrollbarWidth: function() {
41    if(!this.isTouchDevice()) {
42      // タッチデバイスは除く
43      const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth
44      // カスタムプロパティの値を更新する
45      document.documentElement.style.setProperty('--scrollbar', `${scrollbarWidth}px`)
46    }
47  },
48  /**
49   * ウィンドウの横幅をCSS変数として設定する関数
50   */
51  adjustVw: function() {
52    const vw = document.documentElement.clientWidth * 0.01
53    // カスタムプロパティの値を更新する
54    document.documentElement.style.setProperty('--vw', `${vw}px`)
55  },
56  /**
57  * true false の文字列をBooleanで判定できるように変換する
58  * @param {String} data 
59  */
60  toBoolean: function(data) {
61    return data.toLowerCase() === 'true'
62  },
63  /**
64   * フォーカスしてもスクロールさせない
65   *  @param {Element} elem target要素
66   */
67  focusWithoutScroll: function(elem) {
68    const x = window.scrollX || window.pageXOffset
69    const y = window.scrollY || window.pageYOffset
70    elem.focus()
71    window.scrollTo(x, y)
72  },
73  /**
74  * windowのスクロールバー固定
75  */
76  fixScrollBar: function() {
77    const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth
78    const isIOS = this.isiOS();
79    // スクロールバー非表示によるがたつきを削除
80    if (scrollbarWidth > 0) {
81      $('body').css('padding-right', `${scrollbarWidth}px`)
82    }
83
84    // bodyスクロール固定
85    if (isIOS) {
86      // iOSの場合
87      this.scrollPosition = $(window).scrollTop()
88      $('body,html').css({
89        'position': 'fixed',
90        'top': `-${this.scrollPosition}px`,
91        'max-width': '100vw'
92      })
93    } else {
94      $('body').css('overflow', 'hidden')
95    }
96  },  
97  /**
98  * windowのスクロールバー固定解除
99  */
100  unFixScrollBar: function() {
101    $('body').css('padding-right', '')
102    const isIOS = this.isiOS()
103    if (isIOS) {
104      // iOSの場合
105      $('body,html').css({
106        'position': '',
107        'top': '',
108        'max-width': ''
109      })
110      $(window).scrollTop(this.scrollPosition)
111    } else {
112      $('body').css('overflow', '')
113    }
114  },
115  getParam: function() {
116    const query = decodeURI(location.search)
117    const queryItems = (query.indexOf('?') >= 0)? query.split('?')[1].split('&'): []
118    let param = {}
119  
120    queryItems.forEach(function(queryItem){
121      param[queryItem.split('=')[0]] = queryItem.split('=')[1]
122    })
123    
124    return param
125  }
126}
127
128// ==================  ヘッダー関連  ====================== //
129COMMON.HEADER = {
130  $NAVI: $('.c-navi'),
131  OPENCLASS: 'is-opened',
132  CURRENTCLASS: 'is-current',
133  FIXEDTCLASS: 'is-fixed',
134  SPEED: 300,
135  init: function() {
136    this.setParameters()
137    this.switchDropdownMenu()
138    this.initMenu(COMMON.COMMON_OBJECT.mediaQueryMid)
139    this.hoverDropdownMenu(COMMON.COMMON_OBJECT.mediaQueryMid)
140
141    // イベントリスナー登録
142    COMMON.COMMON_OBJECT.mediaQueryMid.addEventListener('change', this.initMenu)
143    COMMON.COMMON_OBJECT.mediaQueryMid.addEventListener('change', this.hoverDropdownMenu)
144
145    window.addEventListener('scroll', () => this.handleScroll())
146  },
147  handleScroll: function() {
148    const scrollPosition = window.scrollY
149    
150    if(scrollPosition <= 50) {
151      this.$NAVI.removeClass(this.FIXEDTCLASS)
152      this.headerFixedFlag = false
153    } else if (!this.headerFixedFlag) {
154      this.$NAVI.addClass(this.FIXEDTCLASS)
155      this.headerFixedFlag = true
156    }
157  },
158  setParameters: function() {
159    this.$toggleTrigger = $('.js-toggle-gnavi'),
160    this.$hoverElement = $('.js-hover-gnavi'),
161    this.$humToggleTrigger = $('.js-toggle-hamburger'),
162    this.$humShowContent = $(`#${this.$humToggleTrigger.attr('aria-controls')}`),
163    this.$gnaviCloseTrigger = $('.js-close-gnavi'),
164    this.$closeBg = $('.js-close-bg'),
165    this.headerFixedFlag = false
166  },
167  /**
168   * メニュー初期表示
169   */
170  initMenu: function(e) {
171    const self = COMMON.HEADER
172    const SPEED = 0
173
174    // スクロールバーの固定解除
175    COMMON.COMMON_OBJECT.unFixScrollBar()
176
177    if(e.matches) {
178      // 1024px以上
179      // グロナビを開く
180      self.showDropdownMenu(self.$humToggleTrigger, SPEED)
181      // グロナビのタブインデックスを解除
182      self.$humShowContent.removeAttr('tabindex').removeAttr('inert').blur()
183    } else {
184      // グロナビを閉じる
185      self.hideDropdownMenu(self.$humToggleTrigger, SPEED)
186    }
187    
188    // ドロップダウンメニューを閉じる
189    self.$toggleTrigger.each(function(){
190      self.hideDropdownMenu($(this), SPEED)
191    })
192
193    // コンテンツの不活性化を解除
194    $('.l-content, .l-footer').removeAttr('inert')
195    // 背景不活性化
196    self.$closeBg.attr('inert', true)
197    // 背景非表示
198    self.$NAVI.removeClass(self.OPENCLASS)
199  },
200  toggleHumMenu: function(e) {
201    e.preventDefault()
202    const HIDEFLAG = this.$humShowContent.attr('aria-hidden')
203
204    if(COMMON.COMMON_OBJECT.toBoolean(HIDEFLAG)) {
205      this.showDropdownMenu(this.$humToggleTrigger, this.SPEED)
206      this.$NAVI.addClass(this.OPENCLASS)
207      this.$humShowContent.find('a').eq(0).focus()
208    } else {
209      this.hideDropdownMenu(this.$humToggleTrigger, this.SPEED)
210      this.hideDropdownMenu(this.$toggleTrigger, this.SPEED)
211      this.$NAVI.removeClass(this.OPENCLASS)
212    }
213  },
214  /**
215   * ドロップダウンメニュー開閉
216   */
217  toggleDropdownMenu: function(e) {
218    if(!COMMON.COMMON_OBJECT.isTouchDevice() && COMMON.COMMON_OBJECT.mediaQueryMid.matches) {
219      // タッチデバイス以外でPCヘッダーの場合処理終了
220      return
221    }
222
223    const self = COMMON.HEADER
224    const $trigger = $(e.currentTarget)
225    const toggleTarget = $trigger.attr('aria-controls')
226    const $showContent= $(`#${toggleTarget}`)
227    const HIDEFLAG = $showContent.attr('aria-hidden')
228    
229    if(COMMON.COMMON_OBJECT.mediaQueryMid.matches && COMMON.COMMON_OBJECT.isTouchDevice() && !COMMON.COMMON_OBJECT.toBoolean(HIDEFLAG)) {
230      // タッチデバイスでPCヘッダーの場合メニューが開いた状態ではページ遷移
231      return
232    }
233
234    e.preventDefault()
235    if(!COMMON.COMMON_OBJECT.mediaQueryMid.matches && e.type == 'focusin') {
236      // SPヘッダーの場合、focusは処理終了
237      return
238    }
239
240    if(COMMON.COMMON_OBJECT.toBoolean(HIDEFLAG)) {
241      this.showDropdownMenu($trigger, self.SPEED)
242    } else {
243      this.hideDropdownMenu($trigger, self.SPEED)
244    }
245  },
246  /**
247   * ドロップダウンメニュー表示
248   * @param {Element} $trigger 
249   * @param {Element} $showContent 
250   * @param {Number} SPEED 
251   */
252  showDropdownMenu: function($trigger, SPEED) {
253    const $showContent = $(`#${$trigger.attr('aria-controls')}`)
254
255    // 開閉コンテンツ以外は不活性化
256    $showContent.attr('aria-hidden', false).removeAttr('inert')
257    $('.l-content, .l-footer').attr('inert', true)
258    // 背景の不活性化を解除
259    COMMON.HEADER.$closeBg.removeAttr('inert')
260
261    // 表示切替
262    $(`[aria-controls=${$trigger.attr('aria-controls')}`).attr('aria-expanded', true)
263    this.$NAVI.addClass(this.OPENCLASS)
264    if(COMMON.COMMON_OBJECT.mediaQueryMid.matches) {
265      // PCの場合
266      $showContent.css('display', '')
267
268      if($trigger.attr('aria-controls') == 'gnavi') { // グロナビ全体の場合
269        COMMON.COMMON_OBJECT.unFixScrollBar()
270      } else {
271        COMMON.COMMON_OBJECT.fixScrollBar()
272      }
273    } else {
274      $showContent.fadeIn(SPEED)
275
276      if($trigger.attr('aria-controls') == 'gnavi') { // グロナビ全体の場合
277        COMMON.COMMON_OBJECT.fixScrollBar()
278      } else {
279        $trigger.parents('.c-gnavi__item').find('.js-toggle-gnavi').attr('inert', true)
280        $trigger.parents('.c-gnavi__item').siblings().attr('inert', true)
281        $trigger.parents('.c-gnavi__list').siblings().attr('inert', true)
282      }
283    }
284  },
285  /**
286   * ドロップダウンメニュー非表示
287   * @param {Element} $trigger 
288   * @param {Element} $showContent 
289   * @param {Number} SPEED 
290   */
291  hideDropdownMenu: function($trigger, SPEED, flag) {
292    const $showContent = $(`#${$trigger.attr('aria-controls')}`)
293
294    // 開閉コンテンツの不活性化を解除
295    $showContent.attr('aria-hidden', true).attr('inert', true)
296
297    // 表示切替
298    $(`[aria-controls=${$trigger.attr('aria-controls')}`).attr('aria-expanded', false)
299    if(COMMON.COMMON_OBJECT.mediaQueryMid.matches) {
300      // PCの場合
301      
302      if(!flag){
303        $showContent.css('display', '')
304        COMMON.COMMON_OBJECT.unFixScrollBar()
305        COMMON.HEADER.$NAVI.removeClass(this.OPENCLASS)
306        
307        // 開閉コンテンツ以外の不活性化を解除
308        $('.l-content, .l-footer').removeAttr('inert')
309        $trigger.parents('.c-gnavi__item').find('.js-toggle-gnavi').removeAttr('inert')
310        $trigger.parents('.c-gnavi__item').siblings().removeAttr('inert')
311        $trigger.parents('.c-gnavi__list').siblings().removeAttr('inert')
312        // 背景を不活性化
313        COMMON.HEADER.$closeBg.attr('inert', true)
314      }
315
316    } else {
317      $showContent.fadeOut(SPEED)
318
319      if($trigger.attr('aria-controls') == 'business') {

320        COMMON.ACCORDION.closeAllSpMd()
321      }
322
323      if($trigger.attr('aria-controls') == 'gnavi') { // グロナビ全体の場合
324        COMMON.COMMON_OBJECT.unFixScrollBar()
325        COMMON.HEADER.$NAVI.removeClass(this.OPENCLASS)
326
327        // 開閉コンテンツ以外の不活性化を解除
328        $('.c-gnavi').removeAttr('inert')
329        $('.l-content, .l-footer').removeAttr('inert')
330        // 背景を不活性化
331        COMMON.HEADER.$closeBg.attr('inert', true)
332      } else {
333        // 開閉コンテンツ以外の不活性化を解除
334        $trigger.parents('.c-gnavi__item').find('.js-toggle-gnavi').removeAttr('inert')
335        $trigger.parents('.c-gnavi__item').siblings().removeAttr('inert')
336        $trigger.parents('.c-gnavi__list').siblings().removeAttr('inert')
337      }
338    }
339  },
340  /**
341   * 表示/非表示 切り替えイベント
342   */
343  switchDropdownMenu: function() {
344    this.$toggleTrigger.on('click', this.toggleDropdownMenu.bind(this))
345    this.$gnaviCloseTrigger.on('click', this.toggleDropdownMenu.bind(this))
346    this.$humToggleTrigger.on('click', this.toggleHumMenu.bind(this))
347    this.$closeBg.on('click keypress', function(){
348      COMMON.HEADER.initMenu(COMMON.COMMON_OBJECT.mediaQueryMid)
349    })
350    this.hoverDropdownMenu(COMMON.COMMON_OBJECT.mediaQueryMid)
351  },
352  /**
353   * PCレイアウトホバー時ドロップダウンメニュー開閉
354   */
355  hoverDropdownMenu: function(e) {
356    const self = COMMON.HEADER
357    if(e.matches) {
358      let hoverTimers = new Map()
359      // 1024px以上
360      self.$hoverElement.on("focusin mouseenter", function(e) {
361        if(!COMMON.COMMON_OBJECT.isTouchDevice()) {
362          const $trigger = $(e.currentTarget).find('.js-toggle-gnavi')
363
364          // タイマーが存在する場合、クリアする（閉じる処理をキャンセル）
365          const timerId = hoverTimers.get($trigger[0])
366          if (timerId) {
367            clearTimeout(timerId)
368            hoverTimers.delete($trigger[0])
369          }
370
371          if(!COMMON.COMMON_OBJECT.toBoolean($trigger.attr('aria-expanded'))) {
372            self.showDropdownMenu($trigger, self.SPEED)
373          }
374        }
375      }).on("focusout mouseout", function(e) {
376        if($(e.relatedTarget).closest(this).length) { return }
377
378        let otherNaviOpenFlag
379        if($(e.relatedTarget).closest('.js-hover-gnavi').length < 1 || e.type == 'focusout') {
380          otherNaviOpenFlag = false
381        } else {
382          otherNaviOpenFlag = true
383        }
384
385        const $trigger = $(e.currentTarget).find('.js-toggle-gnavi')
386
387        // 3秒後にメニューを閉じる処理を実行
388        const timerId = setTimeout(() => {
389          self.hideDropdownMenu($trigger, self.SPEED, otherNaviOpenFlag)
390          hoverTimers.delete($trigger[0]) // タイマーを削除
391        }, 200)
392        // タイマーを記録
393        hoverTimers.set($trigger[0], timerId)
394      })
395    } else {
396      self.$hoverElement.off('mouseenter mouseleave focusin mouseover focusout mouseout')
397    }
398  },
399  /**
400   * 開いているか判定
401   * @returns {boolean}
402   */
403  isOpen: function() {
404    const self = this
405    return self.$NAVI.hasClass(self.OPENCLASS)
406  },
407}
408
409// ==================  フッター関連  ====================== //
410COMMON.FOOTER = {
411  scrollTarget: null,
412  scrollButton: null,
413  floatingBanner: null,
414  footer: null,
415  footerHeight: 0,
416  scrollButtonBottom: 0,
417  isFixed: false,
418  FIXED_CLASS: 'is-fixed',
419  HIDDEN_CLASS: 'is-hidden',
420  init: function() {
421    this.scrollTarget = $('.js-scroll-button')
422    this.scrollButton = this.scrollTarget.find('.c-footer-to-top')
423    this.floatingBanner = $('.js-floating-banner')
424    this.footer = $('.l-footer')
425    this.scrollButtonHeight = this.scrollButton.innerHeight()
426    
427    this.scrollTarget.hide()
428    window.addEventListener('scroll', () => this.handleScroll())
429    this.handleScroll()
430  },
431  handleScroll: function() {
432    const scrollPosition = window.scrollY
433    const windowHeight = window.innerHeight
434
435    const footerOffset = this.footer.offset().top
436    const footerPosition = footerOffset - windowHeight
437
438    const scrollButtonBottom = this.scrollButtonBottom + this.scrollButtonHeight
439
440    if(scrollPosition - footerPosition >= scrollButtonBottom) {
441      this.fixButton()
442    } else {
443      this.unfixButton()
444    }
445
446    if (scrollPosition > 300) {
447      this.showButton()
448    } else {
449      this.hideButton()
450    }
451  },
452  fixButton: function() {
453    if (!this.isFixed) {
454      this.scrollTarget.removeClass(this.FIXED_CLASS)
455      this.floatingBanner.addClass(this.HIDDEN_CLASS)
456      this.isFixed = true
457    }
458  },
459  unfixButton: function() {
460    if (this.isFixed) {
461      this.scrollTarget.addClass(this.FIXED_CLASS)
462      this.floatingBanner.removeClass(this.HIDDEN_CLASS)
463      this.isFixed = false
464    }
465  },
466  showButton: function() {
467    this.scrollButton.fadeIn()
468    this.scrollTarget.fadeIn()
469  },
470  hideButton: function() {
471    this.scrollButton.fadeOut()
472    this.scrollTarget.fadeOut()
473  }
474}
475
476// ==================  アコーディオン  ====================== //
477COMMON.ACCORDION = {
478  trigger: '.js-toggle-acco',
479  SPEED: 300,
480  panel: null,
481  flagSP: '[data-acco-sp]',
482  flagSPmd: '[data-acco-sp-md]',
483  /**
484   * 初期化
485   */
486  init: function() {
487    const self = this
488    this.setInitStyle(COMMON.COMMON_OBJECT.mediaQuery)
489
490    $(this.trigger).each((index, element) => {
491      self.toggleEvent(element)
492    })
493    // イベントリスナー登録
494    COMMON.COMMON_OBJECT.mediaQuery.addEventListener('change', this.setInitStyle)
495    COMMON.COMMON_OBJECT.mediaQueryMid.addEventListener('change', this.setInitStyle)
496  },
497  /**
498   * イベントを設定
499   * @param {HTMLElement} selector
500   */
501  toggleEvent: function(selector) {
502    const self = this
503
504    $(selector).on('click', function(e) {
505      if($(this).is(self.flagSPmd) && COMMON.COMMON_OBJECT.mediaQueryMid.matches) {
506        // PC幅かつタブレット以下のみアコーディオンの場合
507        return
508      }
509      if(COMMON.COMMON_OBJECT.mediaQuery.matches && $(this).is(self.flagSP)) {
510        // PC幅かつSPのみアコーディオンの場合
511        return
512      } else {
513        e.preventDefault()
514        if (self.isOpen(this)) {
515          self.close(this)
516        } else {
517          self.open(this)
518        }
519      }
520    })
521  },
522  /**
523   * 開いているか判定
524   * @param {HTMLElement} trigger
525   * @returns {boolean}
526   */
527  isOpen: function(trigger) {
528    return $(trigger).attr('aria-expanded') === 'true'
529  },
530  /**
531   * パネルを取得
532   * @param {HTMLElement} trigger
533   */
534  getPanel: function(trigger) {
535    const toggleTargetId = $(trigger).attr('aria-controls')
536    this.panel = $(`#${toggleTargetId}.js-show-acco`)
537  },
538  /**
539   * 開く
540   * @param {HTMLElement} trigger
541   */
542  open: function(trigger) {
543    this.getPanel(trigger)
544    $(trigger).attr('aria-expanded', 'true').removeAttr('tabindex')
545    this.panel.slideDown(this.SPEED).attr('aria-hidden', 'false')
546  },
547  /**
548   * 閉じる
549   * @param {HTMLElement} trigger
550   * @param {Number} [speed]
551   */
552  close: function(trigger, speed) {
553    this.getPanel(trigger)
554    $(trigger).attr('aria-expanded', 'false').removeAttr('tabindex')
555    const duration = typeof speed === 'number' ? speed : this.SPEED
556    this.panel.slideUp(duration).attr('aria-hidden', 'true')
557  },
558  /**
559   * PC幅では常時表示しアコーディオン用ARIAを外す
560   * @param {HTMLElement} trigger
561   */
562  showPc: function(trigger) {
563    this.getPanel(trigger)
564    $(trigger).removeAttr('aria-expanded').attr('tabindex', '-1')
565    this.panel.stop(true, true).removeAttr('style').removeAttr('aria-hidden')
566  },
567  /**
568   * 事業紹介の中カテゴリアコーディオンをすべて閉じる
569   */

570  closeAllSpMd: function() {
571    const self = this
572    $('#business').find(self.flagSPmd).each(function() {
573      self.close(this, 0)
574    })
575  },
576  /**
577   * 初期表示
578   */
579  setInitStyle: function() {
580    const self = COMMON.ACCORDION
581    const isPcMd = COMMON.COMMON_OBJECT.mediaQueryMid.matches
582    const isPc = COMMON.COMMON_OBJECT.mediaQuery.matches
583
584    $(self.trigger).each(function() {
585      if($(this).is(self.flagSPmd)) {
586        if(isPcMd) {
587          self.showPc(this)
588        } else {
589          self.close(this, 0)
590        }
591        return
592      }
593
594      if(isPc) {
595        // 768px以上
596        if($(this).is(self.flagSP)) {
597          // SPのみアコーディオンの場合全て開く
598          self.open(this)
599        } else {
600          // 全て閉じる
601          self.close(this)
602        }
603      } else {
604        // 768px未満
605        self.close(this)
606      }
607    })
608  }
609}
610
611//
612COMMON.ANCHORLINK = {
613  headerHeight: 0,
614  SPEED: 500, // スムーススクロールの速度（ミリ秒）
615  FIXEDTCLASS: 'is-fixed',
616
617  init: function() {
618    const self = this
619    this.setAnchorPosition()
620
621    // アンカーリンクのクリックイベントを設定
622    $('a[href^="#"]').on('click', function(e) {
623      e.preventDefault()
624      const targetId = $(this).attr('href').substring(1)
625      self.smoothScroll(targetId, self.SPEED)
626    })
627
628    // #スタートでないページ内リンク
629    $('a[href*="#"]:not([href^="#"])').on('click', function (e) {
630      const hrefHash = $(this).attr('href');
631      if (hrefHash.indexOf('#') > 0) {
632        if (hrefHash.split('#')[0] === location.pathname) {
633          e.preventDefault();
634          const targetId = hrefHash.split('#')[1]
635          self.smoothScroll(targetId, self.SPEED)
636        }
637      }
638    })
639  },
640  getHeaderHeight: function() {
641    const $NAVI = $('.l-navi')
642    if ($NAVI.length > 0 && !COMMON.COMMON_OBJECT.mediaQuery.matches) {
643      this.headerHeight = $NAVI.innerHeight()
644    }
645
646    return this.headerHeight
647  },
648  /**
649  * スムーススクロール
650  * @param {HTMLElement} element 
651  */
652  smoothScroll: function(targetId, SPEED) {
653    const self = this
654    const replaceUrl = location.pathname + location.search
655
656    setTimeout(function() {
657      if(targetId === '') {
658        $('html, body').animate({
659          scrollTop: 0
660        }, SPEED)
661      } else {
662        const $targetElement = $('#' + targetId)
663        self.headerHeight = self.getHeaderHeight()
664
665        if ($targetElement.length) {
666          const offsetTop = $targetElement.offset().top
667          const scrollToPosition = offsetTop - self.headerHeight // ヘッダーの高さを考慮
668    
669          $('html, body').animate({
670            scrollTop: scrollToPosition
671          }, SPEED, "swing", function() {
672            // タブキー移動補助
673            if (!$targetElement.is('a,button')) {
674              $targetElement.attr('tabindex', '-1').css({ 'outline': '0' })
675              COMMON.COMMON_OBJECT.focusWithoutScroll($targetElement)
676            } else {
677              COMMON.COMMON_OBJECT.focusWithoutScroll($targetElement)
678            }
679          })
680
681          history.replaceState(null, null, replaceUrl)
682        } else {
683          return
684        }
685      }
686    }, 0)
687  },
688  setAnchorPosition: function() {
689    const self = this
690    const urlHash = location.hash
691    const SPEED = 0
692
693    // URLにアンカーが存在する場合
694    if (urlHash) {
695      const targetId = (urlHash == '#' || urlHash == '') ? 'html': urlHash.slice(1)
696
697      self.headerHeight = self.getHeaderHeight()
698      self.smoothScroll(targetId, SPEED)
699    } else {
700      return
701    }
702  },
703  /**
704  * ページ読み込み時のブラウザのアンカー移動を制御
705  */
706  setAnchorZero: function() {
707    const urlHash = location.hash
708
709    // URLにアンカーが存在する場合
710    if (urlHash) {
711      $('body,html').stop().scrollTop(0)
712    }
713  }
714}
715
716COMMON.EFFECT = {
717  /**
718   * スクロールアニメーション
719   */
720  scrollEffect: function() {
721    const _self = COMMON.EFFECT 
722    const DELTA = $(window).height() * 0.8
723    $('[data-effect]').each(function (i) {
724      const elemPosition = $(this).offset().top
725      const scrollTop = $(window).scrollTop()
726      const $self = $(this)
727  
728      // 表示領域まできていた場合
729      if (scrollTop > elemPosition - DELTA) {
730        let target = $self.data('effect')
731        if (target === 'slide-up-order' || target === 'slide-left-order') {
732          _self.effectOrder($self.children())
733        } else {
734          $self.addClass('is-visible')
735        }
736      }
737    });

738
739    $('[data-effect-list]').children().each(function (i) {
740      const elemPosition = $(this).offset().top
741      const scrollTop = $(window).scrollTop()
742      const $self = $(this)
743  
744      // 表示領域まできていた場合
745      if (scrollTop > elemPosition - DELTA) {
746        $self.addClass('is-visible')
747      }
748    });
749  },
750  effectOrder : function($self) {
751    const delayTime = 100;
752    $self.each(function (i) {
753      $(this).delay(i * delayTime).queue(function () {
754        $(this).addClass('is-visible').dequeue();
755      })
756    })
757  }
758}
759
760// ==================  ready event  ====================== //
761$(function() {
762  COMMON.ANCHORLINK.setAnchorZero() //　早めに実行
763  COMMON.COMMON_OBJECT.init()
764  COMMON.HEADER.init()
765  COMMON.ACCORDION.init()
766  COMMON.FOOTER.init()
767
768  // ==================  scroll event  ====================== //
769  $(window).on('scroll resize',function() {
770    COMMON.EFFECT.scrollEffect()
771  })
772})
773
774// ==================  load event  ====================== //
775$(window).on('load',function() {
776  COMMON.ANCHORLINK.init()
777  COMMON.EFFECT.scrollEffect()
778})
779
780// ==================  resize event  ====================== //
781$(window).on('load resize orientationchange',function() {
782  COMMON.COMMON_OBJECT.adjustVw()
783})