﻿
p.clear{ clear: both; }


@media screen and (max-width: 767px) { /* MAIN CONTENTS
----------------------------------------------- */
/* COMMON CONTENTS */
.messageBoxWrap { border: 1px solid #a05a76; padding:1px; margin:0 0 10px 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #fff; position:relative; margin:0 0 20px 0; }
.messageBoxWrapInner { border: 1px solid #dbb9c7; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #fff8fb; padding:10px 10px 5px; position:relative; }
.messageBoxWrapInner ul li { color:#761238; background:url(//img.e87.com/selection/images/flowerCmnIco.gif) no-repeat left 0.1em; padding:0 0 9px 20px; border-bottom:dotted 1px #761238; margin:9px 0 0 0; list-style:none; }
.messageBoxWrapInner ul li:first-child { color:#761238; background:url(//img.e87.com/selection/images/flowerCmnIco.gif) no-repeat left 0.1em; padding:0 0 9px 20px; border-bottom:dotted 1px #761238; margin:0; }
.messageBoxWrapInner ul li.last { color:#761238; background:url(//img.e87.com/selection/images/flowerCmnIco.gif) no-repeat left 0.1em; padding:0 0 9px 20px; border-bottom:0; margin:9px 0 0 0; }
p.pinkLink { background:url(//img.e87.com/selection/images/linkAllowPink.gif) no-repeat left center; padding:0 0 0 12px; margin-left:8px; }
p.pinkLink a { color:#cc407d; text-decoration:underline; }
p.pinkLink a:hover { text-decoration:none; }
#massageListBtnWrap { position:relative; margin:0 auto 20px; border: 1px solid #eaaac5; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; padding:1px; }
#massageListBtnWrapInner { position:relative; text-align:left; color:#fff; padding:5px 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#cb417d), to(#e65494)); background: -webkit-linear-gradient(#cb417d, #e65494); background: -moz-linear-gradient(#cb417d, #e65494); background: -ms-linear-gradient(#cb417d, #e65494); background: -o-linear-gradient(#cb417d, #e65494); background: linear-gradient(#cb417d, #e65494); -pie-background: linear-gradient(#cb417d, #e65494); }
#massageListBtnWrapInner p { padding:0 0 0 15px; background:url(//img.e87.com/selection/images/linkAllowWhite.gif) no-repeat left center; line-height:1.2em; }
#massageListBtnWrapInner a { color:#fff; font-weight:bold; font-size:100%; }
p.messageBoxTxt { margin:0 auto 10px auto; width:90%; }
p.messageBoxTxt img{ width: 100%; height: auto; }
.shadowBoxWrap { position:relative; padding:0 0 1px 0; box-shadow:none; margin:0 0 10px 0; background:#fff; }
.shadowBoxWrapInner { border-bottom:none; padding:0; margin:10px 0 0 0; }
.flowerUnitAreaBtnWrap{ border: 1px solid #e15088; padding:1px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #fff; width:331px; height:30px; position:relative; margin:30px 0 10px 0; }
.flowerUnitAreaBtnWrapInner{ position:relative; height:30px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background:url(//img.e87.com/selection/images/flowerUnitAreaBtnBg.gif) left bottom; }
.flowerUnitAreaBtnWrapInner p{ position:absolute; top:0; left:20px; }
.flowerUnitAreaBtnWrapInner p a{ padding:5px; display:block; color:#a6124b; font-weight:bold; }

#otherRankBtnWrap { position:relative; width:170px; margin:10px auto 20px; border: 1px solid #eaaac5; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; padding:1px; float:none; }
#otherRankBtnWrapInner { position:relative; text-align:center; color:#fff; padding:0 10px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#cb417d), to(#e65494)); background: -webkit-linear-gradient(#cb417d, #e65494); background: -moz-linear-gradient(#cb417d, #e65494); background: -ms-linear-gradient(#cb417d, #e65494); background: -o-linear-gradient(#cb417d, #e65494); background: linear-gradient(#cb417d, #e65494); -pie-background: linear-gradient(#cb417d, #e65494); background:#cb417d; }
#otherRankBtnWrapInner a { background:url(//img.e87.com/selection/images/linkAllowWhite_s.gif) no-repeat left center; padding:0 0 0 7px; color:#fff; font-weight:bold; font-size:92%; }
#otherRankBtnWrapInner a span.pcTxt{ display:none; }
.other_q { border: #c8484a 1px solid; padding: 10px 10px 0 10px; }
.flowerUnitAreaImg img{ width:100%; }
.other_q dt{font-weight: bold; }
.other_q dd {float: left;width: 25vw;text-align: center;color: #FFF;font-weight: bold;padding: 10px 5px;background: #FFACAD;margin: 5px;border-radius: 8px;}
.clearfix:after{ content:"."; display:block; height:0px; clear:both; visibility:hidden; }	 

}

@media screen and (min-width: 768px) and (max-width:899px) { /* MAIN CONTENTS
----------------------------------------------- */
/* COMMON CONTENTS */
.messageBoxWrap { border: 1px solid #a05a76; padding:1px; margin:0 0 30px 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #fff; position:relative; }
.messageBoxWrapInner { border: 1px solid #dbb9c7; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #fff8fb; padding:10px 10px 5px; position:relative; }
.messageBoxWrapInner ul li { color:#761238; background:url(//img.e87.com/selection/images/flowerCmnIco.gif) no-repeat left 0.1em; padding:0 0 9px 20px; border-bottom:dotted 1px #761238; margin:9px 0 0 0; list-style:none; }
.messageBoxWrapInner ul li:first-child { color:#761238; background:url(//img.e87.com/selection/images/flowerCmnIco.gif) no-repeat left 0.1em; padding:0 0 9px 20px; border-bottom:dotted 1px #761238; margin:0; }
.messageBoxWrapInner ul li.last { color:#761238; background:url(//img.e87.com/selection/images/flowerCmnIco.gif) no-repeat left 0.1em; padding:0 0 9px 20px; border-bottom:0; margin:9px 0 0 0; }
p.pinkLink { background:url(//img.e87.com/selection/images/linkAllowPink.gif) no-repeat left center; padding:0 0 0 12px; margin-left:8px; }
p.pinkLink a { color:#cc407d; text-decoration:underline; }
p.pinkLink a:hover { text-decoration:none; }
#massageListBtnWrap { position:relative; width:506px; margin:0 auto 35px; border: 1px solid #eaaac5; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; padding:1px; }
#massageListBtnWrapInner { position:relative; text-align:center; color:#fff; padding:5px 0; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#cb417d), to(#e65494)); background: -webkit-linear-gradient(#cb417d, #e65494); background: -moz-linear-gradient(#cb417d, #e65494); background: -ms-linear-gradient(#cb417d, #e65494); background: -o-linear-gradient(#cb417d, #e65494); background: linear-gradient(#cb417d, #e65494); -pie-background: linear-gradient(#cb417d, #e65494); }
#massageListBtnWrapInner a { background:url(//img.e87.com/selection/images/linkAllowWhite.gif) no-repeat left center; padding:0 0 0 12px; color:#fff; font-weight:bold; font-size:123%; }
p.messageBoxTxt { margin:0 0 10px 0; }
.shadowBoxWrap { position:relative; padding:0 0 1px 0; box-shadow:none; margin:0 0 30px 0; background:#fff; }
.shadowBoxWrap.withGiftRanking{ margin-bottom:10px; }
.shadowBoxWrapInner { border-bottom:none; padding:0 0 10px 0; margin:23px 0 0 0; }
.flowerUnitAreaBtnWrap{ border: 1px solid #e15088; padding:1px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #fff; width:331px; height:30px; position:relative; margin:30px 0 10px 0; }
.flowerUnitAreaBtnWrapInner{ position:relative; height:30px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background:url(//img.e87.com/selection/images/flowerUnitAreaBtnBg.gif) left bottom; }
.flowerUnitAreaBtnWrapInner p{ position:absolute; top:0; left:20px; }
.flowerUnitAreaBtnWrapInner p a{ padding:5px; display:block; color:#a6124b; font-weight:bold; }

#otherRankBtnWrap { position:relative; width:140px; margin:0 293px 20px 0; border: 1px solid #eaaac5; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; padding:1px; }
#otherRankBtnWrapInner { position:relative; text-align:center; color:#fff; padding:0 10px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#cb417d), to(#e65494)); background: -webkit-linear-gradient(#cb417d, #e65494); background: -moz-linear-gradient(#cb417d, #e65494); background: -ms-linear-gradient(#cb417d, #e65494); background: -o-linear-gradient(#cb417d, #e65494); background: linear-gradient(#cb417d, #e65494); -pie-background: linear-gradient(#cb417d, #e65494); background:#cb417d; }
#otherRankBtnWrapInner a { background:url(//img.e87.com/selection/images/linkAllowWhite_s.gif) no-repeat left center; padding:0 0 0 7px; color:#fff; font-weight:bold; font-size:92%; }
#otherRankBtnWrapInner a span.pcTxt{ display:none; }
.other_q { border: #c8484a 1px solid;padding: 10px; }
.flowerUnitAreaImg{ float:left; width:48%; }
.flowerUnitAreaImg img{ width: 100%; }
.other_q dt{font-weight: bold; }
.clearfix:after{ content:"."; display:block; height:0px; clear:both; visibility:hidden; }	 
.other_q dd { float: left; width: 12%; text-align: center; color: #FFF; font-weight: bold; padding: 5px; background: #FFACAD; margin: 10px; border-radius: 8px; min-height: 30px;}
}

@media screen and (min-width:900px) { /* MAIN CONTENTS
----------------------------------------------- */

/* COMMON CONTENTS */
.messageBoxWrap { border: 1px solid #a05a76; padding:1px; margin:0 0 30px 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #fff; position:relative; }
.messageBoxWrapInner { border: 1px solid #dbb9c7; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #fff8fb; padding:10px 10px 5px; position:relative; }
.messageBoxWrapInner span.text_b{ font-weight:bold; }
.messageBoxWrapInner ul li { color:#761238; background:url(//img.e87.com/selection/images/flowerCmnIco.gif) no-repeat left 0.1em; padding:0 0 9px 20px; border-bottom:dotted 1px #761238; margin:9px 0 0 0; list-style:none; }
.messageBoxWrapInner ul li:first-child { color:#761238; background:url(//img.e87.com/selection/images/flowerCmnIco.gif) no-repeat left 0.1em; padding:0 0 9px 20px; border-bottom:dotted 1px #761238; margin:0; }
.messageBoxWrapInner ul li.last { color:#761238; background:url(//img.e87.com/selection/images/flowerCmnIco.gif) no-repeat left 0.1em; padding:0 0 9px 20px; border-bottom:0; margin:9px 0 0 0; }
p.messageBoxTxt span.text_b{ font-weight:bold; }
p.messageBoxTxt { margin:0 0 10px 0; }
p._hf { margin:0 0 10px 0; width: 48%; float: right; }

div.linkBox { font-size:82%; padding:10px 0 20px 0; }
p.pinkLink { background:url(//img.e87.com/selection/images/linkAllowPink.gif) no-repeat left center; padding:0 0 0 12px; margin-left:8px; }
p.pinkLink a { color:#cc407d; text-decoration:underline; }
p.pinkLink a:hover { text-decoration:none; }
#massageListBtnWrap { position:relative; width:400px; margin:0 auto 35px; border: 1px solid #eaaac5; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; padding:1px; }
#massageListBtnWrapInner { position:relative; text-align:center; color:#fff; padding:5px 0; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#cb417d), to(#e65494)); background: -webkit-linear-gradient(#cb417d, #e65494); background: -moz-linear-gradient(#cb417d, #e65494); background: -ms-linear-gradient(#cb417d, #e65494); background: -o-linear-gradient(#cb417d, #e65494); background: linear-gradient(#cb417d, #e65494); -pie-background: linear-gradient(#cb417d, #e65494); }
#massageListBtnWrapInner a { background:url(//img.e87.com/selection/images/linkAllowWhite.gif) no-repeat left center; padding:0 0 0 12px; color:#fff; font-weight:bold; font-size:108%; }
.shadowBoxWrap { position:relative; padding:0 0 1px 0; margin:0 0 30px 0; -webkit-box-shadow: 0 5px 5px -3px #ede7e9; -moz-box-shadow: 0 5px 5px -3px #ede7e9; box-shadow: 0 5px 5px -3px #ede7e9; background:#fff; }
.shadowBoxWrap.withGiftRanking{ margin-bottom:10px; }
.shadowBoxWrapInner { border-bottom:dotted 1px #c89fad; padding:0 0 10px 0; margin:23px 0 0 0; }

.flowerUnitAreaBtnWrap{ border: 1px solid #e15088; padding:1px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #fff; width:331px; height:30px; position:relative; margin:0 0 10px 0; clear:both; }
.flowerUnitAreaBtnWrapInner{ position:relative; height:30px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background:url(//img.e87.com/selection/images/flowerUnitAreaBtnBg.gif) left bottom; }
.flowerUnitAreaBtnWrapInner p{ position:absolute; top:0; left:20px; }
.flowerUnitAreaBtnWrapInner p a{ padding:5px; display:block; color:#a6124b; font-weight:bold; }

#otherRankBtnWrap { position:relative; width:170px; margin:0 auto 20px; border: 1px solid #eaaac5; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; padding:1px; float:right; }
#otherRankBtnWrapInner { position:relative; text-align:center; color:#fff; padding:0 10px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; background: -webkit-gradient(linear, 0 0, 0 bottom, from(#cb417d), to(#e65494)); background: -webkit-linear-gradient(#cb417d, #e65494); background: -moz-linear-gradient(#cb417d, #e65494); background: -ms-linear-gradient(#cb417d, #e65494); background: -o-linear-gradient(#cb417d, #e65494); background: linear-gradient(#cb417d, #e65494); -pie-background: linear-gradient(#cb417d, #e65494); background:#cb417d; }
#otherRankBtnWrapInner a { background:url(//img.e87.com/selection/images/linkAllowWhite_s.gif) no-repeat left center; padding:0 0 0 7px; color:#fff; font-weight:bold; font-size:92%; }
#otherRankBtnWrapInner a span.sptlTxt{ display:none; }

.shadowBoxWrap.columnB { margin:0 0 30px 0; -webkit-box-shadow: 0 5px 5px -3px #ede7e9; -moz-box-shadow: 0 5px 5px -3px #ede7e9; box-shadow: 0 5px 5px -3px #ede7e9; overflow: hidden; }
.shadowBoxWrapInner { border-bottom:none; padding:0 0 10px 0; margin:23px 0 0 0; }
.shadowBoxWrapInner.columnB { border-bottom:dotted 1px #c89fad; padding:0 0 10px 0; margin:0 0 0 0; overflow: hidden; }
.flowerUnitArea{ float:left; width:50%; }
.flowerUnitAreaTxt{ padding:0 0 10px 0; margin:0 0 10px 0; }
.flowerUnitAreaTxt img{ max-width: 100%; height: auto; }
.flowerUnitAreaImg{ float:left; width:48%; }
.flowerUnitAreaImg img{ max-width: 100%; height: auto; }
.other_q { border: #c8484a 1px solid;padding: 10px; }

.other_q dt{font-weight: bold; }
.other_q dd { float: left; width: 13%; text-align: center; color: #FFF; font-weight: bold; padding: 10px 5px; background: #FFACAD; margin: 10px; border-radius: 8px;}
.clearfix:after{ content:"."; display:block; height:0px; clear:both; visibility:hidden; }	 
}