@charset "utf-8";

/* ------------------------------------------------------- */
/* Profile
---------------------------------------------------------- */
#profile {
	width: 1000px;
	margin: auto;
	display: flex;
	}

#profile #photo {
	width: 340px;
	margin: 0 40px 0 0;
	}

#profile #photo img {
	width: 100%;
	}

#profile #detail {
	width: 620px;
	background: rgba(255,255,255,0.5);
	border: 1px solid #ededed;
	padding: 40px;
	}

#profile #detail h3 {
	line-height: 0;
	margin: 0 0 15px 0;
	}

#profile #detail h3 img {
	width: 200px;
	}

#profile #detail .profile {
	margin: 0 0 20px 0;
	}

#profile #detail .profile dl {
	font-size: 1.6rem;
	border-top: 1px solid #ededed;
	padding: 10px 0;
	display: flex;
	flex-wrap: wrap;
	}

#profile #detail .profile dl:last-child {
	border-bottom: 1px solid #ededed;
	}

#profile #detail .profile dl dt {
	width: 100px;
	color: #69c3c8;
	text-align: center;
	border-left: 2px solid #69c3c8;
	border-right: 2px solid #69c3c8;
	}

#profile #detail .profile dl dd {
	width: calc(100% - 100px);
	padding: 0 0 0 30px;
	}

@media (max-width: 768px){
#profile {
	width: 100%;
	padding: 0 40px;
	display: block;
	}

#profile #photo {
	width: 100%;
	text-align: center;
	margin: 0 0 20px 0;
	}

#profile #photo img {
	width: 70%;
	}

#profile #detail {
	width: 100%;
	}
}

@media (max-width: 640px){
#profile {
	padding: 0 20px;
	}

#profile #photo img {
	width: 80%;
	}

#profile #detail {
	padding: 25px;
	}

#profile #detail h3 img {
	width: 180px;
	}

#profile #detail .profile dl {
	font-size: 1.4rem;
	}
}