@charset "UTF-8";


/* ------ ランキング02　------ */
.rank02-pt {padding-bottom: 15px; letter-spacing: -.4em;}
.rank02 {position: relative; display: inline-block; vertical-align: top; width: 31.33%; margin:0 1% ;padding: 0; border-width : 2px; border-style: solid; border-color: ; 
  -moz-border-radius: 5px;  -webkit-border-radius: 5px; border-radius: 5px; background-color: #FFF; letter-spacing: 0;}
.rank02-color01 {border-color: ;}
.rank02-color02 {border-color: ;}
.rank02-color03 {border-color: ;}
.rank02-color04 {border-color: ;}
.rank02-color05 {border-color: ;}
.rank02-color06 {border-color: ;}
.rank02-color07 {border-color: ;}
.rank02-color08 {border-color: ;}
.rank02-color09 {border-color: ;}
.rank02 .idx {margin: 0; padding: 5px 5px 0; background-color: ;}
.rank02 .idx-color01 {background-color: ;}
.rank02 .idx-color02 {background-color: ;}
.rank02 .idx-color03 {background-color: ;}
.rank02 .idx-color04 {background-color: ;}
.rank02 .idx-color05 {background-color: ;}
.rank02 .idx-color06 {background-color: ;}
.rank02 .idx-color07 {background-color: ;}
.rank02 .idx-color08 {background-color: ;}
.rank02 .idx-color09 {background-color: ;}
.rank02 .idx img {position: absolute; top: -10px; left: -5px; max-width: 50px;} 
.rank02 .idx .product {margin: 0; padding: 5px 0 10px 45px; font-size: 107%; font-weight: 600; line-height: 1.2em;} 
.rank02 .idx-color01 .product {color: ;}
.rank02 .idx-color02 .product {color: ;}
.rank02 .idx-color03 .product {color: ;}
.rank02 .idx-color04 .product {color: ;}
.rank02 .idx-color05 .product {color: ;}
.rank02 .idx-color06 .product {color: ;}
.rank02 .idx-color07 .product {color: ;}
.rank02 .idx-color08 .product {color: ;}
.rank02 .idx-color09 .product {color: ;}
.rank02 .inner{margin: 0; padding: 10px ;  text-align: justify; text-justify: inter-ideograph;}
.rank02 .inner .img-set { max-width: 100%; border: 1px solid #CCC; text-align: center; overflow: hidden; }
.rank02 .inner .t_link {font-size: 1.08em; line-height: 1.4em; text-align: right;}
.rank02 .inner .exp {margin: 0; padding: 10px 0; font-size: .9em; line-height: 1.4em; color: #333;}

/* ------ 縦並びランキング　------ */
.rank03 {margin: 0.2em 0 1em; padding: 0; line-height: 1.8em;}
.rank03-01 {border: 1px solid ;border-top: 5px solid ;}
.rank03-02 {border: 1px solid ;border-top: 5px solid ;}
.rank03-03 {border: 1px solid ;border-top: 5px solid ;}
.rank03-04 {border: 1px solid ;border-top: 5px solid ;}
.rank03 .idx {position: relative;}
.rank03 .idx-01{margin: 0; padding: 0 5px 5px ; border-bottom: 1px solid ; background-color: ;}
.rank03 .idx-02{margin: 0; padding: 0 5px 5px ; border-bottom: 1px solid ; background-color: ;}
.rank03 .idx-03{margin: 0; padding: 0 5px 5px ; border-bottom: 1px solid ; background-color: ;}
.rank03 .idx-04{margin: 0; padding: 0 5px 5px ; border-bottom: 1px solid ; background-color: ;}
.rank03 .idx img{position: absolute; left: -10px; top: -15px; max-width: 62px;} 
.rank03 .product{margin: 0; padding: 0.4em 0 0 50px; font-size: 1.2em; font-weight: bold; line-height: 1.2em;}
.rank03 .h-01{color: !important;}
.rank03 .h-02{color: ;!important;}
.rank03 .h-03{color: ;!important;}
.rank03 .h-04{color: ;!important;}
.rank03 .rankinner{margin: 0; padding: 10px 20px ; line-height: 150%;}
.rank03 .rankinner .b_link img{float: left; margin: 0 10px 10px 0; max-width: 180px;}
.rank03 .rankinner .t_link{text-align: right; font-size: 1.08em}
.rank03 .exp {padding: 10px 0; font-size: 0.92em; color: #222;}
.rank03 .toku {margin-bottom: 10px;:  vertical-align: middle; font-size: 100%; font-weight: bold; color: #444;}
.rank03 .toku:before {content: '特　徴'; font-size: 1em; color: #FFF; font-weight: bold!important; margin-right: 10px; padding: 5px 20px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; background: ;}
.rank03 .c-copy1 { font-size: 1em; color: #FFF; font-weight: 600!important; font-style: italic; margin: 20px 0; padding: 3px 2em; background-color: ;
    -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; }
.rank03 .c-copy2 { font-size: 1em; color: #FFF; font-weight: 600!important; font-style: italic; margin: 20px 0; padding: 3px 2em; background-color: ;
    -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; }

/* ------ リンク表示 ----- */
.rank02 .slink a, .rank03 .slink a {width: 120px; margin: 5px 0 0 5px; padding: 5px 0; display: inline-block; text-align: center; border:2px solid #FFF; box-shadow: 1px 1px 3px #666; font-size: 12px; font-weight: bold; line-height: 1.2em;color: #FFF; text-decoration:none;
    -webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;
    background:-moz-linear-gradient(top, #5fc9f3 0%, #5fc9f3 49%, #2e79ba 50%, #2e79ba);
    background:-webkit-gradient( linear,left top,left bottom, from(#5fc9f3), color-stop(0.49,#5fc9f3), color-stop(0.50,#2e79ba), to(#2e79ba));
}
.rank02 .slink a:hover, .rank03 .slink a:hover {filter: alpha(opacity=80); -moz-opacity:0.80; -ms-filter: "alpha( opacity=80 )"; opacity:0.80;}

.rank02 .klink a, .rank03 .klink a {width: 120px; margin: 5px 0 0 5px; padding: 5px 0px; display: inline-block; text-align: center; border:2px solid #FFF; box-shadow: 1px 1px 3px #666; font-size: 12px; font-weight: bold; line-height: 1.2em;color: #FFF; text-decoration:none;
    -webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;
    background:-moz-linear-gradient(top, #D11F7E 0%, #D11F7E 49%, #86134f 50%, #86134f);
    background:-webkit-gradient( linear,left top,left bottom, from(#D11F7E), color-stop(0.49,#D11F7E), color-stop(0.50,#86134f), to(#86134f));
}
.rank02 .klink a:hover, .rank03 .klink a:hover {filter: alpha(opacity=80); -moz-opacity:0.80; -ms-filter: "alpha( opacity=80 )"; opacity:0.80;} 

/* ------ ～479px ------ */
@media screen and (max-width: 479px) {
  /* ------ ランキング02　------ */  
  .rank02 {width: 100%; margin: 0 0 15px 0;}
  /* ------ ランキング03　------ */  
  .rank03 {width: 100%; margin: 0 0 15px 0;}
  .rank03 .rankinner .b_link img {float: none; max-width: 100%;}
}

/* ------ 共通 ------ */
.bld {font-weight: bold;}
.red {color: #C00;}
.waku {border: 1px solid #CCC;}
.textleft{text-align: left;}
.textright{text-align: right;}
.textcenter{{text-align: center;}
.clr{clear: both;}