/* CSS Document */

/*スクロールダウン全体の場所*/
.scrolldown4{
	position: absolute;
    bottom: 1%;
    right: 25px;
    animation: arrowmove 1.25s ease-in-out infinite;
    z-index: 4;
}

/*下からの距離が変化して全体が下→上→下に動く*/
@keyframes arrowmove{
      0%{bottom:1%;}
      50%{bottom:3%;}
     100%{bottom:1%;}
 }

/*Scrollテキストの描写*/
.scrolldown4 span{
	position: absolute;
    left: -25px;
    bottom: -1px;
    color: #eee;
    font-size: 0.8rem;
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
    font-weight: 600;
    letter-spacing: 2px;
}

/* 矢印の描写 */
.scrolldown4:before {
    content: "";
    /*描画位置*/
    position: absolute;
    bottom: 0;
    right: -3px;
    /*矢印の形状*/
    width: 1px;
    height: 10px;
    background: #eee;
    transform: skewX(-31deg);
}

.scrolldown4:after{
	content:"";
    /*描画位置*/
	position: absolute;
	bottom:0;
	right:0;
    /*矢印の形状*/
	width:1px;
	height: 50px;
	background:#eee;
}

@media(max-width:1000px){
  .scrolldown4{
    margin-right: calc(50% - 40px);
  }
}

@media(max-width:660px){
	
	@keyframes arrowmove{
      0%{bottom:20px;}
      50%{bottom:30px;}
     100%{bottom:20px;}
 }
  
  .scrolldown4 span {
    font-size: 0.6rem;
    font-weight: 400;
    left: -20px;
  }
  
  .scrolldown4:after {
    height: 35px;
  }
	
	
}