@charset "Shift_JIS";


.insta_wrapper ul{
margin-top: 10px;
	width:100%;
}

.insta_wrapper ul li{
	display: inline-block;
	width:48%;
float:left;
	margin-bottom: 20px;
}

.insta_wrapper ul li:nth-child(2n){
	float:right;
}
.insta_wrapper ul li:last-child{
	margin-bottom: 40px;
}
.insta_wrapper ul li:nth-child(3n){
	margin-bottom: 40px;
}
.insta_wrapper ul li img{
	object-fit: cover;
	width:100%;
	height:300px;
}



/*Topics
---------------------------------------------*/
#Topics {
	width: 100%;
	height: auto;
	margin: 0px;
	padding: 0px;
	text-align: left;
}

#Topics h1 {
	width: 100%;
	height: 40px;
	margin: 0px;
	padding: 0px;
	background: url(../images/title_news.gif) no-repeat left center;
	background-size:100% auto;
	text-indent: -9999px;
}
#Instagram {
	width: 100%;
	height: auto;
	margin: 0px;
	padding: 0px;
	text-align: left;
}
#Instagram h1 {
	width: 100%;
	height: 40px;
	margin: 0px;
	padding: 0px;
	background: url(../images/title_instagram.gif) no-repeat left center;
	background-size:100% auto;
	text-indent: -9999px;
}

#Topics dl {
	width: 100%;
	height: auto;
}

#Topics dt {
	float: left;
	width: 100px;
	height: 30px;
	clear: left;
	background: url(../images/border_bottom.gif) repeat-x left bottom;
}

#Topics dd {
	height: 30px;
	margin-left: 100px;
	background: url(../images/border_bottom.gif) repeat-x left bottom;
}

#Topics div.TopicsBox {
	clear: both;
	width: 660px;
	height: auto;
	margin: 0px;
	padding: 0px 0px 10px 0px;
	overflow: auto;
	line-height: 28px;
}


/* 業務内容 **************************************/
/*Business
---------------------------------------------*/
#Business {
	width: 100%;
	height: auto;
	margin: 0px;
	padding: 0px;
	text-align: left;
}

#Business h1 {
	width: 100%;
	height: 40px;
	margin: 0px;
	margin-top:20px;
	padding: 0px;
	background: url(../images/business_title.gif) no-repeat left center;
	background-size:100% auto;
	text-indent: -9999px;
}
#Business .banner{
	position: relative;
	display: inline-block;
	width: 40%;
	height: auto;
	margin: 10px;
	padding: 10px 20px;
	text-align: center;
	vertical-align: top;
	text-decoration: none;
}

#Business .banner:hover{
	opacity: 0.8;
}
#Business .banner .mar_r0{
	margin-right:0;
}
#Business .banner img{
	position: relative;
	width:100%;
}

#Business .banner .banner_title{
	position: absolute;
	margin:0 8px;
	top:34%;
	width:135px;
	letter-spacing: 1px;
	border:1px solid #333;
	color:#333;
	padding:15px 5px;
	font-size:14px;
	font-weight:normal;
	text-align: center;
	background:rgba(255, 255, 255, 0.8);
	
}

#Business .banner:after{
	display: block;
	content:"";
	clear: both;
}
.business_contents_inner{
	margin:0;
	padding:0;
	margin-top:5px;
	text-align: justify;
	text-decoration: none;
}

/* Effect1
 *************************************** */
/* 擬似要素の共通スタイル */
.change-border01::after,
.change-border01::before,
.change-border01__inner::after,
.change-border01__inner::before {
  background-color: #EBAC2D;
  content: '';
  display: block;
  position: absolute;
  z-index: 10;
  transition: all .3s ease;
  -webkit-transition: all .3s ease;
}
/* 左上へ配置 */
.change-border01::after {
    height: 1px;
    left: -1px;
    top: -1px;
    width: 0px;
}
/* 右下へ配置 */
.change-border01::before {
  bottom: -1px;
  height: 1px;
  right: -1px;
  width: 0px;
}
/* 左下へ配置 */
.change-border01__inner::after {
  bottom: -1px;
  height: 0px;
  left: -1px;
  width: 1px;
}
/* 右下へ配置 */
.change-border01__inner::before {
  height: 0px;
  right: -1px;
  top: -1px;
  width: 1px;
}

/* hover */
.change-border01:hover::after,
.change-border01:hover::before {
  width: 100%;
  width: calc(100% + 1px);
}
.change-border01:hover .change-border01__inner::after,
.change-border01:hover .change-border01__inner::before {
  height: 100%;
  height: calc(100% + 1px);
}