#coutainer {

}

#header{
position:relative;
}
#header .dinosaur{
position:absolute;
top:0;
right:0;
width:70%;
}
#header .midashi{
width:344px;
}

#content .namae{
margin:40px auto 0 auto;
}
#content #chara_0{
margin:0 auto;
width:550px;
}
#content .komidashi{
margin:40px auto 0 auto;
width:260px;
}
#content p{
margin:10px auto 0 auto;
color:#42210b;
}
#content p.comment{
position:relative;
width:900px;
text-align:justify;
font-size:1.4rem;
line-height:1.8;
}
#content p.comment .dashed{
padding-bottom: 0.3rem;
border-bottom: 1px dashed #b28300;
}
#content p.comment:before {
content: '';/*何も入れない*/
display: inline-block;
width: 145px;
height: 97px;
background-image:url(images/kakko_top.png);
background-size: contain;
position:absolute;
left:-2%;
top: -50px;
}
#content p.comment:after {
content: '';/*何も入れない*/
display: inline-block;
width: 145px;
height: 97px;
background-image:url(images/kakko_bottom.png);
background-size: contain;
position:absolute;
bottom: -50px;
right:-2%;
}
#content #chara_1{
margin:0 auto;
width:795px;
}
#content #chara_1 ul{
display:table;
table-layout:fixed;
margin:0 auto;
width:100%;
}
#content #chara_1 li{
display:table-cell;
vertical-align:top;
padding:0 10px;
}
#content #chara_1 li:nth-child(1){
width:52%;
}
#content #chara_1 li:nth-child(2){
width:48%;
}
.DelaGo {
font-family: DelaGothicOne;
font-size:3rem;
color: #f75a24;
}


@media (max-width: 640px) {
#header{
overflow: hidden;
}
#header .dinosaur{
top:15%;
right:-15%;
width:92%;
}
#header .midashi{
width:50%;
}

#content{
width:100%;
}
#content .title{
padding:0 5%;
}
#content .photo{
padding:0 5%;
}
#content .namae{
margin:6vw auto 0 auto;
width:60%;
}
#content #chara_0{
width:70%;
}
#content .komidashi{
width:45%;
}
#content p{
margin:2vw auto 0 auto;
padding:0 5%;
font-size:0.7rem;
}
#content p.comment{
width:90%;
font-size:0.9rem;
}
#content p.comment .dashed{
padding-bottom: 0.3rem;
}
#content p.comment:before {
width: 80px;
height: 53px;
left:1%;
top: -25px;
}
#content p.comment:after {
width: 80px;
height: 53px;
right:1%;
bottom: -25px;
}
#content #namae_1{
width:90%;
}
#content #namae_2{
width:75%;
}
#content #namae_3{
width:65%;
}


#content #chara_1{
width:96%;
}
}
