﻿/* main */
.main .summary h1 {
	font-size: 1.5rem;
}

.main .summary img {
	width: 128px;
	height: 128px;
}

.main .summary p {
	font-size: 1.25rem;
}

/* pickup */
.summary {
	padding: 0.25rem;
}

	.summary h1 {
		margin-top: 0;
		margin-bottom: 0;
		padding: 0.75rem;
		font-size: 1.25rem;
		font-weight: normal;
	}

	.summary > a {
		display: block;
		color: #ffffff;
		background-color: #0b61b7;
		text-decoration: none;
	}

		.summary > a:hover {
			opacity: 0.8;
		}

	.summary img {
		width: 48px;
		height: 48px;
	}

	.summary span {
		display: block;
		padding-top: 0.75rem;
		padding-bottom: 0.75rem;
		text-align: center;
		background-color: #efefef;
	}

	.summary p {
		margin-top: 0;
		margin-bottom: 0;
		padding: 0.5rem 0.75rem;
		background-color: #323232;
		line-height: 150%;
	}

/* info */
.info {
	display: flex;
	flex-direction: column;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}

	.info h2 {
		display: flex;
		justify-content: space-between;
		border: 1px solid #045bb3;
		border-left-width: 0.5rem;
		margin: 0.25rem;
		padding: 0.5rem 0 0.5rem 0.5rem;
		font-size: 1.25rem;
	}

		.info h2 a {
			display: block;
			margin-right: 0.5rem;
			font-size: 1.25rem;
			font-weight: normal;
		}

		.info h2 i {
			margin-right: 0.25rem;
			color: #333333;
			font-size: 1.0rem;
		}

/******** layout ********/

/* < 360px */
@media (max-width: 359px) {
}

/* < 600px */
@media (max-width: 599px) {
}

/* < 768px */
@media (max-width: 767px) {

	/* main */
	.main .summary h1 {
		font-size: 1.25rem;
	}

	.main .summary img {
		width: 64px;
		height: 64px;
	}

	.main .summary p {
		font-size: 1.0rem;
	}

	/* pickup */
	.summary h1 {
		font-size: 1.25rem;
	}
}

/* >= 768px */
@media (min-width: 768px) {

	/* pickup */
	.pickup {
		display: flex;
		padding-top: 0.75rem;
	}

	div[class^="pickup-"] {
		display: flex;
		flex-grow: 1;
		flex-wrap: wrap;
		width: 50%;
	}

		div[class^="pickup-"] .summary {
			width: 100%;
		}

			div[class^="pickup-"] .summary p {
				height: 64px;
			}
}

/* >= 1024px */
@media (min-width: 1024px) {

	/* pickup */
	div[class^="pickup-"] .summary p {
		height: 48px;
	}
}
