// ローディング↓↓↓

//SVGアニメーションの描画
var stroke;
stroke = new Vivus('mask', {//アニメーションをするIDの指定
    start:'manual',//自動再生をせずスタートをマニュアルに
    type: 'scenario-sync',// アニメーションのタイプを設定
    duration: 15,//アニメーションの時間設定。数字が小さくなるほど速い
    forceRender: false,//パスが更新された場合に再レンダリングさせない
    animTimingFunction:Vivus.EASE,//動きの加速減速設定
},
function(){
       $("#mask").attr("class", "done");//描画が終わったらdoneというクラスを追加
}
);

$(window).on('load',function(){
  $("#splash").delay(3000).fadeOut('slow');//ローディング画面を3秒（3000ms）待機してからフェイドアウト
	$("#splash_logo").delay(3000).fadeOut('slow');//ロゴを3秒（3000ms）待機してからフェイドアウト
        stroke.play();//SVGアニメーションの実行
});

// ローディング↑↑↑



// ヘッダーの表示非表示↓↓↓

var beforePos = 0;//スクロールの値の比較用の設定

//スクロール途中でヘッダーが消え、上にスクロールすると復活する設定を関数にまとめる
function ScrollAnime() {
    var elemTop = $('#area_top_sg').offset().top;//#area_top_sg"の位置まできたら
  var scroll = $(window).scrollTop();
    //ヘッダーの出し入れをする
    if(scroll == beforePos) {
    //IE11対策で処理を入れない
    }else if(elemTop > scroll || 0 > scroll - beforePos){
    //ヘッダーが上から出現する
    $('#header').removeClass('UpMove'); //#headerにUpMoveというクラス名を除き
    $('#header').addClass('DownMove');//#headerにDownMoveのクラス名を追加
    }else {
    //ヘッダーが上に消える
        $('#header').removeClass('DownMove');//#headerにDownMoveというクラス名を除き
    $('#header').addClass('UpMove');//#headerにUpMoveのクラス名を追加
    }
    
    beforePos = scroll;//現在のスクロール値を比較用のbeforePosに格納
}


// 画面をスクロールをしたら動かしたい場合の記述
$(window).scroll(function () {
  ScrollAnime();//スクロール途中でヘッダーが消え、上にスクロールすると復活する関数を呼ぶ
});

// ページが読み込まれたらすぐに動かしたい場合の記述
$(window).on('load', function () {
  ScrollAnime();//スクロール途中でヘッダーが消え、上にスクロールすると復活する関数を呼ぶ
});


// ヘッダーの表示非表示↑↑↑




// トップに戻るボタン↓↓↓

//スクロールした際の動きを関数でまとめる
function setFadeElement(){
	var windowH = $(window).height(); //ウィンドウの高さを取得
	var scroll = $(window).scrollTop(); //スクロール値を取得
	  
	  //出現範囲の指定
	var contentsTop = Math.round($('#top_bt1').offset().top);  //要素までの高さを四捨五入した値で取得
	var contentsH = $('#top_bt1').outerHeight(true); //要素の高さを取得
	  
	  //2つ目の出現範囲の指定※任意
	var contentsTop2 = Math.round($('#top_bt2').offset().top); //要素までの高さを取得
	var contentsH2 = $('#top_bt2').outerHeight(true);//要素の高さを取得

	//3つ目の出現範囲の指定※任意
	var contentsTop3 = Math.round($('#top_bt3').offset().top); //要素までの高さを取得
	var contentsH3 = $('#top_bt3').outerHeight(true);//要素の高さを取得
	

	  //出現範囲内に入ったかどうかをチェック
	if(scroll+windowH >= contentsTop && scroll+windowH  <= contentsTop+contentsH){
	  $("#page-top").addClass("LeftMove");    //入っていたらLeftMoveをクラス追加
	  $("#page-top").removeClass("RightMove");   //RightMoveを削除
	  $(".hide-btn").removeClass("hide-btn");   //hide-btnを削除
	}//2つ目の出現範囲に入ったかどうかをチェック※任意
	  else if(scroll+windowH >= contentsTop2 && scroll+windowH <= contentsTop2+contentsH2){       
	  $("#page-top").addClass("LeftMove");    //入っていたらLeftMoveをクラス追加
	  $("#page-top").removeClass("RightMove");   //RightMoveを削除
	}//3つ目の出現範囲に入ったかどうかをチェック※任意
	else if(scroll+windowH >= contentsTop3 && scroll+windowH <= contentsTop3+contentsH3){       
		$("#page-top").addClass("LeftMove");    //入っていたらLeftMoveをクラス追加
		$("#page-top").removeClass("RightMove");   //RightMoveを削除
	  }//それ以外は
	  else{
		  if(!$(".hide-btn").length){       //サイト表示時にRightMoveクラスを一瞬付与させないためのクラス付け。hide-btnがなければ下記の動作を行う
		$("#page-top").addClass("RightMove");  //RightMoveをクラス追加
		$("#page-top").removeClass("LeftMove"); //LeftMoveを削除
	  }   
	}
  }
  
  // 画面をスクロールをしたら動かしたい場合の記述
  $(window).scroll(function () {
	setFadeElement();/* スクロールした際の動きの関数を呼ぶ*/
  });
  
  // ページが読み込まれたらすぐに動かしたい場合の記述
  $(window).on('load', function () {
	setFadeElement();/* スクロールした際の動きの関数を呼ぶ*/
  });
  
  
  // #page-topをクリックした際の設定
  $('#page-top').click(function () {
	  $('body,html').animate({
		  scrollTop: 0//ページトップまでスクロール
	  }, 500);//ページトップスクロールの速さ。数字が大きいほど遅くなる
	  return false;//リンク自体の無効化
  });


// トップに戻るボタン↑↑↑

// クオリティページめくり↓↓↓

$(window).on('load resize', function() {
	var windowWidth = window.innerWidth;
	var elements = $('.sticky_item1');
	if (windowWidth >= 400) {
	  Stickyfill.add(elements);
	}else{
	  Stickyfill.remove(elements);
	} 
  });

	// クオリティページめくり↑↑↑