@charset "utf-8";

/**** title *******************************************************************************************************************/
#title #logo img{
/* 背景グラデーションの作成 */
background: rgb(255,229,159);
background: linear-gradient(0deg, rgba(255,229,159,1) 0%, rgba(0,0,0,1) 65%);
  background-size: 100% 100%;
  animation: AnimationName 10s ease infinite;
}


/**** content *******************************************************************************************************************/
#content{color:#464646;}

#content h2{
height: 169px;
margin: 80px auto 445px auto;
text-align:center;
}

#content dl dt{padding-bottom:17px;font-size:16px;font-weight:bold;line-height: 22px;}
#content dl dd{padding-bottom:22px;font-size:15px;line-height:1.7;}

#content .box{margin-bottom:20%;}
#content .box img{width:100%;height:auto;}
#content .box dl{margin-left:45px;margin-right:45px;}
#content .box .photo{width: 890px;height: auto;}

#content .box1{
	margin-left:9%;
	display: flex;
	align-items: center;
}
#content .box1 dl{}

#content .box2{
	margin-right:15%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;
}
#content .box2 dl{
	margin-bottom:5%;
	text-align:right;
}

#content .box3{
	margin-left:17%;
	display: flex;
	align-items:flex-end;
}

#content .box3 dl{margin-bottom:5%;}

#content .box4{
	margin-right:14%;
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
}
#content .box4 dl{text-align:right;}

#content .box5{
	margin-right:18%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;

}
#content .box5 dl{
	margin-bottom:10%;
	text-align:right;
}

/**** 1000以下 ********/
@media screen and (max-width: 1000px) {
#content h2 {
    margin: 0 auto 20% auto;
    }
#content .box {
    margin-bottom: 13%;
    }
#content .box dl{margin-left:4%;margin-right:4%;}
#content dl dt {
    padding-bottom: 10px;
    font-size:0.9em;
    font-weight:bold;
    line-height: 18px;
    }
#content dl dd {
    padding-bottom: 10%;
    font-size:0.8em;  
    }  
#content .box .photo{width: 62%;height: auto;}

#content .box1{
	margin-left:3%;
	display: flex;
	align-items: center;
}

#content .box1{
	margin-left:9%;
	display: flex;
	align-items: center;
}
#content .box1 dl{}

#content .box2{
	margin-right:3%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;
}
#content .box2 dl{
	margin-bottom:5%;
	text-align:right;
}

#content .box3{
	margin-left:12%;
	display: flex;
	align-items:flex-end;
}

#content .box3 dl{margin-bottom:5%;}

#content .box4{
	margin-right:4%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-start;
}
#content .box4 dl{text-align:left;margin-top:5%;}

#content .box5{
	margin-right:8%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;

}
#content .box5 dl{
	margin-bottom:10%;
	text-align:right;
}






}





/*********************
:::::::::::::::::::::::
************************/

/*********************************************/
@media screen and (max-width: 480px) {








#content .box1,
#content .box2,
#content .box3,
#content .box4,
#content .box5
{align-items: flex-start;display: block;margin: 0;}



#content .box .photo{width:100%;}



#content .box dl {
  margin-left: 4%;
  margin-right: 4%;
  margin-top: 2%;
  margin-bottom:3%;
}




}