@charset "UTF-8";
/*fonts*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600&display=swap');
/* CSS Remedy */
/* base */
html {}
body {
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 500;
  background-image:
    radial-gradient(#e2e2e2 10%, transparent 10%),
    radial-gradient(#e2e2e2 10%, transparent 10%);
  background-size: 20px 20px;
  background-position: 0 0, 20px 20px;
  color: #000;
}

a{color: #515151;}
a:hover{color: #000; }

#body-ai{
	position: relative;
  	width: 100%;
  	min-height: 100vh;
	padding: 2.0rem;
	background: url("../images/ai-bg.svg") no-repeat right top;
}

h1 {
	display:flex;
	justify-content: center;
	align-items: center;
	text-align: center;
}

.tlt{
	display:flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	font-weight: bold;
	font-size: 20px;
	letter-spacing:2px;
	margin-bottom: 3rem;
}


ol {
  padding: 0;
  counter-reset: list;
  list-style-type: none;
}

ol li {
  position: relative;
  line-height: 30px;
  margin: 7px 0 7px 40px;
  padding-left: 10px;
  color: #2A2A2A;
}
ol li:before {
  counter-increment: list;
  content: counter(list);
  position: absolute;
  left: -35px;
  width: 30px;
  height: 30px;
  background: #00ff41;
  color: #000000;
  border: 2px solid #000;
  text-align: center;
  top: 50%;
  transform: translateY(-50%);
}

ul li{
	line-height: 2;
}

hr{
	height: 0;
  margin: 2rem 0;
  padding: 0;
  border: 0;
border-top: 2px solid #000;
}

h2{
	margin-bottom: 1rem;
}

h3{
	margin-top: 2rem;
}

.inner {  
width: 700px;
	margin: 0 auto 3rem;}

.center{
	text-align: center;
}

footer {
  text-align: center;
  background: #2A2A2A;
  padding: 20px;
}
footer p {
  color: #fff;
}
footer p span {
  font-weight: bold;
  font-size: 120%;
}

/* MediaQuery */

@media screen and (max-width: 600px) {
html {font-size: 80%;}
.inner {  
width: 95%;
	}
	footer p small{
		display: block;
	}
}