@charset "UTF-8";

/*/////////////////////////////////////////////////////////////////////

	item css

----------------------------------------------------------------

	- list
	- detail

/////////////////////////////////////////////////////////////////////*/

/*--------------------------------------------------------------
	list
--------------------------------------------------------------*/
#main #ttlPage .imgGreeting { margin: 0 0 0 20px; padding-top: 30px; text-align: left; }

/* category navigation
--------------------------------------------------------------*/
#main #navCategory { margin-bottom: 30px; }
#main #navCategory ul li { float: left; }

/* category section
--------------------------------------------------------------*/
#main .secCat header h1 { margin-bottom: 20px; height: 30px; background-color: #cc3399; }
#main .secCat header h1 img { padding: 5px 0 0 25px; }
#main .secCat .pagetop { clear: left; }
#main #secCatSenbei { margin-bottom: 40px; }

/* list item box
--------------------------------------------------------------*/
#main .secCat .boxListItem { margin: 0 0 30px 28px; width: 200px; float: left; text-align: center; }
#main .secCat .boxListItem .photo { margin-bottom: 5px; }
#main .secCat .boxListItem h1 { font-size: 15px; font-weight: bold; }
#main .secCat .boxListItem h1 a { color: #0066cc; }
#main .secCat .boxListItem .price { margin-bottom: 5px; font-size: 14px; color: #cc0000; }
#main .secCat .boxListItem .price spapn { font-weight: bold; }

/*--------------------------------------------------------------
	detail
--------------------------------------------------------------*/

/* header
--------------------------------------------------------------*/
#main #secItemDetail header h1 { margin-bottom: 20px; height: 30px; background-color: #cc3399; }
#main #secItemDetail header h1 img { padding: 5px 0 0 25px; }
#main #secItemDetail header h2 { margin-left: 30px; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", serif; font-size: 36px; font-weight: bold; color: #663300; }
#main #secItemDetail header p { margin: 0 0 20px 30px; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", serif; font-size: 12px; }

/* photo
--------------------------------------------------------------*/
#main #secItemDetail #imgMain { margin: 0 0 30px 30px; float: left; }
#main #secItemDetail #imgSub1 { margin: 0 0 30px 40px; float: left; }

/* colum left
--------------------------------------------------------------*/
#main #secItemDetail .colL { margin: 0 0 0 30px; width: 500px; float: left; }
.ie6 #main #secItemDetail .colL,
.ie7 #main #secItemDetail .colL { padding-top: 30px; }
#main #secItemDetail .colL .outline { margin-bottom: 2em; font-size: 14px; }
#main #secItemDetail .colL .contents { margin-bottom: 2em; font-size: 14px; color: #663300; }
#main #secItemDetail .colL .detail { margin-bottom: 50px; font-size: 12px; }

/* colum right
--------------------------------------------------------------*/
#main #secItemDetail .colR { margin: 0 0 0 40px; width: 330px; float: left; }
.ie6 #main #secItemDetail .colR,
.ie7 #main #secItemDetail .colR { padding-top: 30px; }
#main #secItemDetail .colR .photo { margin: 0 0 10px 10px; float: right; }
#main #secItemDetail .colR .title { margin-bottom: 5px; font-size: 20px; font-weight: bold; color: #0066cc; }
#main #secItemDetail .colR .price { margin-bottom: 5px; font-size: 16px; color: #cc0000; }
#main #secItemDetail .colR .price span { font-weight: bold; }
#main #secItemDetail .colR .size,
#main #secItemDetail .colR .id,
#main #secItemDetail .colR .number,
#main #secItemDetail .colR .btnOrder { line-height: 1.8; }
#main #secItemDetail .colR .btnOrder { margin-bottom: 20px; padding-top: 10px; }
#main #secItemDetail .colR .navOrder { margin-bottom: 50px; }
#main #secItemDetail .colR .navOrder ul li { margin-right: 2em; float: left; }
#main #secItemDetail .colR .navOrder ul li a { padding-left: 1em; background: url(../img/common/icn_arrow_s.gif) no-repeat left center; font-size: 12px;  }

/* recommended
--------------------------------------------------------------*/
#main #secRecommended { margin-bottom: 40px; }
#main #secRecommended header h1 { margin-bottom: 20px; border-bottom: 1px solid #ccc; }
#main #secRecommended header h1 img { margin: 0 0 10px 10px; }
#main #secRecommended .boxListItem { margin: 0 0 20px 28px; width: 200px; float: left; text-align: center; }
#main #secRecommended .boxListItem .photo { margin-bottom: 5px; }
#main #secRecommended .boxListItem h1 { font-size: 15px; font-weight: bold; }
#main #secRecommended .boxListItem h1 a { color: #0066cc; }
#main #secRecommended .boxListItem .price { margin-bottom: 5px; font-size: 14px; color: #cc0000; }
#main #secRecommended .boxListItem .price spapn { font-weight: bold; }

/*--------------------------------------------------------------
    SNS Official-like Style
--------------------------------------------------------------*/

#main #secItemDetail .sns-area{
    margin-top:20px;
}

/* 共通（サイズ完全固定） */
#main #secItemDetail .sns-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:120px;              /* 横幅固定 */
    height:30px;              /* 高さ固定 */
    margin-right:8px;
    font-size:12px;
    font-weight:bold;
    text-decoration:none;
    border-radius:3px;
    box-sizing:border-box;
    transition:opacity 0.2s ease;
}

/* hover */
#main #secItemDetail .sns-btn:hover{
    opacity:0.9;
}

/* アイコン共通 */
#main #secItemDetail .sns-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-right:6px;
}

/* SVGは文字色を継承 */
#main #secItemDetail .sns-icon svg{
    display:block;
}

/* Facebook */
#main #secItemDetail .fb-btn{
    background:linear-gradient(to bottom, #1877f2 0%, #166fe5 100%);
    color:#fff;
    border:1px solid #166fe5;
}

/* X */
#main #secItemDetail .x-btn{
    background:#000;
    color:#fff;
    border:1px solid #000;
}

/* テキスト縦ズレ防止 */
#main #secItemDetail .sns-btn span{
    line-height:1;
}