﻿@charset "utf-8";

ol {
	margin: 12px;
}

ol li {
	list-style:decimal;
	margin-left: 2.0em;
}

h2 {font-size:20px;}
h3 {font-size:20px;}
h4 {font-size:20px;}
	
h5, h6 {text-align: left;}

p {font-size:15px; margin: 4px 8px;}
ul {margin: 8px;}
li.sq {
	padding-bottom: 1.65em;
	font-size:17px; line-height:1.5em;
}
li.maru {
	display:inline-block;
	list-style-type: circle;
	font-size:15px; line-height:1.5em;
	margin: 0 1.1em;
}
li.maru:before {
	content:"◎ ";
}

#mapbody .inbox {
	width: 100%;
	max-width:536px;
}

#mapbody .inbox > ul {
	background: url(../img/back_top-right.png) no-repeat right top;
	background-size: 100px 100px;
}

/**/


h2 ~ article {
	margin:12px 3%; 
}

table {
	width:98%;
}

.w25p { width:25%; }
.w30p { width:30%; }
.w40p { width:40%; }
.w50p { width:50%; }
.w60p { width:60%; }
.w70p { width:70%; }
.w75p { width:75%; }

#gomen h2 {
	border-left:none;
	margin-left:0;
}

span.caption {
	font-weight:normal;
	font-size:12px;
	color:#6C5544;
	margin-left:24px
}

a.gotop {
	float:right;
	margin:8px 24px;
	font-size:11px;
}	
	
.anchor li {
	float:left;
}

.anchor a {
	display: block;
	width: 160px;
	height: 70px;
}

.anchor span {
	float:left;
	position:relative;
	left:77px;
	top:20px;
	font-size:14px;
}

.anchor a:hover {
	background-position: 0 bottom;
}

.b01 {
	background: url(../img/staff/tn_shigenaga_off-on.png) no-repeat 0 0;
}

.b02 {
	background: url(../img/staff/tn_watanabe_off-on.png) no-repeat 0 0;
}

.b03 {
	background: url(../img/staff/tn_kato_off-on.png) no-repeat 0 0;
}




.picframe ul {
	padding-left:7%;
	font-size:100%;
}

.profile h4 {
	
}

.inbox {
	margin:12px 0;
	width:97%;
	box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
	padding:6px 0;
}

.inbox p {
	margin-left:12px;
}

.picframe ul {
	padding-left:7%;
	font-size:90%;
}

.profile h4 {
	
}

.casim {
	border-top: 1px dotted #181;
	border-bottom: 1px dotted #181;
	background: rgba(0,50,0,0.1);
}

/*** SmartPhone, Tablet and PC Screen CSS ***/

/* スマホ向け　~ 480px */
@media only screen and (max-width:480px) {

	li.maru {
		display:block;
		margin-bottom: 0.6em;
	}
	
	#mapbody .inbox > ul {
		background: url(../img/back_top-right.png) no-repeat right top;
		background-size: 75px 75px;
	}

	#gomen h2 {
		width:100%;
		float:right;
	}

	.picframe{
		width:92%;
		height:auto;
		margin:8px auto;
		/*margin:8px 2.5% 8px 1%; */
		padding:0 1.2% 12px 1.1%;
		background:#fff;
		border-bottom:1px dotted #ddd;
	}
	
	.profile{
		clear:left;
		width:92%;
		margin:2px auto 16px auto;
		/*margin:8px 2.5% 8px 1%; */
		padding:0 1.2% 0 1.1%;		
	}

}


/* タブレット向け　481 ~ 768px */
@media only screen and (min-width:481px) {
	
	#gomen h2 {
		width:80%;
		float:left;
	}

	.picframe{
		float:left;
		min-width:280px;
		/*width:auto;/*280px;*/
		margin: 8px 0 0 2%;
		border-right:1px dotted #ddd;
		border-bottom:none;
		background:#fff;
	}

	.profile{
		float:left;
		max-width:50.5%;
		width:auto;
		padding:8px 1.5% 32px 2%;
	}


}


/* PC向け　769px ~ */
@media only screen and (min-width:769px) {

	.picframe{
		float:left;
		min-width:150px;
		width:35%;
		margin: 8px 0 0 2%;
		border-right:1px dotted #ddd;
		border-bottom:none;
		background:#fff;
	}

	.profile{
		float:left;
		min-width:300px;
		max-width:455px;
		padding:8px 1.5% 32px 2%;
	}


}