#mainVisual {
	margin-top:100px;
	overflow:hidden;
	z-index:1;
}
#mainVisual li {
	background-size:contain;
	background-position:50% 0;
	background-repeat:no-repeat;
}
#mainVisual li img {
	width:100%;	
	height:auto;
}
#mainVisual .bx-wrapper .bx-pager {
	bottom:30px;
}

#mainContents {
	padding:50px 0;
}

#mainContents .tit {
	width:800px;
	margin: 0 auto;
	padding-bottom: 30px;
}
#mainContents .tit img {
	width:100%;
}

#mainContents .conEx li {
	float:left;
	width:25%;
	position: relative;
	box-sizing: border-box;
	padding:5px;
}
#mainContents .conEx li.tell .tellWrap {
	position: absolute;
	top:60px;
	width:100%;
}
#mainContents .conEx li.tell {
	text-align: center;
}
#mainContents .conEx li.tell i,
#mainContents .conEx li.tell a {
	display:block;
	font-size: 28px;
}
#mainContents .conEx li.tell a {
	font-weight: bold;
	color:#3483d0;
}
#mainContents .conEx li.tell div {
	padding-bottom: 10px;
}
#mainContents .conEx li img {
	width:100%;
}
#mainContents .conEx li.tell .sns {
	width:80%;
	margin:0 auto;
}
#mainContents .conEx li.tell .sns li {
	width:50%;
		margin:0 auto;
}
#mainContents .conEx li.tell .sns li img {
	width:100%;
	height:auto;
}

@media all and (max-width: 700px) {
		#mainVisual {
			padding-top:50px;
			margin-top:0;
			overflow:hidden;
		}
		#mainVisual .auto,
		#mainContents .auto {
			width:100%;
		}		
		#mainVisual li {
			width:100%;
		}
		#mainVisual .bx-wrapper .bx-pager {
			bottom:3%;
		}
		#mainContents {
			padding:5% 0;
		}		
        #mainContents .conEx li {
			width:50%;
		}
		#mainContents .tit {
			width:100%;
			padding-bottom: 3%;
		}
		#mainContents .conEx li.tell .tellWrap {
			top:18%;
			width:100%;
		}
		#mainContents .conEx li.tell i,
		#mainContents .conEx li.tell a {
			display:block;
			font-size: 1.3em;
		}
		#mainContents .conEx li.tell .div {
			padding-bottom: 10%;
		}
}