@charset "UTF-8";
/* ==============
    HOME CSS
================ */
#mainBox ul.btnTxt{
list-style: none;	
}
#mainBox ul.btnTxt li{
display: inline-block;
text-align: center;
background-image:-webkit-linear-gradient(270deg, rgb(100, 100, 100) 0%, black 100%);
background-image: linear-gradient(180deg, rgb(100, 100, 100) 0%, black 100%);
background-attachment: scroll;
-webkit-box-shadow: rgb(200, 200, 200) 0px 0px 10px 0px;
box-shadow: rgb(200, 200, 200) 0px 0px 10px 0px;
border: 1px solid #999;
padding: 1rem;
color: #fff;
}
#mainBox ul.btnTxt li a{
color: #fff;
}

/* ----------------
    #mainBox
------------------*/
#mainBox #mainImg{
border: 4px solid #FD3400;
background: #ff9900;
color: #fff;
font-size: 1.4rem;
line-height: 1.6;
padding: 3px 0;
}
#mainBox #mainImg img{
width: 100%;
}

/* --- #newsBox ---*/
#mainBox #newsBox {
/*width: 49%;*/
border: 1px solid #999;	
padding: 0;
margin: 3rem 0;
/*float: left;*/
height: 30rem;
overflow-y: scroll;
}
#mainBox #newsBox h2 {
font-size: 1.8rem;
font-weight: normal;
background: #333;
color: #fff;
border: 1px solid #ccc;
padding: 0.8rem 0.8rem;
margin: 0;
letter-spacing: 0.3rem;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.60, #ff0805), color-stop(0.00, #ff8929));
background: -webkit-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -moz-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -o-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -ms-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: linear-gradient(to bottom, #ff8929 0%, #ff0805 60%);
background-attachment: scroll;
}
#mainBox #newsBox h2 span{
font-size: 1.4rem;
letter-spacing: normal;
float: right;
}
#mainBox #newsBox ul#news{
margin: 0;
line-height: 1.8;
padding: 1rem;
list-style: none;
}
#mainBox #newsBox ul#news li span{
font-size: 2.5rem;
line-height: 0;
margin: 0 0.3rem 0 0;
color: rgba(255,0,4,1.00);
}
#mainBox #newsBox ul#news li{
line-height: 1.2;
margin: 0 0 1rem 0;
padding: 0 0 0.5rem 0;
border-bottom: 1px dashed #ccc;
}
#mainBox dl#newsInfo{
background: #eee;
padding: 1rem 2rem;
-webkit-border-radius:10px;
-moz-border-radius:10px;  
border-radius:10px;
margin: 1.5rem 0 0 0;
}
#mainBox dl#newsInfo dt{
display: inline-block;
margin: 0;
padding: 0;
font-weight: bold;
}
#mainBox dl#newsInfo dt span{
color:#ca0000;
font-size: 2.5rem;
}
#mainBox dl#newsInfo dd{
display: inline-block;
margin: 0;
padding: 0;
}
#mainBox dl#newsInfo dd span{
font-weight: bold;
font-size: 1.5rem;
margin: 0 0.3rem 0 0;
}
#mainBox dl#newsInfo dd li{
margin: 0 2rem 0 0;
padding: 0;
display: inline;
}

/* --- #rankBox ---*/
#mainBox #rankBox {
width: 49%;
border: 1px solid #999;	
padding: 0;
margin: 3rem 0;
float: right;
height: 30rem;
overflow-y: scroll;
}
#mainBox #rankBox h2 {
font-size: 1.8rem;
font-weight: normal;
background: #333;
color: #fff;
border: 1px solid #ccc;
padding: 0.8rem 0.8rem;
margin: 0;
letter-spacing: 0.3rem;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.60, #ff0805), color-stop(0.00, #ff8929));
background: -webkit-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -moz-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -o-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -ms-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: linear-gradient(to bottom, #ff8929 0%, #ff0805 60%);
background-attachment: scroll;
}
#mainBox #rankBox h2 span{
font-size: 1.4rem;
letter-spacing: normal;
float: right;
}
#mainBox #rankBox  ul{
color: #000;
margin: 0;
padding: 1rem;
list-style: none;
}
#mainBox #rankBox  li{
margin: 0.5rem 0 2rem 0;
padding: 0 0 0.5rem 0 ;
border-bottom: 1px dotted rgba(255,0,4,1.00);
line-height: 1.2;
}
#mainBox #rankBox li span{
display: inline-block;
vertical-align:bottom;
color: rgba(255,0,4,1.00);
font-weight: bold;
font-size: 2.4rem;
margin: 0 1rem -0.5rem;
padding: 0;
}
/*k_del
#mainBox #rankBox img{
display: block;
float: left;
width: 8rem;
height: auto;
margin: 0 0.5rem 0 0;
}
*/

/* --- ITEM LIST ---*/
ul.list {
list-style: none;
text-align: center;
}
ul.list li{
margin: 0.5%;
padding:0;
display: inline-block;
vertical-align: top;
}
ul.list li dl.itemBox{
width: 100%;
border: 1px solid #000;
margin: 0;
padding: 0;
background: #fff;
}
ul.list li dl.itemBox dt.imgBox{
}
ul.list li dl.itemBox dt.imgBox img{
display: block;
width: 100%;
}
ul.list li dl.itemBox dd.titleBox{
margin: 0 0.5rem;
}
ul.list li dl.itemBox dd.priceBox{
margin: 0 0.5rem;
font-weight: bold;
color:#ca0000;
}
ul.line01 li{
width: 98%;
}
ul.line02 li{
width: 48.5%;
}
ul.line03 li{
width: 31.8%;
}
ul.line04 li{
width: 23.5%;
}
ul.line05 li{
width: 18.5%;
}
ul.line06 li{
width: 15.2%;
}

/* --- #pickUpBox ---*/
#mainBox #pickUpBox {
margin: 5rem 0 0 0;
}
#mainBox #pickUpBox h2{
font-size: 1.4rem;
border-bottom: 1px dotted #666;
margin: 0;
padding: 0;
}
#mainBox #pickUpBox h2 span.subTxt {
font-size: 1.4rem;
float: right;
color: #000;
padding: 0.5rem 0 0 0;
}
#mainBox #pickUpBox section{
margin: 4rem 0;
padding: 0;
border: 1px solid #999;
}
#mainBox #pickUpBox section h3{
margin: 0;
letter-spacing: 0.3rem;
font-size: 2.4rem;
border: 1px solid #999;
border-left: 10px solid #ff0805;
padding: 0.5rem;
background-image:-webkit-linear-gradient(270deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%);
background-image: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%);
background-attachment: scroll;
}
#mainBox #pickUpBox section h3 span{
color: #ff0805;
font-size: 3.6rem;
}
#mainBox #pickUpBox section p{
margin: 1rem 0;
}

/* --- #mediaBox ---*/
#mediaBox {
margin: 5rem 0 0 0;
}
#mediaBox h2{
font-size: 3rem;
border-top: 3px solid #f90;
border-bottom: 3px solid #f90;
padding: 0.5rem 0;
color: #f90;
letter-spacing: 0.5rem;
margin: 0;
}
#mediaBox h2 span{
color: #666;
}
#mediaBox ul{
list-style: none;
text-align: center;
margin: 0.5rem 0 0 0;
padding: 0;
}
#mediaBox li{
width: 16%;
display: inline-block;
}
#mediaBox li img{
width: 100%;
display: block;
}
#mediaBox p{
background: #f90;
text-align: center;
}
#mediaBox p a{
padding: 0.5rem;
display: block;
width: 100%;
}

/* --- #medamaBox ---*/
#medamaBox {
margin: 5rem 0 0 0;
}
#medamaBox h2{
font-size: 3rem;
background: #ca0000;
padding: 0.5rem 1rem;
border-left: 3px solid #000;
border-right: 3px solid #000;
color: #fff;
letter-spacing: 0.5rem;
font-weight: normal;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.60, #ff0805), color-stop(0.00, #ff8929));
background: -webkit-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -moz-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -o-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -ms-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: linear-gradient(to bottom, #ff8929 0%, #ff0805 60%);
margin: 0;
}
#medamaBox ul{
background: #ddd;
text-align: center;
padding: 0.5rem 0;
}

/* --- #osusumeBox ---*/
#osusumeBox {
margin: 5rem 0 0 0;
}
#osusumeBox h2{
font-size: 3rem;
background: #ca0000;
padding: 0.5rem 1rem;
border-left: 3px solid #000;
border-right: 3px solid #000;
color: #fff;
letter-spacing: 0.5rem;
font-weight: normal;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.60, #ff0805), color-stop(0.00, #ff8929));
background: -webkit-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -moz-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -o-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: -ms-linear-gradient(top, #ff8929 0%, #ff0805 60%);
background: linear-gradient(to bottom, #ff8929 0%, #ff0805 60%);
margin: 0;
}
#osusumeBox ul{
background: #ddd;
text-align: center;
padding: 0.5rem 0;
}

/* --- #kaniBox ---*/
#kaniBox {
width: 48%;
height: 23rem;
float: left;
margin: 5rem 0.5%;
border: 3px solid #000;
-webkit-border-radius:10px;
-moz-border-radius:10px;  
border-radius:10px;
background: url(../img/bg_kanibox.jpg) no-repeat;
background-size: cover;
}
#kaniBox h2{
margin: 0;
padding: 1rem 0.5rem;
font-size: 1.6rem;
background: #000;
color: #fff;
font-weight: normal;
}
#kaniBox p {
margin: 2rem 0 0 0;
padding: 2rem;
background: rgba(0,0,0,0.7);
color: #fff;
}
#kaniBox ul {
margin: 2rem 0 1rem 0;	
text-align: center;	
}
#kaniBox li {
width: 35%;
}

/* --- #seriBox ---*/
#seriBox {
width: 48%;
height: 23rem;
float: left;
margin: 5rem 0.5%;
border: 3px solid #ca0000;
-webkit-border-radius:10px;
-moz-border-radius:10px;  
border-radius:10px;
background: url(../img/bg_seribox.jpg) no-repeat;
background-size: cover;
}
#seriBox h2{
margin: 0;
padding: 1rem 0.5rem;
font-size: 1.6rem;
background: #ca0000;
color: #fff;
font-weight: normal;
}
#seriBox ul {
margin: 1.5rem 0 0rem 0;	
text-align: center;
}
#seriBox p {
background: rgba(255,255,255,0.80);	
text-align: center;
margin: 2rem 0rem 0rem 0rem;
padding: 1rem 0;
}
#seriBox p strong {
color: #ca0000;
font-size: 1.8rem;
display: block;
}
#seriBox p span {
color: #ca0000;
display: block;
}
#seriBox p.entry {
text-align: center;
margin: 0 0 1rem 0;
background:none;	
}


#mainBox hr {
clear: left;
border: none;	
}

/* --- #aboutBox ---*/
#aboutBox {
margin: 5rem 0 0 0;
border: 1px solid #999;
padding: 2rem;
-webkit-border-radius:10px;
-moz-border-radius:10px;  
border-radius:10px;
background-image:-webkit-linear-gradient(270deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%);
background-image: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(240, 240, 240) 100%);
}
#aboutBox h2{
font-size: 1.4rem;
border-bottom: 1px dotted #666;
margin: 0;
padding: 0 0 0 1rem;
border-left: 5px solid #ff0805;
}
#aboutBox h3{
font-size: 3rem;
font-weight: normal;
letter-spacing: 0.5rem;
text-align: center;
border-bottom: 2px solid #ff0805;
padding: 0 0 0.5rem 0;	
}
#aboutBox img{
display: block;
border: 1px solid #ccc;
margin: 0 1rem 1rem 0;
float: left;
}
#aboutBox p{
margin: 0 0 2rem 0;
text-indent: 1em;
line-height: 1.4;
}
#aboutBox ul{
text-align: center;
}
#aboutBox li{
width: 28%;
}
@media only screen and (min-width: 1280px) {
}

@media only screen and (max-width: 800px) {
/* ----------------
    #mainBox
------------------*/
ul.line04 li{
width: 22%;
}
ul.line05 li{
width: 17%;
}
#mainBox #pickUpBox section h3{
font-size: 3vw;
}
#mainBox #pickUpBox section h3 span{
font-size: 4vw;
}
ul.line06 li{
width: 15%;
}

#mainBox #newsBox {
width: 100%;
float: none;
height: auto;
overflow: auto;
}
#mainBox #rankBox {
width: 100%;
float: none;
height: auto;
overflow: auto;
}

#medamaBox h2{
font-size: 4vw;
}
#osusumeBox h2{
font-size: 4vw;
}

#kaniBox {
width: 70%;
margin-left: auto; 
margin-right: auto; 
float: none;
}
#seriBox {
width: 70%;
margin-left: auto; 
margin-right: auto; 
float: none;
}
#aboutBox li{
width: 25%;
}

}

@media only screen and (max-width: 480px) {
/* ----------------
    #mainBox
------------------*/
#pickUpBox h3 span{
}
ul.line02 li{
width: 100%;
display: block;
}
ul.line03 li{
width: 46%;
}
ul.line04 li{
width: 46%;
}
ul.line05 li{
width: 46%;
}
ul.line06 li{
width: 46%;
}
#mediaBox li{
width: 30%;
}
#kaniBox {
width: 100%;
height: auto;
}
#seriBox {
width: 100%;
height: auto;
}
#aboutBox li{
width: 80%;
display: block;
text-align:center;
margin: 0.5rem 0;
}
}

/*k_add_start*/
#medamaBox h2,
#osusumeBox h2 {
    padding: 2px 1rem;
}
#medamaBox ul.list li dl.itemBox dd.titleBox,
#osusumeBox ul.list li dl.itemBox dd.titleBox {
    margin: 0 0.5rem;
    min-height: 40px;
}
/*k_add_end*/