@charset "shift_jis";

/*
============================ Base CSS ==============================

0.New Clear Fix
1.common style
2.Layout
3.info style
4.possible style
5.application style

====================================================================
*/


/* 0. New Clear Fix
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ �� */
.cf:before,.cf:after { content:""; display:table; }
.cf:after{ clear:both; }
.cf{ zoom:1; }/* For IE 6/7 (trigger hasLayout) */


/* 1.common style
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ �� */
.head_box{ padding:0px 5px; border-top:2px solid #ffad00; background-color:#2d1b07; }
.head_box h1{ float:left; margin:0px; padding:0px; line-height:1.5; }

#swingscroll { float:right; background:url(/fruit/img/pagetop.gif) top right no-repeat;padding-right:15px; }
.foot_box { margin-top:10px; }
.foot_box p{ padding:10px 0px; text-align:center; background:url(/fruit/img/bg_foot.gif) repeat-x; }

.pankuz {margin-left:10px;margin-top:10px;text-align:left;}
#contents img { vertical-align:top; }
#tooltip { width:200px; position:absolute; margin-top:20px; padding:5px; font-size:10px; line-height:1.5; border:2px solid #3d7fc4; background:#fff; }

/*--- font ---*/
.txt10 { font-size:10px; }
.fbold { font-weight:bold; }
.txtred { color:#e80000; }

/*--- link ---*/
#contents a:link, #contents a:visited, #contents a:active { color:#006bb6; text-decoration:none; }
#contents a:hover {text-decoration:underline; }

#possibleMain #pointArea a:hover img,
#possibleMain #pointStorageArea a:hover img,
#applicationMain #pointArea a:hover img,
#applicationMain #friendArea .storage dd a:hover img { opacity:0.6; filter: alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }
#applicationMain #friendArea .storage dd a:hover { background:#fff; display:block; }

/*--- navi ---*/
/*--- navi ---*/
#navi { margin-top: 10px; height: 40px;display: flex;align-items: center;}
#navi li { display: inline;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    margin: 0px 5px 0 0;
    line-height: 40px;
    height: 40px;
    width: 270px;
    border: 2px solid #333;
    border-bottom: none;
    border-radius: 5px 5px 0px 0px;
    box-sizing: border-box;}

#contents #navi li a:link, #contents #navi li a:visited, #contents #navi li a:active{
    color:#333;
    text-decoration: none;
}
#contents #navi li.activeTab a:link, #contents #navi li.activeTab a:visited, #contents #navi li.activeTab a:active{
    color:#fff;
    text-decoration: none;
}
#contents #navi li.activeTab{
    border: 2px solid #a6cce3;
    border-bottom: none;
    background:#a6cce3;
}
.pointData a::before{
    font-family: "Font Awesome 5 Free";  
    content: "\f51e";
    font-weight: 900;
    margin-right: 5px;
}
.historyData a::before{
    font-family: "Font Awesome 5 Free";
    content: "\f2f1";
    font-weight: 900;
    margin-right: 5px;
}
.introData a::before{
    font-family: "Font Awesome 5 Free";
    content: "\f234";
    font-weight: 900;
    margin-right: 5px;
}
/*--- select input ---*/
#list .years { float:left; margin-bottom:20px; _margin-bottom:0px; }
#list select { font-size:16px; height:26px; margin-right:1px; font-family:Verdana;}
#list input { font-size:14px; padding:4px; width:80px; }

/*--- pageguide ---*/
#contents .pageGuide { float:left; width:670px; }

/*---paging_navi---*/
#contents .paging { float:left; width:485px; }
#contents dl.paging_navi { clear:both; text-align:center; overflow:hidden; margin:20px auto; position:relative; left:20px; } /* ���� */
#contents div.pageGuide dl.paging_navi { text-align:center; overflow:hidden; margin:0px; position:relative; left:0px; } /* �㕔 */
#contents dl.paging_navi dt, #contents dl.paging_navi dd { display:inline; padding-left:5px; line-height:28px; }
#contents dl.paging_navi i { border:1px solid #e5d682; padding:5px 5px; background-color:#5b99d6; font-weight:bold; color:#ffffff; font-style:normal; }
#contents dl.paging_navi dd a { border:1px solid #bcbcbc; padding:5px 5px; background-color:#eaeaea; }

/*--- number ---*/
.number { float:right; text-align:right; color:#666; position:relative; top:8px; }

/*--- infoBtn ---*/
.infoBtn { float:right; margin:10px auto; width:720px; }
.infoBtn li { float:left; width:360px; text-align:right; }
.infoBtn a:hover img { opacity:0.6; filter: alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }

/*--- table ---*/
#contents table { border:1px solid #b5b5b5; border-collapse:collapse; border-spacing:0; }
#contents table td { padding:7px; border-right:1px solid #b5b5b5; border-bottom:1px solid #b5b5b5; color:#333; font-size:12px; }
#contents tr.title { border-top:2px solid #999; border-bottom:2px solid #999; font-weight:bold; color:#666; }
#contents tr.title td { background-color:#ddd; color:#5a5a5a; padding:9px 1px; text-align:center; }
#contents td.item01 { width:80px; text-align:right; }
#contents tr.title td.item01 { width:80px; text-align:center; }
#contents td.item02 { width:121px; }
#contents td.item03 { width:186px; }
#contents td.item04 { width:483px; }
#contents td.item05 { width:66px; text-align:right; }
#contents tr.title td.item05 { width:76px; text-align:center; }
#contents td.item06 { width:90px; }
#contents td.item07 { width:90px; text-align:right; }
#contents tr.title td.item07 { width:90px; text-align:center; }
/* point */
#contents td.item05 span { color:#F00; }

/* ���F/���Z�҂� */
#contents tr.recognition td { background-color:#f9f4d6; color:#965604; }
/* �����ς� */
#contents tr.change td { background-color:#ffebeb; color:#d73349; }
/* ���蒆 */
#contents tr.judgment td { background-color:#e0f4ff; color:#2477a8; }
/* ���� */
#contents tr.expiration td { background-color:#e7e7e7; color:#5b6366; }
#contents .tooltips, #contents .tooltips2 { position:relative; top:2px; _top:0px; left:2px; cursor:pointer; }

/*--- attention ---*/
.attention { font-size:12px; line-height:180%; color:#333; float:left; width:580px; }

/*--- otherArea ---*/
#otherArea { width:910px; margin:20px 0px 20px 10px; }
#otherArea h4 { background:url(/fruit/img/pointhistory/common/bg.gif?20130425) 0px -38px no-repeat; color:#333; padding:5px; height:19px; }
#otherArea .body { border-left:1px solid #bababa; border-right:1px solid #bababa; border-bottom:1px solid #bababa; background-color:#fff; padding:10px; }
#otherArea li { display:inline; margin-right:20px; }
#otherArea li a { background:url(/fruit/img/pointhistory/common/bg.gif) -964px -91px no-repeat; padding-left:20px; vertical-align:top; }

/*--- adnet ---*/
.pointhistoryAdNet300 { float:right; border:1px solid #ccc; border-radius:6px; float:right; padding:10px; }
.pointhistoryAdNet { text-align:center; margin:15px 0px 10px 0px; }




/* 2.Layout
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ �� */
#contents { width:950px; margin:0px auto; font-family:verdana; text-align:left; }
#main { background-color:#f5f5f5; padding:5px; }
#list { padding:20px 5px 0px 5px; }

/* 3.info style
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ �� */


/* 4.possible style
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ �� */
#possibleMain { border:5px solid #f4c0a9; padding:5px; }
#possibleMain h3 { margin:5px 0px; }

/*--- pointArea ---*/
#possibleMain #pointArea { width:368px; float:left; }
#possibleMain #pointArea h4 { background:url(/fruit/img/pointhistory/possible/bg.gif) 0px 5px no-repeat; color:#fff; height:40px; font-size:14px; }
#possibleMain #pointArea h4 i { font-style:normal; position:relative; top:13px; _top:15px; left:35px; }
#possibleMain #pointArea .body { border-left:1px solid #bababa; border-right:1px solid #bababa; border-bottom:1px solid #bababa; background-color:#fff; padding:10px 10px 5px 10px; }
/* IE8,7 huck */ #possibleMain #pointArea .body { /* IE8 */ padding:10px 10px 4px 10px\9; /* IE7 */ *padding:10px 10px 9px 10px; }
#possibleMain #pointArea li { display:inline; font-size:14px; color:#333; font-weight:bold; margin: 0px 10px; }
#possibleMain #pointArea li.txtB { color:#e80000; line-height:30px; }
#possibleMain #pointArea li.txtB i { font-size:36px; font-style:normal; line-height:45px; }
#possibleMain #pointArea .limit { background-color:#fffdc5; padding:10px; margin:5px 0px; }
#possibleMain #pointArea .limit .limit_title { float:left; color:#333; font-size:14px; width:100px; text-align:right; position:relative; top:2px; font-weight:bold; }
#possibleMain #pointArea .limit dl { float:left; width:226px; }
#possibleMain #pointArea dt, #possibleMain #pointArea dd { float:left; margin:3px 0px; }
#possibleMain #pointArea dt { width:100px; text-align:right; margin-right:10px; }
#possibleMain #pointArea dd { width:100px; font-weight:bold; color:#e80000; font-size:14px;}
#possibleMain #pointArea .fbold { color:#333; font-size:14px; }
#possibleMain #pointArea .btn { text-align:center; overflow:hidden; }
#possibleMain #pointArea .btn li { float:left; margin:4px; padding:0px; }
#possibleMain #pointArea .btn img { margin-bottom:2px; }
#possibleMain #pointArea .btn .txt10 { color:#333; display:block; font-weight:normal; }

/*--- pointStorageArea ---*/
#possibleMain #pointStorageArea { width:548px; float:right; }
#possibleMain #pointStorageArea h4 { background:url(/fruit/img/pointhistory/possible/bg.gif) 0px -40px no-repeat; color:#fff; height:42px; font-size:14px; }
#possibleMain #pointStorageArea h4 i { font-style:normal; position:relative; top:13px; _top:15px; left:65px; }
#possibleMain #pointStorageArea .body { border-left:1px solid #bababa; border-right:1px solid #bababa; border-bottom:1px solid #bababa; background-color:#fff; padding:22px 5px; }
#possibleMain #pointStorageArea li { float:left; width:174px; text-align:center; padding:6px 0px; font-size:12px; }

/*--- list ---*/
#possibleMain #list h3 { font-size:16px; font-weight:bold; color:#333; background:url(/fruit/img/pointhistory/possible/bg.gif) -596px -187px no-repeat; padding:0px 0px 5px 10px; margin-bottom:10px; border-bottom:1px dotted #b1b1b1; }
#possibleMain #list li { display:inline; }


/* 5.application style
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ �� */
#applicationMain { border:5px solid #a6cce3; padding:5px; }
#applicationMain h3 { margin:5px 0px; }

/*--- pointArea ---*/
#applicationMain #pointArea { width:368px; float:left; }
#applicationMain #pointArea h4 { background:url(/fruit/img/pointhistory/application/bg.gif?20180228) 0px 0px no-repeat; color:#fff; height:36px; font-size:14px; }
#applicationMain #pointArea h4 i { font-style:normal; position:relative; top:8px; _top:10px; left:35px; }
#applicationMain #pointArea .body { border-left:1px solid #bababa; border-right:1px solid #bababa; border-bottom:1px solid #bababa; background-color:#fff; padding:10px 10px 5px 10px; }
/* IE8,7 huck */ #applicationMain #pointArea .body { /* IE8 */ padding:10px 10px 4px 10px\9; /* IE7 */ *padding:10px 10px 9px 10px; }
#applicationMain #pointArea li { display:inline; font-size:14px; color:#333; font-weight:bold; margin: 0px 10px; }
#applicationMain #pointArea li.txtB { color:#e80000; line-height:30px; }
#applicationMain #pointArea li.txtB i { font-size:36px; font-style:normal; line-height:45px; }
#applicationMain #pointArea .limit { background-color:#fffdc5; padding:10px; margin:5px 0px; }
#applicationMain #pointArea .limit .limit_title { float:left; color:#333; font-size:14px; width:100px; text-align:right; position:relative; top:2px; font-weight:bold; }
#applicationMain #pointArea .limit dl { float:left; width:226px; }
#applicationMain #pointArea dt, #applicationMain #pointArea dd { float:left; margin:3px 0px; }
#applicationMain #pointArea dt { width:100px; text-align:right; margin-right:10px; }
#applicationMain #pointArea dd { width:100px; font-weight:bold; color:#e80000; font-size:14px;}
#applicationMain #pointArea .fbold { color:#333; font-size:14px; }
#applicationMain #pointArea .btn { text-align:center; }
#applicationMain #pointArea .btn img { margin-bottom:2px; }
#applicationMain #pointArea .btn .txt10 { color:#333; }

/*--- friendArea ---*/
#applicationMain #friendArea { width:548px; float:right; }
#applicationMain #friendArea h4 { background:url(/fruit/img/pointhistory/application/bg.gif) 0px -40px no-repeat; color:#fff; height:36px; font-size:14px; }
#applicationMain #friendArea h4 i { font-style:normal; position:relative; top:8px; _top:10px; left:60px; }
#applicationMain #friendArea .body { border-left:1px solid #bababa; border-right:1px solid #bababa; border-bottom:1px solid #bababa; background-color:#fff; padding:10px; }
#applicationMain #friendArea ul { background-color:#e6f0f2; padding:8px 0px 8px 15px; height:33px; }
#applicationMain #friendArea li { display:inline; font-size:14px; color:#333; font-weight:bold; margin: 0px 10px; }
#applicationMain #friendArea li.txtB { color:#e80000; line-height:30px; }
#applicationMain #friendArea li.txtB i { font-size:36px; font-style:normal; }
#applicationMain #friendArea li.month { color:#e80000; }

/*--- storage ---*/
#applicationMain #friendArea .storage { margin-top:12px; background:url(/fruit/img/pointhistory/application/friend_bg.gif) no-repeat; }
#applicationMain #friendArea .storage dt { position:relative; top:13px; left:100px; width:424px; height:87px;}
#applicationMain #friendArea .storage dd { display:inline; padding:0px; margin:0px; }

/*--- list ---*/
#applicationMain #list h3 { font-size:16px; font-weight:bold; color:#333; background:url(/fruit/img/pointhistory/application/bg.gif) -596px -187px no-repeat; padding:0px 0px 5px 10px; margin-bottom:10px; border-bottom:1px dotted #b1b1b1; }
#applicationMain #list li { display:inline; }


/* 6.other style
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ �� */
#pointOtherMain { padding:5px 5px 15px 5px; }
#pointOtherMain h3 { font-size:16px; font-weight:bold; color:#333; background:url(/fruit/img/pointhistory/common/bg.gif) 0px -86px no-repeat; padding:0px 0px 5px 10px; border-bottom:1px dotted #b1b1b1; margin:20px 0px 10px 0px; }
#pointOtherMain h3.title { background:none; margin:5px 0px; padding:0px; }

#pointOtherMain ul { padding:10px; margin:15px 0px; font-size:12px; font-weight:bold; background-color:#feffd3; }
#pointOtherMain li { display:inline; margin-right:10px; text-align:center; }

/* table */
#pointOtherMain table { margin:0px auto; }
#pointOtherMain td.item01 { width:180px; text-align:left; }
#pointOtherMain tr.title { text-align:center; }
#pointOtherMain td.item02 { width:245px; }
#pointOtherMain td.item03 { width:245px; }




/* 7.extension style
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ �� */
#extension_bnr { display:none; }
#boxExtension { overflow:hidden; margin-bottom:25px; height: }
#boxExtension .arrow { background:url(/fruit/img/pointhistory/extension/icon_arrow.gif) no-repeat 0 4px; padding-left:12px; }
#boxExtension .marTop13 { margin-top:13px; line-height:1.5; }
#boxExtension .marTop6 { margin-top:6px; line-height:1.6; }
#boxExtension .red { color:#d10000; }
#boxExtension .redold { color:#d10000; font-weight:bold; }
#boxExtension .redBoldBig { color:#d10000; font-size:14px; font-weight:bold; }
#boxExtension .bold { font-weight:bold; font-size:14px; padding:10px 0 0 6px; line-height:1.5; /letter-spacing:-1px;/*IE7*/ letter-spacing:-1px\9;/*IE8*/ }
#boxExtension .blue { color:#015fa9; font-weight:bold; margin-top:6px; line-height:1.6; }

/*--- Left ---*/
#boxExtension .boxLeft { float:left; margin-right:8px; width:471px; }
#boxExtension .boxLeft .inner { height:180px; border:4px #fed835 solid; border-top:none; padding:14px 10px; /*height:260px; �L�����y�[���J�n�O�p�X�^�C��*/ }
#boxExtension .boxLeft .inBox01 { text-align:center; margin-top:22px; background:url(/fruit/img/pointhistory/extension/img_startbefor.gif) no-repeat 30px 0; }
#boxExtension .boxLeft .inBox02 { text-align:center; margin-top:20px; background:url(/fruit/img/pointhistory/extension/img_no_point.gif) no-repeat 0 15px; }
#boxExtension .boxLeft .inBox02 .bgYellow { background:#feffc5; width:270px; height:52px; margin:0 auto; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; } 
#boxExtension .boxLeft .inBox03 { text-align:center; margin-top:18px; background:url(/fruit/img/pointhistory/extension/img_start.gif) no-repeat 67px 0; }
#boxExtension .boxLeft .inBox03 input:hover { opacity:0.7; filter:alpha(opacity=70); -ms-filter:"alpha( opacity=70 )"; }
#boxExtension .boxLeft .inBox04 { text-align:center; margin-top:20px; background:url(/fruit/img/pointhistory/extension/img_completion.gif) no-repeat 106px -4px; }
#boxExtension .boxLeft .inBox04 .bgYellow { background:#feffc5; width:125px; height:34px; margin:0 auto; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; font-size:16px; } 
#boxExtension .boxLeft .inBox05 { text-align:center; margin:30px auto 0 auto; background:#d1d1d1; font-weight:bold; font-size:16px; padding-top:25px; moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px; width:350px; height:40px; }

/*--- Right ---*/
#boxExtension .boxRight { float:left; width:471px; }
#boxExtension .boxRight .inner { height:180px; border:4px #80CEFF solid; border-top:none; padding:14px 10px; height:180px; background:url(/fruit/img/pointhistory/extension/img_sorry.gif) no-repeat 330px 120px; }

/*--- Slot_box ---*/
.slot_box { position:relative; width:950px; height:337px; background:url(/fruit/img/pointhistory/extension/slot_back.gif); overflow:hidden; margin:10px 0; }
.slot_box .slot { margin:0 auto; width:468px; height:60px; overflow:hidden; position:relative; top:122px; }
.slot_box .txt { position:relative; top:136px; left:360px; visibility:hidden; }
.slot_box .btn { position:relative; top:153px; left:267px; background:url(/fruit/img/pointhistory/extension/slot_btn_pink.png) no-repeat; }
.slot_box .btn a { display:inline-block; }
.slot_box .btn a:hover { cursor:pointer; background-color:transparent; }
.slot_box .btn a:hover img { visibility:hidden; }