@charset "shift_jis";

/* common parts */
/* ----------------------------------------------------------------- */

/* link */
a:link    { color: #333333}
a:visited { color: #333333}
a:hover   { color: orange }
a:active  { color: #333333}

a {
	-webkit-tap-highlight-color: rgba(100,100,100,0.40);
}


img {
    vertical-align: bottom;
}

.bg {
	background: url(images/header_bg.gif) repeat-x 0 0;
    background-color: #eba4c3;
}

.clear {
    clear: both;
    height: 1px;
    font-size: 1px;
}

.boxtop {
    width: 100%;
    height: 5px;
    background-color: #fff;
    background-image: url(images/bg-corner1.gif), url(images/bg-corner2.gif);
    background-repeat: no-repeat, no-repeat;
    background-position: top left, top right;
}

.boxbottom {
    width: 100%;
    height: 5px;
    background-color: #fff;
    background-image: url(images/bg-corner4.gif), url(images/bg-corner3.gif);
    background-repeat: no-repeat, no-repeat;
    background-position: top left, top right;
}

.box {
    background: #fff;
}

.btn-allpumf {
    width: 100%;
    height: 42px;
    margin: 15px 0 0 0;
    padding-bottom: 10px;
}

.btn-allpumf a {
    display: inline-block;
    width: 100%;
    height: 42px;
    background-image: url(images/btn-seikyu-all.gif), url(images/btn-allpumf-arrow.gif), url(images/btn-allpumf-bg.gif);
    background-repeat: no-repeat, no-repeat, repeat-x;
    background-position: top left, top right, top;
}

.btn-allpumf a:hover {
    background-image: url(images/btn-seikyu-all_on.gif), url(images/btn-allpumf-arrow_on.gif), url(images/btn-allpumf-bg_on.gif);
    background-repeat: no-repeat, no-repeat, repeat-x;
    background-position: top left, top right, top;
}

.btn-allpumf a:active {
    background-image: url(images/btn-seikyu-all_on.gif), url(images/btn-allpumf-arrow_on.gif), url(images/btn-allpumf-bg_on.gif);
    background-repeat: no-repeat, no-repeat, repeat-x;
    background-position: top left, top right, top;
}

.backbtn a:link {
    float: left;
    width: 68px;
    height: 30px;
    margin: 15px 0px 0px -5px;
    background: url(images/btn-back1_off.gif) no-repeat 0 0;
}

.backbtn a:visited {
    background: url(images/btn-back1_off.gif) no-repeat 0 0;
}

.backbtn a:hover {
    background: url(images/btn-back1_on.gif) no-repeat 0 0;
}

.backbtn a:active {
    background: url(images/btn-back1_on.gif) no-repeat 0 0;
}

.backbtn span {
    display: none;
}

.backbtn2 a:link {
    float: left;
    width: 207px;
    height: 30px;
    margin: -5px 0px 0px -5px;
    background: url(images/btn-back2_off.gif) no-repeat 0 0;
}

.backbtn2 a:visited {
    background: url(images/btn-back2_off.gif) no-repeat 0 0;
}

.backbtn2 a:hover {
    background: url(images/btn-back2_on.gif) no-repeat 0 0;
}

.backbtn2 a:active {
    background: url(images/btn-back2_on.gif) no-repeat 0 0;
}

.backbtn2 span {
    display: none;
}

.backbtn3 a:link {
    float: left;
    width: 207px;
    height: 30px;
    margin: 15px 0px 0px -5px;
    background: url(images/btn-gotop2_off.gif) no-repeat 0 0;
}

.backbtn3 a:visited {
    background: url(images/btn-gotop2_off.gif) no-repeat 0 0;
}

.backbtn3 a:hover {
    background: url(images/btn-gotop2_on.gif) no-repeat 0 0;
}

.backbtn3 a:active {
    background: url(images/btn-gotop2_on.gif) no-repeat 0 0;
}

.backbtn3 span {
    display: none;
}

.label {
    margin: 10px 0 0 0;
}

.box ul {
    margin: 0 0 0 -30px;
    list-style: none;
}

.box li {
    background: url(images/marker-1.gif) no-repeat 0 8px;
    padding-left: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 12px;
    line-height: 18px;
}

.box li a:link    { color: #333333; font-weight: normal;}
.box li a:visited { color: #333333;}
.box li a:hover   { color: orange ;}
.box li a:active  { color: #333333;}

.listviewfont {
    font-size: 14px;
    font-weight: bold;
    line-height: 30px;
}

.footer {
    width: 100%;
    height: 50px;
    background: url(images/footer-bg.gif) repeat-x 0 0;
    text-align: center;
}

.footer h2 {
    font-size: 12px;
    font-weight: normal;
    display: inline-block;
    height: 50px;
    padding-top: 0px;
    color: #333333;
}

/* header parts */
/* ----------------------------------------------------------------- */
.header {
    width: 310px;
    margin: 0 auto 0 auto;
    text-align: center;
}

.shoulder {
    width: 310px;
    margin: 0 auto 0 auto;
    text-align: left;
    color: #111111;
    font-size: 12px;
}

.logo {
    float: left;
    margin-top: 5px;
}

.loginbtn a:link {
    float: right;
    width: 62px;
    height: 26px;
    margin-top: 10px;
    background: url(images/btn-login_off.gif) no-repeat 0 0;
}

.loginbtn a:visited {
    background: url(images/btn-login_off.gif) no-repeat 0 0;
}

.loginbtn a:hover {
    background: url(images/btn-login_on.gif) no-repeat 0 0;
}

.loginbtn a:active {
    background: url(images/btn-login_on.gif) no-repeat 0 0;
}

.loginbtn span {
    display: none;
}

.homebtn {
    float: right;
    width: 62px;
    height: 26px;
    margin: 10px 5px 0 0;
}



/* content parts */
/* ----------------------------------------------------------------- */
.box h1 {
    width: 100%;
    margin: 0px;
    text-align: center;
    font-size: 12px;
    font-weight: normal;
    color: #333333;
}

.box h2 {
    width: 100%;
    margin: 0px;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    color: #333333;
}

.book {
    width: 100%;
    max-width: 340px;
    margin: 0 auto;
    background: url(images/book_bg.jpg) no-repeat right 0;
}

.photo {
    float: left;
    margin: 5px;
}

.topsentence {
    text-align: center;
}

.wordsearch-box {
    float: left;
    width: 100%;
    height: 36px;
    margin: 10px 0 0px -45px;
}

.wordsearch {
    height: 36px;
    margin-left: 45px;
    background-color: #fff;
    background-image: url(images/searchbox-l.gif), url(images/searchbox-r.gif);
    background-repeat: no-repeat, no-repeat;
    background-position: top left, top right;
}

.wordsearch input {
    line-height: 36px;
    height: 36px;
    width: 190px;
    margin: 0px;
    padding: 0 0 0 40px;
    border: none;
    outline: 0;
    background-color: #fff;
    background-image: url(images/searchbox-icon.gif);
    background-repeat: no-repeat;
}

.search-btn {
    float: right;
    width: 36px;
    height: 36px;
    margin: 10px 0 0px 5px;
}


/* space parts */
/* ----------------------------------------------------------------- */
.space {
    widht: 100%;
    margin: 10px auto 0 auto;
    text-align: center;
}

.space h1 {
    font-size: 16px;
    font-weight: bold;
    color: #333333;
    line-height: 16px;
}

.sname {
    font-size: 10px;
    line-height: 12px;
    font-weight: normal;
    color: #333333;
}

.spaceline {
    font-size: 1px;
    height: 4px;
    margin-left: 4px;
    margin-right: 4px;
    background: #bf3b75;
}

.areagenre {
    font-size: 10px;
    line-height: 14px;
    fonr-weight: normal;
    color: #bf3b75;
}

.areagenre span {
    color: #333333;
}

.readbox {
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    text-align: left;
    max-width: 280px;
}

.read {
    float: left;
    background: url(images/icon-light.gif) no-repeat 0 0;
    padding-left: 13px;
    width: 150px;
    font-size: 12px;
    font-weight: bold;
}

.read2 {
    float: left;
    background: url(images/icon-light.gif) no-repeat 0 0;
    padding-left: 13px;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 10px;
}

.readtext {
    padding: 0 5px 0 5px;
    font-size: 12px;
    line-height: 18px;
}

.moreread {
    float: right;
    margin: 0 0 0 5px;
    width: 112px;
    heifth: 25px;
}

.space-label {
    margin: 10px 0 5px 0;
}

.photo-check {
    width: 280px;
    text-align: left;
    margin: 0 auto 0 auto;
    font-size: 12px;
}

.photo-check-cell {
    width: 280px;
    text-align: center;
    margin: 20px auto 0 auto;
}


.photo-check a {
    font-weight: normal;
}

.photo-check a:link {
    font-weight: normal;
}

.btn-hbasic {
    width: 100%;
    text-align: left;
    height: 41px;
    margin: 0 0 0 0;
}

.btn-hbasic_on {
    display: inline-block;
    width: 100%;
    text-align: left;
    height: 41px;
    margin: 0 0 10px 0;
    text-decoration: none;
    background-image: url(images/btn-std-marker_open.gif), url(images/btn-std-bg_on.gif);
    background-repeat: no-repeat, repeat-x;
    background-position: top left, top;
}

.btn-hbasic a {
    display: inline-block;
    width: 100%;
    height: 41px;
    text-decoration: none;
    background-image: url(images/btn-std-marker_off.gif), url(images/btn-std-arrow_off.gif), url(images/btn-std-bg_off.gif);
    background-repeat: no-repeat, no-repeat, repeat-x;
    background-position: top left, top right, top;
}

.btn-hbasic a:hover {
    text-decoration: none;
    background-image: url(images/btn-std-marker_on.gif), url(images/btn-std-arrow_on.gif), url(images/btn-std-bg_on.gif);
    background-repeat: no-repeat, no-repeat, repeat-x;
    background-position: top left, top right, top;
}

.btn-hbasic a:active {
    text-decoration: none;
    background-image: url(images/btn-std-marker_on.gif), url(images/btn-std-arrow_on.gif), url(images/btn-std-bg_on.gif);
    background-repeat: no-repeat, no-repeat, repeat-x;
    background-position: top left, top right, top;
}

.btn-hbasic span {
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
    margin: 0px 0 0 30px;
    line-height: 41px;
    color: #333333;
}

.btn-hbasic_on span {
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
    margin: 0px 0 0 30px;
    line-height: 41px;
    color: #333333;
}

.btn-hbasic-top {
    padding-top: 15px;
}

.btn-hbasic-bottom {
    border-top: solid 1px;
    border-color: #878787;
}

.datalabel {
    display: inline-block;
    line-height: 23px;
    height: 23px;
    font-size: 12px;
    font-weight: bold;
    color: #333333;
    background-image: url(images/datalabel-r.gif), url(images/datalabel-bg.gif);
    background-repeat: no-repeat, repeat-x;
    background-position: top right, top;
}

.datalabel p {
    display: inline;
    margin: 0 13px 0 10px;
}

.box dt {
    font-size: 12px;
    padding-left: 10px;
    padding-top: 4px;
    padding-bottom: 10px;
}

.box dt img {
    margin-right: 3px;
}

.article {
    font-size: 12px;
    text-align: left;
    margin: auto;
    padding: 0px 5px 25px 5px;
}

.articlepht {
    max-width: 640px;
    margin: auto;
    text-align: center;
}

.article h1 {
    text-align: left;
    font-size: 16px;
    font-weight: bold;
    color: #355882;
    width: auto;
    padding-left: 20px;
    background: url(images/icon-star.gif) no-repeat 0 0;
}

.article hr {
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: #aaa;
    height: 2px;
    padding: 0px;
    margin: 5px 0 2px 0;
}

.coupon {
    font-size: 12px;
    text-align: left;
    max-width: 640px;
    margin: auto;
    padding: 15px 5px 25px 5px;
}

.coupon h1 {
    text-align: left;
    font-size: 16px;
    font-weight: bold;
    color: #355882;
    width: auto;
    padding-left: 20px;
    background: url(images/icon-star.gif) no-repeat 0 0;
}

.coupon p {
    font-size: 12px;
    text-align: left;
    color: #333333;
}

.coupon span {
    font-size: 12px;
    color: #bf3b75;
    display: block;
}

.hbasic-nakami {
    width: 100%;
    font-size: 12px;
    text-align: left;
}

.hbasic-nakami dt {
    font-size: 12px;
    padding-left: 10px;
    padding-bottom: 10px;
}

.sat {
    color: #0054b3;
}

.sun {
    color: #dc0000;
}



/* search parts */
/* ----------------------------------------------------------------- */
.search-hit {
    font-size: 12px;
    font-weight: bold;
    margin-top: 10px;
}

.search-hit span {
    font-size: 18px;
    color: #ffffff;
}

.search-flag {
    font-size: 12px;
    margin: 0 0 5px 0;
}

.searchlist-cell {
    text-indent: 5px;
    text-align: left;
}

.searchlist-cell h1 {
    display: inline-block;
    font-size: 16px;
    font-weight: bold;
    line-height: 16px;
    text-align: left;
}

.searchlist-cell p {
    text-indent: 0px;
    padding-left: 5px;
    font-size: 12px;
    line-height: 16px;
    text-align: left;
    margin: 0;
}

.searchlist-cell ul {
    margin: 0px;
    padding: 0px;
}

.searchlist-cell li {
    width: 18px;
    height: 11px;
    list-style: none;
    background: none;
    float: left;
    line-height: 11px;
    margin: 0 0 2px 0;
    padding: 0px;
}

.search-pager {
    width: 100%;
    text-align: center;
    font-size: 16px;
    margin: 0 0 20px 0;
}

.searchlist-cell a:link    { color: #333333;}
.searchlist-cell a:visited { color: #333333;}
.searchlist-cell a:hover   { color: orange ;}
.searchlist-cell a:active  { color: red;}

.search-pager a:link    { color: #fff;}
.search-pager a:visited { color: #fff;}
.search-pager a:hover   { color: orange ;}
.search-pager a:active  { color: red;}


/* login parts */
/* ----------------------------------------------------------------- */
.loginbox {
    text-align: ceter;
    width: 320px;
    margin: auto;
}

.loginbox dt {
    font-size: 14px;
    font-weight: bold;
    padding-top: 10px;
}

.loginbox dd {
    padding-bottom: 10px;
}

.loginbox input {
    width: 220px;
    height: 30px;
}

.btn-login1 {
    width: 200px;
    background: url(images/btn-login1_on.gif) 0 0 no-repeat;
    margin: 10px auto;
}

.btn-login1 input:active {
    opacity: 0.0;
}


/* form parts */
/* ----------------------------------------------------------------- */
.btn-send1 {
    width: 200px;
    background: url(images/btn-send1_on.gif) 0 0 no-repeat;
    margin: 10px auto;
}

.btn-send1 input:active {
    opacity: 0.0;
}

.btn-send2 {
    width: 200px;
    background: url(images/btn-send2_on.gif) 0 0 no-repeat;
    margin: 10px auto;
}

.btn-send2 input:active {
    opacity: 0.0;
}

.btn-send3 {
    width: 200px;
    background: url(images/btn-send3_on.gif) 0 0 no-repeat;
    margin: 10px auto;
}

.btn-send3 input:active {
    opacity: 0.0;
}

.btn-send5 {
    width: 200px;
    background: url(images/btn-search5_on.gif) 0 0 no-repeat;
    margin: 10px auto;
}

.btn-send5 input:active {
    opacity: 0.0;
}

.btn-sendbk {
    width: 68px;
    background: url(images/btn-back1_on.gif) 0 0 no-repeat;
    margin: 10px auto;
}

.btn-sendbk input:active {
    opacity: 0.0;
}

.btn-login {
    width: 200px;
    background: url(images/btn-login1_on.gif) 0 0 no-repeat;
    margin: 10px auto;
}

.btn-login input:active {
    opacity: 0.0;
}



.form_allbox li {
    background: none;
    padding: 10px 0 0px 0;
    margin: 0;
    vertical-align: middle;
    border-bottom: solid 1px #cccccc;
}

.form_allbox li input {
    float: left;
}

.form_all dd {
    margin: 0px;
    padding: 5px 0 15px 20px;
    font-size: 12px;
    line-height: 16px;
}

.form-li {
    background-image: url(images/icon-arrow1.gif), url(images/li-bg.gif);
    background-repeat: no-repeat, repeat-x;
    background-position: right, bottom;
}

.form-attent {
    font-size: 12px;
    color: #ee0000;
    font-weight: bold;
}

.thanksmes {
    font-size: 12px;
    line-height: 22px;
    padding-left: 20px;
}


/* form-fair parts */
/* ----------------------------------------------------------------- */
.form-fair ul {
    padding-bottom: 10px;
}

.form-fair li {
    background: none;
    padding: 10px 0 0px 0;
    margin: 0;
    vertical-align: middle;
}

.form-fair li input {
    float: left;
}

.fair-wkd {
    width: 36px;
    height: 36px;
    background-color: #dddddd;
    color: #000;
    text-align: center;
}

.fair-std {
    width: 36px;
    height: 36px;
    background-color: #bae7ff;
    color: #000;
    text-align: center;
}

.fair-sun {
    width: 36px;
    height: 36px;
    background-color: #ffbacc;
    color: #000;
    text-align: center;
}

.fair-label-wkd {
    width: 36px;
    height: 16px;
    background-color: #999999;
    color: #fff;
    text-align: center;
}

.fair-label-sat {
    width: 36px;
    height: 16px;
    background-color: #319ef2;
    color: #fff;
    text-align: center;
}

.fair-label-sun {
    width: 36px;
    height: 16px;
    background-color: #fc668d;
    color: #fff;
    text-align: center;
}


/* fair-search parts */
/* ----------------------------------------------------------------- */
.fair-schedule-ttl {
    padding-left: 24px;
    background: url(images/icon-schedule.gif) no-repeat 0 0;
    font-size: 18px;
    font-weight: bold;
    color: #333333;
}

.fair-schedule-ttl span {
    font-size: 14px;
}


/* mypage parts */
/* ----------------------------------------------------------------- */
.mypage {
    padding-top: 10px;
    font-size: 12px;
}

.mypage dd {
    padding: 10px 10px 10px 20px;
    border-top: 1px solid #cccccc;
}

.mypage dd .midoku {
    display: inline-block;
    width: 34px;
    height: 10px;
    margin: 0 0 0 3px;
    vertical-align: -1px;
    background: url(images/icon-midoku.gif) no-repeat 0 0;
}

.mypage .message-header {
    padding: 0 0 0 20px;
}

.mypage .message-thread-title {
    padding: 5px 10px 5px 10px;
    margin: 10px 10px 10px 10px;
    background: #fffdf0;
    border-radius: 10px;
    border: 1px solid #bbbbbb;
}

.mypage .message-thread-text {
    padding: 5px 10px 5px 10px;
    margin: 10px 10px 0 10px;
    background: #fffdf0;
    border-radius: 10px;
    border: 1px solid #bbbbbb;
}

.mypage .message-write {
    padding: 5px 10px 5px 10px;
    margin: 10px 10px 10px 10px;
    text-align: center;
}

.mypage .message-write textarea {
    width: 100%;
}


.statusicon-shitami1 {
    display: inline-block;
    width: 90px;
    color: #000000;
    font-size: 12px;
    padding: 2px 0;
    margin: 0 5px;
    text-align: center;
    background: -prefix-linear-gradient(top, #dee735, #ebf182);
    background: linear-gradient(to bottom, #dee735, #ebf182);
    border-radius: 10px;
    border: 2px solid #c4cd23;
}

.statusicon-shitami2 {
    display: inline-block;
    width: 90px;
    color: #000000;
    font-size: 12px;
    padding: 2px 0;
    margin: 0 5px;
    text-align: center;
    background: -prefix-linear-gradient(top, #ebf182, #f8fad4);
    background: linear-gradient(to bottom, #ebf182, #f8fad4);
    border-radius: 10px;
    border: 2px solid #d0d92e;
}

.statusicon-kyoyaku1 {
    display: inline-block;
    width: 90px;
    color: #000000;
    font-size: 12px;
    padding: 2px 0;
    margin: 0 5px;
    text-align: center;
    background: -prefix-linear-gradient(top, #55aadd, #b4d9eb);
    background: linear-gradient(to bottom, #55aadd, #b4d9eb);
    border-radius: 10px;
    border: 2px solid #63b3e0;
}

.statusicon-kyoyaku2 {
    display: inline-block;
    width: 90px;
    color: #000000;
    font-size: 12px;
    padding: 2px 0;
    margin: 0 5px;
    text-align: center;
    background: -prefix-linear-gradient(top, #92c9e4, #c5e2f0);
    background: linear-gradient(to bottom, #92c9e4, #c5e2f0);
    border-radius: 10px;
    border: 2px solid #75bfe8;
}

.statusicon-waitpayment {
    display: inline-block;
    width: 90px;
    color: #000000;
    font-size: 12px;
    padding: 2px 0;
    margin: 0 5px;
    text-align: center;
    background: -prefix-linear-gradient(top, #fa81b4, #fba8c8);
    background: linear-gradient(to bottom, #fa81b4, #fba8c8);
    border-radius: 10px;
    border: 2px solid #f66ca8;
}

.statusicon-decision {
    display: inline-block;
    width: 90px;
    color: #000000;
    font-size: 12px;
    padding: 2px 0;
    margin: 0 5px;
    text-align: center;
    background: -prefix-linear-gradient(top, #ffbc4b, #ffda99);
    background: linear-gradient(to bottom, #ffbc4b, #ffda99);
    border-radius: 10px;
    border: 2px solid #ffae2f;
}

.naviphoto {
    width: 180px;
    height: 180px;
    text-align: center;
    background: #eeeeee;
    border: 4px solid #dddddd;
    line-height: 180px;
    margin: 0 20px 0 0;
}

.naviphoto img {
    max-width: 160px;
    max-height: 160px;
    line-height: 160px;
    border: none;
    vertical-align: middle;
}

.naviphoto span {
    height: 92px;
    width: 0px;
    display: inline-block;
}