@charset "UTF-8";

/* -------------------------------------------------------------
Author: pentaro.
Author URI: http://drunken-penguin.com/
Version: 1.0
------------------------------------------------------------- */

html {  
    background: #000000;
}
body{
	font-family:'Lucida Grande','Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
	padding: 20px 0 0 0;
	margin: 0;
    background: #ffffff;
}

li{
	list-style:none;
}
a, a:hover, a:visited{
	color:#000000;
	text-decoration:none; 
}
div{
	margin:0;
	padding:0;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input[type="text"],input[type="button"],input[type="submit"] {
	border-radius: 0;
	-webkit-appearance: none;
}

input:focus {
	outline: 0;
}

h1{
	margin: 0;
	padding: 0;
}

h2 {
	margin: 0 0 10px 0;
}

h3{
    border-left:6px solid #000000;
    padding:5px 5px 5px 10px;
    margin:0 0 10px 0;
}

header, section{
	width: 1200px;
	margin:0 auto 0 auto;
}
header{
	height:50px;
}
header h1{
	float:left;
}
header ul#sns{
	float:right;
}
header ul#sns li{
	display:inline-block;
	vertical-align:top;
	margin:0 0 0 5px;
}
header ul#sns li.facebook{
	line-height: 0;
}
header ul#sns .twitter-share-button{
	width:90px !important;
}

div#searchArea{
	text-align:center;
	margin:10px 0 10px 0;
}

div#searchArea input{
	font-size:100%;
	padding:10px;
	margin:0;
}

div#searchArea input#ip{
	width:40%;
	border-top:3px solid #000000;
	border-left:3px solid #000000;
	border-right:1px solid #000000;
	border-bottom:3px solid #000000;
}
div#searchArea input#search{
	color:#ffffff;
	background:#000000;
	width:120px;
	border:3px solid #000000;
}
div#searchArea input:hover#search{
	color:#000000;
	background:#ffffff;
}
div.about{
	text-align:left!important;
}
.leftArea a,
div.about p a,
div.self a{
	text-decoration:underline;
}
.leftArea a:hover,
div.about p a:hover,
div.self a:hover{
	color:#999999;
	text-decoration:underline;
}

section div#leftArea{
	float:left;
	margin-right:20px;
}
section div#leftArea table {
	width: 380px;
	height:500px;
	border-collapse: collapse;
	text-align: left;
}
section div#leftArea th {
    border: #000000 3px solid;
	padding: 10px;
	font-weight: normal;
	width:30%;
}
section div#leftArea td {
	border-top: #000000 3px solid;
	border-bottom: #000000 3px solid;
	border-right: #000000 3px solid;
	padding: 10px;
	width:70%;
	word-break: break-all;
}

section div#rightArea{
	float:right;
	margin-bottom:20px;
}
section div#rightArea div#map_canvas{
	width:800px;
	height:500px;
}
section div.self{
	margin-bottom:20px;
}
section div.self table{
	border-collapse: collapse;
	text-align: left;
	width:100%;
}
section div.self table th {
    border: #000000 3px solid;
	padding: 10px;
	font-weight: normal;
	width:30%;
}
section div.self table td {
	border-top: #000000 3px solid;
	border-bottom: #000000 3px solid;
	border-right: #000000 3px solid;
	padding: 10px;
	width:70%;
	word-break: break-all;
}

footer{
	margin:20px auto 0 auto;
	text-align:center;
	background:#000000;
	color:#ffffff;
}
footer div{
	padding:10px 0;
	width: 1200px;
	margin:0 auto;
}
footer ul#nav{
	text-align:left;
	padding:10px;
	margin:0;
}
footer ul#nav li{
	display:inline;
}
footer ul#nav li:not(:last-child):after{
	content : " | ";
}
footer ul#nav li a{
	color:#ffffff;
}
footer ul#nav li a:hover{
	text-decoration:underline;
}
footer p{
	padding:10px;
	text-align:right;
}

 /***** floatの解除 ******/
.clearfix:after {
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
}
.bnr_responsive{
	margin:0 auto;
	text-align:center;
	display:block;
}
.bnr_728{
	margin:0 auto;
	text-align:center;
	display:block;
}
.bnr_468{
	display:none;
}
.bnr_320{
	display:none;
}

@media screen and (max-width: 1024px){
	header, section{
		width: 980px;
	}
}
@media screen and (max-width: 769px){
	header, section{
		width: 768px;
	}
	section div#leftArea{
		float:none;
	}
	section div#leftArea table{
		text-align-center;
		margin:0 auto;
	}
	section div#leftArea div{
		text-align-center;
		margin:0 auto;
	}
	section div#rightArea{
		float:none;
	}
}
@media screen and (max-width: 480px){
	body{
		padding-top: 10px;
	}
	header, section{
		width: 320px;
	}
	header{
		height: 80px;
	}
	header h1{
		float:none;
		text-align:center;
	}
	header ul#sns{
		float:none;
		text-align:left;
		margin-left:-25px;
	}
	header ul#sns .googleplus{
		width:40px !important;
	}
	h2{
		padding: 0 10px;
		font-size:13px;
		margin:0 0 10px 0;
	}
	div#searchArea{
		text-align:center;
		margin:20px 0 10px 0;
	}
	div#searchArea{
		font-size:10px;
	}
	div#searchArea input#search{
		width:60px;
	}

	section div#leftArea{
		float:none;
		text-align:center;
		margin:0 auto 10px auto;
		font-size:12px;
	}
	section div#leftArea table {
		width: 300px;
		height:400px;
		border-collapse: collapse;
		text-align: left;
	}
	section div#leftArea th {
	}
	section div#leftArea td {
	}
	section div#rightArea{
		float:none;
		margin-bottom:10px;
	}
	section div#rightArea div#map_canvas{
		width:300px;
		height:240px;
		margin:0 auto;
		text-align:center;
	}
	footer ul#nav{
	}
	footer ul#nav li{
		display:block;
		font-size:14px;
	}
	footer ul#nav li:not(:last-child):after{
		content : " ";
	}
	footer{
		margin:20px auto 0 auto;
		text-align:center;
		background:#000000;
		color:#ffffff;
	}
	footer div{
		width:320px;
		padding:10px 0;
		margin:0 auto;
		font-size:10px;
	}

}

/* @Phone (iphone6s)
------------------------------------------------------------*/
@media only screen and (max-width:380px) {
	body{
		padding-top: 10px;
	}
	header, section{
		width: 320px;
	}
	header{
		height: 100px;
	}
	header h1{
		float:none;
		text-align:center;
	}
	header ul#sns{
		float:none;
		text-align:left;
		margin-left:-25px;
	}
	header ul#sns .googleplus{
		width:40px !important;
	}
	h2{
		padding: 0 10px;
		font-size:13px;
		margin:0 0 10px 0;
	}
	div#searchArea{
		text-align:center;
		margin:0 0 10px 0;
	}
	div#searchArea{
		font-size:10px;
	}
	div#searchArea input#search{
		width:60px;
	}

	section div#leftArea{
		float:none;
		text-align:center;
		margin:0 auto 10px auto;
		font-size:12px;
	}
	section div#leftArea table {
		width: 300px;
		height:400px;
		border-collapse: collapse;
		text-align: left;
	}
	section div#leftArea th {
	}
	section div#leftArea td {
	}
	section div#rightArea{
		float:none;
		margin-bottom:10px;
	}
	section div#rightArea div#map_canvas{
		width:300px;
		height:240px;
		margin:0 auto;
		text-align:center;
	}
	footer ul#nav{
	}
	footer ul#nav li{
		display:block;
		font-size:14px;
	}
	footer ul#nav li:not(:last-child):after{
		content : " ";
	}
	footer{
		margin:20px auto 0 auto;
		text-align:center;
		background:#000000;
		color:#ffffff;
	}
	footer div{
		width:320px;
		padding:10px 0;
		margin:0 auto;
		font-size:10px;
	}
}
@media screen and (max-width: 320px){
	body{
		padding-top: 10px;
	}
	header, section{
		width: 320px;
	}
	header{
		height: 80px;
	}
	header h1{
		float:none;
		text-align:center;
	}
	header ul#sns{
		float:none;
		text-align:left;
		margin-left:-25px;
	}
	header ul#sns .googleplus{
		width:40px !important;
	}
	h2{
		padding: 0 10px;
		font-size:13px;
		margin:0 0 10px 0;
	}
	div#searchArea{
		text-align:center;
		margin:0 0 10px 0;
	}
	div#searchArea{
		font-size:10px;
	}
	div#searchArea input#search{
		width:60px;
	}

	section div#leftArea{
		float:none;
		text-align:center;
		margin:0 auto 10px auto;
		font-size:12px;
	}
	section div#leftArea table {
		width: 300px;
		height:400px;
		border-collapse: collapse;
		text-align: left;
	}
	section div#leftArea th {
	}
	section div#leftArea td {
	}
	section div#rightArea{
		float:none;
		margin-bottom:10px;
	}
	section div#rightArea div#map_canvas{
		width:300px;
		height:240px;
		margin:0 auto;
		text-align:center;
	}
	footer ul#nav{
	}
	footer ul#nav li{
		display:block;
		font-size:14px;
	}
	footer ul#nav li:not(:last-child):after{
		content : " ";
	}
	footer{
		margin:20px auto 0 auto;
		text-align:center;
		background:#000000;
		color:#ffffff;
	}
	footer div{
		width:320px;
		padding:10px 0;
		margin:0 auto;
		font-size:10px;
	}
}
