@charset "utf-8";

/*==================================================
    ■ fv_move start
==================================================*/
/* ファーストビューでの動き */
.fv_move {
    animation-name:fadeUpAnime;
    animation-duration:3s;
    animation-fill-mode:forwards;
    opacity: 0;
}
    @media (max-width: 640px) {
        .fv_move {
            animation-name:none;
            opacity: 1;
        }
    }
@keyframes fadeUpAnime{
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* ファーストビューでの動き */
.fv_move_index {
    animation-name:fv_move_index;
    animation-duration:3s;
    animation-fill-mode:forwards;
    opacity: 0;
}
    @media (max-width: 640px) {
        .fv_move {
        }
    }
@keyframes fv_move_index{
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* ファーストビューでの動き */
.select_box_share {
    animation-name:select_box_share;
    animation-duration:0.3s;
    animation-fill-mode:forwards;
    opacity: 0;
}
@keyframes select_box_share{
  from {
    opacity: 0;
    transform: translate(0px, 30px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}
/* ファーストビューでの動き */
.page_title dl dt {
    animation-name:select_box_share2;
    animation-duration:0.5s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 0.8s;
}
@keyframes select_box_share2{
  from {
    opacity: 0;
    transform: translate(0px, 50px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}
/* ファーストビューでの動き */
.page_title dl dd {
    animation-name:select_box_share3;
    animation-duration:0.5s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 0.9s;
}
@keyframes select_box_share3{
  from {
    opacity: 0;
    transform: translate(0px, 50px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}

/* ファーストビューでの動き */
.page_title {
  overflow: hidden;
  position: relative;
}
.page_title::before {
  animation: img-wrap 1s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  background: #fff;
  content: '';
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}
@keyframes img-wrap {
  100% {
    transform: translateX(100%);
  }
}

/* ファーストビューでの動き */
.product_navi li:nth-child(1), 
.quality_navi li:nth-child(1), 
.company_navi li:nth-child(1), 
#interview .bl1 li:nth-child(1)  {
    animation-name:select_box_share4;
    animation-duration:0.5s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 0.9s;
}
.product_navi li:nth-child(2), 
.quality_navi li:nth-child(2), 
.company_navi li:nth-child(2), 
#interview .bl1 li:nth-child(2) {
    animation-name:select_box_share4;
    animation-duration:0.5s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 1.2s;
}
.product_navi li:nth-child(3), 
.quality_navi li:nth-child(3), 
.company_navi li:nth-child(3), 
#interview .bl1 li:nth-child(3) {
    animation-name:select_box_share4;
    animation-duration:0.5s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 1.4s;
}
.product_navi li:nth-child(4),
#interview .bl1 li:nth-child(4) {
    animation-name:select_box_share4;
    animation-duration:0.5s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 1.6s;
}
#interview .bl1 li:nth-child(5) {
    animation-name:select_box_share4;
    animation-duration:0.5s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 1.8s;
}
@keyframes select_box_share4{
  from {
    opacity: 0;
    transform: translate(0px, 50px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}

/* ファーストビューでの動き */
#news .wrap1 .bl1 li:nth-child(1)  {
    animation-name:select_box_share6;
    animation-duration:0.2s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 0.9s;
}
#news .wrap1 .bl1 li:nth-child(2){
    animation-name:select_box_share6;
    animation-duration:0.2s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 1s;
}
#news .wrap1 .bl1 li:nth-child(3){
    animation-name:select_box_share6;
    animation-duration:0.2s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 1.1s;
}
#news .wrap1 .bl1 li:nth-child(4)  {
    animation-name:select_box_share6;
    animation-duration:0.2s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 1.2s;
}
#news .wrap1 .bl1 li:nth-child(5)  {
    animation-name:select_box_share6;
    animation-duration:0.2s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 1.3s;
}
@keyframes select_box_share6{
  from {
    opacity: 0;
    transform: translate(0px, 10px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}
/* ファーストビューでの動き */
#product .wrap1,
#clp .wrap1,
#gtr .wrap1,
#ub2 .wrap1,
#new_technology .wrap1,
#quality .wrap1,
#company .wrap1,
#greeting .wrap1,
#access .wrap1,
.pro_share1,
.product_navi2,
.product_navi3,
.product_navi4,
.product_navi5,
#recruit .wrap1,
#interview .wrap1,
#contact .wrap1{
    animation-name:select_box_share5;
    animation-duration:0.5s;
    animation-fill-mode:forwards;
    opacity: 0;
    animation-delay: 1.1s;
}
@keyframes select_box_share5{
  from {
    opacity: 0;
    transform: translate(0px, 50px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}
/*==================================================
    ■ obj start
==================================================*/

.fadeInDown {
	animation-name: fadeInDown;
	animation-duration: 0.5s;/* ふわっとする時間 */
	animation-fill-mode: forwards;
}

@keyframes fadeInDown {
    0% {opacity: 0;}
    100% {opacity: 1; transform: translate(0)}
}

/* アニメーションスタートの遅延時間を決める */
.delay01{animation-delay: 0.1s;}
.delay02{animation-delay: 0.2s;}
.delay03{animation-delay: 0.3s;}
.delay04{animation-delay: 0.4s;}
.delay05{animation-delay: 0.5s;}

/* フェードイン */
.obj {	opacity: 0;}

/* 上から下 */
.obj_down01 { transform: translateY(-10px);}
.obj_down02 { transform: translateY(-20px);}
.obj_down03 { transform: translateY(-30px);}
.obj_down04 { transform: translateY(-40px);}
.obj_down05 { transform: translateY(-50px);}
.obj_down06 { transform: translateY(-60px);}
.obj_down07 { transform: translateY(-70px);}
.obj_down08 { transform: translateY(-80px);}
.obj_down09 { transform: translateY(-90px);}
.obj_down10 { transform: translateY(-100px);}

/* 下から上 */
.obj_up01 { transform: translateY(10px);}
.obj_up02 { transform: translateY(20px);}
.obj_up03 { transform: translateY(30px);}
.obj_up04 { transform: translateY(40px);}
.obj_up05 { transform: translateY(50px);}
.obj_up06 { transform: translateY(60px);}
.obj_up07 { transform: translateY(70px);}
.obj_up08 { transform: translateY(80px);}
.obj_up09 { transform: translateY(90px);}
.obj_up10 { transform: translateY(100px);}

/* 右から左 */
.obj_left01 { transform: translateX(-10px);}
.obj_left02 { transform: translateX(-20px);}
.obj_left03 { transform: translateX(-30px);}
.obj_left04 { transform: translateX(-40px);}
.obj_left05 { transform: translateX(-50px);}
.obj_left06 { transform: translateX(-60px);}
.obj_left07 { transform: translateX(-70px);}
.obj_left08 { transform: translateX(-80px);}
.obj_left09 { transform: translateX(-90px);}
.obj_left10 { transform: translateX(-100px);}

/* 左から右 */
.obj_right01 { transform: translateX(10px);}
.obj_right02 { transform: translateX(20px);}
.obj_right03 { transform: translateX(30px);}
.obj_right04 { transform: translateX(40px);}
.obj_right05 { transform: translateX(50px);}
.obj_right06 { transform: translateX(60px);}
.obj_right07 { transform: translateX(70px);}
.obj_right08 { transform: translateX(80px);}
.obj_right09 { transform: translateX(90px);}
.obj_right10 { transform: translateX(100px);}

/*==================================================
    ■ obj start
==================================================*/