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

/*================================================
 *  基本設定
 ================================================*/

	body {
		margin: 0px;
		padding: 0px;
	}

	#header {
		position:fixed;
	}

	.index-back {
		background-color: white;
		z-index: -80000;
	}

/********* レスポンシブ設定 ********************************************************************************************/
/********* スマートフォンA -600px、スマートフォンB 601px-850、タブレット 851-1200px、パソコン 1200-                         **************/
/********************************************************************************************************************/


/*========================================================================================================
 *  パソコンメニュー用　基本 すべての画面サイズ これをベースに画面サイズごとに設定を変える
 ========================================================================================================*/

				/*TOPイメージ画像 スライドショー*/

							.top-img img{
								width:100%;
							}


				/*********** 内容　[パソコン] ***************************************************/

							.top1 {
								text-align: center;
								margin: 0 auto;
								margin-top: 50px;
								margin-bottom: -100px;
							}
							.top1 img{
								max-width: 1000px;
								margin: 0 auto;
								text-align: center;
							}


					/*********** ボタンデザイン　[パソコン] ***************************************************/

							a.btn_06 {
								display: block;
								vertical-align: middle;
								text-decoration: none;
								width: 250px;
								padding: 1rem 4rem;
								font-weight: bold;
								border-radius: 100vh;
								border-bottom: 7px solid #0686b2;
								background: #27acd9;
								color: #fff;
							}
							a.btn_06:hover {
								margin-top: 6px;
								border-bottom: 1px solid #0686b2;
								color: #fff;
							}
							.top1-btn {
								margin: 0 auto;
								text-align: center;
								margin-top: -150px;
								margin-left: 25%;
							}
							.top2-btn {
								margin: 0 auto;
								text-align: center;
								margin-top: -200px;
								margin-left: 25%;
							}

							
							#contents{
								margin: 0 auto;
								text-align: center;
							}
							.catch-copy{
								text-align: center;
							}

/************************** izu1 **************************/

							.izu1{
								display: flex;
								flex-direction: row;
								width: 100%;
								min-width: 850px;
								margin: 0 auto;
								text-align: center;
								margin-top: 100px;
								justify-content: center;
							}

							.izu1 .catch-copy{
								margin: 0 20px;
							}
							.izu-copy-pc{
								display: block;
								
							}
							.izu-copy-sm{
								display: none;
								width: 100%;
							}
							.izu1 .catch-copy{
								width: 150%;
							}
							.izu1 .catch-copy-text{
								width: 150%;
								min-width: 400px;
							}


							.izu-img1-pc{
								display: block;
							}
							.izu-img1-sm{
								display: none;
							}

							.izu-img1 img {
								max-width: 300px;
								min-width: 200px;
								margin-left: 0px;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}

							.izu1 .catch-copy{
								width: 30%;
								text-align: center;
							}


/************************** izu2 **************************/

							/*分岐*/
							.izu-img2-pc{
								display: block;
							}
							.izu-img2-sm{
								display: none;
							}
							/***/

							.izu-img2 img {
								display: block;
								max-width: 250px;
								min-width: 200px;
								margin-right: 0px;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}

							.izu2{
								display:block;
								text-align: center;
								background: linear-gradient(to bottom, #BDE8D5, #FFFFFF);
								width: 100vw;
								height: auto;
								margin: 0 auto;
								margin-top: 80px;
								padding-top: 40px;
							}
							.izu2 .catch-copy{
								margin-top: 0px;
								margin-bottom: -50px;
							}

							.izu2 img{
								margin: 0 auto;
							}

							.izu-img3-pc{
								display: block;
							}
							.izu-img3-sm{
								display: none;
							}

							.izu-img3-pc img {
								max-width: 600px;
								min-width: 300px;
								margin: 0 auto;
								margin-top: 100px;
								margin-bottom: 100px;
								text-align: center;
							}

/************************** izu3 **************************/

							.izu3{
								background: #FFFFFF;
								width: 100vw;
								height: auto;
								margin: 0 auto;
								margin-top: -50px;
							}

							.izu3 .catch-copy{
								margin-top: -100px;
								margin-bottom: 50px;
							}
							.izu-img4 img{
								max-width: 100px;
								min-width: 50px;
								margin: 0 auto;
								margin-top: 100px;
								margin-bottom: 0px;
								text-align: center;
							}

/************************** izu4 **************************/

							.izu4{
								background: #E6E2E2;
								width: 100vw;
								height: auto;
								margin: 0 auto;
								padding-bottom: 50px;
							}
							.izu-img5 img{
								max-width: 1000px;
								min-width: 600px;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}
						
							.izu-img6-pc{
								display: block;
								margin-top: 50px;
							}
							.izu-img6-sm{
								display: none;
							}
							.izu-img6-pc img{
								max-width: 900px;
								min-width: 600px;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}

							.izu-img7-pc{
								display: block;
							}
							.izu-img7-sm{
								display: none;
							}
							.izu-img7-pc img{
								max-width: 900px;
								min-width: 600px;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}

							.izu-img8-pc{
								display: block;
							}
							.izu-img8-sm{
								display: none;
							}
							.izu-img8-pc img{
								max-width: 900px;
								min-width: 600px;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}

							.footer-background2 {
								
							}

					/*********** おすすめ　[パソコン] ******************************************/

							.news {
								display: flex;
									/* 右方向に横並び */
								justify-content: center;
								margin-top: 30px;
								margin-bottom: 50px;
							}
							
							.new-1 {
							    width: 400px;
								display: flex;
								flex-direction: column;
								jistify-content: center;
							}
							.new-1 img {
								max-width: 400px;
							}

							.new-2 {
							    width: 400px;
								margin-top: 5px;
								margin-left: 40px;
								display: flex;
								flex-direction: column;
								jistify-content: center;
							}
							.new-2 img {
								max-width: 400px;
							}


					/*********** ボタンデザイン　[パソコン] ***************************************************/

							a.btn_06 {
								display: block;
								vertical-align: middle;
								text-decoration: none;
								width: 250px;
								padding: 1rem 4rem;
								font-weight: bold;
								border-radius: 100vh;
								border-bottom: 7px solid #0686b2;
								background: #27acd9;
								color: #fff;
							}
							a.btn_06:hover {
								margin-top: 6px;
								border-bottom: 1px solid #0686b2;
								color: #fff;
							}

							
							a.btn_07 {
								display: block;
								vertical-align: middle;
								text-decoration: none;
								width: 250px;
								padding: 0.5rem 2rem;
								font-weight: bold;
								border-radius: 100vh;
								border-bottom: 7px solid #0686b2;
								background: #27acd9;
								color: #fff;
								text-align: center;
							}
							a.btn_07:hover {
								margin-top: 6px;
								border-bottom: 1px solid #0686b2;
								color: #fff;
							}



						
					/*********** お問い合わせ　Contact Us 設定　[パソコン] ******************************************/
					
							.contact {
								display: flex;
								flex-direction: row; 	/* 右方向に横並び */
								justify-content: center;
								margin-top: 30px;
								margin-bottom: 50px;
							}
							
							.contact-tel {
							    width: 350px;
							}
					
							.contact-web {
							    width: 350px;
								margin-top: 5px;
								margin-left: 40px;
							}







/*=======================================================================================================
 *  タブレット向けデザイン　画面幅600px以上849以下
  ========================================================================================================*/

			/*** メニュー部分はスマートフォン用、内容はunder900、スマートフォン用。共用部分に注意 *********/
				@media screen and (min-width:601px) and (max-width:849px) {
					
							body {
								max-width: 849px;
							}
					
					
							.slider {
								z-index: -30000;
								width:100vw;
 								height:100vh;
								margin-bottom: -120px;
							}

							.caption {
								position: absolute;
								left: 50%;
								transform: translateX(-50%);
								bottom:200px;
								z-index: 100000;
							}
							.caption img {
								width: 250px;
								height: 100%;
							}

					
				/*********** 内容　[タブレット] ***************************************************/

							.top1 {
								text-align: center;
								margin: 0 auto;
								margin-top: 50px;
								margin-bottom: -100px;
							}
							.top1 img{
								max-width: 1000px;
								margin: 0 auto;
								text-align: center;
							}


					/*********** ボタンデザイン　[タブレット] ***************************************************/

							a.btn_06 {
								display: block;
								vertical-align: middle;
								text-decoration: none;
								width: 250px;
								padding: 1rem 4rem;
								font-weight: bold;
								border-radius: 100vh;
								border-bottom: 7px solid #0686b2;
								background: #27acd9;
								color: #fff;
							}
							a.btn_06:hover {
								margin-top: 6px;
								border-bottom: 1px solid #0686b2;
								color: #fff;
							}
							.top1-btn {
								margin: 0 auto;
								text-align: center;
								margin-top: -150px;
								margin-left: 25%;
							}
							.top2-btn {
								margin: 0 auto;
								text-align: center;
								margin-top: -200px;
								margin-left: 25%;
							}

							
							#contents{
								margin: 0 auto;
								text-align: center;
								justify-content: center;
							}
							.catch-copy{
								text-align: center;
							}

/************************** izu1 **************************/

							.izu1{
								display: flex;
								flex-direction: row;
								width: 100%;
								min-width: 850px;
								margin: 0 auto;
								text-align: center;
								margin-top: 100px;
								justify-content: center;
							}



							.izu-img1-pc{
								display: block;
							}
							.izu-img1-sm{
								display: none;
							}

							.izu-img1 img {
								max-width: 200px;
								min-width: 150px;
								margin-top: 0px;
								margin-bottom: 0px;
								margin-left: calc(20% - 20vw);
								text-align: center;
							}
					
							.izu-copy-pc{
								display: none;
								
							}
							.izu-copy-sm{
								display: block;
								width: 40%;
							}

							.izu1 .catch-copy-text{
								width: auto;
								min-width: 200px;
								text-align: left;
								margin: 0 20;
							}

							/*分岐*/
							.izu-img2-pc{
								display: block;
							}
							.izu-img2-sm{
								display: none;
							}
							/***/

							.izu-img2 img {
								display: block;
								max-width: 200px;
								min-width: 150px;
								/*justify-content: flex-end;*/
								margin-top: 0px;
								margin-bottom: 0px;
								margin-right: -100px;
							}

/************************** izu2 **************************/

							.izu2{
								display:block;
								text-align: center;
								background: linear-gradient(to bottom, #BDE8D5, #FFFFFF);
								width: 100vw;
								height: auto;
								margin: 0 auto;
								margin-top: 80px;
								padding-top: 40px;
							}
							.izu2 .catch-copy{
								margin-top: 0px;
								margin-bottom: -50px;
							}

							.izu2 img{
								margin: 0 auto;
							}
					
					.izu-img3-pc{
						display: block;
					}
					.izu-img3-sm{
						display: none;
					}

							.izu-img3-pc img {
								max-width: 600px;
								min-width: 300px;
								margin: 0 auto;
								margin-top: 100px;
								margin-bottom: 100px;
								text-align: center;
							}

/************************** izu3 **************************/

							.izu3{
								background: #FFFFFF;
								width: 100vw;
								height: auto;
								margin: 0 auto;
								margin-top: -50px;
							}

							.izu3 .catch-copy{
								margin-top: -100px;
								margin-bottom: 50px;
							}
							.izu-img4 img{
								max-width: 80px;
								min-width: 50px;
								margin: 0 auto;
								margin-top: 100px;
								margin-bottom: 0px;
								text-align: center;
							}

/************************** izu4 **************************/

							.izu4{
								background: #E6E2E2;
								width: 100vw;
								height: auto;
								margin: 0 auto;
								padding-bottom: 50px;
							}
							.izu-img5 img{
								max-width: 840px;
								min-width: 550px;
								width: 100%;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}
					
							.izu-img6-pc{
								display: block;
								margin-top: 50px;
							}
							.izu-img6-sm{
								display: none;
							}
							.izu-img6-pc img{
								max-width: 840px;
								min-width: 550px;
								width: 100%;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}
					
							.izu-img7-pc{
								display: block;
							}
							.izu-img7-sm{
								display: none;
							}
							.izu-img7-pc img{
								max-width: 840px;
								min-width: 550px;
								width: 100%;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}
					
							.izu-img8-pc{
								display: block;
							}
							.izu-img8-sm{
								display: none;
							}
							.izu-img8-pc img{
								max-width: 840px;
								min-width: 550px;
								width: 100%;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}
					/*
					
							.news-box{
								margin: 0 auto;
								text-align: center;
								width: 90%;
								height: 520px;
								position: relative;
							}
							.box {
								margin-top:50px; 
								margin:0 auto; 
								position: relative;
								margin: 0 auto;
								width: 90%;
								height: 520px;
							}
							.linkbox {
								width: 90%;
								height: 520px;
								position: absolute;
							}
							.box iframe {
								width: 90%;
								height: 520px;
							}
					
					
					/*********** キャッチコピー設定　[タブレット 600-850]***************************************************/
									
				
							.catch-copy {
								max-width: 550px;
								margin: 0 auto;
								margin-top:10px;
							}
					
							.catch-copy-text {
								width: 500px;
								margin-top: 10px;
							}
					
					
					/*********** 内容　[スマホB 600-850]***************************************************/
										
					.top1 img {
						width: 100%;
						margin-top: 80px;
					}
					.top2 img {
						width: 100%;
					}
					
					
					/*********** ボタンデザイン　[パソコン] ***************************************************/

							a.btn_06 {
								display: block;
								text-align: center;
								vertical-align: middle;
								text-decoration: none;
								width: 200px;
								margin: auto;
								padding: 1rem 3rem;
								font-weight: bold;
								border-radius: 100vh;
								border-bottom: 5px solid #0686b2;
								background: #27acd9;
								color: #fff;
							}
							a.btn_06:hover {
								margin-top: 6px;
								border-bottom: 1px solid #0686b2;
								color: #fff;
							}
					
					/*********** お問い合わせ　Contact Us 設定　[タブレット 600-850] ******************************************/
					
							.contact {
								display: flex;
								flex-direction:column;/* 右方向に横並び */
								justify-content: center;
							
							}
							
							.contact-tel {
							    width: 100px;
								margin: 0 auto;
							}
							.contact-tel img {
								flex-shrink: 0;
								max-width: none;
								margin-left: -100px;
							}
					
							.contact-web {
							    width: 300px;
								margin-left: 0px;
								margin: 0 auto;
							}
							.contact-web img {
								width: 360px;
								flex-shrink: 0;
								max-width: none;
							}
							.contact-button img{
								max-width: none;
								flex-shrink: 0;
							}

					


					}




/*========================================================================================================
 *  スマートフォンA向けデザイン  画面幅600以下
 ========================================================================================================*/

				@media screen and (max-width:600px) {
			
					body *{
						max-width: 600px;
						margin: 0px;
						padding: 0px;
					}

					.wrapper {
						overflow: hidden;
					}
					
					/*.slider {
								z-index: -30000;
							}

							.caption {
								display: flex;
								flex-direction: column;
								justify-content: center;
								margin-left: auto; 
								margin-right: auto;
								width: 100px;
								margin-top: -600px;
								z-index: 100000;
							}
							.caption img {

							}*/
					
					/************************** izu1 **************************/

							.izu1{
								display: flex;
								flex-direction: column;
								width: 100%;
								min-width: 850px;
								margin: 0 auto;
								text-align: center;
								margin-top: 100px;
								justify-content: center;
							}



							.izu-img1-pc{
								display: none;
							}
							.izu-img1-sm{
								display: block;
							}

							.izu-img1-sm img {
								max-width: 400px;
								min-width: 150px;
								margin-top: -80px;
								margin-bottom: 0px;
								margin-left: calc(20% - 20vw);
								text-align: center;
								margin-bottom: 50px;
							}
					
							.izu-copy-pc{
								display: none;
								
							}
							.izu-copy-sm{
								display: block;
								width: 150%;
								margin: 0 auto;
								margin-left: 5%;
							}


							/*分岐*/
							.izu-img2-pc{
								display: none;
							}
							.izu-img2-sm{
								display: block;
							}
							/***/

							.izu-img2-sm img {
								display: block;
								width: 80%;
								max-width: 500px;
								min-width: 150px;
								margin-left: 5%;
								/*justify-content: flex-end;*/
								margin-top: 0px;
								margin-bottom: 0px;
								margin-right: -100px;
							}

/************************** izu2 **************************/

							.izu2{
								display:block;
								text-align: center;
								background: linear-gradient(to bottom, #BDE8D5, #FFFFFF);
								width: 100vw;
								height: auto;
								margin: 0 auto;
								margin-top: 80px;
								padding-top: 40px;
							}
							.izu2 .catch-copy{
								margin-top: 0px;
								margin-bottom: -50px;
							}

							.izu2 img{
								margin: 0 auto;
							}
					
					.izu-img3-pc{
						display: none;
					}
					.izu-img3-sm{
						display: block;
					}

							.izu-img3-sm img {
								max-width: 380px;
								min-width: 300px;
								margin: 0 auto;
								margin-top: 100px;
								margin-bottom: 100px;
								text-align: center;
							}

/************************** izu3 **************************/

							.izu3{
								background: #FFFFFF;
								width: 100vw;
								height: auto;
								margin: 0 auto;
								margin-top: -50px;
							}

							.izu3 .catch-copy{
								margin-top: -100px;
								margin-bottom: 50px;
							}
							.izu-img4 img{
								max-width: 80px;
								min-width: 50px;
								margin: 0 auto;
								margin-top: 100px;
								margin-bottom: 0px;
								text-align: center;
							}

/************************** izu4 **************************/

							.izu4{
								background: #E6E2E2;
								width: 100vw;
								height: auto;
								margin: 0 auto;
								padding-bottom: 50px;
							}
							.izu-img5 img{
								max-width: 840px;
								min-width: 550px;
								width: 100%;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}
					
							.izu-img6-pc{
								display: none;
							}
							.izu-img6-sm{
								display: block;
								margin-top: 80px;
							}
							.izu-img6-sm img{
								max-width:600px;
								width: 90%;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}
					
							.izu-img7-pc{
								display: none;
							}
							.izu-img7-sm{
								display: block;
							}
							.izu-img7-sm img{
								max-width:600px;
								width: 90%;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}
					
							.izu-img8-pc{
								display: none;
							}
							.izu-img8-sm{
								display: block;
							}
							.izu-img8-sm img{
								max-width:600px;
								width: 90%;
								margin: 0 auto;
								margin-top: 0px;
								margin-bottom: 0px;
								text-align: center;
							}
					
					
					#contents {
						margin-top: 0px;
						padding-top: 0px;
						margin: 0;
						z-index: -500005;
						max-width: 600px;
					}
					
				/*	.news-box{
								margin: 0 auto;
								text-align: center;
								width: 90%;
								height: 520px;
								position: relative;
							}
							.box {
								margin-top:50px; 
								margin:0 auto; 
								position: relative;
								margin: 0 auto;
								width: 90%;
								height: 300px;
							}
							.linkbox {
								width: 90%;
								height: 520px;
								position: absolute;
							}
							.box iframe {
								width: 180%;
								height: 520px;
								transform:scale(0.55);
								margin-left: -130px;
								margin-top: -100px;
							}
					

					/*********** キャッチコピー設定　[スマホ-600] ***************************************************/

					
							.catch-copy {
								max-width: 600px;
								margin-top:10px;
							}
					
							.catch-copy-text {
								width: 100%;
								margin-left: 0px;
								margin-top: -40px;
								margin-bottom: 30px;
							}
					
							h1 {
								font-size: 23px;
							}
					
					
					
					/*********** 内容　[スマホ-600] ***************************************************/

							.top1 img {
								width: 100%;
							}
							.top2 img {
								width: 100%;
							}
					
					
					/*********** ボタンデザイン　[スマホ600] ***************************************************/

							a.btn_06 {
								display: block;
								text-align: center;
								vertical-align: middle;
								text-decoration: none;
								width: 150px;
								height: 10px;
								font-weight: bold;
								font-size: 11pt;
								border-radius: 50px;
								border-bottom: 4px solid #0686b2;
								background: #27acd9;
								color: #fff;
							}
							a.btn_06:hover {
								margin-top: 4px;
								border-bottom: 1px solid #0686b2;
								color: #fff;
							}
					
							.top1-btn{
								margin: 0 auto;
								text-align: center;
								margin-left: 25%;
								margin-right: 25%;
								margin-top: -20px;
							}
					.top2-btn{
						margin-left: 25%;
					}

					
					/*********** お問い合わせ　Contact Us 設定　[スマホ-600] ******************************************/
					
							.contact {
								display: flex;
								flex-direction: column;/* 右方向に横並び */
								justify-content: center;
								margin-top: 30px;
								margin-bottom: 50px;
							}
							
							.contact-tel {
							    width: 300px;
								margin: 0 auto;
							}
					
							.contact-web {
							    width: 300px;
								margin: 0 auto;
								margin-top: 5px;
								
							}
					
					}