:root {
--main-color: #7ED58C;
--accent-color: #ff9800;
--bg-color: #f5f5f5;
--text-color: #333333;
--border-color: #cccccc;
--btn-color: #DEF1A1;
--aka-color: #f74057;
--dodger-color: dodgerblue;
--Turquoise-color: #0fbcbf;
--shiro-color: #ffffff;
--yello-color: #f2db00;
--btn_gel-color: #F04D27;
}
.flex_box{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.flex_between{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.flex_stretch{
align-items: stretch;
}
.flex_start {
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: center;
}
.flex_around,.selsct_flex00{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
}
.flex_column{
display: flex;
flex-direction: column;
justify-content: center;
width: 90%;
margin: 10px auto;
}
/*font*/
.bbb{
font-weight: bold;
}
.bbbb{
font-weight: 700;
font-size: 150%;
}
.fo_80{
font-size: 150%;
margin: 10px auto 0;
width: 95%;
color: #369FD1;
text-align: center;	
font-weight: bold;
}
.te_cen{
text-align: center;
}
.pa10{
padding: 10px 0;
}
.pa20{
padding: 20px 0;
}
.flex_20{
width: 22%;
margin: 0 auto;
}
.flex_30{
width: 28%;
margin: 0 auto;
}
.flex_35{
width: 32%;
margin: 0 auto;
}
.flex_40{
width: 38%;
margin: 0 auto;
}
.flex_50{
width: 48%;
margin: 0 auto;
}
.flex_60{
width: 58%;
margin: 0 auto;
}
.flex_65{
width: 63%;
margin: 0 auto;
}
.flex_70{
width: 68%;
margin: 0 auto;
}
.flex_90{
width: 90%;
margin: 0 auto;
}
.flex_box img,.flex_between img,.flex_start img,.flex_box04 img,.flex_column img{
width: 100%;
}
/*color*/
.co_aka {
color: #cd2c24;
}
.co_green {
color: #00b71a;
}
.co_pink {
color: #fc1d5b;
}
.wi95{
width: 95%;
margin: 0 auto;
}
.wi90{
width: 90%;
}
footer{
background: #fff;
border-top: dotted 2px #17A999;
}
.footer_logo{
width: 30%;
margin: 20px auto 10px;
}
.footer_logo img{
width: 100%;
margin: 0 auto;
}
.un_yello {
background: linear-gradient(transparent 60%, #f1f000 0%);
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateX(-10px);
}
to{
opacity: 1;
transform: translateX(0);
}
}
.fade-in {
animation: fadeIn 0.6s ease-out forwards;
}
.te_cent {
text-align: center;
}
.img_60 {
width: 60%;
margin: 0 auto;
}
.img_60 img {
width: 100%;
}
.akawaku{
padding: 0px 10px;
font-size: 150%;
font-weight: bold;
color: #EB1E1E;
border: 2px solid #EB1E1E;
margin: 5px;
line-height: 1;
}
.akawaku_bk{
display: block;
	padding: 10px 10px;
}
.sp_on{
display: none;
}
.sp_none{
display: block;
}

@media screen and (max-width: 890px) {
.flex_box,.flex_between,.flex_start,.flex_around {
flex-direction: column;
width: 100%;
margin: 10px auto;
}
.flex_20 {
width: 60%;
margin: 8px auto;
}
.flex_30 {
width: 50%;
}
.flex_40 {
width: 85%;
}
.flex_35,.flex_65,.flex_50,.flex_60,.flex_70,.flex_90{
width: 95%;
}
.footer_logo{
width: 60%;
margin: 20px auto 10px;
}
.sp_on{
display: block;
}
.sp_none{
display: none;
}
.bbbb{
font-size: 130%;
}

}
@media screen and (max-width: 520px) {
.selsct_flex00{
flex-direction: column;
width: 100%;
margin: 10px auto;
}
.flex_20{
width: 86%;
margin: 8px auto;
}
.flex_35,.flex_65,.flex_30,.flex_40,.flex_50,.flex_60,.flex_70,.flex_90,.flex_75{
width: 98%;
}
.flex_column{
width: 100%;
}
.akawaku02{
margin: 5px;
line-height: 1.7;
display: inline-block;
}
}
