#page ul{
  margin: 1em 0;
  padding-left: 40px;
  list-style-type: disc;
}

#page h1 {
position: relative;
color: #333333;
display: inline-block;
margin: 47px;
text-shadow: 0 0 2px white;
}


#page h1:before {
content: "";
position: absolute;
background: #ffd69d;
width: 100px;
height: 100px;
border-radius: 50%;
top: 50%;
/* border: dashed 1px white; */
left: 50%;
-moz-transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
z-index: -1;
}



#page h2 {
	position: relative;
  font-size: 22px;
  font-weight: 400;
	padding: .25em 0 .25em .75em;
	border-left: 6px solid #ff871c;
}



#page h3 {
	padding: .5em .75em;
	background-color: #ffedcc;
	border-bottom: 1px solid #ccc;
  font-size: 20px;
}

#page p{
  margin-left: 2%;
  margin-right: 2%;
}



#page .hhh {
  font-family: '小塚ゴシック Pro L','Kozuka Gothic Pro Light',sans-serif;
	position: relative;
	padding: 0 .4em .1em;
  margin-left: 4%;
  margin-right: 4%;
  font-size: 22px;
}
#page .hhh::after {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: -1;
	content: '';
	width: 100%;
	height: 10px;
	background-color: #b6f0fc;
}

#page p{
  margin-left: 2%;
  margin-right: 2%;
  font-size: 18px;
  text-align: justify;
  text-justify: inter-ideograph;
    font-family: '小塚ゴシック Pro L','Kozuka Gothic Pro Light',sans-serif;
}

/*重なった写真風フレーム*/
.frame {
	display: inline-block;
	position: relative;
}
.frame:after {
	position: absolute;
	display: block;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
	transform: rotate(3deg); /* 回転させる */
	background: #fff;
	z-index: -1;
}

/*h2{
	position:relative;
	margin:0 -10px;
	padding:5px;
	font:normal 28px/1.6 "Times New Roman", Times, serif;
	text-align:center;
	color:#ffe8e8;
	background:#f99;
	-webkit-transform: rotate(-3deg) skew(-3deg);
	-moz-transform: rotate(-3deg) skew(-3deg);
	-o-transform: rotate(-3deg) skew(-3deg);
	transform: rotate(-3deg) skew(-3deg);
	box-shadow:0 1px 2px 0 rgba(0,0,0,0.2);
    background-image: -webkit-gradient(linear, left top, left bottom,
			from(			rgba(0, 0, 0, 0.0)),
			color-stop(0.08, rgba(255, 255, 255, 0.5)),
			color-stop(0.12, rgba(255, 255, 255, 0.5)),
			color-stop(0.12, rgba(0, 0, 0, 0.0)),
			color-stop(0.88, rgba(0, 0, 0, 0.0)),
			color-stop(0.88, rgba(255, 255, 255, 0.5)),
			color-stop(0.92, rgba(255, 255, 255, 0.5)),
			color-stop(0.92, rgba(0, 0, 0, 0.0)),
			to(				rgba(0, 0, 0, 0.0))
			);
	background-image: -moz-linear-gradient(top,
			transparent 8%,
            rgba(255, 255, 255, 0.5) 8%,
            rgba(255, 255, 255, 0.5) 12%,
            transparent 12%,
            transparent 88%,
            rgba(255, 255, 255, 0.5) 88%,
            rgba(255, 255, 255, 0.5) 92%,
            transparent 92%
			);
	background-image: -o-linear-gradient(top,
			transparent 8%,
            rgba(255, 255, 255, 0.5) 8%,
            rgba(255, 255, 255, 0.5) 12%,
            transparent 12%,
            transparent 88%,
            rgba(255, 255, 255, 0.5) 88%,
            rgba(255, 255, 255, 0.5) 92%,
            transparent 92%
			);
	background-image: linear-gradient(to bottom,
			transparent 8%,
            rgba(255, 255, 255, 0.5) 8%,
            rgba(255, 255, 255, 0.5) 12%,
            transparent 12%,
            transparent 88%,
            rgba(255, 255, 255, 0.5) 88%,
            rgba(255, 255, 255, 0.5) 92%,
            transparent 92%
			);
}
h2:before{
	content:" ";
	position:absolute;
	top:-5px;
	left:0;
	width:0;
	height:0;
	border-width:0 0 5px 10px;
	border-style:solid;
	border-color:transparent;
	border-bottom-color:#c66;
}
h2:after{
	content:" ";
	position:absolute;
	top:100%;
	right:0;
	width:0;
	height:0;
	border-width:5px 10px 0 0;
	border-style:solid;
	border-color:transparent;
	border-top-color:#c66;
}*/
