@charset "utf-8";
*{margin:0;padding:0;}
html,body{
width:100%;
}
body {
line-height:130%;
color:#333;
background: #fff;
font-family: Verdana, Roboto, 'Droid Sans', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
font-size:14px;
/*background-image: url(./b014.jpg);*/
}

a{color:#0000ff;text-decoration:none}
a:hover{color:#212421;}
img{border:0;}
.clear{clear:both;}
.cf:before,
.cf:after {
content:"";
display:table;
}
.cf:after { clear:both;}
.cf { zoom:1;}
.left{ float:left;}
.right{ float:right;}
.centerbox {
display: -moz-inline-box; /*for Firefox 2*/
display: inline-block; /*for modern*/
/display: inline; /*for ie5～7*/
/zoom: 1; /*for ie5～7*/
margin: 0 auto;
}
.katebox {
display: -moz-inline-box; /*for Firefox 2*/
display: inline-block; /*for modern*/
/display: inline; /*for ie5～7*/
/zoom: 1; /*for ie5～7*/
margin: 0 auto;  
}
/*******************************/

.rank {
border: 0px;
margin: 0px;
overflow: hidden;
width:750px;
height:490px;
background: #fff;
}
.rtime {
border: 0px;
margin: 0px;
overflow: hidden;
width:720px;
height:480px;
}
.new {
border: 0px;
margin: 0px;
overflow: hidden;
width:750px;
height:270px;
background: #fff;
}
.pick {
width:750px;
height:2700px;
border: 0px;
margin: 0px;
background: #fff;
overflow:hidden;
border: 1px solid #ccc;
}
.pickwaku2 {
width:750px;
height:2280px;
border: 0px;
margin: 0px;
background: #fff;
overflow:hidden;
}
.new2 {
border: 0px;
margin: 0px;
overflow: hidden;
width:750px;
height:260px;
background: #fff;
}
.rank2 {
border: 0px;
margin: 0px;
overflow: hidden;
width:750px;
height:490px;
background: #fff;
}
.pick2 {
width:750px;
height:2200px;
border: 0px;
margin: 0px;
background: #fff;
overflow:hidden;
}

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

.ts_a{
color: #333;
font-size:18px;
padding:0 0 0px;
margin:0 0 -8px;
font-family: Century Gothic, Arial;
letter-spacing:1px !important;
}
.ts1{
color: #bf0000;
font-size:36px;
margin: 0 2px 0 0;
}
.ts2{
color: #ccc;
font-size:14px;
margin: 0 0 0 5px;
}
.tsline{
border-bottom: 2px solid #ccc;
position: relative;

}
.tsline:after {
content: "";
display: block;
line-height: 0;
overflow: hidden;
position: absolute;
left: 0;
bottom: -2px;
width: 30%;
border-bottom: 2px solid #bf0000;

}
.lllne,
.lllne:before,
.lllne:after {
content: none;
background: none;
background-color: none;
border: none;
border-radius: 0;
}
.ll{
color:#cccccc;
margin:0 0 0 20px;
font-size:15px;
}
.lllne {
font-size:18px;
padding:0 0 5px;
margin:0 0 10px;
font-family: Century Gothic, Arial;
letter-spacing:0.5px;
position: relative;
border-bottom: 2px solid #ccc;
}
.lllne:first-letter {
font-size: 2em;
color:#bf0000;
margin:0 1px 0 0;
}
.lllne:before{
content:"";
display:block;
width:32%;
border-bottom: 2px solid #bf0000;
position:absolute;
bottom:0;
margin-bottom:-2px;
}
/****************************/

.lllne2,
.lllne2:before,
.lllne2:after {
content: none;
background: none;
background-color: none;
border: none;
border-radius: 0;
}
.ll{
color:#cccccc;
margin:0 0 0 20px;
font-size:15px;
}
.lllne2 {
font-size:18px;
padding:0 0 5px;
margin:0 0 10px;
font-family: Century Gothic, Arial;
letter-spacing:0.5px;
position: relative;
border-bottom: 2px solid #ccc;
}
.lllne2:first-letter {
font-size: 2em;
color:#bf0000;
margin:0 1px 0 0;
}
.lllne2:before{
content:"";
display:block;
width:32%;
border-bottom: 2px solid #4c79b6;
position:absolute;
bottom:0;
margin-bottom:-2px;
}
.aa{
margin:0 0 0 5px;
}

.jyu{
font-size:13px;
width: 150px;
padding:3px 8px;
margin: 0px 0 5px 10px;
color: #fff;
background: #8fb64c;
text-align:center;
font-family: Century Gothic, Arial;
letter-spacing:1px;
}
/*************************/
.pbarsp{
padding: 3px;
}
.pbarsp2{
padding: 6px;
}
.pbar{
position: relative;
text-align: center;
font-size:20px;
color: #333;
margin: 0;
}

.pbar::before{
position: absolute;
top: 50%;
z-index: 1;
content: "";
display: block;
width: 100%;
height: 1px;
background: #000;
background: linear-gradient(-45deg, transparent, #8fb64c 10%, #8fb64c 90%, transparent);
margin: 0;
}

.pbar span{
position: relative;
z-index: 2;
display: inline-block;
padding: 0 20px;
background-color: #fff;
text-align: left;
color: #333;
}
.pbar_u{
display:  block;
font-size:12px;
width: 150px;
margin: 8px auto -10px;
padding: 2px;
color: #fff;
background: #8fb64c;
text-align:center;
font-family: Century Gothic, Arial;
letter-spacing:1px;
}
.pbar_s,
.pbar_s2{
display:  block;
font-size:13px;
width: 100px;
margin: 0px auto 0px;
color: #8fb64c;
background: #fff;
text-align:center;
font-family: Century Gothic, Arial;
letter-spacing:1px;
}
.pbar_s2{
width: 150px;
}

/*************************/
/*************************/
/**************************/
/* 
/**************************/
.header_w{
width:100%;
margin: auto;
}
.header{
width:1000px;
margin: auto;
border: 0px solid #ccc;
}
.header1{
width: 500px;
float: left;
}
.header1 img{
width: 250px;
float: left;
margin: 0;
padding: 0;
-webkit-transition: 0.21s ease-in-out;
   -moz-transition: 0.21s ease-in-out;
     -o-transition: 0.21s ease-in-out;
        transition: 0.21s ease-in-out;
}
.header1 img:hover {
filter:alpha(opacity=70);
-moz-opacity: 0.7;
opacity: 0.7;
}
.header2{
width: 230px;
float: left;
margin: 8px 0 0 0;
}

.header1 a,
.header2 a{
-webkit-transition: 0.21s ease-in-out;
   -moz-transition: 0.21s ease-in-out;
     -o-transition: 0.21s ease-in-out;
        transition: 0.21s ease-in-out;
}
.header1 a:hover,
.header2 a:hover {
filter:alpha(opacity=70);
-moz-opacity: 0.7;
opacity: 0.7;
}
.header3{
width: 70px;
padding: 0px 0;
margin: 10px 0 0 0;
float: left;
text-align:center;
}
.header3 img{
width: 20px;
padding: 5px 0 0;
margin:0 auto;
}
.header3 a{
color:#777;
display: block;
font-size:11px;
-webkit-transition: 0.1s ease-in-out;
   -moz-transition: 0.1s ease-in-out;
     -o-transition: 0.1s ease-in-out;
        transition: 0.1s ease-in-out;
}
.header3 a:hover {
background: #efefef;
}
.header_l li img:hover {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
}
/**************************/

/************************/
.sitebar_w{
margin: 0px 0 0;
border-top: 1px solid #f2f2f2;
border-bottom: 1px solid #f2f2f2;
}
.sib{
margin: 2px 0 0 0;
border-bottom: 1px solid #f2f2f2;
}
.sitebar{
width: 100%;
background: #f2f2f2;
margin: 2px 0 0;
padding: 0px 0;
display: table;
}
.sitebar ul{
width: 1000px;
margin:0 auto;
}
.sitebar li{
width: 200px;
display:table-cell;
vertical-align:middle;
padding: 10px 0;

}
.sitebar li a{
padding: 10px 0;
font-size:13px;
font-weight:bold;
color:#333;
font-family: Century Gothic, Arial;
letter-spacing:0.5px;
-webkit-transition: 0.1s ease-in-out;
   -moz-transition: 0.1s ease-in-out;
     -o-transition: 0.1s ease-in-out;
        transition: 0.1s ease-in-out;
}
.sitebar li a:hover {
filter:alpha(opacity=70);
-moz-opacity: 0.7;
opacity: 0.7;
}

/********************************************/
.llbar{
color:#333;
font-size:20px;
padding:0 0 6px 0px;
margin: 0px 0 5px;
border-bottom:3px solid #ccc;
position: relative;
letter-spacing:0.5px;
}
.llbar:before{
content:"";
display:block;
width:32%;
border-bottom:3px solid #bf0000;
position:absolute;
bottom:0;
margin-bottom:-3px;
}
.llbar span{
color:#cccccc;
font-size:16px;
padding:0 0 0px 0px;
margin: 0px 0 0 20px ;
letter-spacing: 1px;
}
.ll_box{
width:100%;
margin: 10px 0;
}
.ll_box5{
width:100%;
margin: 0px 0;
}
.icon_r,
.icon_r2{
display: block;
float: left;
width: 25px;
margin: -3px 5px 0px 0;
padding: 0px 0 0 0;
}
.icon_r2{
width: 35px;
margin: -11px 5px 0px 0;
}
/********************************************/
.tukai_w{
width:100%;
}
.tukai{
margin: 0px 0;
padding: 5px 0 0px;
width:980px;
margin: auto;
}
#side{
width:220px;
border: 0px dotted #d875d7;
float: left;
margin: 20px 30px 0 0;
}
#mainra{
width:720px;
margin: 20px 0 0 0;
border: 0px dotted #d875d7;
float: left;
}
/************************/
.tkm_bw{
background: #fff;
border:0px solid #000;
margin: 15px 12px 0px;
padding: 0px;
float: left;
}
.tkm_b{
background: #fff;
border: 1px solid #ccc;
border-bottom: 0px solid #ccc;
margin: 0px 0px 0px;
padding: 5px;
}
.tkm_t{
font-size:12px;
color:#fff;
letter-spacing: 1px;
background: #4c79b6;
margin:0px 0px;
padding: 3px 5px;
text-align:center;
display: table;
}
.tkm_t p{
display: table-cell;
vertical-align: middle;
}

.tkm_bw{width:221px;height: 190px;}
.tkm_b{width:210px;height: 131px;}
.tkm_b img{width:210px;}
.tkm_t{width:212px; height: 37px;}
/****/


.kyot_bw{
background: #fff;
border:0px solid #000;
margin: 15px 12px 0px;
padding: 0px;
float: left;
width:222px;
height: 190px;
overflow:hidden;
}
.kyot_b{
background: #fff;
border: 1px solid #ccc;
border-bottom: 0px solid #ccc;
margin: 0px 0px 0px;
padding: 5px;
width:210px;
height: 131px;
}
.kyot_t{
font-size:12px;
color:#fff;
letter-spacing: 1px;
background: #4c79b6;
text-align:center;
display: table;
height: 40px;
margin:0px 0px;
padding: 5px 0px;
width:222px;
line-height: 13pt;
}
.kyot_t p{
display: table-cell;
vertical-align: middle;
text-align:center;
width:200px;
margin:0px 0px;
padding:0 5px;
}
.kyot_b img{width:210px;}


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

.sbtn_w{
border: 1px solid #ccc;
margin: 0 0 10px 0;
}
input[type="text"] {
width: 150px;
padding: 11px 5px;
font-size:14px;
margin: 2px 0 0;
border: 0px solid #ff3131;
}
.sbtn{
background: #ca1210;
margin: 0px 0 0 0;
width:40px;
height:42px; 
border: 0px solid #ff3131;
overflow: hidden;
text-indent: 100%;
white-space: nowrap;
background: url(https://www.rakuten.co.jp/gold/f473243-yomitan/image/sbtn.png);
background-repeat: no-repeat;
background-position: 50% 50%;
background-size:25px;
}
.sbtn:hover{
cursor: pointer;
opacity:0.5;
}
input[type="text"]:focus {
outline: 0;
background: #ededed;
}
/*****/
/****************/
.left_btn1{
width: 218px;
margin: 5px 0;
text-align: center;
border: 1px solid #bf0000;
}
.left_btn1 a{
font-size:14px;
background: #bf0000;
padding: 15px 0px;
margin: 0px 0 0 0;
color:#fff;
display: block;
    -webkit-transition: 0.2s ease-in-out;
       -moz-transition: 0.2s ease-in-out;
         -o-transition: 0.2s ease-in-out;
            transition: 0.2s ease-in-out;
}
.left_btn1 a:hover {
background: #ffebeb;
color:#bf0000;
}
/********************************************/
.fukidashi1 {
position: relative;
background: #333;
width: 220px;
height: 40px;
margin: 15px 0 0px 0;
}
.fukidashi1 p{
padding: 10px 0 0 13px;
margin: 0px 0 0 0px;
color:#fff;
font-size:13px;
}
.fukidashi1:after {
content: '';
position: absolute;
border-top: 10px solid #333;
border-right: 8px solid transparent;
border-left: 8px solid transparent;
bottom: -9px;
left: 18px;
}
/************/

.left_b{
padding:0px;
margin: 0px;
}
.left_b ul{
padding:0px 0;
border: 0px dashed #ccc;
}
.left_b li{
list-style-type:none;
border-bottom:1px dotted #999;
width: 100%;
padding:0px;
margin: 0px 0 0 0px;
    -webkit-transition: 0.2s ease-in-out;
       -moz-transition: 0.2s ease-in-out;
         -o-transition: 0.2s ease-in-out;
            transition: 0.2s ease-in-out;
}
.left_b li a{
font-size:13px;
font-weight:bold;
padding: 12px 0px 12px 24px;
color:#333;
display: block;
    -webkit-transition: 0.2s ease-in-out;
       -moz-transition: 0.2s ease-in-out;
         -o-transition: 0.2s ease-in-out;
            transition: 0.2s ease-in-out;
}
.left_b li:hover {
color:#bf0000;
background: #fff0f0;
}
.left_b li a:hover {
color:#333;
}

/********************************************/
.lbr{
position: relative;
display: inline-block;
padding: 0px;
margin: 0 0 0 5px;
vertical-align: middle;
text-decoration: none;
}
.lbr::before,
.lbr::after{
position: absolute;
top: 0px;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}
.lbr2::before{
left: 3px;
width: 4px;
height: 4px;
border-top: 2px solid #bf0000;
border-right: 2px solid #bf0000;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}

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

.footer_w{
width:100%;
background: #efefef;
}
.footer{
margin: 0px 0;
padding: 5px 0 0px;
width:980px;
margin: auto;
}

.fchu_w{
width: 650px;
background: #fff;
padding: 5px;
margin: 10px auto;
border-radius: 6px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
box-shadow: 3px 3px 4px 1px rgba(79,79,79,0.2);
}
.fchu{
margin: 0px 0;
font-size:13px;
padding: 5px;
background: #fffdf1;
border-radius: 6px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
}
.fchu p{
width: 100%;
background: #efefef;
padding: 5px 0;
margin: auto;
text-align:center;
color:#ff0055;
font-size:17px;
font-weight:bold;
text-shadow: 1px 1px 3px #fff;  

background:repeating-linear-gradient(50deg, #fffbe3 0, #fffbe3 10px, #fff3aa 10px, #fff3aa 20px);
}
.fchu_c{
margin:10px 5px;
color:#333;
}
.fchu_c span{
color:#ff0055;
}
/*********************/

.footer_box{
width: 470px;
float: left;
color:#333;
font-size:13px;
background: #fff;
margin: 10px 5px;
padding:5px 5px;
text-align:left;
}
.footer_caimg{
margin: 0px 0;
}
.footer_com{
text-align:left;
margin:5px 0 10px 5px;
}
.footer_com2{
text-align:left;
margin:5px 0 18px 5px;
}
.footer_box span{
color:#bf0000 !important;
}
.footer_tit{
font-weight:bold;
color:#333;
font-size:14px;
margin:0 0 5px;
background: #fdedfd;

background:repeating-linear-gradient(50deg, #f2f2f2 0, #f2f2f2 10px, #efefef 10px, #efefef 20px);
}
.footer_tit p{
margin: 0 0px 0 10px;
}

.ar{
position: relative;
display: inline-block;
padding: 0 0 0 16px;
margin: 10px;
color: #000;
vertical-align: middle;
text-decoration: none;
font-size: 14px;
}
.ar::before,
.ar::after{
position: absolute;
top: 0;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}
.arr::before{
width: 12px;
height: 12px;
-webkit-border-radius: 50%;
border-radius: 50%;
background: #000;
}
.arr::after{
left: 5px;
box-sizing: border-box;
width: 3px;
height: 3px;
border: 3px solid transparent;
border-left: 3px solid #fff;
}
.arr:hover{
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
}

.arr2::before{
width: 18px;
height:18px;
-webkit-border-radius: 50%;
border-radius: 50%;
background: #333;
}
.arr2::after{
top: 7px;
left: 4px;
box-sizing: border-box;
width: 5px;
height: 6px;
border: 5px solid transparent;
border-top: 7px solid #fff;
}

.arr3::before{
width: 18px;
height:18px;
-webkit-border-radius: 50%;
border-radius: 50%;
background: #d875d7;
}
.arr3::after{
top: 7px;
left: 4px;
box-sizing: border-box;
width: 5px;
height: 6px;
border: 5px solid transparent;
border-top: 7px solid #fff;
}
/*******************************/
.fy{
    position: relative;
    display: inline-block;
    padding: 0 0 0 16px;
    color: #000;
    vertical-align: middle;
    text-decoration: none;
}
.fy::before,
.fy::after{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}
.fy1::before{
    width: 12px;
    height: 12px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: #bf0000;
}
.fy1::after{
    left: 3px;
    width: 3px;
    height: 3px;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.footlink a{
color:#333;
float: left;
font-size:13px;
line-height: 17pt;
margin:0 0 0 15px;
    -webkit-transition: 0.2s ease-in-out;
       -moz-transition: 0.2s ease-in-out;
         -o-transition: 0.2s ease-in-out;
            transition: 0.2s ease-in-out;
}
.footlink a:hover{
color:#bf0000;
}

/************************/
.footer_link_w{
width:100%;
padding: 7px 0;
background: #ccc;
font-size:13px;
color:#fff;
margin: auto;
text-align:center;
}
.footer_link_i{
width:1000px;
margin: auto;
}
.footer_link_iin{
margin:0 0 0 530px;
}
.footer_end{
width:100%;
padding: 7px 0;
background: #000;
font-size:13px;
color:#fff;
margin: auto;
text-align:center;
}
.txtbox img{
margin: 10px auto 10px;
    max-width: 100%; /*元の画像サイズを超えないように*/
    height: auto;/*横幅に合わせて縦幅を調整*/
    vertical-align: bottom; /*画像を下付にする*/
    display: block; /*ブラウザによってinline要素と認識されるのを防ぐ*/
}
.txtbox img {
width:100%;
}
/************************/

.pickup{
width: 210px;
margin:10px 0 10px 8px;
border: 1px solid #ddd;
    -webkit-transition: 0.2s ease-in-out;
       -moz-transition: 0.2s ease-in-out;
         -o-transition: 0.2s ease-in-out;
            transition: 0.2s ease-in-out;
}
.pickup img{
width: 200px;
margin:0px auto;
padding: 5px 5px 5px 5px;
}
.pickup :hover{
filter:alpha(opacity=70);
-moz-opacity: 0.7;
opacity: 0.7;
}

.tsbox{
width: 330px;
float: left;
border: 1px solid #ccc;
margin: 5px 10px;
    -webkit-transition: 0.2s ease-in-out;
       -moz-transition: 0.2s ease-in-out;
         -o-transition: 0.2s ease-in-out;
            transition: 0.2s ease-in-out;
}
.tsbox_l{
width: 110px;
height: 110px;
float: left;
margin:5px;
overflow:hidden;
}
.tsbox_l img{
width: 110px;
margin:0 auto;
}
.tsbox_r{
width: 205px;
margin: 5px 2px 0;
float: left;
}
.tsbox_f{
width: 120px;
margin: 0px ;
padding: 0px;
text-align: center;
font-size:11px;
background: #8fb64c;
color:#fff;
font-family: Century Gothic, Arial;
}
.tsbox_t{
font-size:12px;
line-height: 13pt;
margin: 5px 5px 0 5px;
height: 37px;
overflow:hidden;
color:#333;
font-weight:bold;
}
.tsbox_y{
font-size:13px;
color:#bf0000;
font-family: Century Gothic, Arial;
text-align:right;
font-weight:bold;
margin: 0 5px 0 0;
}
.tsbox_te{
font-size:11px;
margin: 5px 5px 0 5px;
color:#333;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

.tsbox:hover{
border: 1px solid #8fb64c;
color:#bf0000;
background: #f5ffe3;
}
