@charset "utf-8";
/* CSS Document */

/* --------------------
トップ
------------------- */
.langBtn {
border-bottom: 1px dotted #000;
margin-bottom: 1px;
}
.langBtn ul {
width: 320px;
margin-right: auto;
margin-left: auto;
padding-bottom: 1px;
}
.langBtn ul li {
float: left;
margin-left: 1px;
margin-bottom: 1px;
}
.langBtn li:first-child {
margin-left: 0;
}
.topNavBg {
background-color: #777;
margin-bottom: 10px;
}
.topNavBg ul {
width: 320px;
margin-right: auto;
margin-left: auto;
background-color: #FFF;
}
.topNavBg ul li {
float: left;
margin-right: 1px;
margin-bottom: 1px;
height: 50px;
}
.topNavBg ul li:nth-child(3n) {
margin-right: 0;
}
.topNavBg ul li:nth-last-child(-n+3) {
margin-bottom: 0;
}
.topCampaignBtn03 {
text-align: center;
}
.topCampaignBtn02 {
text-align: center;
margin-bottom: 10px;
}
.topLineBnr {
text-align: center;
padding-top: 10px;
}
.topNewsTit
.topSlide {
text-align: center;
}
.topCampaignBtn {
text-align: center;
margin-bottom: 15px;
}
.topAttention {
width: 300px;
margin-right: auto;
margin-left: auto;
margin-bottom: 15px;
}
.topAttention li:nth-child(odd) {
float: left;
}
.topAttention li:nth-child(even) {
float: right;
}
.topTit {
text-align: center;
margin-bottom: 20px;
padding-top: 40px;
}
.topNewsTit {
text-align: center;
margin-bottom: 20px;
padding-top: 20px;
}
.topBg {
background-color: #777;
padding: 10px;
}
.topBnr {
width: 300px;
margin-right: auto;
margin-left: auto;
}
.topBnr li {
margin-bottom: 10px;
}
.topBnr li:last-child {
margin-bottom: 0;
}
.topCate {
width: 300px;
margin-left: auto;
margin-right: auto;
}
.topCate li:nth-child(odd) {
float: left;
margin-bottom: 10px;
}
.topCate li:nth-child(even) {
float: right;
margin-bottom: 10px;
}
.topSearch {
margin-bottom: 20px;
text-align: center;
}
.topNews {
margin-right: 10px;
margin-left: 10px;
}
.topNews li {
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #ccc;
padding: 10px;
}
.topNews li div {
padding-right: 20px;
background-image: url(../img/top/news_arrow.gif);
background-repeat: no-repeat;
background-position: right center;
background-size: 8px 14px;
}
.topNews li .date {
color: #8a8a8a;
font-size: 70%;
margin-bottom: 3px;
}
.topNews li .title {
line-height: 1.4;
font-size: 85%;
}
.topNews li .title a:link {
color: #000;
font-weight: normal;
text-decoration: underline;
}
/**********1607_topランキング**********/

#top_rank {
    font-family: "Yu Gothic" !important;
    width: 320px;
    margin: 0 auto;
    padding-bottom: 30px;
}
#top_rank h2 {
    font-family: "Yu Mincho", "YuMincho", serif  !important;
    font-size: 120%;
}
#top_rank ul,
#top_rank dl {
    font-size: 85%;
}

/*****common*****/

#top_rank li.last {
    margin-bottom: 0px;
}

/*****clear_fix*****/

#top_rank ul:after {
    content: "";
    display: block;
    clear: both;
}

/*****tit_font*****/

#top_rank h2 {
    text-align: center;
    padding: 0 20px;
    background: #fff;
}

/*****h2_tit*****/

#top_rank h2 {
    padding: 30px 0 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
#top_rank h2:before,
#top_rank h2:after {
    border-top: 1px solid;
    content: "";
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}
#top_rank h2:before {
    margin-right: 1em;
}
#top_rank h2:after {
    margin-left: 1em;
}

/*****h3_tit*****/

#top_rank h3 {
    padding: 30px 0 23px;
    text-align: center;
}
#top_rank h3:before,
#top_rank h3:after {
    font-size: 80%;
    content: '■';
}

/******ul_ranc******/

.ranc_ul {
    background: #e4e4e4;
    padding: 10px;
    position: relative;
}
.ranc_ul li {
    padding: 20px 40px 20px 10px;
    margin-bottom: 10px;
    background: #fff;
    position: relative;
}
.ranc_ul li:after {
    content: "";
    background: url("<!--{$TPL_URLPATH}-->img/top/ico.png");
    display: inline-block;
    width: 8px;
    height: 14px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 21px;
    margin: auto 0;
}
.ranc_ul li a {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
}
.ranc_ul li a {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
}
.ranc_ul .ranc_ribbon {
    position: absolute;
    top: 0;
    left: 8;
}

/******dl_ranc******/

.ranc_ul dl {
    font-weight: 500;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}
.ranc_ul dl span {
    color: #cf2d04;
}
.ranc_ul dt {
    width: 70%;
    text-align: left;
    line-height: 140%;
}
.ranc_ul dd {
    width: 25%;
    padding-right: 10px;
}