/* CSS Document */
#container>div{
	margin-bottom: 20px;
	/*min-height: 200px;*/
}
#title_sakuranbo{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	margin: 10px 0;
	border-bottom:  1px pink dashed;
}
#title_sakuranbo div{
	width: 100%;
	font-size: 24px;
	border-left: pink 10px solid;
	padding: 6px;
}
#title_sakuranbo img{
	border-radius: 10px;
}

.sub_title{
	border-left: 6px #339900 solid;
	min-height: 28px;
	padding-left: 10px;
	padding-top: 6px;

	font-size: 24px;
	border-bottom:  1px #339900 dashed;
}
#container .element{
	margin: 6px;
	line-height: 1.5em;
	
}
#container .element ul{
	list-style: none;
	margin-bottom: 10px;
}
#container .element ul::after{
    content: "";
    clear: both;
    display: block;		
}
#container .element li{
	float: left;
}
#container .element li:nth-child(2){
	margin-left: 1em;
}
.photo_area {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
/*	text-align: center;*/
}
.photo_area img{
	width: 200px;
	height: auto;
	border-radius: 6px;
	margin: 10px;
}
.foo { 
	/*	transform: rotate(7deg); */
}
.deg1 { 
	transform: rotate(3deg); 
}
.deg2 { 
	transform: rotate(6deg); 
}
.deg3 { 
	transform: rotate(-3deg); 
}
.deg4 { 
	transform: rotate(-6deg); 
}

.waku01 {
  border:3px solid #ffff;
  box-shadow: 1px 3px 8px rgba(20,20,20,0.3);
}
.waku01:before {
  box-shadow: inset 1px 1px 6px 0px rgba(0,0,0,0.4),
			  -1px -1px 2px rgba(40,40,40,0.2),
			  1px 1px 2px rgba(255,255,255,1);  
}
/*Tablet View ----------------------------------------------------------------------------------------------*/
@media (min-width: 768px){
	#container .element li:nth-child(1){
		width: 80px;
		padding-left:1em;
		text-indent:-1em;
	}
	#title_sakuranbo div{
		width: auto;
		font-size: 36px;
	}
	.photo_area {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
}

/*Desktop View ----------------------------------------------------------------------------------------------*/
@media (min-width: 1024px){
		
}