@charset "utf-8";
@media only screen and (min-width :768px ){
.contents .flex{
max-width: 960px;	
}
/*記事-----------------------------------*/
.item-flex{
max-width: 960px;	
flex-wrap: wrap; /* 画面幅に合わせてカラム落ちさせる */
display: flex;
justify-content: space-between;
align-items: top
}	
/* 最後のコンテンツを左寄せにする指定 */
.flex-flex:after {
content: "";
display: block;
width: 66.5%;  /* .boxに指定したwidthと同じ幅を指定する */
height: 0;
}


/**コラム--------*/
.center{
text-align: center;
margin: auto;	
}		
.item-flex p{
margin: 0rem auto 1rem auto;
padding: 0rem 0.5rem 0rem 0.5rem;
text-align: center;	
text-align: justify;		
}	
.flex h4{
color: #fffffb;		
background-color:rgba(50, 165, 185,1);
border: solid 1px rgba(50, 165, 185,1);
margin: 0rem auto 2rem auto;
padding: 0.5rem 0rem 0.5rem 0rem;
text-align: center;	
font-size: 2.2rem;	
font-weight: 500;	
}
.flex h3{
color: rgba(50, 165, 185,1);		
margin: 0rem auto 0rem 0.5rem;
padding: 0rem;
text-align: left;	
font-size: 2rem;	
line-height: 2.5rem;	
font-weight: 600;	
}	
.flex h5{
color: #333;	
margin: 0rem auto 0rem 0.5rem;
padding: 0rem;
text-align: left;	
font-size: 1.8rem;	
font-weight: 600;	
}		
.flex img{
margin: 0rem auto 3rem auto;
padding: 0rem;	
}	
.flex li{
margin: 0rem 0rem 0rem 2rem;
padding: 0rem 0.5rem 0rem 0.5rem;
text-align: left;	
text-align: justify;	
line-height: 2rem;
list-style: none;
color: #555;	
text-indent: -2.2rem	
}		


.flex-effect{
width: 30%;	
margin: 0rem auto  3rem auto;
text-align: center;	
}	

.flex-effect-b{
width: 30%;	
margin: 0rem auto  0rem auto;
}	
.flex-effect img{
width: 75%;	
margin: 0rem auto  0rem auto;	
padding: 0rem;
text-align: center;	
}	
.flex-effect h4{
text-align: center;
white-space: nowrap;	
margin: 0rem auto  1rem auto;	
color: #00a0ca;
font-weight: 600;	
font-size: 1.8rem;	
line-height: 2.2rem;
}
.flex-effect li{
text-align: center;
line-height: 2rem;	
margin: 1rem 0 0rem 1.5rem;
padding: 0em;
color:#777;
font-size: 1.5rem;	
}			
.flex-effect p{
margin: 0rem auto  0rem auto;	
padding: 0em;
text-align: center;	
font-size: 1.6rem;		
}
.item-btn{
width: 80%;	
margin: 0rem auto  0rem auto;		
}	
.item-btn h4{
background-color: #00a0ca;
border-radius: 4px;	
text-align: center;
margin: 1rem auto  1rem auto;
padding: 0.5rem  0rem 0.5rem 0rem;
color:#fff;
font-weight: 600;	
font-size: 1.6rem;	
line-height: 2.2rem;
}	
	
}


@media only screen and (max-width :768px ){
/*記事-----------------------------------*/
.pink {
margin: 3rem auto 3rem auto;	
text-align: center;	
color: #ff6464;
font-weight: 600;
}	
.flex p{
margin: 0.5rem auto 3rem auto;
padding: 0rem 0.5rem 0rem 0.5rem;
text-align: left;	
text-align: justify;		
}	
.flex h4{
color: #fffffb;		
background-color:rgba(50, 165, 185,1);	
margin: 0rem auto 0rem auto;
padding: 0.5rem 0rem 0.5rem 0rem;
text-align: center;	
font-size: 2rem;	
line-height: 2.5rem;	
font-weight: 500;	
}
.flex h3{
color: rgba(50, 165, 185,1);	
margin: 0rem auto 0rem 0.5rem;
padding: 0rem;
text-align: left;	
font-size: 1.8rem;	
font-weight: 600;	
}	
.flex h5{
color: #333;	
margin: 1rem auto 0rem 0.5rem;
padding: 0rem;
text-align: left;	
font-size: 1.8rem;	
font-weight: 600;	
}		
	
.flex img{
margin: 0rem auto 3rem auto;
padding: 0rem;	
}	
.flex li{
margin: 0rem 0rem 1rem 2rem;
padding: 0rem 0.5rem 0rem 0.5rem;
text-align: left;	
text-align: justify;	
line-height: 2rem;
list-style: none;
color: #555;	
text-indent: -2.2rem		
}		
	
.item-flex .flex-effect{
width: 100%;	
margin: 2rem auto  0rem auto;
text-align: center;	
}	
	
.flex-effect img{
width: 70%;	
margin: 0rem auto  -2rem auto;	
padding: 0rem;
text-align: center;	
}	
.item-flex .flex-effect h4{
margin: 2.5rem auto  1rem auto;	
color:rgba(50, 165, 185,1);	
font-weight: 600;	
font-size: 1.8rem;
line-height: 2.2rem;	
transform: scale(0.9, 1);
text-align: center;	
}	
.item-flex .flex-effect li{
text-align: center;	
margin: 1rem auto 0.5rem auto;
padding: 0em 0rem 0rem  0rem;
color:#777;
font-weight: 500;	
font-size: 1.5rem;	
}	
.flex-effect p{
margin: 0rem auto  0rem auto;	
padding: 0em  1rem 1rem  1rem;
text-align: center;	
font-size: 1.6rem;	

}		
	
.flex-effect .item-btn{
width: 80%;	
margin: 0rem auto  0rem auto;		
}	
.flex-effect .item-btn h4{
background-color: #00a0ca;
border-radius: 4px;	
text-align: center;
margin: 1rem auto  1rem auto;
padding: 0.5rem  0rem 0.5rem 0rem;
color:#fff;
font-weight: 600;	
font-size: 1.6rem;	
line-height: 2.2rem;
}	
		
}	