@charset "utf-8";

* { box-sizing: border-box; }

a:link {text-decoration: none; color:#00F;}
a:visited {text-decoration: none; color: #00F;}
a:active {text-decoration: none; color: #00F;}
a:hover {text-decoration:  underline; color:#F00;}
body {
	margin:auto 0;background-color:#FFFFFF;font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

img{border: 0px;}
table{border: 0px;}
ul {list-style:none;padding:0;margin:0;} 

p {
	margin:10px 0 20px 0;
}

a:hover img {
	opacity:0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
	background: #fff;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}

header{
	width:1050px;
	text-align:left;
	margin:3px auto;
	padding:0;
}

#catch {
	font-size:12px;
	color:#333;
	padding:0;
	margin:0 0 10px 0;
	font-weight:normal;
}

header img {
	margin:0;
}

#h-r {
	display:block;
	float:right;
	width:600px;
	height:55px;
	float:right;
	text-align:right;
}

#h-r img {
	margin:0 0 0 25px;
	vertical-align:middle;
}

section {
	width:1050px;
	margin:20px auto;
}

#tel {
	display:none;
}

h1 {
	font-size:30px;
	clear:both;
	text-align:center;
	letter-spacing:1px;
}

.cnt {
	text-align:center;
}

#office-table {
	width:95%;
	margin:0 auto 50px auto;
	border-collapse:separate;
	border-spacing:1px;
	border:3px solid #F7F7F7;
	font-size:14px;
}

#office-table th {
	width:25%;
	text-align:center;
	font-weight:bold;
	letter-spacing:1px;
	background-color:#EEE;
	border-bottom:1px solid #DDD;
	border-right:1px solid #DDD;
}

#office-table td {
	border-bottom:1px solid #EEE;
	padding:15px 15px 15px 25px;
}

h2 {
	border-left:5px solid #06C;
	border-bottom:1px dashed #CCC;
	padding:5px 0 5px 20px;
	margin:5px 0 30px 0;
}

h3 {
	font-size:20px;
	border-left:5px solid #06C;
	border-bottom:1px dashed #CCC;
	padding:5px 0 5px 20px;
	margin:50px 0 30px 0;
}

#flow {
	width:100%;
}

#flow dt {
	clear:both;
	width:70%;
	border-radius:10px;
	background-color:#06C;
	color:#FFF;
	font-size:20px;
	text-align:center;
	padding:5px 25px;
	font-weight:bold;
	margin:5px auto 25px auto;
}

#flow dd {
	width:70%;
	margin:0 auto 10px auto;
	line-height:30px;
}

#flow dd img {
	float:left;
	margin:0 25px 30px 0;
}
	
#flow dd p {
	margin-top:30px;
}

.w-70 {
	width:70%;
	line-height:30px;
	margin:0 auto 20px auto;
}

.w-70 img {
	margin:30px 0;
}

.s10 {
	width:10%;
}

.s20 {
	width:20%;
}

.s50 {
	width:50%;
}

.s80 {
	width:80%;
}

.s100 {
	width:100%;
}

#choice {
	width:100%;
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}

#choice li {
	list-style:none;
	width:48%;
	background-color:#F5F5F5;
	padding:30px 40px 30px;
	margin-bottom:30px;
	border-radius:5px;
}

#choice li p {
	margin-bottom:0;
}

#choice li img {
	width:100%;
	height:auto;
	margin-bottom:15px;
}

#choice li strong {
	display:block;
	text-align:center;
	font-size:20px;
	color:#06F;
	margin-bottom:10px;
}

#type {
}

#type h2 {
	border-left:0;
	border-bottom:0;
	margin:5px 0 30px 0;
	text-align:center;
	letter-spacing:2px;
	font-size:28px;
}

#type h2:first-letter{
	background-color:#0066CC;
	color:#FFF;
	font-size:32px;
	padding:2px 7px;
	margin-right:3px;
}

#type p {
	text-align:center;
	border-bottom:1px dashed #CCC;
	padding-bottom:20px;
}

#type li {
	display:block;
	width:100%;
	margin-bottom:30px;
	padding:20px;
	text-align:center;
	background-color:#F7F7F7;
	position:relative;
}

.type-before {
	position:absolute;
	display:block;
	width:70px;
	height:70px;
	border-radius:100%;
	top:250px;
	left:70px;
	background-color:#FFF;
	opacity: 0.9;
	color:#333;
	line-height:70px;
}

.type-after {
	position:absolute;
	display:block;
	width:70px;
	height:70px;
	border-radius:100%;
	top:280px;
	left:550px;
	background-color:#C00;
	opacity: 0.9;
	color:#FFF;
	line-height:70px;
	text-align:center;
	font-weight:bold;
}

#works {
	width:100%;
}

#works li {
	display:block;
	width:100%;
	margin-bottom:30px;
	border:1px solid #DDD;
	border-radius:5px;
	box-shadow:1px 1px 1px 1px #DDD;
	padding:20px;
	text-align:center;
	position:relative;
}

#works li h2 {
	margin:0 0 10px 0px;
	padding:0 0 0 20px;
	font-size:22px;
	letter-spacing:2px;
	border-left:5px solid #06C;
	text-align:left;
	line-height:28px;
}

.wo-01 {
	height:300px;
	width:auto;
	border:2px solid #CCC;
	vertical-align:middle;
}

.wo-02 {
	height:350px;
	width:auto;
	border:2px solid #F00;
	vertical-align:middle;
}

.wo-before {
	position:absolute;
	display:block;
	width:70px;
	height:70px;
	border-radius:100%;
	top:300px;
	left:70px;
	background-color:#FFF;
	opacity: 0.9;
	color:#333;
	line-height:70px;
}

.wo-after {
	position:absolute;
	display:block;
	width:70px;
	height:70px;
	border-radius:100%;
	top:320px;
	left:550px;
	background-color:#C00;
	opacity: 0.9;
	color:#FFF;
	line-height:70px;
	text-align:center;
	font-weight:bold;
}

.wo-data {
	display:block;
	font-size:18px;
	padding:30px 0 5px 0;
	border-bottom:1px dashed #DDD;
}

.wo-ar {
	margin:0 20px;
	vertical-align:middle
}

#voice {
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}

#voice li {
	display:block;
	width:49%;
	margin-bottom:30px;
	border:1px solid #DDD;
	border-radius:5px;
	box-shadow:1px 1px 1px 1px #DDD;
	padding:15px;
}

#voice li img {
	width:200px;
	height:auto;
	margin-right:30px;
	float:left;
}

#voice li strong {
	color:#003399;
	font-size:18px;
}

#voice li .rank {
	display:block;
	background-color:#FFFF00;
	margin:10px 0 5px;
}

#voice li p {
	font-size:14px;
	line-height:26px;
}

footer {
	clear:both;
	float:left;
	width:100%;
	margin:0 auto;
	text-align:center;
	background-color:#0066CC;
}

#fot_in {
	width:1050px;
	margin:0 auto;
	padding-top:20px;
	font-size:12px;
	color:#FFF;
	line-height:22px;
	text-align:left;
}

#fot_in a {
	color:#FFF;
}

#fot-menu {
	float:right;
	width:750px;
	line-height:34px;
	text-align:right;
	margin-top:10px;
}

small {
	clear:both;
	display:block;
	width:100%;
	font-size:12px;
	text-align:center;
	line-height:40px;
}

.pc_no {
	display:none;
}

#sp-tel {
	display:none;
}

@media screen and (max-width:768px){

body {
	margin:0;
	background:none;
}

header{
	width:96%;
	text-align:left;
	margin:0 auto;
	padding:0;
}

header img {
	width:40%;
	height:auto;
	max-width:195px;
	height:auto;
}

#catch {
	width:90%;
	text-align:center;
	font-size:10px;
	color:#333;
	margin:0 5% 5px 5%;
}

#h-r {
	display:none;
}

#tel {
	display:block;
	width:90%;
	margin:15px auto;
	font-size:12px;
	font-weight:bold;
	background-color:#FF0000;
	border-radius:20px;
	text-align:center;
	padding:5px 0;
}

#tel a {
	color:#FFF;
}

#tel strong {
	display:block;
	font-size:18px;
}

section {
	margin:0 auto;
	width:96%;
}

#choice li {
	width:100%;
	background-color:#F5F5F5;
	padding:20px 30px;
	margin-bottom:20px;
}

#type h2 {
	margin:5px 0 20px 0;
	font-size:20px;
	letter-spacing:1px;
}

#type h2:first-letter{
	font-size:28px;
	padding:2px 5px;
	margin-right:2px;
}

.type-before {
	width:50px;
	height:50px;
	border-radius:100%;
	top:190px;
	left:30px;
	color:#333;
	line-height:50px;
	font-size:14px;
}

.type-after {
	width:50px;
	height:50px;
	border-radius:100%;
	top:450px;
	left:30px;
	color:#FFF;
	line-height:50px;
}

#works li {
	margin-bottom:20px;
	border:none;
	border-bottom:1px dashed #DDD;
	border-radius:0;
	box-shadow:none;
	padding:10px;
	position:relative;
}

#works li h2 {
	margin:0 0 10px 0px;
	padding:0 0 0 20px;
	font-size:22px;
	letter-spacing:2px;
	border-left:5px solid #06C;
	text-align:left;
	line-height:28px;
}

.wo-01 {
	height:auto;
	width:100%;
	margin-bottom:20px;
}

.wo-02 {
	height:auto;
	width:100%;
}

.wo-before {
	width:50px;
	height:50px;
	border-radius:100%;
	top:230px;
	left:30px;
	color:#333;
	line-height:50px;
	font-size:14px;
}

.wo-after {
	width:50px;
	height:50px;
	border-radius:100%;
	top:510px;
	left:30px;
	color:#FFF;
	line-height:50px;
}

.wo-data {
	display:block;
	font-size:16px;
	padding:20px 0 10px 0;
	border-bottom:none;
}

.wo-ar {
	display:none;
}

#flow dt {
	clear:both;
	width:100%;
	font-size:18px;
	padding:5px 25px;
	margin-top:5px;
}

#flow dd {
	width:100%;
	margin:0 auto 10px auto;
	line-height:28px;
}

#flow dd img {
	float:none;
	display:block;
	width:44%;
	height:auto;
	margin:0 28% -10px 28%;
}


#voice li {
	display:block;
	width:100%;
	margin-bottom:20px;
	padding:10px;
}

#voice li img {
	width:80%;
	height:auto;
	margin-right:0;
	float:none;
	margin:0 10% 5px 10%;
}

h2,h3 {
	font-size:20px;
	margin:30px 0 25px;
}

#office-table {
	width:96%;
	margin:0 auto 0 auto;
}

#office-table th {
	width:100%;
	display:block;
	line-height:30px;
}

#office-table td {
	width:100%;
	display:block;
	border-bottom:1px solid #EEE;
	padding:15px 0;
	text-align:center;
	line-height:24px;
}

.w-70 {
	width:100%;
	line-height:28px;
}

.w-70 img {
	width:100%;
	height:auto;
	margin:20px 0;
}

#fot_in {
	width:100%;
	padding-top:20px;
	line-height:22px;
	text-align:center;
}

#fot_in img {
	width:50%;
	height:auto;
}

#fot-menu {
	display:none;
}

small {
	font-size:10px;
}

#sp-tel {
	display:block;
	width:100%;
	background-color:#FF0000;
	border-radius:6px;
	line-height:50px;
	font-size:26px;
	font-weight:bold;
	text-align:center;
	margin-bottom:20px;
	letter-spacing:2px;
}

#sp-tel a {
	color:#FFF;
}

.pc_no {
	display:block;
}

.sp-no {
	display:none;
}

}
