@charset "utf-8";

/**** title *******************************************************************************************************************/
#title #logo img{
/* 背景グラデーションの作成 */
background: rgb(255,193,193);
background: linear-gradient(180deg, rgba(255,193,193,1) 10%, rgba(0,0,0,1) 65%);
  background-size: 100% 100%;
  animation: AnimationName 10s ease infinite;
}


/**** content *******************************************************************************************************************/
#content{color:#464646;}

#content h2{
height: 170px;
margin: 80px auto 445px auto;
display: block;
overflow: hidden;
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:4%;margin-right:4%;}

#content .box1{
	margin-left:9%;
	display: flex;
	align-items: center;
}
#content .box1 .photo{width: 890px;height: auto;}
#content .box1 dl{}

#content .box2{
	margin-right:15%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;
}
#content .box2 .photo{width: 890px;height: auto;}
#content .box2 dl{
	margin-bottom:5%;
	text-align:right;
}

#content .box3{
	margin-left:16%;
	display: flex;
	align-items:flex-end;
}
#content .box3 .photo{width: 890px;height: auto;}
#content .box3 dl{margin-bottom:5%;}

#content .box4{
	margin-left:8%;
	display: flex;
	align-items:flex-end;
}
#content .box4 .photo{width:890px;height: auto;}
#content .box4 dl{margin-bottom:5%;}

#content .box5{
	margin-right:28%;
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
}
#content .box5 .photo{width: 600px;height: auto;}
#content .box5 dl{
margin-bottom:6%;
text-align:right;
}

#content .box6{
	margin-right:14%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;
}
#content .box6 .photo{width:890px;height: auto;}
#content .box6 dl{
	margin-bottom:5%;
	margin-right:5%;
	line-height: 1.6;
}
#content .box6 dd{font-size:14px;}

#content .box7{
	margin-left:22%;
	display: flex;
	align-items: center;
}
#content .box7 .photo{width: 600px;height: auto;}
#content .box7 dl{margin-bottom:5%;line-height: 1.6;}
#content .box7 dd{font-size:14px;}

#content .box8{
	margin-right:14%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;
}
#content .box8 .photo{width:890px;height: auto;}
#content .box8 dl{
	margin-bottom:5%;
	text-align:right;
	line-height: 1.6;
}
#content .box8 dd{font-size:14px;}

#content .box9{
	margin-left:18%;
	display: flex;
	align-items: center;
}
#content .box9 .photo{width:975px;height: auto;}
#content .box9 dl{}

#content .box10{
	margin-left:10%;
	display: flex;
	align-items: center;
}
#content .box10 .photo{width:975px;height: auto;}
#content .box10 dl{margin-bottom:10%;}


#content .box11{
	margin-right:11%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;
}
#content .box11 .photo{width:1000px;height: auto;}
#content .box11 dl{margin-bottom:2%;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 dt.ap{padding-bottom: 9px !important;}
#content dl dd {
    padding-bottom: 10%;
    font-size:0.8em;  
    }  
    
#content .box1{
	margin-left:4%;
	display: flex;
	align-items: center;
}
#content .box1 .photo{width:65%;height: auto;}
#content .box1 dl{}

#content .box2{
	margin-right:5%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;
}
#content .box2 .photo{width: 65%;height: auto;}
#content .box2 dl{
	margin-bottom:5%;
	text-align:right;
}

#content .box3{
	margin-left:10%;
	display: flex;
	align-items:flex-end;
}
#content .box3 .photo{width: 65%;height: auto;}
#content .box3 dl{margin-bottom:5%;}

#content .box4{
	margin-left:5%;
	display: flex;
	align-items:flex-end;
}
#content .box4 .photo{width:65%;height: auto;}
#content .box4 dl{margin-bottom:10%;}

#content .box5{
	margin-right:18%;
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
}
#content .box5 .photo{width: 50%;height: auto;}
#content .box5 dl{
margin-bottom:6%;
text-align:right;
}

#content .box6{
	margin-right:4%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;
}
#content .box6 .photo{width:64%;height: auto;}
#content .box6 dl{
	margin-bottom:5%;
	line-height: 1.6;
}
#content .box6 dd{font-size:13px;}


#content .box7{
	margin-left:16%;
	display: flex;
	align-items: center;
}
#content .box7 .photo{width: 45%;height: auto;}
#content .box7 dl{margin-bottom:5%;line-height: 1.6;}
#content .box7 dd{font-size:13px;}

#content .box8{
	margin-right:2%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;
}
#content .box8 .photo{width:63%;height: auto;}
#content .box8 dl{
	margin-bottom:5%;
	text-align:right;
	line-height: 1.6;
}
#content .box8 dd{font-size:13px;}

#content .box9{
	margin-left:13%;
	display: flex;
	align-items: center;
}
#content .box9 .photo{width:70%;height: auto;}
#content .box9 dl{margin-top:8%;}

#content .box10{
	margin-left:3%;
	display: flex;
	align-items: center;
}
#content .box10 .photo{width:63%;height: auto;}
#content .box10 dl{margin-bottom:10%;}


#content .box11{
	margin-right:3%;
	display: flex;
	flex-direction: row-reverse;
	align-items:flex-end;
}
#content .box11 .photo{width:65%;height: auto;}
#content .box11 dl{margin-bottom:2%;text-align:right;}

}




/*********************
:::::::::::::::::::::::
************************/

/*********************************************/
@media screen and (max-width: 480px) {
#content .box6 {
  margin-right: 4%;
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;
}


#content .box8 {
  margin-right: 2%;
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;}







#content .box1,
#content .box2,
#content .box3,
#content .box4,
#content .box5,
#content .box6,
#content .box7,
#content .box8,
#content .box9,
#content .box10,
#content .box11{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%;
}




}