body{
color: #44aacc;
background-color: #fcf9f6;
text-align: center;
font-size: 20px;
margin: 0;
}

.subtitle{
font-size: 28px;
text-decoration: none;
font-family: 'Cormorant Upright', serif; 
}

a.en{
color: #44aacc;
font-size: 24px;
text-decoration: none;
font-family: 'Cormorant Upright', serif; 
}

a.ja{
color: #44aacc;
font-size: 20px;
text-decoration: none;
font-family: 'Noto Serif JP', serif;
}

.top_menu{
width: 12%;
margin: 0 auto;
}

hr{
width: 100%;
border: solid 2px #44aacc;
}

.main_title{
width: 100%;
}

.main_title2{
font-family: 'Noto Serif JP', serif;
font-size: 1vw;
line-height: 90%;
}

.top_margin{
width: 100%;
}

.menu_margin{
width: 100%;
height: auto;
}

.page_title{
margin: 8px auto -4px;
width:360px;
}

.content_base{
width: 960px;
margin: 0 auto;
}

.thumbnail{
float: left;
width: 23%;
margin: 3% 1%;
}

td.alban_title{
width: 640px;
height: 240px;
}

td.alban_widget{
width: 120px;
}

.story_img{
width: 200px;
}

td.story{
text-align: left;
vertical-align: top;
width: 600px;
padding: 8px;
}

td.story_hr{
height: 30px;
background-image: url(images/storybook/hr.png);
background-repeat: repeat-x;
background-position: center center;
}

.story_title{
font-size: 28px;
font-family: 'Rye', cursive;
line-height: 100%;
}

.story_text{
font-size: 24px;
font-family: 'Special Elite', cursive;
line-height: 150%;
}

.rose_name{
width: 33%;
float: left;
line-height: 180%;
}

.angels_profile{
border: solid 1px #c0c9c3;
border-radius: 12px;
padding: 12px;
margin: 20px 10px 10px;
}

td.profile_text{
color: #667788;
font-size: 16px;
line-height: 150%;
font-family: 'Noto Serif JP', serif;
border-bottom: dashed 1px #c0c9c3;
padding: 4px 10px;
}

.profile_name{
font-size: 24px;
}

td.profile_box{
width: 50%;
text-align: left;
vertical-align: top;
}

.back{
width: 100%;
text-align: center;
line-height: 100%;
padding: 6px;
border-top: dashed 1px #44aacc;
border-bottom: dashed 1px #44aacc;
background-color: #fcf9f6;
position: fixed;
bottom: 0;
}

.angels{
position: fixed;
bottom: 10px;
height: 56%;
}

.watering_can{
position: fixed;
bottom: 10px;
height: 14%;
}

@media screen and ( min-width: 801px ){

.img_sp{
display: none;
}

.angels_header{
width: 960px;
vertical-align: top; 
}

}


@media screen and ( max-width: 800px ){

.top_menu{
width: 32%;
padding-top: 4px;
}

.content_base{
width: 100%;
}

.page_title{
width: 80%;
}

.main_title2{
font-size: 2vw;
}

.menu_margin{
display: none;
}

a{
font-size: 1vw;
}

.gallery{
width: 96%;
margin: 0 2%;
}

.thumbnail{
width: 46%;
margin: 16px 2%;
}

.rose_name{
width: 100%;
}

.story_th{
width: 100%;
vertical-align: top;
}

td.alban_title{
display: block;
width: 100%;
height: auto;
margin: -5% 0;
}

td.alban_widget{
display: block;
text-align: center;
width: 100%;
}

td.story_th{
display: block;
text-align: center;
vertical-align: top;
width: 100%;
padding: 0;
}

td.story{
display: block;
vertical-align: top;
width: 90%;
}

td.story_hr{
display: block;
width: 100%;
height: 40px;
background-position: top center;
}

.story_img{
width: 80%;
}

td.profile_box{
width: 100%;
display: block;
float: left;
}

.angels{
height: 45%;
margin: 0 -20px;
}

.watering_can{
height: 10%;
margin: 0 -20px 15px;
}

.img_pc{
display: none;
}

.angels_header{
width: 100%;
vertical-align: top; 
}

}