body {
font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic'  
}


.wrapper {
  max-width: 1300px;
  margin: 0 auto;
}
header {


}
.container {
  display: flex;
}
.main {


}
footer {



}



	/*　画像をリサイズ　*/
.resizeimage img { width: 100%; }
.resizeimage-half img { width: 50%;}
.resizeimage-half2 img { width: 120%;}
.resizeimage-01 { width: 100%; }



	/*　住所を横に詰める　*/
.adress {
margin-left:-4vw;
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.mobile { display: none !important; }
/* スマートフォンで見たときは"mobile"のclassがついた画像が表示される */
@media only screen and (max-width: 767px) {
.pc { display: none !important; }
.mobile { display: block !important; }
}












	/*　Conceputの横並び(PC)　*/

*, *:before, *:after {
	box-sizing: border-box;
}
.col_2{
        margin-top:-3vw;
        margin-left:16vw;
	width: 71%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}
.col_2 > div{
	width: 50%;
	padding: 10px;
}
@media screen and (max-width: 960px) {
	.col_2 > div{
		width: 100%;
	}
}





	/*　Conceputの横並び(スマホ)01　*/

*, *:before, *:after {
	box-sizing: border-box;
}
.col_2mo{
        margin-top:-3vw;
        margin-left:0vw;
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}
.col_2mo > div{
	width: 50%;
	padding: 10px;
}
@media screen and (max-width: 960px) {
	.col_2mo > div{
		width: 100%;
	}
}





.concept01{
margin-top:3vw;
}



/*　地図下のtableを横寄せ　*/
.tb01{
margin-top:-3vw;
margin-left:11vw;
}


/*　地図下のtableを横寄せ(スマホ)　*/
.tb01mo{
margin-top:-10vw;

}


/*　Conceptの画像を上へ詰める(スマホ)　*/
.concept{
margin-top:-10vw;

}



/*　レスポンシブタブレット 縦　*/
@media screen and (max-width: 1024px) {

.wrapper {
  max-width: 100%;
  margin: 0 auto;
}
  .container {
    flex-direction: column;
    max-width: 100%;
  }
  .main {
    max-width: 100%;
  }
footer {

    max-width: 100%;

}

 }




@media (max-width: 1000px){
.wrapper {
  max-width: 100%;
  margin: 0 auto;
}
  .container {
    flex-direction: column;
    max-width: 100%;
  }
  .main {
    max-width: 100%;
  }
footer {

    max-width: 100%;

}

}




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

.wrapper {
  max-width: 100%;
  margin: 0 auto;
}
  .container {
    flex-direction: column;
    max-width: 100%;
  }
  .main {
    max-width: 100%;
  }
footer {

    max-width: 100%;

}
 }





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

.wrapper {
  max-width: 100%;
  margin: 0 auto;
}
  .container {
    flex-direction: column;
    max-width: 100%;
  }
  .main {
    max-width: 100%;
  }
footer {

    max-width: 100%;

}
}