@charset "UTF-8";
/* CSS Document */

/* ------------------------------------- */
/*	 リンク
/* ------------------------------------- */
a {
	color:			#12baab;
	text-decoration:none;
	}
a:hover {
	color:			#12baab;
	text-decoration:underline;
	}
	
/* ------------------------------------- */
/*	スライド
/* ------------------------------------- */
#main-visual {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
  background-color: #fff;
  }
  #main-visual img {
  height:auto;
	width: 100%;
}

/*messageと画像
---------------------------------------------------- */

#message {
	width: 100%;
	float: left;
	}
		@media only screen and (max-width: 650px) {/* スマホ幅 */
		h3{
			font-size: 1.1em;
			}
		#message {
			width: 100%;
			}
		}

#message p {
	color: #444;
	font-size: 85%;
	line-height: 1.8;
	letter-spacing: normal;
	margin: 0px 0px 0px 0px;

	}
	@media only screen and (max-width: 650px) {/* スマホ幅 */
		#message p{
			letter-spacing:-0.5px;
			float: none;
			width: 100%;
			}
		}
/*------------------------------------------------
banner
---------------------------------------------------- */
#container.style1 {
	width: 100%;
	}
#work {
	margin: 20px 0 10px 0;
	max-width:700px;
	height:auto;
	text-align: left;
	}
	@media only screen and (max-width: 800px) {/* タブレット幅 */
		#work{
			width: 100%;
			max-width:100%;
			}
		}
#work ul {
	display: inline-block;
	width: 700px;
	list-style: none;
	line-height: 0px;
	}
	@media only screen and (max-width: 800px) {/* タブレット幅 */
		#work ul{
			width: 100%;
			}}
#work ul li {
	list-style:none;
	width: 50%;
	}
	@media only screen and (max-width: 650px) {/* スマホ幅 */
		#work ul li {
			float:none;
			width: 100%;
			margin:0 auto;
			}
			li.b02 {
				padding: 10px 0px 0px 0px;
				}}

#work ul li a img {	}
	@media only screen and (max-width: 800px) {/* タブレット幅 */
		#work ul li a img{
			width: 98%;
			}
		}
		@media only screen and (max-width: 650px) {/* スマホ幅 */
		#work ul li a img{
			width: 100%;
			}
		}
li.b01{
	float: left;
}
li.b02  {
	float: right;
}
li.b01 a:hover,
li.b02 a:hover {
	filter:			alpha(opacity=75);
    -moz-opacity:	0.75;
    opacity:		0.75;
}


/*------------------------------------------------
info
---------------------------------------------------- */
#container.style2 {
	width: 100%;
	padding: 0 0 0 0;
}
.topi_t {
	border-bottom: 1px dotted #555;
	margin: 5px 0px 5px 0px;
}
.topi_t a {
	background: url(../img/top/info_t.png) no-repeat 0px 0px;
	height:26px;
	text-indent: -9999px;
	text-decoration: none;
	display: block;
	overflow:hidden;
	outline:none;
	background-size: 136px 26px;
	margin: 0px 0px 10px 0px;
}
.info_box2 {
      margin: 10px 0px 0px 0px;
	  
	  }
.info_box {
	width: 100%;
	float: left;
	font-weight: normal;
	display: block;
margin: 0px 20px 0px 0px;
padding: 14px 0px 10px 0px;
border-bottom: #555 dotted 1px;
}
.info_box p {
	float: left;
	font-size: 85%;
	line-height: 150%;
	margin: 0px 10px 0px 0px;
	text-align: left;
	color: #12baab;
	font-weight: normal; }
.info_box h5 a {
	text-decoration: none;
	float: left;
	font-weight: normal;
	font-size: 100%;
	line-height: 150%;
	color: #555;
}
.info_box h5 a:hover {
	text-decoration: underline;
}
.topi_t p {
	background:url(../img/top/info_list.png) no-repeat;
	background-size: 72px 14px;
	float:right;
	width:72px;
	height:14px;
	text-indent: -9999px;
	text-decoration: none;
	display: block;
	margin: 10px 0px 0px 0px;
}