@charset "Shift_JIS";

/*
////////// guide.css //////////

	1 : orgn layout
	2 : guide
*/



/* 1 : orgn layout
------------------------------------------------------------*/
div#content{
margin: 0 0 15px 0 ;
background:#ffffff;}

div#mainColumn{
padding: 7px 0px 0px 0;
width:950px;}



/* 2 : genre
------------------------------------------------------------*/

ul#socialGraph{
text-align:right;
margin:10px 0;}

ul#socialGraph li{
margin:0 0 0 10px;
display:inline;}


div#ammTtl{
width:690px;}


div#tieupContent{
width:950px;
margin: 0 0 0 0px;}

div#tieupContent *{
font-family:'MS UI Gothic';}

div#tieupContent a{
text-decoration:underline;}

/*------------------------------------------------------------*/


/* 共通で使おうにゃ */

div#ttlSpecialMain{
padding:15px 20px 4px 20px;}

div#ttlSpecialMain.threeCon{
padding-right:0px;}

div.unitTtl{
padding:0 0 0 0;
width:910px;}

div.unitTtl h2.ttlName{
width:910px;
height:47px;
float:left;}

div.unitTtl h2.ttlName span{
padding:15px 0 0 15px;
display:block;
font-size:16px;
font-weight:bold;
color:#fff;}

/* ２倍マイル */
div#ttlSpecialMain.doubleMile div.unitTtl h2.ttlName{
padding:1px 0 0 0;
background:url(../image/90_40_2b.gif) right no-repeat;}

/* ３倍マイル */
div#ttlSpecialMain.tripleMile div.unitTtl h2.ttlName{
padding:1px 0 0 0;
background:url(../image/90_40_3b.gif) right no-repeat;}

/* 4倍マイル */
div#ttlSpecialMain.quadrupleMile div.unitTtl h2.ttlName{
padding:1px 0 0 0;
background:url(../image/90_40_4b.gif) right no-repeat;}

/* 5倍マイル */
div#ttlSpecialMain.quintupleMile div.unitTtl h2.ttlName{
padding:1px 0 0 0;
background:url(../image/90_40_5b.gif) right no-repeat;}

div.txtFree{
width:atuo;
height:auto;
margin:15px 0 0 0;
padding:5px 5px 5px 10px;
background-color:#fff;
color:#000;}

/*------------------------------------------------------------*/


/* 特集ヘッダ */

div#spHeaderSec{
margin:0 0 16px 0;}

div#spHeaderSec div.headImg{
padding:0 10px 0 0;
float:left;
width:670px;}

div#spHeaderSec div.shopInfo{
float:left;
width:230px;}

div#spHeaderSec div.shopInfo ul{
padding:0 0 10px 0;
float:left;
width:230px;}

div#spHeaderSec div.shopInfo li.logo{
padding:0 5px 0 0;
float:left;
width:85px;}

div#spHeaderSec div.shopInfo li.shopName{
float:left;
width:135px;}

div#spHeaderSec div.shopInfo p.attention{
width:230px;
text-align:center;}

div#spHeaderSec div.shopInfo dl.mileInfo{
margin:10px 0 0 0;
height:70px;
background:#fff;
border:solid 1px #ffcd5a;
width:230px;
text-align:center;}

div#spHeaderSec div.shopInfo dl.mileInfo dt{
padding:3px 0;
background:#ffcd5a;
text-align:center;}

div#spHeaderSec div.shopInfo dl.mileInfo dd{
margin:10px 0 0 0;
font-size:14px;
background:#fff;
color:#000;
text-align:center;}

div#spHeaderSec div.shopInfo dl.mileInfo dd strong{
font-weight:bold;
font-family:Verdana;
font-size:22px;
color:#000;}

div#spHeaderSec div#ttlSpecialMain.doubleMile div.shopInfo dl.mileInfo dd strong,
div#spHeaderSec div#ttlSpecialMain.tripleMile div.shopInfo dl.mileInfo dd strong{
color:#f00;}

div#spHeaderSec div#ttlSpecialMain.doubleMile div.shopInfo dl.mileInfo dd span,
div#spHeaderSec div#ttlSpecialMain.tripleMile div.shopInfo dl.mileInfo dd span{
color:#f00;}

div#spHeaderSec div.shopInfo p.partnersite a{
background:url(../image/btnPartnersite.jpg) no-repeat;
margin:15px 0 8px 13px;
display:block;
width:209px;
height:48px;
text-indent:-9999px;}

div#spHeaderSec div.shopInfo p.partnersite a:hover{
background-position:bottom;}

div#spHeaderSec div.areaPeriod{
margin:10 0 5px 0px;
width:910px;
height:37px;}

div#spHeaderSec div.areaPeriod h2.ttlPeriod{
padding:12px 0 0 10px;
width:auto;
float:left;
font-size:14px;
font-weight:bold;
color:#535353;}

div#spHeaderSec div#ttlSpecialMain div.txtFree{
width:auto;
height:auto;
margin:10px 0 0 0;
padding:3px 3px 3px 10px;
background-color:#fff;
color:#535353;}


/*------------------------------------------------------------*/


/* セカンドセクション */

div#spSecondSec{
margin:0 0 16px 0;}



/*------------------------------------------------------------*/

/* いちおしキャンペーン */

div#spThirdSec{
margin:0 0 16px 0;}

div#spThirdSec div#ttlSpecialMain dl.mainBnr{
margin:10px 0 0 0;}

div#spThirdSec div#ttlSpecialMain dl.mainBnr dd{
margin:5px 0 0 0;}

div#spThirdSec div#ttlSpecialMain dl.subBnrFirst{
width:440px;
float:left;
display:inline;
margin:15px 10px 0 0;}

div#spThirdSec div#ttlSpecialMain dl.subBnrFirst dd{
margin:5px 0 5px 0;}

div#spThirdSec div#ttlSpecialMain dl.subBnrSecond{
width:440px;
float:right;
display:inline;
margin:15px 0 0 0;}

div#spThirdSec div#ttlSpecialMain dl.subBnrSecond dd{
margin:5px 0 5px 0;}

/*------------------------------------------------------------*/

/* おすすめアイテム */

div#spFourthSec{
margin:0 0 16px 0;}

div.specialSection{
margin:20px 20px 0 0;
float:left;
width:290px;
background-color:#fff;}

div#ttlSpecialMain > div.specialSection{
width:288px;}

div.specialSection p.itemName{
width:260px;
height:50px;
font-weight:bold;
padding:5px 10px 0 10px;}

div#tieupContent div.specialSection p.imgItemBnr{
text-align:center;}

div#tieupContent div.specialSection p.commentAr{
width:260px;
height:80px;
padding:5px 10px 0 10px;
color:#000;}

div#tieupContent div.specialSection p.pointAr{
height:36;
margin:5px 10px 0 10px;
padding-top:3px;}


/* 金額マイル数表示 */

div#tieupContent div#ttlSpecialMain p.pointAr{
letter-spacing:0.05em;
font-size:15px;
color:#000;}

div#tieupContent div#ttlSpecialMain span.zeikomi{
font-size:11px;
color:#000;}


/* 通常マイル */
div#tieupContent div#ttlSpecialMain p.pointAr strong{
padding:0px;
font-weight:bold;
font-family:Verdana;
font-size:22px;
color:#000;}

div#tieupContent div#ttlSpecialMain p.pointAr span.mile{
font-size:12px;
color:#000;}


/* ２倍３倍マイル */
div#tieupContent div#ttlSpecialMain.doubleMile p.pointAr strong,
div#tieupContent div#ttlSpecialMain.tripleMile p.pointAr strong,
div#tieupContent div#ttlSpecialMain.quadrupleMile p.pointAr strong,
div#tieupContent div#ttlSpecialMain.quintupleMile p.pointAr strong{
color:#f00;
}

div#tieupContent div#ttlSpecialMain.doubleMile p.pointAr span.mile,
div#tieupContent div#ttlSpecialMain.tripleMile p.pointAr span.mile,
div#tieupContent div#ttlSpecialMain.quadrupleMile p.pointAr span.mile,
div#tieupContent div#ttlSpecialMain.quintupleMile p.pointAr span.mile{
color:#f00;}


div#tieupContent p.otherLink a{
margin:5px 0 8px 25px;
display:block;
width:242px;
height:50px;
text-indent:-9999px;}

div#tieupContent p.otherLink a:hover{
background-position:bottom;}

div.txtFreeArea{
padding:5px 5px 5px 10px;
margin:10px 20px 10px 20px;
height:auto;
color:#000;
background-color:#fff;}

/*------------------------------------------------------------*/

/* おすすめ情報 */

div#spFifthSec{
margin:0 0 16px 0;}

div#spFifthSec div.mmText{
margin:10px 0 0 0;}

div#spFifthSec div.mmText li{
margin:5px 0;
background:url(../image/icon_arrow.gif) no-repeat 0 2px;
padding:0 0 0 16px;}

/*------------------------------------------------------------*/

/* 共通 */

#sectionInfo {
	color:#000;
	line-height:1.5;
	font-size:12px;}
#sectionInfo h2 {
	font-weight:bold;}

#sectionInfo .pgtp {
	text-align:right;}



/* clearFix */
.clearFix:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }
.clearFix { display: inline-table; min-height: 1%; }
/* Hide from mac IE5 \*/
* html .clearFix { height: 1%; }
.clearFix { display:block; }
/* End Hide from mac IE5 */



/* blue--------------------------------------------------------*/

div#tieupContent.blue div.sectionBoxTop{
background:url(../image/imgCaptionTop_blue.jpg) no-repeat;
padding-top:4px;}

div#tieupContent.blue div.sectionBoxBtm{
background:url(../image/imgCaptionBtm_blue.jpg) no-repeat;
background-position:bottom left;
padding-bottom:11px;}

div#tieupContent.blue div.sectionBoxCon{
background:url(../image/imgCaptionCon_blue.jpg) repeat-y;
padding-bottom:1px;}

div#tieupContent.blue div#spHeaderSec div.areaPeriod{
background:url(../image/bgDot_Wblue.jpg) repeat-x;
margin-top: 10px;
}

div#tieupContent.blue div.unitTtl{
background:url(../image/bgTitle_blue.jpg) repeat-x;}

div#tieupContent.blue div#spFourthSec p.pointAr{
background:url(../image/bgDot_blue.jpg) repeat-x;}

div#tieupContent.blue p.otherLink a{
background:url(../image/btnDetails_blue.jpg) no-repeat;}

div#tieupContent.blue p.otherLink a:hover{
background-position:bottom;}

div#tieupContent.blue div.specialSection{
border:solid 1px #5776e9;}


/* pink--------------------------------------------------------*/

div#tieupContent.pink div.sectionBoxTop{
background:url(../image/imgCaptionTop_pink.jpg) no-repeat;
padding-top:4px;}

div#tieupContent.pink div.sectionBoxBtm{
background:url(../image/imgCaptionBtm_pink.jpg) no-repeat;
background-position:bottom left;
padding-bottom:11px;}

div#tieupContent.pink div.sectionBoxCon{
background:url(../image/imgCaptionCon_pink.jpg) repeat-y;
padding-bottom:1px;}

div#tieupContent.pink div#spHeaderSec div.areaPeriod{
background:url(../image/bgDot_Wpink.jpg) repeat-x;}

div#tieupContent.pink div.unitTtl{
background:url(../image/bgTitle_pink.jpg) repeat-x;}

div#tieupContent.pink div#spFourthSec p.pointAr{
background:url(../image/bgDot_pink.jpg) repeat-x;}

div#tieupContent.pink p.otherLink a{
background:url(../image/btnDetails_pink.jpg) no-repeat;}

div#tieupContent.pink p.otherLink a:hover{
background-position:bottom;}

div#tieupContent.pink div.specialSection{
border:solid 1px #eb6f7a;}


/* gray--------------------------------------------------------*/

div#tieupContent.gray div.sectionBoxTop{
background:url(../image/imgCaptionTop_gray.jpg) no-repeat;
padding-top:4px;}

div#tieupContent.gray div.sectionBoxBtm{
background:url(../image/imgCaptionBtm_gray.jpg) no-repeat;
background-position:bottom left;
padding-bottom:11px;}

div#tieupContent.gray div.sectionBoxCon{
background:url(../image/imgCaptionCon_gray.jpg) repeat-y;
padding-bottom:1px;}

div#tieupContent.gray div#spHeaderSec div.areaPeriod{
background:url(../image/bgDot_Wgray.jpg) repeat-x;}

div#tieupContent.gray div.unitTtl{
background:url(../image/bgTitle_gray.jpg) repeat-x;}

div#tieupContent.gray div#spFourthSec p.pointAr{
background:url(../image/bgDot_gray.jpg) repeat-x;}

div#tieupContent.gray p.otherLink a{
background:url(../image/btnDetails_gray.jpg) no-repeat;}

div#tieupContent.gray p.otherLink a:hover{
background-position:bottom;}

div#tieupContent.gray div.specialSection{
border:solid 1px #999596;}


/* orange--------------------------------------------------------*/

div#tieupContent.orange div.sectionBoxTop{
background:url(../image/imgCaptionTop_orange.jpg) no-repeat;
padding-top:4px;}

div#tieupContent.orange div.sectionBoxBtm{
background:url(../image/imgCaptionBtm_orange.jpg) no-repeat;
background-position:bottom left;
padding-bottom:11px;}

div#tieupContent.orange div.sectionBoxCon{
background:url(../image/imgCaptionCon_orange.jpg) repeat-y;
padding-bottom:1px;}

div#tieupContent.orange div#spHeaderSec div.areaPeriod{
background:url(../image/bgDot_Worange.jpg) repeat-x;}

div#tieupContent.orange div.unitTtl{
background:url(../image/bgTitle_orange.jpg) repeat-x;}

div#tieupContent.orange div#spFourthSec p.pointAr{
background:url(../image/bgDot_orange.jpg) repeat-x;}

div#tieupContent.orange p.otherLink a{
background:url(../image/btnDetails_orange.jpg) no-repeat;}

div#tieupContent.orange p.otherLink a:hover{
background-position:bottom;}

div#tieupContent.orange div.specialSection{
border:solid 1px #fb8851;}


/* black--------------------------------------------------------*/

div#tieupContent.black div.sectionBoxTop{
background:url(../image/imgCaptionTop_black.jpg) no-repeat;
padding-top:4px;}

div#tieupContent.black div.sectionBoxBtm{
background:url(../image/imgCaptionBtm_black.jpg) no-repeat;
background-position:bottom left;
padding-bottom:11px;}

div#tieupContent.black div.sectionBoxCon{
background:url(../image/imgCaptionCon_black.jpg) repeat-y;
padding-bottom:1px;}

div#tieupContent.black div#spHeaderSec div.areaPeriod{
background:url(../image/bgDot_Wblack.jpg) repeat-x;}

div#tieupContent.black div.unitTtl{
background:url(../image/bgTitle_black.jpg) repeat-x;}

div#tieupContent.black div#spFourthSec p.pointAr{
background:url(../image/bgDot_black.jpg) repeat-x;}

div#tieupContent.black p.otherLink a{
background:url(../image/btnDetails_black.jpg) no-repeat;}

div#tieupContent.black p.otherLink a:hover{
background-position:bottom;}

div#tieupContent.black div.specialSection{
border:solid 1px #b4b2b3;}