@charset "UTF-8";
@media screen and (max-width:768px) {
/* ===================================================================

	Setting

=================================================================== */
html { color:#333; background:#FFF; line-height:1.6; text-align:left; font-size:65.5%; }
body { font-size:1.5rem; font-family:'メイリオ',Meiryo,'ＭＳ Ｐゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro'; overflow-x:hidden; }
img { max-width:100%; height:auto; }
.containar { width:100%; height:100%; margin:0 auto; position:relative; }
.containar:after { content:""; display:block; clear:both; }


.pc { display:none; }
.sp { display:block; }

　　/* link set
	------------------------------------------------------------------- */
	a { color:#5B463F; text-decoration:none; transition:0.3s ease-in-out; }
	a img { transition:0.3s ease-in-out; }
	a:hover { color:#47676F; }

	/* float対策：背景色表示用
	------------------------------------------------------------------- */
	.clearfix:after { display: block; clear: both; height: 0px; line-height: 0px; visibility: hidden; content: "."; }
	.clearfix {	display: block; /* for IE8 */ }
	.both { clear:both; }
	.hidden { display: none; }

	/* 	imgホバーアクション
	------------------------------------------------------------------- */
	.imgWrap { overflow: hidden; width: 100%;　height: auto; cursor: pointer; background-color: #ffffff; }
	.imgWrap img{ display: block; transition-duration: 0.3s; margin-top: -1px; }
	/*.imgWrap img:hover{ opacity: 0.6; transform: scale(1.1); transition-duration: 0.3s; }*/

	/* 	背景画像＆テキスト使用時スマホ用
	------------------------------------------------------------------- */
	.bg.spTxt { text-indent: 0; width: auto !important; height: auto !important; background-image: none !important; }



/* ===================================================================

	Header

=================================================================== */
body > header  { display: none; }
body > header .logo { line-height: 1.8; display: inline-block; width: 80%; }
body > header h1 { float:left;  max-width: 60%; margin-left: 4%; margin-top:0px; }
body > header img.logo02 { width: 60%; margin-left: 1%; vertical-align: bottom; }
body > header .h_sns { display: none; }
body > header .logo {
    float: left;
    padding: 10px 0px 0px 0px;
    margin-right: 100px;
}

	      /* h_r
		  ------------------------------------------------------------------- */
		  body > header .h_r { display: none; }


		  /* nav
		  ------------------------------------------------------------------- */
		  body > header nav { display: none; }


	/* smh_menu
		  ------------------------------------------------------------------- */
		  #smh_menu { display: none; }


/* ===================================================================
	/
	/	smh_menu　トグルメニュー
	/
	=================================================================== */
	#smh_menu { display: block; position: relative;	z-index: 9999; }
	.drawer-nav ul li { margin-right: 0px; float: none; font-size: 1.1rem; display: block; padding: .5rem; text-decoration: none;	color: #222; }




	.main_wrapper {width:100%; position: relative;right: auto; top: auto;margin-top: -26px;}






/* ===================================================================
	/
	/	main-image
	/
	=================================================================== */
	.main_image {
		text-align: center;
		margin-top: 0;
		position: relative;
	}
	.main_image {
		background-image: url(../images/sougi_top_tani-02.jpg);
		background-repeat: no-repeat;
		background-size: contain;
		height: auto;
		padding: 13% 5% 7% 12%;
	}
	.main_image1 {
		width:65%;
		margin-bottom:10px;
	}
	.main_image p {
		font-size:12px;
		font-weight:bold;
		margin-bottom:0px;
		text-align:left;
	}
	.main_image .topc {
		display:none;
	}

/* ===================================================================
	/
	/	contact-area
	/
	=================================================================== */
	.contact-area {
		background-image: url(../images/sougi_top_tani-03.jpg);
		padding: 30px 10% 30px;
		color: #fff;
	}
	.contact-area p {
		margin-bottom: 30px;
		font-size: 13px;
		line-height: 23px;
	}
	.contact-area .containar div .tel {
		width: 100%;
		float: none;
		margin-bottom: 30px;
	}
	.contact-area .containar div .mail {
		width: 100%;
		float: none;
		margin-bottom: 30px;
	}


/* ===================================================================
	/
	/	s1
	/
	=================================================================== */
	.s1 {
		background: #ffffff;
		padding: 50px 5%;
	}
	.s1 h2 {
    margin-bottom: 40px;
}
	.s1 .containar .area .area01 {
		width:100%;
		margin-bottom:40px;
	}
	.s1 .containar .area .area02 {
		width:100%;
		margin-bottom:40px;
	}
	.s1 .containar .area .area03 {
		width:100%;
		margin-bottom:40px;
	}




/* ===================================================================
	/
	/	s2
	/
	=================================================================== */
	.s2 { padding: 30px 5%; }
	.s2 .containar .area .area01 {
		width:48%;
	}
	.s2 .containar .area .area02 {
		width:48%;
	}
	.s2 .containar .area .area03 {
		width:48%;
		margin-left:auto;
		margin-right:auto;
	}
	.s2 .containar .area .plan-link img {
    margin-top: -100px;
    width: 80%;
}

/* ===================================================================
	/
	/	s3
	/
	=================================================================== */
	.s3 div .area01 {
		width: 100%;
		float: none;
		background-image: url(../images/sougi_top_tani-09.jpg);
		padding: 30px 4% 30px;
		text-align:center;
	}
	.s3 div .area01 img {
		float: none;
		width: 80%;
	}
	.s3 div .area02 {
		width: 100%;
		float: none;
		background-image: url(../images/sougi_top_tani-10.jpg);
		padding: 30px 4% 30px;
		text-align:center;
	}
	.s3 div .area02 img {
		float: none;
		width: 80%;
	}

/* ===================================================================
	/
	/	s4
	/
	=================================================================== */
	.s4 { padding:30px 5%; text-align:center;
	}
	.s4 h2 {
		width: 80%;
	}
	.s4 p {
		text-align:left;
		font-size: 15px;
    	margin-bottom: 40px;
	}
	.s4 .area {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 100%;
		margin: 0 auto 50px;
	}
	.s4 .area .area01 {
		width: 100%;
		margin-bottom:30px;
	}
	.s4 .area .area02 {
		width: 100%;
		margin-bottom:30px;
	}
	.s4 .motto {
		width: 60%;
		margin-bottom:30px;
	}



/* ===================================================================
	/
	/	s5
	/
	=================================================================== */
	.s5 {
		padding:30px 5%;
	}
	.s5 .containar .area {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		width: 100%;
		margin: 0 auto 50px;
	}
	.s5 .containar .area .area01 {
		width: 48%;
		text-align: center;
		margin-bottom:30px;
	}
	.s5 .containar .area .area02 {
		width: 48%;
		text-align: center;
		margin-bottom:30px;
	}
	.s5 .containar .area .area03 {
		width: 48%;
		text-align: center;
		margin-bottom:30px;
	}
	.s5 .motto {
		width: 60%;
		margin-bottom:30px;
	}








/* ===================================================================
	/
	/	footer
	/
	=================================================================== */
	body > footer > .containar { margin:0 0 10px;padding: 0px 0 30px; }
	footer {  background:#c9e6e2;text-align:center; padding:30px 5% 30px;}
	footer ul { display:none;}
	footer .flogo img {
		width:50%;
		margin:30px 0 15px 0;
	}
	small { display: block; margin-right: 0; }


}