@charset "UTF-8";
article { box-sizing: border-box; line-height: 1.5; }
article img {
    max-width: 100%;
    height: auto;
    vertical-align: bottom;/* 画像下のスペースを消す */
}
article.collection {
    background-color: #fff;
    padding-bottom: 0.1rem;
    margin-bottom: 2rem;
    color : #1F1F1F;
}
/****************************/
/*  head-container
/***************************/
.head-container { margin-bottom: 2rem; }
.caption { padding: 0.5rem 1rem; }
.caption .title { font-size: 2rem; }
.headBanner { margin-bottom: 1rem; }
.headLead { width: 95%; margin: 0 auto; font-size: 1.2rem; }
.headLead span { font-size: 0.8rem; }
.update { margin: 0.3rem 0.3rem 0; text-align: right; font-size: 0.8rem; color: #808080; }

/****************************/
/*  list-container
/***************************/
.list-container { width: 80%; margin: 0 auto 4rem; padding: 1rem; border: 1px solid #C7C7C7; font-size: 1.2rem; }
.listTitle { font-weight: bold; text-align: center; }
.listInner li { display: flex; align-items: center; gap: 0 10px; position: relative; padding: .3em .3em .3em 1.5em; overflow-wrap: anywhere; }
.listInner li a { text-decoration: underline; color: #FF579B; }
.listInner li::before,
.listInner li::after { position: absolute; content: ''; }
.listInner li::before { left: 0; width: 1.2em; height: 1.2em; border-radius: 50%; background-color: #FF579B; }
.listInner li::after { left: .6em; transform: translateX(-75%) rotate(-45deg); width: .3em; height: .3em; border-bottom: 2px solid #fff; border-right: 2px solid #fff; }
/****************************/
/*  contents-container
/***************************/
.contents-container { margin-bottom: 4rem; }
.contentsTitle { background: #FF579B; font-size: 1.5rem; font-weight: bold; color: #fff; text-align: center; padding: 0.5rem; margin-bottom: 1rem; }
.contentsLead { width: 95%; margin: 0 auto 2rem; font-size: 1.2rem; }
.contentsLead span { font-size: 0.8rem; }
/****************************/
/*  titleBox
/***************************/
.titleBox  { width: 95%; margin: 0 auto 3rem; }
.titleName { border-left: 5px solid #FF579B; border-bottom: 1px solid #FF579B; padding: 0.5rem 0.5rem 0.5rem 1rem; font-size: 1.3rem; font-weight: bold; margin-bottom: 1rem; }
.titleDetail { display: flex; margin-bottom: 2rem; }
.titlePic { width: 15rem; margin-right: 1rem; }
.titleInfo { flex: 1; }
.titleInfo .author, .titleInfo .genres, .titleInfo .story { margin-bottom: 0.3rem; }
.titleInfo .author, .titleInfo .genres, .titleInfo .story, .titleInfo .StarRating { display: flex; }
.titleInfo .author .itemName, .titleInfo .genres .itemName, .titleInfo .story .itemName, .titleInfo .StarRating .itemName { width: 5rem; }
.titleInfo .author .itemName::after, .titleInfo .genres .itemName::after, .titleInfo .story .itemName::after, .titleInfo .StarRating .itemName::after { color: #FF579B; content: ":"; }
.titleInfo .author .itemName span, .titleInfo .genres .itemName span, .titleInfo .story .itemName span, .titleInfo .StarRating .itemName span { display: inline-block; width: 4rem; color: #FF579B; }
.titleInfo .author .item, .titleInfo .genres .item, .titleInfo .story .item, .titleInfo .StarRating .item { flex: 1;  }
.titleInfo .author a, .titleInfo .genres a, .titleInfo .story a { display: inline-block; text-decoration: underline; }
.titleInfo .genres a { margin-right: 0.5rem; }
.titleInfo .StarRating a, .titleInfo .StarRating .StarRatingBlock { display: flex; }
.titleInfo .StarRating .star { margin-right: 0.2rem; line-height: 1.2; }
.titleInfo .StarRating .star img { width: 1.2rem; margin-right: 0.1rem; }
.titleInfo .StarRating .count { font-size: 1rem; }
 @media (max-width: 568px) {
     .titleDetail { display: block; }
     .titlePic { margin: 0 auto 1rem; }
 }
.titleInfo .btnBlock { margin-top: 1rem; text-align: center; }
.titleInfo .btnBlock a { display: inline-block; width: 13rem; padding: 0.6rem 1rem; margin: 1rem 0.5rem 0;
    border: 1px solid #C7C7C7; border-radius: 4px; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.16);
    font-weight: bold; text-align: center;}
.titleInfo .btnBlock a:hover { opacity: .6; } 
.titleInfo .btnBlock .purchaseBtn { background: #56D6FF; }
.titleBox .comment { padding: 1rem; background: #DAEEFD; font-size: 1.2rem; }
.titleBox .comment span { font-weight: bold; color: #FF579B; }
.titleBox .comment .writer { margin-top: 1rem; text-align: right; }
.titleBox .reviews { border: 1px solid #FF579B; padding: 1rem; font-size: 1.2rem; }
.titleBox .reviews span { font-weight: bold; color: #FF579B; font-size: 1.5rem; }
.titleBox .reviews .userReview { text-align: left; margin-top: 1rem; border-top: 1px solid #e5e5e5; padding-top: 1rem; }
.titleBox .reviews .userReview .reviewTitle { font-weight: bold;}
.titleBox .reviews .userInfo { display: flex; flex-wrap: wrap; align-items: center; }
.titleBox .reviews .userInfo p { max-width: 100%; margin-right: 0.5rem;  margin-bottom: 0.5rem; }
.titleBox .reviews .userInfo .star { line-height: 0; }
.titleBox .reviews .userInfo .star img { width: 1.2rem; margin-right: 0.1rem; }
.titleBox .reviews .userInfo .userName a { font-size: 1rem; line-height: 0; text-decoration: underline; }
.titleBox .reviews .userInfo .date { color: #707070; font-size: .9rem; }
.titleBox .reviews .seeAll { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #e5e5e5; text-align: right; }
.titleBox .reviews .seeAll a { display: inline-block; position: relative; padding-right: 1.2rem; font-size: 1rem; text-decoration: underline; }
.titleBox .reviews .seeAll a::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: .5rem;
    height: .5rem;
    margin-top: -0.3rem;
    margin-right: 0.5rem;
    clear: both;
    transform: rotate(135deg);
    border-width: 2px 0 0 2px;
    border-style: solid;
    border-color: #1f1f1f transparent transparent #1f1f1f;
    content: "";
}
.titleBox .special { border: 1px solid #FF579B; padding: 0 1rem 1rem; font-size: 1.2rem; }
.titleBox .special .title { display: inline-block; font-weight: bold; color: #fff; padding: 0.5rem 1rem; background: #FF579B; border-bottom-right-radius: 1rem; margin: 0 0 1rem -1rem; }
.titleBox .special span { font-weight: bold; color: #FF579B; }
.titleBox .recommendationLink { width: 90%; margin: 2rem auto 0; }
.titleBox .recommendationLink a.iconLink { display: block; position:relative; padding-left: 1.7rem; text-align: left; font-size: 1.2rem; text-decoration: underline; color:#FF579B; margin-bottom: 1rem; }
.titleBox .recommendationLink a.iconLink::before { content: ""; position: absolute; left: 0; width: 1.2em; height: 1.2em; border-radius: 50%;
    background-color: #FF579B; background-image: url(../images/icon_link.svg); background-size: 0.8rem; background-repeat: no-repeat; background-position: center; }
.titleInfo .story .item { position: relative; padding-bottom: 2rem; }
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button1 { display: none; }
.titleInfo .story .item .readmore_button1 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button1:not(:checked) ~ .readmore_button1:after,
.titleInfo .story .item input#readmore_button1:not(:checked) ~ .readmore_button1:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button1:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button1:checked ~ .readmore_button1:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button2 { display: none; }
.titleInfo .story .item .readmore_button2 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button2:not(:checked) ~ .readmore_button2:after,
.titleInfo .story .item input#readmore_button2:not(:checked) ~ .readmore_button2:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button2:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button2:checked ~ .readmore_button2:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button3 { display: none; }
.titleInfo .story .item .readmore_button3 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button3:not(:checked) ~ .readmore_button3:after,
.titleInfo .story .item input#readmore_button3:not(:checked) ~ .readmore_button3:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button3:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button3:checked ~ .readmore_button3:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button4 { display: none; }
.titleInfo .story .item .readmore_button4 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button4:not(:checked) ~ .readmore_button4:after,
.titleInfo .story .item input#readmore_button4:not(:checked) ~ .readmore_button4:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button4:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button4:checked ~ .readmore_button4:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button5 { display: none; }
.titleInfo .story .item .readmore_button5 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button5:not(:checked) ~ .readmore_button5:after,
.titleInfo .story .item input#readmore_button5:not(:checked) ~ .readmore_button5:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button5:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button5:checked ~ .readmore_button5:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button6 { display: none; }
.titleInfo .story .item .readmore_button6 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button6:not(:checked) ~ .readmore_button6:after,
.titleInfo .story .item input#readmore_button6:not(:checked) ~ .readmore_button6:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button6:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button6:checked ~ .readmore_button6:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button7 { display: none; }
.titleInfo .story .item .readmore_button7 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button7:not(:checked) ~ .readmore_button7:after,
.titleInfo .story .item input#readmore_button7:not(:checked) ~ .readmore_button7:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button7:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button7:checked ~ .readmore_button7:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button8 { display: none; }
.titleInfo .story .item .readmore_button8 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button8:not(:checked) ~ .readmore_button8:after,
.titleInfo .story .item input#readmore_button8:not(:checked) ~ .readmore_button8:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button8:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button8:checked ~ .readmore_button8:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button9 { display: none; }
.titleInfo .story .item .readmore_button9 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button9:not(:checked) ~ .readmore_button9:after,
.titleInfo .story .item input#readmore_button9:not(:checked) ~ .readmore_button9:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button9:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button9:checked ~ .readmore_button9:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button10 { display: none; }
.titleInfo .story .item .readmore_button10 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button10:not(:checked) ~ .readmore_button10:after,
.titleInfo .story .item input#readmore_button10:not(:checked) ~ .readmore_button10:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button10:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button10:checked ~ .readmore_button10:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button11 { display: none; }
.titleInfo .story .item .readmore_button11 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button11:not(:checked) ~ .readmore_button11:after,
.titleInfo .story .item input#readmore_button11:not(:checked) ~ .readmore_button11:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button11:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button11:checked ~ .readmore_button11:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button12 { display: none; }
.titleInfo .story .item .readmore_button12 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button12:not(:checked) ~ .readmore_button12:after,
.titleInfo .story .item input#readmore_button12:not(:checked) ~ .readmore_button12:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button12:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button12:checked ~ .readmore_button12:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button13 { display: none; }
.titleInfo .story .item .readmore_button13 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button13:not(:checked) ~ .readmore_button13:after,
.titleInfo .story .item input#readmore_button13:not(:checked) ~ .readmore_button13:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button13:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button13:checked ~ .readmore_button13:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button14 { display: none; }
.titleInfo .story .item .readmore_button14 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button14:not(:checked) ~ .readmore_button14:after,
.titleInfo .story .item input#readmore_button14:not(:checked) ~ .readmore_button14:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button14:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button14:checked ~ .readmore_button14:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button15 { display: none; }
.titleInfo .story .item .readmore_button15 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button15:not(:checked) ~ .readmore_button15:after,
.titleInfo .story .item input#readmore_button15:not(:checked) ~ .readmore_button15:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button15:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button15:checked ~ .readmore_button15:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/
/*▼▼reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▼▼*/
.titleInfo .story .item input#readmore_button16 { display: none; }
.titleInfo .story .item .readmore_button16 { display: block; width: 6.5rem; text-align: right; position: absolute; bottom: 0; right: 0;
    text-decoration: underline; text-underline-position: under; text-decoration-line: underline; text-decoration-skip-ink: none; font-feature-settings: "palt"; cursor: pointer; }
.titleInfo .story .item input#readmore_button16:not(:checked) ~ .readmore_button16:after,
.titleInfo .story .item input#readmore_button16:not(:checked) ~ .readmore_button16:after { content: "Read more"; display: block; }
.titleInfo .story .item input#readmore_button16:not(:checked) ~ .storyText { height: 6rem; overflow: hidden; }
.titleInfo .story .item input#readmore_button16:checked ~ .readmore_button16:after { content: "Close"; display: block; }
/*▲▲reedmoreの個数だけreadmore_buttonの後ろに連番付けて増やす▲▲*/


/****************************/
/*  titleListBox
/***************************/
.titleListBox { width: 95%; margin: 0 auto; border-top: 2px solid #E5E5E5; padding-top: 2rem;
    display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 2rem; }
.titleListBox.noBorder { border-top: none; padding-top: 0; }
.li-titlePic { width: 80%; margin: 0 auto 0.5rem; }
.li-titleName, .li-authorName, .li-tag { word-break: break-word; }
.li-titleName { font-size: 1.2rem; text-decoration: underline; text-align: center; }
.li-authorName { color: #FF579B; text-decoration: underline; text-align: center; }
.li-tag { margin-top: 0.3rem; text-align: center; font-size: 0.8rem; }
.li-tag a { display: inline-block; text-decoration: underline; }
.li-StarRating { margin-top: 0.5rem; }
.li-StarRating a { display: flex; justify-content: center; }
.li-StarRating .star { margin-right: 0.2rem; line-height: 1.2; }
.li-StarRating .star img { width: 1.2rem; margin-right: 0.1rem; }
.li-StarRating .count { font-size: 1rem; }
.li-StarRating .count span { text-decoration: underline; }
.li-btnBlock { margin-top: 1rem; text-align: center; }
.li-btnBlock a { display: inline-block; width: 80%; padding: 0.6rem 1rem;
    border: 1px solid #C7C7C7; border-radius: 4px; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.16);
    font-weight: bold; text-align: center;}
.li-btnBlock a:hover { opacity: .6; } 
.li-btnBlock .purchaseBtn { background: #56D6FF; margin-top: 1rem; }
@media (max-width: 568px) {
     .titleListBox { grid-template-columns: repeat(2, 1fr); }
 }
/****************************/
/*  specialBannerArea
/***************************/
.specialBannerArea {
    width: 95%;
    margin: 0 auto 2rem;
    text-align: center;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 1rem;
}
.specialName { margin-top: 0.3rem; font-weight: bold; }
@media (max-width: 568px) {
    .specialBannerArea {grid-template-columns: 1fr; }
}
/****************************/
/*  linkBtnBox
/***************************/
.linkBtnBox { width: 95%; margin: 0 auto; border-top: 2px solid #E5E5E5; padding-top: 2rem; text-align: center; }
.linkBtnBox.noBorder { border-top: none; padding-top: 1rem; }
.linkBtnBox a { display: inline-block; width: 17rem; padding: 0.6rem 1rem; margin: 0 0.5rem 1rem;
    border: 1px solid #C7C7C7; border-radius: 3rem; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.16);
    background: #FF579B; color: #fff; font-weight: bold; text-align: center;}
.linkBtnBox a:hover { opacity: .6; } 
/****************************/
/*  cam
/***************************/
.camPeriod { font-size: 1rem; font-weight: bold; color: #FF579B; text-align: center; width: 90%; margin: 0 auto 2rem; }
.titleName .point { display: inline-block; background: #EF3232; color: #fff; font-weight: normal; padding: 0.3rem 0.3rem 0.2rem; font-size: 1rem; line-height: 1; }
/**
 * ***************************************
 * 応募規約
 * ***************************************
 */
.entry-agreement {
	border: solid 1px #FF579B;
	padding: 1rem 1rem 0rem 1rem;
	margin: 0 2% 2rem 2%;
}
.entry-agreement p {
	font-size: 1rem;
	margin-bottom: 1rem;
	line-height: 1.5rem;
}
.entry-agreement a {
	text-decoration: underline;
}
.entry-agreement .heading{ text-align: center;}
.txt-blue {
	color: #FF579B;
	font-size: 1.2rem;
	font-weight: bold;
}
.txt-red {
	color: #EF3232;
}
.txt-bold {
	font-weight: bold;
}