@charset "UTF-8";

body, h1, h2, h3, h4, div, p,
address, ul, li, dl, dt, dd, form, img, table, th, td {
    margin: 0;
    padding: 0;
    list-style: none;
    font-style: normal;
}

a:link {
    color: #C00;
}
a:visited {
    color: #600;
}

body {
    background: #FFF;
}

html, body {
    scrollbar-base-color: #EDDCCC;
}

img {
    border: 0;
}

.clear {
    clear: both;
}

.center {
    text-align: center;
}

div#layout {
    width: 800px;
    margin: 20px auto;
}

div#container {
    position: relative;
    width: 800px;
    height: 562px;
}
div.default {
    background: url("/resources/images/common/backgrounds/note.png") no-repeat 50% 0;
}
div.has_prev {
    background: url("/resources/images/common/backgrounds/note_prev.png") no-repeat 50% 0;
}
div.has_next {
    background: url("/resources/images/common/backgrounds/note_next.png") no-repeat 50% 0;
}
div.has_prev_next {
    background: url("/resources/images/common/backgrounds/note_next_prev.png") no-repeat 50% 0;
}

p.pager_prev,
p.pager_next {
    position: absolute;
    width: 27px;
    height: 27px;
    top: 470px;
}
p.pager_prev {
    left: 0px;
}
p.pager_next {
    left: 700px;
}

div#container h1 {
    position: absolute;
    top: -11px;
    left: 31px;
    width: 372px;
    height: 65px;
    z-index: 1;
}
div#container h2.caption {
    position: absolute;
    top: 0;
    left: 650px;
    z-index: 1;
}
div#container h2#caption_profile {
    left: 676px;
}
div#container h2#caption_photos {
    left: 610px;
}
div#container h2#caption_arts {
    left: 628px;
}
div#container h2#caption_bakery {
    left: 688px;
}
div#container h2#caption_others {
    left: 634px;
}
div#container h2#caption_diary {
    left: 690px;
    top: -10px;
}
div#container h2#caption_links {
    left: 688px;
}
div#container h2#caption_contact {
    left: 664px;
}

div#contents {
    color: #8A644A;
    position: absolute;
    width: 731px;
    height: 500px;
    left: 34px;
    top: 44px;
}

div#division1,
div#division2 {
    position: absolute;
    width: 330px;
    height: 450px;
    top: 12px;
    overflow: auto;
/*
    background: #000;
    filter: alpha(opacity=50);
    -moz-opacity:0.5;
    opacity:0.5;
*/
}
div#division1 {
    left: 4px;
}
div#division2 {
    left: 396px;
}

/*
 * Home
 */

div.home p#weekly_photo {
    margin-top: 110px;
    text-align: center;
}
div.home div#division1 {
    background: url("/resources/images/home/backgrounds/information.png") 20px 80px no-repeat;
}
div.home div#information {
    width: 300px;
    height: 230px;
    margin: 210px 0 0 20px;
    overflow: auto;
}
div.home div#information p {
    color: #C60;
    font-size: 70%;
    margin: 8px 8px 16px 8px;
    line-height: 1.3;
}
div.home div#division2 {
    overflow: visible;
}
div.home div#division2 p#launch {
    font-size: 70%;
    position: absolute;
    left: 236px;
    top: 430px;
}

/*
 * Profile
 */

div.profile div#division1 {
    overflow: visible;
    top: 8px;
}
div.profile div#division1 p {
    color: #D88874;
    font-size: 80%;
    text-align: center;
    margin-bottom: 20px;
    line-height: 1.5;
}
div.profile div#division1 p.first {
    position: relative;
    width: 327px;
    height: 428px;
    margin-top: 20px;
    overflow: hidden;
}
div.profile div#division1 p.first span {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 327px;
    height: 428px;
    background: url("/resources/images/profile/first.png") no-repeat;
}

div.profile div#division2 {
    left: 370px;
    width: 356px;
    overflow: visible;
}
div.profile div#division2 p.detail {
    position: relative;
    width: 339px;
    height: 416px;
    margin: 16px 0 0 16px;
    overflow: hidden;
}
div.profile div#division2 p.detail span {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 339px;
    height: 416px;
    background: url("/resources/images/profile/profile.jpg") no-repeat;
}

/*
 * Art Theater
 */

div.arts h3.ticket {
    position: absolute;
}
div.arts h3.ticket img {
    position: absolute;
    top: 28px;
}
div.arts h3.ticket span {
    position: absolute;
    width: 43px;
    height: 53px;
    top: 4px;
    left: 40px;
    background: url("/resources/images/common/tape1.png") no-repeat;
    filter: alpha(opacity=70);
    -moz-opacity:0.7;
    opacity:0.7;
}

div.arts h3#art_loveandpeace {
    top: 10px;
    left: 30px;
}

div.arts h3#art_tsukitousagi {
    top: 120px;
    left: 180px;
}

div.arts h3#art_hitomi {
    top: 30px;
    left: 30px;
}
div.arts h3#art_hitomi span {
    background: url("/resources/images/common/tape2.png") no-repeat;
}

div.arts h3#art_takaramono {
    top: 140px;
    left: 180px;
}

/*
 * Photo Gallery
 */

div.photos div#division1 {
    width: 700px;
    overflow:visible;
}
div.photos h3.invitation_card,
div.photos img.new {
    position: absolute;
}

div.photos h3.invitation_card.position1 {
    top: 10px;
    left: 30px;
}
div.photos img.new.position1 {
    top: 20px;
    left: 220px;
}

div.photos h3.invitation_card.position2 {
    top: 160px;
    left: 80px;
}
div.photos img.new.position2 {
    top: 170px;
    left: 270px;
}

div.photos h3.invitation_card.position3 {
    top: 310px;
    left: 70px;
}
div.photos img.new.position3 {
    top: 320px;
    left: 260px;
}

div.photos h3.invitation_card.position4 {
    top: 10px;
    left: 420px;
    z-index: 1;
}
div.photos img.new.position4 {
    top: 20px;
    left: 610px;
    z-index: 2;
}

div.photos h3.invitation_card.position5 {
    top: 160px;
    left: 450px;
    z-index: 1;
}
div.photos img.new.position5 {
    top: 170px;
    left: 640px;
    z-index: 2;
}

div.photos h3.invitation_card.position6 {
    top: 310px;
    left: 400px;
    z-index: 1;
}
div.photos img.new.position6 {
    top: 320px;
    left: 590px;
    z-index: 2;
}

/*
 * Bakery
 */

div.bakery div#division1 h3 {
    text-align: center;
    margin: 4px 0 8px;
}
div.bakery div#division1 p {
    margin-bottom: 20px;
}
div.bakery div#division1 h4 {
    margin-bottom: 4px;
}
div.bakery div#division1 ul {
    margin: 0 4px 8px;
}
div.bakery div#division1 ul li.bread {
    display: inline;
}

div.bakery div#division2 {
    background: url("/resources/images/bakery/backgrounds/polaroid.png") 20px 40px no-repeat;
}
div.bakery p#photo {
    position: absolute;
    width: 260px;
    height: 230px;
    left: 30px;
    top: 66px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image: url("/resources/images/common/mark_red.png");
    z-index: 1;
}

div.bakery div.polaroid {
    position: absolute;
    width: 284px;
    height: 360px;
    left: 20px;
    top: 40px;
    display: none;
}
div.bakery div.polaroid h4 {
    position: absolute;
    width: 260px;
    left: 10px;
    top: 8px;
    font-size: 80%;
    text-align: center;
}
div.bakery div.polaroid p.date {
    position: absolute;
    left: 10px;
    top: 256px;
    width: 260px;
    font-size: 80%;
    text-align: right;
}
div.bakery div.polaroid p.comment {
    position: absolute;
    font-size: 60%;
    width: 260px;
    height: 60px;
    left: 10px;
    top: 280px;
    line-height: 1.3;
    overflow: auto;
}

/*
 * Others
 */

div.others div#division1 {
    background: url("/resources/images/others/backgrounds/sewing_machine.png") 50% 260px no-repeat;
}
div.others div#division1 p {
    margin-top: 80px;
}

div.others div#division2 {
    background: url("/resources/images/others/backgrounds/tube.png") 50% 120px no-repeat;
}
div.others div#division2 p {
    margin-top: 200px;
}

/*
 * Others/Clothes
 */

div.clothes div#division1 {
    background: url("/resources/images/others/clothes/backgrounds/sewing_machine.png") 20px 20px no-repeat;
}

div.clothes div#division1 ul {
    position: relative;
}
div.clothes div#division1 ul li {
    position: absolute;
}
div.clothes li#caption_red_dragon {
    left: 92px;
    top: 66px;
}
div.clothes li#caption_for_urbanity {
    left: 80px;
    top: 92px;
}
div.clothes li#caption_chocolate_bar {
    left: 70px;
    top: 134px;
}
div.clothes li#caption_white_coffee {
    left: 78px;
    top: 178px;
}
div.clothes li#caption_in_the_darkness {
    left: 122px;
    top: 218px;
}

div.clothes div#division2 {
    background: url("/resources/images/others/clothes/backgrounds/tag.png") 0 4px no-repeat;
}

div.clothes div#division2 p#display {
    position: relative;
    width: 305px;
    height: 347px;
    margin: 30px 0 0 8px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image: url("/resources/images/common/mark_red.png");
}
div.clothes div#division2 p#display a,
div.clothes div#division2 p#display span {
    position: absolute;
    font-size: 12px;
    top: 354px;
}
div.clothes div#division2 p#display a#navi_prev {
    left: 160px;
    display: none;
}
div.clothes div#division2 p#display span#page {
    left: 198px;
    width: 50px;
    text-align: center;
}
div.clothes div#division2 p#display a#navi_next {
    left: 250px;
    display: none;
}

/*
 * Others/Illustrations
 */

div.illustrations div#division1 {
    background: url("/resources/images/others/illustrations/backgrounds/tubes.png") 95% 95% no-repeat;
}

div.illustrations div#division1 ul {
    position: relative;
}
div.illustrations div#division1 ul li {
    position: absolute;
}
div.illustrations div#division1 ul li#caption_kanohime {
    left: 162px;
    top: 274px;
}
div.illustrations div#division1 ul li#caption_passion {
    left: 105px;
    top: 333px;
}
div.illustrations div#division1 ul li#caption_tsuki {
    left: 32px;
    top: 356px;
}
div.illustrations div#division1 ul li#caption_breeze {
    left: 4px;
    top: 290px;
}
div.illustrations div#division1 ul li#caption_misa {
    left: 238px;
    top: 200px;
}
div.illustrations div#division1 ul li#caption_shion {
    left: 190px;
    top: 220px;
}
div.illustrations div#division1 ul li#caption_happychristmas {
    left: 19px;
    top: 228px;
}
div.illustrations div#division1 ul li#caption_cherry {
    left: 204px;
    top: 145px;
}
div.illustrations div#division1 ul li#caption_hiyomeki {
    left: 109px;
    top: 177px;
}
div.illustrations div#division1 ul li#caption_rk {
    left: 22px;
    top: 168px;
}
div.illustrations div#division1 ul li#caption_syotyu {
    left: 246px;
    top: 88px;
}
div.illustrations div#division1 ul li#caption_blastingdoll {
    left: 71px;
    top: 112px;
}
div.illustrations div#division1 ul li#caption_natsushizu {
    left: 154px;
    top: 59px;
}
div.illustrations div#division1 ul li#caption_himiko {
    left: 1px;
    top: 68px;
}
div.illustrations div#division1 ul li#caption_volition {
    left: 68px;
    top: 18px;
}

div.illustrations div#division2 {
    width: 350px;
    height: 474px;
    top: 8px;
    left: 388px;
    overflow: hidden;
    background: url("/resources/images/others/illustrations/backgrounds/wall_paper.png") no-repeat;
}
div.illustrations div#division2 p#display {
    width: 339px;
    height: 457px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image: url("/resources/images/common/mark_white.png");
}


/*
 * Links
 */

div.links h3 {
    margin-bottom: 6px;
}
div.links dl.links {
    margin-bottom: 12px;
    line-height: 1.3;
}
div.links dl.links dt {
    font-size: 90%;
}
div.links dl.links dd {
    font-size: 70%;
    margin-bottom: 2px;
}

/*
 * Contact
 */

div.contact div#division1 {
    background: url("/resources/images/contact/pen_and_ink.png") no-repeat 50% 95%;
}
div.contact div#division1 p.description{
    margin: 20px 0 0 20px;
}
div.contact div#division1 ul.errors {
    margin: 20px 0 0 20px;
}
div.contact div#division1 ul.errors li {
    color: #F00;
    font-weight: bold;
}
div.contact div#division2 {
    background: url("/resources/images/contact/letter_paper.png") no-repeat 10px 30px;
}
div.contact div#division2 form textarea#contact_body,
div.contact div#division2 form input#contact_name,
div.contact div#division2 form input#contact_email {
    position: absolute;
    border: dashed 1px #BAAA9D;
    background: transparent;
}
div.contact div#division2 form label {
    position: absolute;
    font-family: "ＭＳ 明朝", serif;
}
div.contact div#division2 form label#for_body {
    top: 46px;
    left: 48px;
}
div.contact div#division2 form textarea#contact_body {
    width: 238px;
    height: 228px;
    top: 70px;
    left: 56px;
    line-height: 26px;
}

div.contact div#division2 form label#for_name {
    top: 308px;
    left: 48px;
}
div.contact div#division2 form input#contact_name {
    width: 164px;
    top: 306px;
    left: 100px;
}

div.contact div#division2 form label#for_email {
    top: 334px;
    left: 48px;
}
div.contact div#division2 form input#contact_email {
    width: 164px;
    top: 332px;
    left: 100px;
}
div.contact div#division2 form img#post_navi {
    position: absolute;
    top: 428px;
    left: 90px;
}
div.contact div#division2 form input#submit {
    position: absolute;
    top: 418px;
    left: 284px;
}

/*
 * indexes
 */

ul#indexes {
    position: absolute;
    top: 10px;
}
ul#indexes li {
    position: relative;
    overflow: hidden;
    margin-bottom: 4px;
}
ul#indexes li.not_opened,
ul#indexes li.opened {
    width: 29px;
    height: 60px;
}
ul#indexes li.opened {
    left: -6px;
}
ul#indexes li.not_opened {
    left: 774px;
}
ul#indexes li.opened {
    width: 26px;
}

ul#indexes li.selected {
    width: 41px;
    height: 60px;
}
ul#indexes li a span {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    cursor: pointer;
    background-repeat: no-repeat;
}
ul#indexes li.not_opened a span {
    background-position: -10px 0;
}

ul#indexes li#index_profile.opened a span {
    background-image: url("/resources/images/common/indexes/opened/profile.png");
}
ul#indexes li#index_profile.not_opened {
    left: 772px;
}
ul#indexes li#index_profile.not_opened a span {
    background-image: url("/resources/images/common/indexes/not_opened/profile.png");
}

ul#indexes li#index_photos.opened a span {
    background-image: url("/resources/images/common/indexes/opened/photos.png");
}
ul#indexes li#index_photos.not_opened {
    left: 772px;
}
ul#indexes li#index_photos.not_opened a span {
    background-image: url("/resources/images/common/indexes/not_opened/photos.png");
}

ul#indexes li#index_arts.opened a span {
    background-image: url("/resources/images/common/indexes/opened/arts.png");
}
ul#indexes li#index_arts.not_opened {
    left: 773px;
}
ul#indexes li#index_arts.not_opened a span {
    background-image: url("/resources/images/common/indexes/not_opened/arts.png");
}

ul#indexes li#index_bakery.opened a span {
    background-image: url("/resources/images/common/indexes/opened/bakery.png");
}
ul#indexes li#index_bakery.not_opened {
    left: 773px;
}
ul#indexes li#index_bakery.not_opened a span {
    background-image: url("/resources/images/common/indexes/not_opened/bakery.png");
}

ul#indexes li#index_others.opened a span {
    background-image: url("/resources/images/common/indexes/opened/others.png");
}
ul#indexes li#index_others.not_opened a span {
    background-image: url("/resources/images/common/indexes/not_opened/others.png");
}

ul#indexes li#index_diary.opened a span {
    background-image: url("/resources/images/common/indexes/opened/diary.png");
}
ul#indexes li#index_diary.not_opened {
    left: 775px;
}
ul#indexes li#index_diary.not_opened a span {
    background-image: url("/resources/images/common/indexes/not_opened/diary.png");
}

ul#indexes li#index_links.opened a span {
    background-image: url("/resources/images/common/indexes/opened/links.png");
}
ul#indexes li#index_links.not_opened {
    left: 776px;
}
ul#indexes li#index_links.not_opened a span {
    background-image: url("/resources/images/common/indexes/not_opened/links.png");
}

ul#indexes li#index_contact.opened a span {
    background-image: url("/resources/images/common/indexes/opened/contact.png");
}
ul#indexes li#index_contact.not_opened {
    left: 777px;
}
ul#indexes li#index_contact.not_opened a span {
    background-image: url("/resources/images/common/indexes/not_opened/contact.png");
}

