@charset "UTF-8";

.lead {
	background-image:url(/ec/images/feature/110E0K03000/lead_bg.webp);
	background-repeat: no-repeat;
	padding: 5.33vw 0;
	text-align: center;
}
@media screen and (min-width: 813px) {
  .lead {
	  padding: 40px 0;
	}
}

.coollimit_logo {
	max-width: 53.33vw;
	height: auto;
	margin: 0 auto 3.47vw;
	filter: drop-shadow(0px 0px 5px #FFF);
}
@media screen and (min-width: 813px) {
  .coollimit_logo {
	  max-width: 480px;
	  margin-bottom: 30px;
	}
}

.lead p {
	font-size: 2.67vw;
	line-height: 1.5em;
	color: #4d4d4d;
}
@media screen and (min-width: 813px) {
  .lead p {
	  font-size: 24px;
	}
}

.lead p span {
	color: #0046aa;
	font-weight: bold;
}

.lineup {
	background: linear-gradient(to right, #003caa, #0080cb);
	padding: 5.33vw 0;
}
@media screen and (min-width: 813px) {
  .lineup {
	  padding: 50px 0;
	}
}

.lineup_ttl {
	max-width: 69.33vw;
	height: auto;
	margin: 0 auto 5.33vw;
	filter: drop-shadow(0px 0px 5px #1464c8);
}
@media screen and (min-width: 813px) {
  .lineup_ttl {
	  width: 623px;
	  margin: 0 auto 55px;
	}
}

.lineup_list {
	width: 100%;
	height: auto;
	display: flex;
	align-items: space-between;
	padding: 0 3.73vw;
	gap: 0 3.73vw; /*カード同士の余白*/
	flex-wrap: wrap;
}
@media screen and (min-width: 813px) {
	.lineup_list {
		padding: 0 30px;
		gap: 0 30px; /*カード同士の余白*/
	}
}
.lineup_list  li {
	flex-basis: calc((100% - 3.73vw) / 2); /*（全体の幅 - gapでつけた余白の合計）をカラム数で割る */
	margin-bottom: 3.73vw;
	filter: drop-shadow(0px 0px 5px #1464c8);
}
@media screen and (min-width: 813px) {
	.lineup_list  li {
		flex-basis: calc((100% - 30px) / 2); /*（全体の幅 - gapでつけた余白の合計）をカラム数で割る */
		margin-bottom: 30px;
	}
}
.about_qmax {
	background-image:url("/ec/images/feature/110E0K03000/about_qmax_bg_start.webp"), url("/ec/images/feature/110E0K03000/about_qmax_bg_end.webp"),linear-gradient(to right, #003caa, #0080cb);
	background-repeat: no-repeat, no-repeat, no-repeat;
	background-position: top, bottom, right;
	background-size: 100%;
	padding: 12vw 0 5.33vw;
	text-align: center;
}
@media screen and (min-width: 813px) {
	.about_qmax {
		padding: 100px 0 45px;
	}
}

.about_qmax_ttl {
	max-width: 42.67vw;
	height: auto;
	margin: 0 auto 4vw;
}
@media screen and (min-width: 813px) {
	.about_qmax_ttl {
		max-width: 386px;
		margin: 0 auto 35px;
	}
}

.about_qmax p {
	font-size: 3.2vw;
	line-height: 1.5em;
	color: #4d4d4d;
	margin-bottom: 4vw;
}
@media screen and (min-width: 813px) {
	.about_qmax p {
		font-size: 24px;
		margin-bottom: 40px;
	}
}

.about_qmax p span {
	font-weight: bold;
	color: #00b1ef;
}

.about_qmax img {
	width: 89.33vw;
	height: auto;
}
@media screen and (min-width: 813px) {
	.about_qmax img {
		width: 804px;
	}
}

.features {
	background-image:url(/ec/images/feature/110E0K03000/features_bg.webp);
	background-repeat: no-repeat;
	background-position: bottom;
	padding: 7.47vw 4vw 4vw;
}
@media screen and (min-width: 813px) {
	.features {
		padding: 70px 40px 40px;
	}
}

.features_ttl {
	max-width: 58.67vw;
	height: auto;
	margin: 0 auto 5.33vw;
}
@media screen and (min-width: 813px) {
	.features_ttl {
		width: 528px;
		margin: 0 auto 50px;
	}
}

.features_list {
	display:flex;
	align-items: space-between;
	flex-wrap: wrap;
	gap: 0 5.33vw; /*カード同士の余白*/
}
@media screen and (min-width: 813px) {
	.features_list {
		gap: 0 40px; /*カード同士の余白*/
	}
}

.list_wrap {
	/*max-width: 42.67vw;
	height: auto;*/
	flex-basis: calc((100% - 5.33vw) / 2); /*（全体の幅 - gapでつけた余白の合計）をカラム数で割る */
	margin-bottom: 2.67vw;
	display: flex;
	align-items: space-between;
}
@media screen and (min-width: 813px) {
	.list_wrap {
		/*width: 384px;*/
		flex-basis: calc((100% - 40px) / 2); /*（全体の幅 - gapでつけた余白の合計）をカラム数で割る */
		margin-bottom: 24px;
	}
}

.features_img {
	max-width: 17.33vw;
	height: auto;
	margin-right: 1.87vw;
}
@media screen and (min-width: 813px) {
	.features_img {
		width: 156px;
		margin-right: 15px;
	}
}

.features_txt {
	/*max-width: 23.2vw;*/
	height: auto;
}
@media screen and (min-width: 813px) {
	.features_txt {
		width: 209px;
	}
}

.item_name {
	font-size: 2.93vw;
	line-height: 1.5em;
	font-weight: bold;
	color: #00b1ef;
}
@media screen and (min-width: 813px) {
	.item_name {
		font-size: 24px;
	}
}

.item_txt {
	font-size: 2.53vw;
	line-height: 1.5em;
	color: #4d4d4d;
}
@media screen and (min-width: 813px) {
	.item_txt {
		font-size: 19px;
	}
}




@media screen and (min-width: 813px) {
  .sp {
    display: none;
  }
}

@media screen and (max-width: 812px) {
  .pc {
    display: none;
  }
}
