@media only screen and (max-width: 767px) {

	.eyecatch-area {
		margin-top: 134px;
		width: 100%;
		background-image:url("../img/top-main01.jpg");
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.eyecatch-logotype {
		position: relative;
		margin: auto;
		width: 80%;
		max-width: 900px;
		height: 51vw;
	}
	.eyecatch-logotype .logo {
		display: block;
		position: absolute;
		top: 34%;
		left: 0;
		right: 0;
		margin: auto;
		width: 100%;
	}
	.eyecatch-logotype .copy {
		margin:  30px 0 0 0;
	/*	position: absolute;
		top: 44%;
		left: 0;
		right: 0;
		margin: auto;
		width: 100%;*/
		text-align: center;
		color: #ffffff;
		font-size: 32px;
		text-shadow: 2px 3px 6px rgba(0, 0, 1, 1);
		font-weight: 500;
	}
	.news-area {
		margin: 0;
		padding: 20px;
		padding: 5px 15px;
	}
	.news-title {
		padding: 0 0 10px 0;
		font-size: 16px;
		font-weight: bold;
		color: #231815;
		border-bottom: 1px solid #727171;
	}
	.news-area ul {
		margin: 15px 0;
		padding: 0;
		list-style: none;
		font-size: 14px;
	}
	.news-area ul li {
		margin: 0;
		padding: 0;
	}
	.news-area ul li span {
		display: block;
		padding: 0 20px 0 0;
	}

	.box-contents-index {
		display: flex;
		justify-content: space-evenly;
		flex-wrap: wrap;
		margin: 25px auto 0 auto;
		padding: 0;
		width: calc(100% - 20px);
	}
	.box-contents-index .item {
		position: relative;
		margin: 10px 0;
		padding: 0;
		width: 46%;
	}
	.box-contents-index h2 {
		position: absolute;
		left: 0;
		right: 0;
		margin: 16% auto 0 auto;
		padding: 0;
		color: #ffffff;
		text-align: center;
		/*text-shadow: rgba(0, 0, 1, 1) 1px 1px 10px, rgba(0, 0, 1, 1) -1px 1px 10px, rgba(0, 0, 1, 1) 1px -1px 10px, rgba(0, 0, 1, 1) -1px -1px 10px;*/
		text-shadow: rgba(0, 0, 1, 1) 1px 1px 10px, rgba(0, 0, 1, 1) -1px 1px 10px;
		font-size: 18px;
	}
	.box-contents-index h2 span {
		display: block;
		font-weight: normal;
		line-height: 1em;
	}
	.box-contents-index .item a {
		position: absolute;
		top: 0;
		left: 0;
		margin: 0;
		padding: 0;
		width: 100%;
		height: 100%;
	}

	.box-contents-index-bottom-area {
		margin: 50px 0;
		padding: 0;
		width: 100%;
		background: #fffeee;
	}
	.box-contents-index-bottom {
		display: flex;
		justify-content: center;
		margin: 0 auto;
		padding: 0;
		width: 100%;
		/*max-width: 1280px;*/
	}
	.box-contents-index-bottom .item {
		margin: 0;
		padding: 0;
		width: 25%;
	}
	.box-contents-index-bottom .item img {
		margin: 0;
		padding: 0;
		width: 100%;
	}



	/*==// スライダーと文字のwrap //==*/
	.slider-area{
		position:relative;
		margin: 77px 0 0 0;
		padding: 0;
		width: 100%;
	}
	/*==// 上に載せる文字部分 //==*/
	.slider-area .copy{
		margin: 0 auto;
		width: 90%;
		max-width: 800px;
		color:#fff;
		position:absolute;
		/*上下中央に文字配置*/
		top:50%;
		transform:translateY(-50%);
		-webkit-transform:translateY(-50%);
		-ms-transform:translateY(-50%);
		left: 0;
		right: 0;
	}
	.slider-area .copy p {
		font-size: 32px;
	}
	/*===================================
	 スライダーの指定だけならここから下だけでOK
	===================================*/
	/*==// スライダーのコンテナ //==*/
	.slider-area .slider {
		padding: 0;
		width:100%;/* スライダーの幅を指定*/
		list-style:none;
	}
	/*==//  ここから矢印  //==*/
	.slick-arrow{ display: none !important; /*z-index:100;*/ }
	.slick-next{ right:10px !important;}/*内側に右から10ピクセル移動*/
	.slick-prev{ left:10px !important; }/*内側に左から10ピクセル移動*/

}

@media only screen and (max-width: 565px) {
	.box-contents-index h2 {
		position: absolute;
		left: 0;
		right: 0;
		margin: 16% auto 0 auto;
		padding: 0;
		color: #ffffff;
		text-align: center;
		/*text-shadow: rgba(0, 0, 1, 1) 1px 1px 10px, rgba(0, 0, 1, 1) -1px 1px 10px, rgba(0, 0, 1, 1) 1px -1px 10px, rgba(0, 0, 1, 1) -1px -1px 10px;*/
		text-shadow: rgba(0, 0, 1, 1) 1px 1px 10px, rgba(0, 0, 1, 1) -1px 1px 10px;
		font-size: 15px;
	}
}

@media only screen and (max-width: 459px) {
	.slider-area .copy p {
		font-size: 24px;
	}
}