/* The legacy desktop list and phone list share one set of article cards. */
.mutuo-blog-list-responsive-template .blog-list-phone-promo { display: none; }
.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog { display: flow-root; }

@media (min-width: 801px) and (max-width: 1040px) {
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog {
		display: grid;
		grid-template-columns: min(200px, 35%) minmax(0, 1fr);
		column-gap: 10px;
		align-items: start;
		width: calc(100% - 40px);
		margin-right: 0;
	}
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog :is(.blogimg, .blogdesc) { width: 100%; min-width: 0; margin: 0; float: none; }
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog .blogimg img { box-sizing: border-box; max-width: 100%; height: auto; }
}

@media (max-width: 800px) {
	.mutuo-blog-list-responsive-template .contentblog { width: 100%; }
	.mutuo-blog-list-responsive-template .contentblog > .bloglist { width: 96.875%; margin: 0 auto; float: none; }
	.mutuo-blog-list-responsive-template .contentblog > .bloglist:has(> .listblog:first-child) { padding-top: calc(30 * var(--blog-article-unit)); }
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog {
		display: grid;
		grid-template-columns: calc(180 * var(--blog-article-unit)) minmax(0, 1fr);
		column-gap: calc(13 * var(--blog-article-unit));
		width: 100%;
		margin: 0;
		padding: 0 0 calc(15 * var(--blog-article-unit));
		border-bottom: 1px solid #ccc;
		float: none;
	}
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog.blog-list-phone-hidden { display: none; }
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog .blogdesc { display: contents; }
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog .blogdesc h1 {
		grid-column: 1 / -1;
		grid-row: 1;
		margin: calc(10 * var(--blog-article-unit)) 0;
		padding: 0;
		font-size: calc(34 * var(--blog-article-unit));
		line-height: normal;
		font-weight: bold;
	}
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog .blogdesc h1 a { color: #0066cc; }
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog .blogimg {
		grid-column: 1;
		grid-row: 2 / span 2;
		align-self: start;
		width: 100%;
		margin: 0;
		float: none;
	}
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog .blogimg img { width: 100%; height: auto; border: 0; display: block; }
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog .blogdesc > p {
		grid-column: 2;
		grid-row: 2;
		margin: 0;
		padding: 0;
		font-size: calc(26 * var(--blog-article-unit));
		line-height: 1.2;
		color: #666;
		text-align: justify;
	}
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog .blog-list-read-more {
		grid-column: 2;
		grid-row: 3;
		justify-self: end;
		align-self: start;
		margin: calc(20 * var(--blog-article-unit)) 0 0;
		font-size: calc(27 * var(--blog-article-unit));
		line-height: normal;
	}
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog .blog-list-read-more :is(a, p) { color: #0066cc; font-size: inherit; line-height: inherit; margin: 0; padding: 0; text-decoration: none; }
	.mutuo-blog-list-responsive-template .contentblog .bloglist .listblog:has(.blogdesc > p:empty) .blog-list-read-more { grid-row: 2; justify-self: start; }
	.mutuo-blog-list-responsive-template .blog-list-phone-promo { display: flow-root; clear: both; text-align: center; }
	.mutuo-blog-list-responsive-template .blog-list-phone-promo .btnmin { margin: calc(20 * var(--blog-article-unit)) auto calc(10 * var(--blog-article-unit)); }
	.mutuo-blog-list-responsive-template .blog-list-phone-promo:first-child .btnmin { margin-top: calc(40 * var(--blog-article-unit)); }
	.mutuo-blog-list-responsive-template .blog-list-phone-promo img { width: calc(375 * var(--blog-article-unit)); max-width: 100%; height: auto; }
	.mutuo-blog-list-responsive-template .blog-list-phone-promo .morebtnmin { margin: calc(40 * var(--blog-article-unit)) 0; text-align: left; }
	.mutuo-blog-list-responsive-template .blog-list-phone-promo h1 { font-size: calc(36 * var(--blog-article-unit)); margin-bottom: calc(40 * var(--blog-article-unit)); color: #0066cc; }
	.mutuo-blog-list-responsive-template .blog-list-phone-promo .img2btn { text-align: center; margin-bottom: calc(40 * var(--blog-article-unit)); }
	.mutuo-blog-list-responsive-template .blog-list-phone-promo img[src$="/mutuo-2btn.png"] { width: calc(403 * var(--blog-article-unit)); }
	.mutuo-blog-list-responsive-template .blog-list-phone-promo img[src$="/mobile-banner.png"] { width: calc(428 * var(--blog-article-unit)); }
}