/* ロゴの下の説明分 

style01 … PC1行／スマホ1行 or 2行
style02 … PC2行／スマホ3行
style03 … PC2行／スマホ2行

*/

#main-img {
  margin: 0px 0 20px;
}

.header_text {
  margin: 0 0 20px;
}
.topics {
  margin: 0 0 45px;
}
.text_area {
	margin: 20px 0 25px 0;
}

.list {
    margin: 30px 0 40px;
}
.list:after {
  content: "";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.list li {
	float: left;
	margin: 0 15px 30px 15px;
}

.list li a {
    display: block;
    width: 286px;
    height: 66px;
    padding: 20px 30px 20px 12px;
    position: relative;
	border: 1px solid #666;
	background: url(../../../../common/img/icon_external_link.png) 302px center no-repeat;
	background-size: 18px;
}
.list li a.style01 {
    height: 86px;
    width: 311px;
    text-decoration-line: none;
    padding: 10px 5px 10px 12px;
}
.list li a.style01 p {
    line-height: 2;
}

.list li a.style02,
.list li a.style03 {
    height: 94px;
    width: 318px;
    text-decoration-line: none;
    padding: 6px 5px;
}

.list li p {
    text-align: center;
    line-height: 1.2;
	font-size: 80%;
}

.list li a:hover,
.list li a:active {
	opacity: 0.7;
    color: #333;
}


#flow-wrap {
  width: 700px;
  margin: -10px auto 0 auto;
}
#flow-wrap ul li div.waku {
  border: #B4B3A9 1px solid;
  padding: 15px 15px;
}
#flow-wrap ul li {
  padding: 10px 0 23px;
  background: url("../img/arrow.gif") center bottom no-repeat;
}
#flow-wrap ul li#flow04 {
  padding: 10px 0 10px;
  background: none;
}
#flow-wrap ul li span {
	color: #f79111;	
}
#flow-wrap ul li p {
	margin: 5px 0 0 20px;	
    font-size: 93%;
}


@media only screen and (max-width: 767px) {
.list li {
	float: left;
    width: 50%;
    margin: 0; 
}
.list li a {
    margin: 0 0 5px 0; 
    width: auto;
    padding: 20px 5px 5px 5px;
    height: 85px;
    background-image: none;
}

.list li a.style01 {
    margin: 0 0 5px 0; 
    width: auto;
    padding: 8px 5px;
    height: 95px;
}
.list li a.style02 {
    margin: 0 0 5px 0; 
    width: auto;
    padding: 5px 2px;
    height: 100px;
}
.list li a.style03 {
    margin: 0 0 5px 0; 
    width: auto;
    padding: 5px 2px;
    height: 100px;
}
.list li a.style01 p {
    line-height: 1.2;
}
.list li a.style02 p {
    line-height: 1;
}
.list li a.style03 p {
    line-height: 1.2;
}

.list li p {
	font-size: 75%;
}
    
.list li:nth-child(odd) a{
    margin: 0 5px 5px 0; 
}
    
#flow-wrap {
    width: auto;
  }
#flow-wrap ul li div.waku {
  padding: 10px;
}
    
#flow-wrap ul li p {
	margin: 5px 0 0 0px;
    font-size: 85%;
  }

}

@media only screen and (max-width: 430px) {
.list li a {
    height: 55px;
}
.list li a.style01 {
    height: 64px;
}
.list li a.style02 {
    height: 70px;
}
.list li a.style03 {
    height: 70px;
}
}