@charset "UTF-8";



/* visual --------------------------------------------------------------- */
#visual {
	width: 100%;
	height: 100vh;
	margin: 0 auto;
	
	background-image: url(../../img/contact/visual/visual.jpg);
	background-position: center center;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	-ms-background-size: cover;		
		
	position: relative;
	}
	
@media(max-width: 768px){
	}

@media(max-width: 420px){
	#visual {
		height: 50vh;
		}
	}
	
	
	
/* contact --------------------------------------------------------------- */
#contact {
	width: 90%;
	max-width: 600px;
	margin: 0 auto 150px auto;
	position: relative;
	}
	
	#contact #message {
		margin-bottom: 50px;
		}
		
		#contact #message dl,
		#contact #message p {
			line-height: 2.5;
			}
			
			#contact #message dl dt {
				}
				
				#contact #message dl dt span {
					cursor: pointer;
					display: inline-block;
					text-decoration: underline;
					}
		
			#contact #message dl dd {
				display: none;
				padding-top: 30px;
				font-size: 12px;
				letter-spacing: 0;
				line-height: 2;
				}
				
				#contact #message dl dd span {
					font-weight: bold;
					}
							
	#contact #form {
		}
		
		#contact #form p,
		#contact #form dl dt,
		#contact #form dl dd {
			padding: 10px 0;
			}
			
			#contact #form p span,
			#contact #form dl dt span,
			#contact #form dl dd span {
				font-size: 11px;
				padding: 0 0 3px 3px;
				}
		
		#contact #form dl {
			overflow: hidden;
			}
			
			#contact #form dl dt,
			#contact #form dl dd {
				width: 48%;
				}
				
			#contact #form dl dt {
				float: left;
				}
				
			#contact #form dl dd {
				float: right;
				}
			
			#contact #form input[type="text"],
			#contact #form textarea {
				width: 100%;
				padding: 7px;
				color: #46607c;
				box-sizing: border-box;
				letter-spacing: 0;
				background-color: #f5f5f5;
				}
				
			#contact #form textarea {
				height: 15em;
				}
				
			#contact #form ::-moz-placeholder {
				color: #46607c;
				-ms-filter: "alpha(opacity=50)";
				filter: alpha(opacity=50);
				opacity: 0.5;
				}
				
			#contact #form ::-webkit-input-placeholder,
			#contact #form :-ms-input-placeholder {
				color: #cccccc;
				}
		
		#contact #form ul {
			width: 100%;
			margin-top: 50px;
			text-align: center;
			letter-spacing: -1em;
			}
		
			#contact #form ul li {
				display: inline-block;
				width: 46%;
				margin: 0 2%;
				box-sizing: border-box;
				}
				
				#contact #form ul li #back,
				#contact #form ul li #send {
					width: 100%;
					display: block;
					padding: 10px 0;
					cursor: pointer;
					text-align: center;
					background-color: transparent;
					box-sizing: border-box;
					border: solid 1px;
					}
					
				#contact #form ul li #back {
					border-color: #dddddd !important;
					}
					
				#contact #form ul li #send {
					color: #ffffff;
					background-color: #46607c;
					border-color: #46607c !important;
					}

@media(max-width: 768px){
	#contact {
		margin: 0 auto 50px auto;
		}
			
			#contact #message dl,
			#contact #message p {
				line-height: 2;
				}
				
				#contact #form dl dt,
				#contact #form dl dd {
					width: 100%;
					}
					
				#contact #form dl dt,
				#contact #form dl dd {
					float: none;
					}
			
				#contact #form ul li {
					display: block;
					width: 80%;
					margin: 0 auto;
					}
					
					#contact #form ul li #back {
						margin-bottom: 15px;
						}
	}

@media(max-width: 420px){
	}