/* キャッチコピー */
#catch-copy{
  padding-top:52px;
  padding-bottom: 60px;
  text-align: center;
}
#catch-copy .title{
  padding-top: 50px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}
#catch-copy .title img{
  width:80%;
  object-fit: contain;
}
#catch-copy .description{
  padding-top: 35px;
  padding-left: 20px;
  padding-right: 20px;
  font-size: 18px;
  line-height: 1.8em;
}
#catch-copy .c1{
  display: flex;
  justify-content: center;
}
#catch-copy .button{
  padding-top: 35px;
  padding-left: 20px;
  padding-right: 20px;
  width: 100%;
}
#catch-copy .button a{
  height: 50px;
  font-size: 18px;
  width: 100%;
  max-width: 280px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#catch-copy .image{
  padding-top: 15px;
  padding-left: 0px;
  padding-right: 0px;
}
#catch-copy .image img{
  width: 100%;
  object-fit: contain;
}

/* デザインハブの概要 */
#designhub{
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 40px;
}
#designhub .text{
	padding-left: 20px;
  padding-right: 20px;
}
#designhub .text h2{
	padding-top: 46px;
  padding-bottom: 40px;
}
#designhub .description{
  font-size: 16px;
  line-height: 2em;
}
#designhub .link{
  padding-top:40px;
  padding-left:0;
}
#designhub .image{
  padding-top: 40px;
  padding-left: 0;
  padding-right: 0;
}
#designhub .image img{
  width: 100%;
  object-fit: contain;
}

/* デザインハブの特徴（メリット） */
#merit{
  padding-bottom: 60px;
}

#merit .title{
	padding-top: 60px;
  padding-bottom: 10px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
}
#merit .c1{
  display: flex;
  justify-content: space-between;
  flex-wrap:wrap;
  margin-left: 10px;
  margin-right: 10px;
}
#merit .div3{
  margin-top: 30px;
  width: 50%;
  min-width: 100px;
}
#merit .div3 h3{
  margin-top:10px;
  padding-left: 10px;
  padding-right: 10px;
  text-align: center;
}
#merit .div3 div{
  margin-top:10px;
  line-height: 1.5em;
  padding-left: 10px;
  padding-right: 10px;
  text-align: left;
}
#merit .div3 div.image{
  margin-top: 0px;
  margin-left: 0px;
  text-align: center;
}
#merit .image img{
  width: 80px;
  object-fit: contain;
}
#merit .c2{
  display: flex;
  justify-content: center;
}
#merit .button3{
  margin-top: 40px;
  margin-left: 20px;
  margin-right: 20px;
}
#merit .button3 a{
  width: 280px;
  height: 40px;
  font-size: 16px;
}

/* デザインシステムのテンプレート */
#template{
  padding-bottom: 60px;
}

#template .text{
	text-align: center;
  justify-content: center;
  padding-top: 60px;
  padding-left: 20px;
  padding-right: 20px;
}
#template .point{
  font-size:24px;
  color: #03A9F4;
  font-weight: bold;
}
#template h2{
	padding-top:20px;
  padding-bottom:40px;
}
#template .text .description{
  line-height: 2em;
}

#template .c1{
  display: flex;
  flex-wrap:wrap;
  justify-content: space-between;
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
}
#template .div2{
  padding-top: 40px;
  width: 100%;
}
#template .div2 h3{
  padding-top:32px;
  padding-bottom:20px;
  text-align: center;
}
#template .div2 .text2{
  padding-left:20px;
  padding-right:20px;
}
#template .image{
  width: 100%;
  margin-top: 0;
  text-align: center;
}
#template .image img{
  width: 100px;
  object-fit: contain;
}
#template .c2{
  display: flex;
  justify-content: center;
}
#template .button3{
  padding-top: 30px;
}
#template .button3 a{
  width: 280px;
  height: 40px;
  font-size: 16px;
}


/* 料金プラン */
#cost{
  padding-bottom: 60px;
  text-align: center;
}

#cost h2{
	padding-top:60px;
  padding-bottom:10px;
}

/* 推奨環境 */
#requirements{
  padding-bottom: 60px;
  text-align: center;
}

#requirements h2{
	padding-top:60px;
  padding-bottom:10px;
}

#requirements .c1{
  display: flex;
  justify-content: space-between;
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
}

#requirements .text2{
  text-align: left;
}