@charset "utf-8";
/*
 * ================================================
 *
 * [function]
 *
 * ================================================
 */
/*-----------------------------------------
  mainVisual
-----------------------------------------*/
#content {
    padding-top: 65px;
		text-align: left;
}
#mainVisual {
	height: 500px;
	width: 100%;
  min-width: 1200px;
	margin: 0 auto 160px;
	background: url(../images/function/main_photo.jpg) no-repeat center center;
	-webkit-background-size: cover;
	background-size: cover;
	position: relative;
}
	#mainVisual .inner {
		width: 1000px;
		height: 100%;
		position: absolute;
		top: 0;
		left: 50%;
		margin-left: -500px;
	}
	#mainVisual .content {
		/*margin: 0 auto;*/
		position: absolute;
		top: 50%;
		-webkit-transform: translateY(-50%);
		    -ms-transform: translateY(-50%);
		        transform: translateY(-50%);
	}
/*-----------------------------------------
  contVox
-----------------------------------------*/
.contVox {
	color: #888;
	width: 1000px;
	margin:  0 auto 200px auto;
	position: relative;
}
	.contVox .inner { overflow: hidden; }
		.contVox .photo {
			position: absolute;
			top: -20px;
			right: 0;
		}
    .listStyle01 li {
    list-style-type: disc;
    margin-left: 20px;
    }
/*-----------------------------------------
  feature1
-----------------------------------------*/
.contVox#feature1 {}
	.contVox#feature1 .text {}
		.contVox#feature1 .header { margin-bottom: 50px; }
		.contVox#feature1 .item { margin-bottom: 30px; }
			.contVox#feature1 .title {
				color: #4C4A4A;
				font-weight: bold;
				margin-bottom: 5px;
			}
/*-----------------------------------------
  feature2
-----------------------------------------*/
.contVox#feature2 {}
	.contVox#feature2 .header { margin-bottom: 110px; }
	.contVox#feature2 .item {
		width: 328px;
		float: left;
		margin-right: 8px;
	}
	.contVox#feature2 .item:last-child { margin-right: 0; }
		.contVox#feature2 .item .image { margin-bottom: 10px; }
/*-----------------------------------------
  feature3
-----------------------------------------*/
.contVox#feature3 {}
	.contVox#feature3 .inner .header { margin-bottom: 50px; }
		.contVox#feature3 .inner .text img { margin-bottom: 10px; }
/*-----------------------------------------
  feature4
-----------------------------------------*/
	.contVox#feature4 .inner .header { margin-bottom: 50px; }
	.contVox#feature4 .inner .text1 { margin-bottom: 50px; }
	.contVox#feature4 .inner .text2 {
		overflow: hidden;
	}
	.contVox#feature4 .inner .text2 * {
		float: left;
	}
	.contVox#feature4 .inner .text2 img {
		margin-right: 2em;
	}
	.contVox#feature4 .inner .note {
		color: #666;
		font-size: 1.1rem;
		text-align: right;
		padding-top: 30px;
	}
/*-----------------------------------------
  howto
-----------------------------------------*/
	.contVox#howto .inner .howto { overflow: hidden; }
		.contVox#howto .inner .howto .title {
			color: #4C4A4A;
			font-weight: bold;
			margin-bottom: 10px;
		}
		.contVox#howto .inner .howto .item {
			width: 333px;
			height: 180px;
			float: left;
			padding: 0 15px;
			background-repeat: no-repeat;
			background-position: 15px 15px;
			border: 1px solid #656464;
			border-right: none;
	    box-sizing: border-box;
		}
		.contVox#howto .inner .howto .item:last-child { border-right: 1px solid #656464; }
		.contVox#howto .inner .howto .item.num1 { background-image: url(../images/function/num1.png); }
		.contVox#howto .inner .howto .item.num2 { background-image: url(../images/function/num2.png); }
		.contVox#howto .inner .howto .item.num3 { background-image: url(../images/function/num3.png); }
			.contVox#howto .inner .howto .item p {
				color: #4C4948;
				line-height: 1.6;
				width: 150px;
				float: left;
				padding-top: 70px;
			}
			.contVox#howto .inner .howto .item .image {
				text-align: center;
				width: 150px;
				float: right;
				position: relative;
				top: 50%;
				-webkit-transform: translateY(-50%);
				    -ms-transform: translateY(-50%);
				        transform: translateY(-50%);
			}
/**
 ****************************************************
 *
 * screens larger than 768
 *
 ****************************************************
 */
@media only screen and (min-width: 768px) {

}	/*  @media END */
/**
 ****************************************************
 *
 * screens smaller than 767
 *
 ****************************************************
 */
@media only screen and (max-width: 767px) {
	#content {
	    padding-top: 50px;
	}
	#mainVisual {
    min-width: 100%;
    height: 0;
		padding-top: 97.5%;
		margin: 0 auto 38px;
		background: url(../images/function/SP_main_photo.jpg) no-repeat center center;
		background-size: contain;
	}
		#mainVisual .inner {
			left: 37px;
			margin-left: 0;
		}
		#mainVisual .content {
			/*margin: 0 auto;*/
			position: absolute;
			top: 40px;
			transform: translateY(0);
		}
	.contVox {
		width: 82.8%;
		margin:  0 auto 70px;
	}
		.contVox .inner { overflow: hidden; }
			.contVox .photo {
				position: static;
				margin-top: 20px;
			}
      .contVox .text{
        text-align: left;
      }
	.contVox#feature1 {}
		.contVox#feature1 .text {}
			.contVox#feature1 .header { margin-bottom: 25px; }
			.contVox#feature1 .item { margin-bottom: 15px; }
	.contVox#feature2 {}
		.contVox#feature2 .header { margin-bottom: 25px; }
		.contVox#feature2 .photo { margin-bottom: 40px; }
		.contVox#feature2 .item {
			width: 100%;
			float: none;
			margin: 20px 0;
		}
			.contVox#feature2 .item .image { margin-bottom: 8px; }
      .contVox#feature2 .item .listStyle01{ line-height: 1.4; }
	.contVox#feature3 {}
		.contVox#feature3 .inner .header { margin-bottom: 25px; }
		.contVox#feature3 .inner .text { margin-bottom: 25px; }
			.contVox#feature3 .inner .text img { margin-bottom: 5px; }
	.contVox#feature4 {}
		.contVox#feature4 .inner .header { margin-bottom: 25px; }
		.contVox#feature4 .inner .text1 { margin-bottom: 25px; }
		.contVox#feature4 .inner .text2 { margin-bottom: 25px; }
		.contVox#feature4 .inner .text2 img {
		}
		.contVox#feature4 .inner .note {
			margin-bottom: 0;
			padding-top:20px;
		}
		.contVox#howto .inner .howto { overflow: hidden; }
			.contVox#howto .inner .howto .item {
				width: 100%;
				height: auto;
				float: none;
				padding: 10px;
				background-position: 10px 10px;
				border: 1px solid #656464;
				border-bottom: none;
				overflow: hidden;
				background-size: 27px 27px;
			}
			.contVox#howto .inner .howto .item:last-child { border-bottom: 1px solid #656464; }
			.contVox#howto .inner .howto .item.num1 { background-image: url(../images/function/SP_num1.png); }
			.contVox#howto .inner .howto .item.num2 { background-image: url(../images/function/SP_num2.png); }
			.contVox#howto .inner .howto .item.num3 { background-image: url(../images/function/SP_num3.png); }
				.contVox#howto .inner .howto .item p {
					width: auto;
					float: left;
					padding-top: 30px;
					width: 150px;
				}
				.contVox#howto .inner .howto .item .image {
					text-align: left;
					width: 100px;
					float: right;
					position: static;
					transform: translateY(0);
				}
}	/*  @media END */