main > section:nth-child(2n-1) {
  background: rgb(247, 253, 253);
}
main > section > div {
  padding: 4rem 28rem;
  display: flex;
  justify-content: space-between;
}
main > section:nth-child(2n) > div {
  flex-direction: row-reverse;
}
main > section > div .book {
  flex-basis: 28rem;
}
main > section > div .book > img {
  width: 100%;
}
main > section > div .book + div {
  padding-top: 4rem;
  width: calc(100% - 40rem);
}
main > section + section > div .book {
  flex-basis: 40rem;
}
main > section > div .mentor {
  display: flex;
  flex-direction: column;
}
main > section > div .mentor .title + div {
  display: flex;
  justify-content: space-between;
}
main > section > div .mentor .title + div > div {
  display: flex;
  flex-direction: column;
  align-items: center;
}
main > section > div .mentor img {
  width: 200px;
}
main {
  letter-spacing: 0.2em;
  font-size: 1.4rem;
}
.main-color {
    color: rgb(60, 198, 196);
}
h2 {
  position: relative;
  font-weight: 500;
  margin-bottom: 3rem;
}
h2::before {
  position: absolute;
  left: 0;
  bottom: -1.5rem;
  content: "";
  width: 14rem;
  height: 0.4rem;
  border-radius: 0.5rem;
  background: rgb(57, 198, 195);
}
.desc {
  margin-bottom: 2rem;
  font-weight: 700;
}
.desc ul {
  padding-left: 1.1rem;
  /* list-style-type: "*"; */
  list-style: disc;
}
.function p {
  margin-bottom: 2rem;
  line-height: 2.5em;
  font-size: 1.3rem;
  letter-spacing: 0.2rem;
}
.function p:last-child {
  margin: 0;
}
main ol {
  padding-left: 2.5rem;
  list-style-type: decimal;
}
main li {
  margin: 0.5rem 0;
}
.title {
  margin: 2rem 0 1rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgb(60, 198, 196);
  font-size: 1.4rem;
}
.title::before,.title::after {
  position: absolute;
  top: 50%;
  content: "";
  width: 43%;
  height: 0.1rem;
  background-color: rgb(60, 198, 196);
}
.title::before {
  left: 0;
}
.title::after {
  right: 0;
}
.title + div {
  letter-spacing: 0.3em;
}
.mentor span {
  line-height: 2em;
}
.content {
  margin-top: 3rem;
  line-height: 2em;
}
.content span {
  position: relative;
  padding-left: 1.8rem;
}
.content span::before {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-40%);
  content: "";
  width: 1rem;
  height: 1rem;
  background: black;
}
@media only screen and (max-width: 875px){
	body main > section > div{
		    padding: 4rem 2rem;
	}
	body main > section > div .book + div{
		    width: 50%;
	}
	body main > section:nth-child(2) > div .book > img{
		padding-top: 4rem;
	}
}
@media only screen and (max-width: 490px){
	html {
	    height: 100%;
	    font-size: 12px;
	    -webkit-text-size-adjust: 100%;
	}
	body h2 {
		position: relative;
		margin-bottom: 3rem;
		font-size: 1.5rem;
		font-weight: 700;
		letter-spacing: 0.15em;
	}
	body main > section {
	    padding: 0 2rem;
	}
	body main > section > div{
		padding: 3rem 0;
		flex-direction: column;
		align-items: center;
	}
	body main > section > div .book{
		text-align: center;
		flex-basis: 28rem;
	}

	body main > section > div .book > img{
		width: 60%;
	}
	body main > section:nth-child(2n) > div{
		flex-direction: column;
	}
	body main > section:nth-child(2) > div .book > img,body main > section:nth-child(3) > div .book > img{
		width: 80%;
	}

	body main > section > div .book + div{
		width: 100%;
		padding-top: 0;
	}
	body main li{
		line-height: 1.7;
		font-size: 1rem;
		letter-spacing: 0.1rem;
		font-weight: 500;
	}
	body main .function p{
		line-height: 1.7;
		font-size: 1rem;
		letter-spacing: 0.1rem;
	}
	body main .function li{
		font-weight:normal;
	}
	body main > section > div .mentor .title + div{
		flex-direction: column;
	}
	body .title::before,.title::after {
	  width: 35%;
	}
	body main .desc{
		line-height: 1.7;
		font-size: 1rem;
		letter-spacing: 0.1rem;
	}
	body main .content,body main .mentor span{
		line-height: 1.7;
		font-size: 1rem;
		letter-spacing: 0.1rem;
	}
}