@charset "utf-8";
@import url(cmn.css);
@import url(base.css);

/* ==========================================================================
	CONTENT
========================================================================== */
#flow-select{
  text-align:center;
  padding-top:40px;
}
#flow-select img{
  width:35%;
  padding:0 15px;
}
/* ------------------------------------------------------------
	 PC   800px -
------------------------------------------------------------ */

@media screen and (min-width: 800px) {
#head{
  border-bottom:1px solid #c6c6c6;
}

#about .float-l{
  width:390px;
}
#about .float-r{
  width:500px;
  text-align:center;
}
#about .float-r h3 img{
  width:95%;
  height:auto;
  margin-bottom:30px;
}
#flow01{
  padding-bottom:100px;
  margin-bottom:150px;
  border-bottom:1px solid #9fa0a0;
}
.flow .float-l{
  width:200px;
}
.flow .float-l img{
  width:100%;
  height:auto;
}
.flow .float-r{
  width:694px;
  text-align:center;
}
.flow .float-r h3{
  text-align:left;
  border-bottom:1px dotted #999;
  margin-bottom:20px;
  padding-left:85px;
  padding-bottom:10px;
}
.flow .float-r h3 img{
  height:15px;
  width:auto;
}
.flow .float-r li{
  margin-bottom:20px;
}

}

/* ------------------------------------------------------------
	 TABLET   for - 799px
------------------------------------------------------------ */

@media screen and (max-width:799px) {
#about .float-l{
  width:40%;
}
#about .float-r{
  width:55%;
  text-align:center;
}
#about .float-r h3 img{
  width:95%;
  height:auto;
  margin-bottom:20px;
}
#flow01{
  padding-bottom:60px;
  margin-bottom:80px;
  border-bottom:1px solid #9fa0a0;
}
.flow .float-l{
  width:20%;
}
.flow .float-l img{
  width:100%;
  height:auto;
}
.flow .float-r{
  width:78%;
  text-align:center;
}
.flow .float-r h3{
  text-align:left;
  border-bottom:1px dotted #999;
  margin-bottom:20px;
  padding-left:85px;
  padding-bottom:10px;
}
.flow .float-r h3 img{
  height:15px;
  width:auto;
}
.flow .float-r li{
  margin-bottom:20px;
}

}
/* ------------------------------------------------------------
	 SP　599pxまで
------------------------------------------------------------ */

@media screen and (max-width: 599px) {
#about .float-l{
  float:none;
  width:100%;
}
#about .float-r{
  float:none;
  width:100%;
  text-align:center;
  padding:40px 0;
}
#about .float-r h3 img{
  width:95%;
  height:auto;
  margin-bottom:10px;
}

.flow .float-l{
  float:none;
  width:100%;
  text-align:center;
}
.flow .float-l img{
  width:60%;
  height:auto;
  margin-bottom:10px;
}
.flow .float-r{
  float:none;
  width:100%;
  text-align:center;
}
.flow .float-r h3{
  text-align:left;
  border-bottom:1px dotted #999;
  margin-bottom:20px;
  padding-left:65px;
  padding-bottom:10px;
}
.flow .float-r h3 img{
  height:15px;
  width:auto;
}
.flow .float-r li{
  margin-bottom:20px;
}

}