
/* ------------------------------------------------------------ */

/* for Smart Phone */
:root {
	
	--width: 21em;
	
}

/* for Tablet */
@media (min-width: 768px) {
	
	#tweets {
		
		font-size: 1.8rem;
		
	}
	
	:root {
		
		--width: 18em;
		
	}
	
}

/* ------------------------------------------------------------ */
/* for tweet wrap */

#tweets {
	
	display: flex;
	
	flex-wrap: wrap;
	
	align-items: flex-start;
	
	margin: 1.2em 0 0;
	
}

.tweet_wrap {
	
	width: var(--width);
	
	margin: 0.7em auto;
	
	padding: 0.7em 0.9em 0.9em;
	
	border: 1px solid #cccccc;
	
	border-radius: 0.9em;
	
	box-shadow: 0.2em 0.2em 0.3em rgba(0, 0, 0, 0.4);
	
}

/* ------------------------------------------------------------ */
/* for tweet body */

.tweet_img {
	
	width: var(--width);
	
}

.img_h {
	
	height: calc(var(--width) / 3 * 4);
	
}

.img_w_3_2 {
	
	height: calc(var(--width) / 3 * 2);
	
}

.img_w_4_3 {
	
	height: calc(var(--width) / 4 * 3);
	
}

.img_w_16_9 {
	
	height: calc(var(--width) / 16 * 9);
	
}

.x {
	
	margin: 0 0 0 0.7em;
	
}

