/* ----------------------------------------
 e87.com いいはなドットコム　CSS
 
 date:2007/05/01
	template-E
---------------------------------------- */

/* 
 frame
----------------------------------- */

#contents {
	width:960px;
	margin:0 auto;
}

#contents #mainArea {
    margin: 0 10px 0;
}


/* 
 mainArea
----------------------------------- */

#mainArea h1 {
	padding:0 0 0 40px;
	font-size:180%;
	color:#ca417d;
	font-weight:bold;
	background:url(//img.e87.com/word/images/icon_01.gif) no-repeat left top;
	line-height:180%;
	margin-top: 20px;
}

#mainArea p {
	padding:0 0 0 15px;
	line-height: 1.3;
	font-size: 130%;
}

#mainArea .lead01{
	margin: 10px 0 25px;
}

/* ----- tableArea ----- */

#mainArea table {
    padding-top: 10px;
}

#mainArea table th {
    text-align: left;
    font-weight: bold;
    font-size: 120%;
    color: #ca417d;
}

#mainArea table td {
    padding: 17px 0 5px 0;
    border-bottom: 1px dashed #ccc;
    font-size: 130%;
    background-position: bottom;
}

#mainArea table td.td01 {
	width:150px;
}

#mainArea table td.td02 {
    width: 270px;
    font-weight: bold;
}

#mainArea table td.td03 {
	width:250px;
}

#mainArea table td span {
    color: #ca417d;
    padding: 0 0 0 20px;
    font-size: 120%;
    background: url(//img.e87.com/word/images/icon_03.gif) no-repeat left center;
}

/* 
 bottomArea
----------------------------------- */
/* ----- pickuplist ----- */

#bottomArea {
	margin:0 0 0 16px;
}

#bottomArea h2{
padding:25px 0 20px 65px;
background:url(//img.e87.com/word/images/h2_pickup_bg.gif) no-repeat top left;
color:#e2137e;
font-weight:bold;
font-size:125%;
}

#bottomArea #pickuplist{
margin:5px 0 0 0;
}

#bottomArea #pickuplist ul li{
float:left;
width:199px;
_width:230px;
padding:10px 8px;
margin:0 14px 0 0;
border:8px solid #ffb0d3;
font-size:85%;
}

#bottomArea div#pickuplist ul li.rightlist{
margin:0;
}

#bottomArea #pickuplist ul li p.goodsname {
margin:0;
padding:0;
}

#bottomArea #pickuplist ul li p.goodsname a {
	color:#ca417d;
}

#bottomArea #pickuplist ul li p.catch {
margin:0;
padding:3px 0 5px 0;
	color:#ca417d;
}

#bottomArea #pickuplist ul li .newpct {
	padding:13px 0 0 0;
	background:url(//img.e87.com/products/images/ico_new.gif) no-repeat top left;
}


/* Win版IE7とMac版IE5対策 */
#bottomArea #pickuplist{
   display:inline-block;
}

/* Win版IE5および6対策 */
/* Hides from IE-mac \*/
* html #bottomArea #pickuplist{
   height:1px;
}

#bottomArea #pickuplist{
   display:block;
}
/* End hide from IE-mac */

#bottomArea #pickuplist ul li p.detailText {
margin:0;
padding:3px 0 5px 0;
background:url(//img.e87.com/images/table_dotline01.gif) repeat-x bottom;
}

#bottomArea div.product_detail {
background:url(//img.e87.com/images/table_dotline01.gif) repeat-x bottom;
padding:0 0 1px 0;
width:199px;
}

#bottomArea div.product_detail dl {
	float:left;
}


#bottomArea div.product_detail dl.right {
	float:left;
	margin:0 0 0 10px;
}

#bottomArea div.product_detail dl dt{
	display:block;
	width:35px;
	float:left;
	font-weight:bold;
	padding:3px 0 0 0;
}

#bottomArea div.product_detail dl dd{
	padding:3px 0 0 0;
}

#bottomArea div.product_detail_bottom {
	margin:3px 0 0 0;
}

#bottomArea div.product_detail_bottom p {
	font-weight:bold;
	float:left;
}

#bottomArea div.product_detail .imgBox {
	float:right;
	_padding:0;
	text-align:right;
	height:20px;
}

#bottomArea .messageBtnBox {
	margin:3px 0 3px 4px;
	_margin:3px 0 3px 3px;
}

#bottomArea .messageBtn {
	float:left;
	margin:0 3px 0 0;
}

/* Win版IE7とMac版IE5対策 */
#bottomArea div.product_detail{
   display:inline-block;
}

/* Win版IE5および6対策 */
/* Hides from IE-mac \*/
* html #bottomArea div.product_detail{
   height:1px;
}

#bottomArea div.product_detail{
   display:block;
}
/* End hide from IE-mac */


/* ----- columnListArea ----- */

.columnListArea {
    border-top: 1px solid #EEEEEE;
    width: calc(100% - 2px);
    float: left;
    margin: 0 0 15px;
    padding: 0;
}

.columnListArea h3{
	color:#ee0000;
	font-weight:bold;
	margin:20px 0 5px 0;
}

.columnList {
	background-color:#FFEFFD;
	border:1px solid #FFAED0;
	padding:10px 0 5px 15px;
}

.columnList ul:after{
   content:".";
   display:block;
   height:0px;
   clear:both;
   visibility:hidden;
}

/* Win版IE7とMac版IE5対策 */
#mainArea .columnList ul{
   display:inline-block;
}

/* Win版IE5および6対策 */
/* Hides from IE-mac \;*/
* html #mainArea .columnList ul{
   height:1px;
}

.columnList ul{
   display:block;
}
/* End hide from IE-mac */

.columnList ul{
	width:945px;
}

.columnList ul li {
    background: url(//img.e87.com/selection/newyear/images/colum_arrow.gif) no-repeat left center;
    padding: 0 0 0 15px;
    margin: 5px 0px;
    font-size: 130%;
    width: 170px;
    float: left;
}

.columnList ul li a {
	text-decoration:none;
}
.columnList ul li a:hover {
	text-decoration:underline;
}



/* 
 rightArea
----------------------------------- */
/* ----- monthMenuBox ----- */
#rightArea .monthMenuBox {
	    display: none;
}

#rightArea .monthMenuTit {
	width:100%;
	padding:4px 0;
	text-align:center;
	color:#c8417c;
	background:#ffeef6;
}

#rightArea .monthMenu {
	margin:5px 0 6px 12px;
}

#rightArea .monthMenu td {
    padding: 5px 20px;
    background: url(//img.e87.com/word/images/allow.gif) no-repeat left;
    width: 60px;
    text-align: center;
    font-size: 120%;
    background-origin: content-box;
}

/* ----- rightText ----- */

#rightArea .rightText {
	margin:40px 20px 30px;
	font-size:85%;
}

#rightArea .rightText dt {
	display:block;
	width:39px;
	float:left;
	color:#ca417d;
}

#rightArea .rightText dd {
	width:104px;
	float:left;
}

#rightArea .rightText span.textBy {
	display:block;
	padding:20px 0 0 0;
	color:#979685;
}

/* ----- bannerBox ----- */

#rightArea .bannerBox {
	margin:0;
}

#rightArea .bannerText {
	width:140px;
	margin:3px 0 8px 10px;
	_margin:0 0 8px 10px;
	font-size:85%;
}


/* 
 bottomArea
----------------------------------- */

#contents .pagetop {
	text-align:right;
	margin:25px 0;
}

#contents .pagetop p {
    font-size: 85%;
    margin: 0 5px 0 0;
    text-align: right;
}

#contents .allow {
	color:#ca417d;
	font-size:85%;
}
.sp_navi {
    display: none;
}


/*bnr_area
-----------------------------*/
.bnr_area ul { display: flex; padding: 0 20px;}
.bnr_area ul li {  padding: 10px;}
.bnr_area ul li img:hover {opacity: 0.7;}
.bnr_area h2.h2_ttl {color: #305b48;border-top: 1px solid #305b48;border-bottom: 1px solid #305b48;text-align: center;padding: 8px 0 6px;font-size: 16px;font-weight: bold;margin: 30px 0 20px;}
.bnr_area ul li img{width:100%;height:auto;}

/* 
 スマホ
----------------------------------- */
@media screen and (max-width: 680px) { 
.bnr_area ul { display: block; padding: 0 5%;}
.bnr_area ul li {  padding: 5px 10px;}
.sp_navi {display: block;}
.sp_navi ul {display: flex;}
.sp_navi ul a {width: 25%;background: #000;padding: 10px 0;border-right: 1px solid #fff;color: #fff;margin-bottom: 10px;}
.sp_navi ul a li {text-align: center;font-size: 11px;}
#e87service .contents_ {padding: 5px 0!important;}
#header {width: 100%;}
#header .contents_:first-of-type {height: 0;}
.contents_ div#logo_area {width: 100%;margin: 0 5px;}
.contents_ div#logo_area p#sitelogo img {width: 85%;height: auto;}
.contents_ div#logo_area p#sitelogo {width: 100%;display: flex;padding-bottom: 10px;}
#mainArea p {padding: 0;line-height: 1.3;font-size: 100%;}
#headline_nav,div#global_content,div#globalnav_box {display: none;}
#header .contents_:first-of-type {width: 100%;height: 0!important;background: #fbf7f7;}
div#gift_content, #youre_home_content {display: none;}
div#globalnav_box {display: none;}
div#global_content {display: none;}
#contents {width: 100%;margin: 0 auto;}
div#topArea img {width: 100%;height: auto;}
#mainArea table td.td01 {width: 24%;font-size: 10.5px;}
#mainArea table td.td02 {width: 33%;}
#mainArea table td {font-size: 12px;}
.columnListArea {margin: 3%;width: calc(94% - 2px);}
div#gift_content, #youre_home_content {display: none;}
.columnList ul {width: 100%;}
.columnList ul li {width: 90%;}
div.contents_, div.col1_ {margin: 0 auto;width: 960px;text-align: left;}
.contents_ {width: 100%!important;}
#e87service #service_link_box_r {width: 96%!important;height: auto;padding: 2%!important;background: #fff;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;-ms-border-radius: 5px;}
#e87service #service_link_box_r ul:first-of-type #qr {width: 100%;height: 72px;border-right: #efe8e6 1px solid;padding-top: 10px;}
#e87service #service_link_box_l {width: 96%!important;padding: 2%!important;}
#e87service #service_link_box_r ul:first-of-type li {float: none;}
#e87service #service_link_box_r ul:first-of-type #verisign ul {width: 100%;height: auto;}
#footernav li { white-space: nowrap;}



}


