@charset "utf-8";
/*----- PCとスマホ用 -----*/
/* Basic
-------------------------------------------*/
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
html {
   overflow-y:scroll;
}
body {
   margin:0;
   padding:0;
   line-height:1.6;
   letter-spacing:1px;
   font-family:"メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
   font-size:13px;
   background:#F4F5F6;
   color:#333;
   border-top:3px solid #2E468E;
}
br {
   letter-spacing:normal;
}

a {
   color:#2E468E;
   text-decoration:none;
}

a:hover {
   color:#2E468E;
   text-decoration:none;
}

img {
   margin:0; padding:0;
   border:0;
   vertical-align:bottom;
}

h1,h2,h3,h4,h5,h6 {
   max-width:100%;
   margin:0;
}
div{
	margin:0; padding:0;
}
dl {
	max-width:100%;
}
input[type="text"]{
	margin:0; padding:5px;
	height:23px;
}
textarea {
	margin:0; padding:5px;
}
article{
	overflow:hidden;
}
/* Layout
-------------------------------------------*/
#container {
	width:100%;
}
header {
	width: 780px;
	height: 150px;
	margin:0 auto;
	position:relative;
}
#gNavi{
	position:absolute;
	top:10px;
	right:10px;
	font-size:11px;
}
nav {
   width:100%;
   height:auto;
   overflow:hidden;
   background: #f2f5f6; /* Old browsers */
background: -moz-linear-gradient(top, #f2f5f6 0%, #e3eaed 37%, #c8d7dc 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=0 ); /* IE6-9 */
}
#contents {
	width: 100%;
	border-top:5px solid #2E468E;
}
#pagetop {
	margin-top:10px;
}
footer {
	border-top:1px #ccc solid;
	width: 100%;
	padding:10px 0;
	text-align:center;
}
/* Header
-------------------------------------------*/
header h1 {
	padding:10px 0 0 10px;
	font-size: 11px;
	font-weight: normal;
}
#gNavi a:hover{
	text-decoration:underline;
}
#gNavi::before{
	content: "[";
}
#gNavi::after{
	content: "]";
}
/******* Menu *******/
#menu ul {
   overflow:hidden;
   width:780px;
   margin:0 auto;
   padding:0;
   border-right:1px solid #ccc;
}

#menu li {
   float:left;
   width:20%;
   text-align:center;
   list-style-type:none;
   background: #f2f5f6; /* Old browsers */
   background: -moz-linear-gradient(top, #f2f5f6 0%, #e3eaed 37%, #c8d7dc 100%); /* FF3.6-15 */
   background: -webkit-linear-gradient(top, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* Chrome10-25,Safari5.1-6 */
   background: linear-gradient(to bottom, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=0 ); /* IE6-9 */
}

#menu li a {
   font-size:14px;
   display:block;
   color:#333;
   line-height:50px;
   border-left:1px solid #ccc;
   font-weight:bold;
}

#menu li a.active {
   text-decoration:none;
   background: #f2f5f6; /* Old browsers */
   background: -moz-radial-gradient(center, ellipse cover, #f2f5f6 0%, #e3eaed 37%, #c8d7dc 100%); /* FF3.6-15 */
   background: -webkit-radial-gradient(center, ellipse cover, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* Chrome10-25,Safari5.1-6 */
   background: radial-gradient(ellipse at center, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
#menu li a:hover {
background: #f2f5f6; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, #f2f5f6 0%, #e3eaed 37%, #c8d7dc 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
/* main
---------------------------------*/
#main {
	width:780px;
	margin:0 auto;
	overflow:hidden;
}
h2 {
	position: relative;
	margin:20px 0;
	padding: 5px 0 5px 10px;
	border-left: 6px solid #2E468E;
	font-size:15px;
	max-width:100%;
}
h2::after {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	width: 100%;
	height: 0;
	border-bottom: 1px solid #ccc;
}
h2 span {
	font-size:140%;
	color:#2E468E;
}
h3 {
	margin-top:10px;
	position: relative;
	display: inline-block;
	padding: 0 0 0 19px;
	vertical-align: middle;
	font-size: 15px;
}
h3::before,
h3::after{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}
h3::before{
	bottom:3px;
	width: 15px;
	height: 15px;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	background: #2E468E; /* Old browsers */
	background: -moz-linear-gradient(top, #2E468E 0%, rgba(32,124,202,1) 50%, rgba(125,185,232,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #2E468E 0%,rgba(32,124,202,1) 50%,rgba(125,185,232,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #2E468E#2E468Ez 0%,rgba(32,124,202,1) 50%,rgba(125,185,232,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2E468E', endColorstr='#7db9e8',GradientType=0 ); /* IE6-9 */
}
h3::after{
	left: 6px;
	bottom: 4px;
	box-sizing: border-box;
	width: 4px;
	height: 4px;
	border: 3px solid transparent;
	border-left: 3px solid #fff;
}
h3.h3Big {
	font-size:18px;
	color:#2E468E;
}
/* business
-------------------------------------------*/
#main article {
	overflow:hidden;
}
#main #business01{
	width:100%;
}
#main #business01 dl{  
  width : 46%;
  min-height:150px;
  margin:10px 2%;
  padding : 20px;
  float : left;
  box-shadow:0 0 5px #fff, 0 0 5px #ccc, 0 0 1px #aaa;
  -webkit-box-shadow:0 0 5px #fff, 0 0 5px #ccc, 0 0 1px #aaa;
  -moz-box-shadow:0 0 5px #fff, 0 0 5px #ccc, 0 0 1px #aaa;
  
  border:1px solid #ccc;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  background-color:#FFF;
}
#main #business01 dt{
  border-bottom: 1px #2E468E solid;
  padding-bottom : 3px;
  margin-bottom: 10px;
}
#main #business01 dt h3{
	margin-top:0;
}
#main #business01 dd{  
  padding-left : 10px;
  padding-right : 10px;
}
#main article {
	margin-bottom:40px;
}
ul.ul_df li {
	padding:5px 0;
}
/* campany
-------------------------------------------*/
dl.prof > dt{
	margin:0;
	width:40%;
	float:left;
}
dl.prof > dt img{
	width:95%;
	height:auto;
}
dl.prof > dd{
	margin:0;
	width:60%;
	float:right;
}
dl.prof dd{
	font-size:12px;
}
dl.prof > dd:nth-of-type(1){
	font-size:18px;
	font-weight:bold;
	color:#2E468E;
}
dl.prof > dd:nth-of-type(4){
	color:#2E468E;
}
dl.history dt{
	width:13%;
	float:left;
}
dl.history dd{
	margin-left:13%;
	width:87%;
}
dl.dl_x {
	width: 100%;
	max-width:100%;
	margin:0 auto;
	background: #dddedf;
}
dl.dl_x dt{  
  background: #dddedf;        
  padding:15px 0;
  width : 30%;
  float : left;
  text-align:center;
}
dl.dl_x dd{    
  background: #fff;
  padding: 15px;
  width : 70%;
  margin-left :30%;
}

/* contact
-------------------------------------------*/
form#f1 {
	text-align:center;
}
form#f1 dl,
form#f1 dt,
form#f1 dd{
	margin:0; padding:0;
}
form#f1 dl {
  width  : 70%;
  margin:0 auto;
}
 
form#f1 dt {
  width : 100%;
  font-weight : bold;
  text-indent : 5px;
  text-align:left;
}
form#f1 dd {
  padding : 5px;
}
form#f1 input[type="text"],
form#f1 textarea {
	width:100%;
}
form#f1 textarea {
	height:200px;
}
input[type="submit"],
input[type="button"]{
	cursor:pointer;
	padding: 10px 20px;
	margin:0 auto;
	border:none;
	background: #f2f5f6; /* Old browsers */
   background: -moz-linear-gradient(top, #f2f5f6 0%, #e3eaed 37%, #c8d7dc 100%); /* FF3.6-15 */
   background: -webkit-linear-gradient(top, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* Chrome10-25,Safari5.1-6 */
   background: linear-gradient(to bottom, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=0 ); /* IE6-9 */
}
input[type="submit"]:hover,
input[type="button"]:hover{
   background: #f2f5f6; /* Old browsers */
   background: -moz-radial-gradient(center, ellipse cover, #f2f5f6 0%, #e3eaed 37%, #c8d7dc 100%); /* FF3.6-15 */
   background: -webkit-radial-gradient(center, ellipse cover, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* Chrome10-25,Safari5.1-6 */
   background: radial-gradient(ellipse at center, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
/* page top
-------------------------------------------*/
#pagetop a {
	position: relative;
	display: inline-block;
	padding: 5px 10px 5px 27px;
	background: #f2f5f6; /* Old browsers */
   background: -moz-linear-gradient(top, #f2f5f6 0%, #e3eaed 37%, #c8d7dc 100%); /* FF3.6-15 */
   background: -webkit-linear-gradient(top, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* Chrome10-25,Safari5.1-6 */
   background: linear-gradient(to bottom, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=0 ); /* IE6-9 */
	color:#333;
	font-size:11px;
}
#pagetop a::before{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
}

#pagetop a::before{
	left: 12px;
	bottom: 6px;
	box-sizing: border-box;
	width: 3px;
	height: 3px;
	border: 3px solid transparent;
	border-bottom: 3px solid #333;
}
#pagetop {
   text-align:right;
}
#pagetop a:hover {
	background: #f2f5f6; /* Old browsers */
   background: -moz-radial-gradient(center, ellipse cover, #f2f5f6 0%, #e3eaed 37%, #c8d7dc 100%); /* FF3.6-15 */
   background: -webkit-radial-gradient(center, ellipse cover, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* Chrome10-25,Safari5.1-6 */
   background: radial-gradient(ellipse at center, #f2f5f6 0%,#e3eaed 37%,#c8d7dc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#c8d7dc',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
/* footer
-------------------------------------------*/
footer ul {
   margin:5px 0;
   padding:20px 0;
   text-align:center;
}

footer li {
   display:inline;
   margin:0 0 0 20px;
   list-style:none;
}
footer li a {
   color:#333;
}
footer li a:hover {
   color:#333;
   text-decoration:underline;
}
/* clearfix
-------------------------------------------*/

/*--------------- タブレットとスマホ用（481px～800px）---------------*/
@media (max-width:800px){
/* Basic
-------------------------------------------*/
	img{
		max-width:100%;
		height:auto;
	}

/* Customize
-------------------------------------------*/
	#container {
		max-width:100%;
	}
	header {
		width:100%;
	}
	header h1{
		max-width:75%;
	}
	#main {
		width:100%;
		padding:10px;
	}
	#menu ul {
		width:100%;
		overflow:hidden;
	}
	#menu ul li {
		width:33%;
	}
	#menu ul li:first-child {
		width:34%;
	}
	#menu ul li:first-child a{
		line-height:100px;
	}
	#business01 dl{
		height:230px;
	}
	dl.history dt{
		width:20%;
		float:left;
	}
	dl.history dd{
		margin-left:20%;
		width:80%;
	}
	
}
/*--------------- スマホのみ -----------------------------------*/
@media (max-width : 480px){
	header {
		height:auto;
	}
	header #logo{
		width:50%;
		margin:0 auto;
	}
	header #logo img {
		width:100%;
		height:auto;
	}
	#menu ul li:first-child {
		width:100%;
	}
	#menu ul li:first-child a{
		line-height:50px;
	}
	#menu ul li {
		width:50%;
	}
	footer ul{
		overflow:hidden;
		width:100%;
	}
	footer ul li {
		margin:0;
		display:block;
		width:50%;
		float:left;
	}
	#main #business01 dl{
		width:100%;
		clear:both;
		margin:5px 0;
	}
	form#f1 dl {
		width  : 100%;
		margin:0 auto;
	}
	#business01 dl{
		height:150px;
	}
	dl.prof > dt{
		clear:both;
		width:100%;
		text-align:center;
	}
	dl.prof > dt img{
		width:50%;
	}
	dl.prof > dd{
		clear:both;
		width:100%;
	}
}