body {
 margin:0;	padding:0;
 width:98%;
 overflow:auto;
}
 body::-webkit-scrollbar {
	width:10px;
	height:10px;
}
 body::-webkit-scrollbar-thumb {
	background: darkred;
}
.obi {
	display:inline-block;
	background: -moz-linear-gradient(left, #cc0000 , #330000);
  	background: -webkit-linear-gradient(left, #cc0000 , #330000);
  	background: linear-gradient(to right, #cc0000 , #330000);
	padding-left:12px;
	padding-top:12px;
	color:ivory;
	font-weight:bold;
	height:38px;
	width:100%;
	vertical-align:middle;
}
video {
	margin: 0 auto;
}
 .vido {
	margin: 0 auto;
	width: 100%;
 }
.cach {
	position:relative;
}
.girl {
	position:relative;
	top:-40px;
	left:20px;
	margin-bottom:-40px;
	float:left;
	z-index:40;
	width: 60%;
	height: 60%;
}
.slow {
	position:absolute;
	right:20px;
	top:32px;
	z-index:30;
	padding-right:8px;
}
 .cercle {
 	position:relative;
	display:inline-block;
	width:80px;
	height:50px;
	border-radius:50%;
	text-align:center;
	line-height: 50px;
	color:white;
	text-shadow:2px 2px 3px #C0C0C0;
	box-shadow:4px 4px 2px black;
	opacity:90%;
}
.blue {
	background: -moz-linear-gradient(left, #000055 , #0000FF);
  	background: -webkit-linear-gradient(left, #000055 , #0000FF);
  	background: linear-gradient(to right, #000055 , #0000FF);
}
.red {	
	background: -moz-linear-gradient(left, #550000 , #FF0000);
  	background: -webkit-linear-gradient(left, #550000 , #FF0000);
  	background: linear-gradient(to right, #550000 , #FF0000);
}
.green{
	background: -moz-linear-gradient(left, #005500 , #00FF00);
  	background: -webkit-linear-gradient(left, #005500 , #00FF00);
  	background: linear-gradient(to right, #005500 , #00FF00);
}
.waku {
	position:relative;
	padding:20px;
	top:66px;
	display:block;	
	z-index:10;
	background-color:darkred;
	border-radius:10px;
	background-image:url('../pic/gr.png');
	width: 96%;
	height: 220px;
	margin: 0 auto;
}
.telo {
	position:absolute;
	display:inline-block;
	padding-left:16px;
	padding-right:16px;
	border:1px black dashed;
	padding-top:16px;
	color: white;
	font-size:1.2em;
	width:400px;
	height:120px;
	right: 20px;
}
.conte{
	position:relative;
	top:20px;
	width:98%;
	padding-left:2em;
	padding-right:1em;
	padding-top:8px;
	padding-bottom:8px;
	border-radius:5px;
	background-color:goldenrod;
	font-weight:bold;
	color:white;
	font-size:x-large;
}



.second {
	position:relative;
	background-color:white;
}

* {

  list-style: none;
  padding: 0;
  margin: 0;
}

.preload {
       width: 0px;
       height: 0px;
       display: inline;
	background-image:url('../pic/slider/1.png');
	background-image:url('../pic/slider/2.png');
	background-image:url('../pic/slider/3.png');
	background-image:url('../pic/slider/4.png');
	background-image:url('../pic/slider/5.png');
}


.obi2 {
	position:absolute;
	top:160px;
	left:200px;
	height:200px;
	font-size:1.4em;
}
.lis li {
	list-style:square;
}

.Frem {
	position:relative;
	margin-left:auto;
	margin-right:auto;
	padding:20px;
	width:900px;
	height:350px;
}

/* スライドする要素 */
.content {

  width: 280px;
  height: 280px;
}

/* スライドレールの枠 */
.wrap {
  overflow: hidden;
  display: flex;
  align-items: center;
  height: 300px;
  margin-bottom: 50px;
  opacity:20%;
}

/* content4つをまとめたスライドブロック */
.slideshow {
  display: flex;
  -webkit-animation: loop-slide 20s infinite linear 1s both;
  animation: loop-slide 50s infinite linear 1s both;
}

@-webkit-keyframes loop-slide { 
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

@keyframes loop-slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

.box p {
	padding-left:50px;
	padding-top:20px;
	padding-bottom:20px;
}