/*--------------------------------------------------------------
@media
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
		
	.photo-area {
		background: url(web_hoshi_0319.jpg) center no-repeat;
		background-size: cover;
		margin: 0;
		padding: 0;
		width: 100%;
		height: 200px;
	}
		
	.contact-area {
		margin: 20px 30px 0 30px;
		padding: 30px 0 0 0;
		overflow: hidden;
	}
	
	.bgimg {
		background: url(../images/illust-2.svg) right top no-repeat;
		-webkit-background-size: 120px auto;
		background-size: 120px auto;
	}
	
	.contact-area h5 {
		margin: 0 0 20px 0;
		padding: 0;
		font-size: 18px;
		font-weight: 600;
		letter-spacing: 1px;
	}
	
	.contact-area p {
		font-size: 14px;
		line-height: 1.8;
	}
	
	.contact-area p.style1 {
		margin: 0 0 20px 0;
		padding: 0;
	}
	
	.contact-area p.style2 {
		margin: 0 0 30px 0;
		padding: 0;
		overflow: hidden;
	}
	
	.contact-area dl {
		margin: 0 0 50px 0;
		padding: 0;
	}
	
	.contact-area dt {
		margin: 0 0 15px 0;
		padding: 0;
		color: #20b4e0;
		font-size: 30px;
		font-weight: 600;
		line-height: 1;
	}
	
	.contact-area dt i {
		margin: 0 10px 0 0;
		padding: 0;
		font-size: 25px;
	}
	
	.contact-area dd {
		margin: 0;
		padding: 0;
		font-size: 14px;
	}
	
	.contact-area dd br {
		display: inherit;
	}
	
	.contact-area dd span {
		margin: 0 0 5px 0;
		padding: 5px 0;
		font-weight: 500;
		border-top: 1px solid #4c4c4c;
		border-bottom: 1px solid #4c4c4c;
		border-right: none;
		border-left: none;
		display: block;
	}
	
}
/* Small than tablet */
@media (min-width: 768px) {
		
	.photo-area {
		width: 100%;
		height: 300px;
	}
	
	.contact-area {
		margin: 20px 5% 0 5%;
	}
	
	.bgimg {
		-webkit-background-size: 200px auto;
		background-size: 200px auto;
	}
	
	.contact-area p.style1 {
		margin: 0 0 10px 0;
		padding: 0;
	}
		
	.contact-area dd span {
		margin: 0 15px 0 0;
		padding: 0 10px;
		font-weight: 500;
		border-top: none;
		border-bottom: none;
		border-right: 2px solid #4c4c4c;
		border-left: 2px solid #4c4c4c;
		display: inline;
	}
	
	.contact-area dd br {
		display: none;
	}

}


/* Larger than tablet */
@media (min-width: 992px) {
		
	.contact-area h5 {
		margin: 0 0 20px 0;
		padding: 0;
		font-size: 20px;
	}
	
	.contact-area dt {
		font-size: 40px;
	}
	
	.contact-area dt i {
		font-size: 35px;
	}
	
}