/**
 * common.js
 *
 *  version --- 1.0
 *  updated --- 2017/11/30
 */

/* !pageScroll -------------------------------------------------------------- */
$(window).on('load resize', function () {
    $('a.js-scroll, .js-scroll a').each(function () {
        $(this).unbind('click').bind("click keypress", function (e) {
            e.preventDefault();
            var target = $(this).attr('href');
            var targetY = $(target).offset().top;
            var parent = 'html,body';
            $(parent).animate({
                    scrollTop: targetY
                },
                400
            );
            return false;
        });
    });
});


/* !common --------------------------------------------------- */
$(function () {
    //スマホグローバルナビ
    $(".btn-menu").click(function () {
        $("#g-navi").toggleClass("is-active");
        $(this).toggleClass("is-active");
    });

    $(window).resize(function () {
        setTimeout(function () {
            if ($(window).width() > 767) {
                $(".btn-menu").removeClass('is-active');
                $("#g-navi").removeClass('is-active');
            }
        }, 500);
    });

    $(window).scroll(function(){
        if($(window).scrollTop() > 100){
            $('.page-top').fadeIn();
        }else{
            $('.page-top').fadeOut();
        }
    });

    $('iframe').each(function(){
        var $this = $(this),
            $width = $this.attr('width'),
            $height = $this.attr('height');
        $this.before('<span class="iframe-wrap"><span class="iframe-wrap__box"></span></span>');

        var $wrap = $this.parent().find('.iframe-wrap'),
            $box = $wrap.children('.iframe-wrap__box');
        $wrap.css({
            'max-width': $width / 10 + 'rem'
        });
        $box.css({
            'padding-top': $height / $width * 100 + '%'
        });
        $this.clone(true).appendTo($box);
        $this.remove();
    });
    
    $('#g-navi .menu .page_item_has_children, #g-navi .menu .menu-item-has-children').each(function(){
        var $this = $(this);
        $this.append('<span class="target"></span>');
        var $target = $this.children('.target'),
            $box = $this.children('.children, .sub-menu');
        $target.click(function(){
            if($this.hasClass('is-active')){
                $this.removeClass('is-active');
                $box.stop().slideUp(200);
            }else{
                $this.addClass('is-active');
                $box.stop().slideDown(200);
            }
        });
    }); 


});