/* Respective Size Define

1200px or more
992px - 1199px		Space 207px, iPad Horizontal View.
768px - 991px		Space 223px, iPad Vertical View.
600px - 767px		Space 167px, Mobile Horizontal View.
480px - 599px		Space 119px
320px - 479px		Space 159px, Mobile Vertical View.
319px or below

*/

.contact { background: #f0f0f0; color: #777; line-height: 1.3 }
.contact > div { padding: 60px }
/*.contact h3, .contact h4 { margin: 0; font-weight: 300 }
.contact h3 { font-size: 28px; color: #00b2ba }
.contact h4 { padding: 15px 0 5px 0; font-size: 16px }
.contact p { margin-top: 0; margin-bottom: 30px; font-weight: 300; font-size: 22px }
.contact ul { margin: 0; padding: 0; list-style: none }
.contact li:first-child { margin-bottom: 30px }
.contact td { padding: 3px 0; font-weight: 300; font-size: 16px; vertical-align: top }
.contact td:first-child { padding-right: 30px }*/

.contact p { margin-top: 0; font-weight: 300; font-size: 22px }
.contact a { color: #00b2ba; text-decoration: none }
.contact a:hover { color: #93d5db; text-decoration: underline }

.contact .address-board { display: table; margin: 0; padding: 0; list-style: none; width: 100%; border-collapse: collapse }
.contact .address-board > li { display: table-cell; padding: 30px; width: 50%; background: white; border: solid 30px #f0f0f0 }
.contact .address-board > li:first-child { border-left: 0 }
.contact .address-board > li:last-child { border-right: 0 }
.contact .address-board iframe { display: block; margin-top: 15px; width: 100%; height: 300px }
.contact .address-board h3 { font-weight: 300; font-size: 24px; color: #005a65 }
.contact .address-board h4 { position: absolute; margin-top: 25px; font-weight: 500; font-size: 16px }
.contact .address-board table { margin-top: 50px; font-weight: 300 }
.contact .address-board td { padding-bottom: 10px; vertical-align: top; font-size: 15px }
.contact .address-board td:first-child { padding-right: 10px }

/*@media (max-width: 479px) {
	.contact > div { padding: 40px }
	.contact p { font-size: 18px }
	.contact h3 { font-size: 24px }
	.contact h4 { font-size: 14px }
	.contact td { font-size: 14px }
	.contact td:first-child { padding-right: 15px }
}

@media (max-width: 319px) {
	.contact > div { padding: 30px }
	.contact p { font-size: 16px }
	.contact h3 { font-size: 22px }
	.contact h4 { font-size: 13px }
	.contact td { font-size: 13px }
	.contact td:first-child { padding-right: 10px }
}*/

@media (max-width: 767px) {
	.contact > div { padding: 50px 60px }
	.contact p { font-size: 18px }
	.contact .address-board { display: block }
	.contact .address-board > li { display: block; width: auto; border: none }
	.contact .address-board > li:first-child { margin-top: 50px; margin-bottom: 30px }
	.contact .address-board td { font-size: 14px }
	.contact .address-board h4 { position: initial }
	.contact .address-board table { margin-top: 15px }
}

@media (max-width: 599px) {
	.contact .address-board > li { margin-left: -20px; margin-right: -20px }
}

@media (max-width: 479px) {
	.contact > div { padding: 40px }
	.contact p { font-size: 18px }
	.contact .address-board > li { padding: 20px }
	.contact .address-board > li:first-child { margin-top: 30px; margin-bottom: 20px }
	.contact .address-board iframe { height: 200px }
}

@media (max-width: 319px) {
	.contact p { font-size: 16px }
}