/*=============================================
 * <section>
 *=============================================*/

section {
}

/*=============================================
 * sec1
 *=============================================*/


#sec1{
	padding:0px 0 0px;
	position: relative;
    width:100%;
}

#sec1 .ttl{
   text-shadow: 1px 1px 0 #fff,
               -1px 1px 0 #fff,
               1px -1px 0 #fff,
               -1px -1px 0 #fff;
    line-height: 150%;

    }
#sec1 .ttl:after{
        content: '';
    position: absolute;
    width: 140px;
    height: 6px;
    background: #ab4833;
    top: -50px;
    right: 20px;
}
#sec1 .ttl:before{
        content: '';
    position: absolute;
    width: 140px;
    height: 2px;
    background: #ab4833;
    top: -40px;
    right: 20px;
}
#sec1 h3{
	text-align: left;
    font-size:60px;
    letter-spacing: 0.1em;
    line-height: 1.4em;
   text-shadow: 1px 1px 0 #fff,
               -1px 1px 0 #fff,
               1px -1px 0 #fff,
               -1px -1px 0 #fff;
    position:absolute;
    right:20px;
    top:20px;
}

#sec1 .img2{
width:45%;
    float:right;
    margin:0 0 80px;
}
#sec1 .col{
    width:52%;
    margin-top:-120px;
}
#sec1 .col h4{
    font-size:44px;
    line-height:100%;
}
#sec1 .col h4 span{
    font-size:20px;
    position:relative;
    top:20px;
}
#caution{
    clear:both;
    text-align: center;
    margin:0 0 80px;
    border:4px solid #ab4833;
    background: rgba(255,255,255,0.5);
    padding:10px 30px 20px 40px;
    position: relative;
}
#caution h3{
    font-size:30px;
    padding-bottom:20px;
}
#caution h3:after{
    content: '';
    position: absolute;
    width: 160px;
    height: 1px;
    background: #4e5d5d;
    top: 86px;
    right: 40%;
}
#caution h4{
    font-size:20px;
    line-height:160%;
}
 .txt-vertical {
     cursor: vertical-text;
     writing-mode: vertical-rl;
     -o-writing-mode: vertical-rl;
     -ms-writing-mode: vertical-rl;
     -ms-writing-mode: tb-rl;
     -moz-writing-mode: vertical-rl;
     -webkit-writing-mode: vertical-rl;
     text-orientation: upright;
     word-wrap: break-word;
     vertical-align: top;
 }
@media screen and (max-width:768px) {
    
#sec1{
	padding:30px 0 40px;
}
#sec1 .ttl{
    margin:0 0 0px 0px;
    
    }
#sec1 .ttl:before{
     top: -20px;
    right: 0px;
    width:100px;
}
#sec1 .ttl:after{
    top: -30px;
    right: 0px;
    width:100px;
}
    #sec1 h3{
        right:0;
        top:40px;
        font-size:9vw;
    }
    #sec1 .img2{
        display: none;
    }
#sec1 .col{
    width:100%;
    margin:0px auto 40px;
}
#sec1 .col h4{
    font-size:8vw;
    line-height:100%;
}
#sec1 .col h4 span{
    font-size:5vw;
    position:relative;
    top:20px;
}    

#caution{
    padding:0px 10px 10px 10px;
    text-align: left;
}
#caution h3{
    font-size:7vw;
    text-align: center;
}
#caution h3:after{
    content: '';
    position: absolute;
    width: 160px;
    height: 1px;
    background: #4e5d5d;
    top: 80px;
    right: 27%;
}
#caution h4{
    font-size:5vw;
}
}


#contents h2{
	border:none !important;
	text-align:center;
	width:100%;
}

#contents h2 span{
	display: block;
    font-size: 0.5em;
    margin-top: 1em;
	position:relative;
}
#contents h2 span:after{
	content:"";
   display:block;
   width: 150px;
    height: 2px;
    background-color: #000;
    position: absolute;
    bottom: -15px;
    left: 50%;
    right: 50%;
  -webkit-transform:translateX(-50%);
  transform:  translateX(-50%);
}
@media (max-width: 768px){
    #bnr_area {
    margin-left:0px;
}
    #bnr_area li .bnr_txt {
 font-size: 3.5vw;
        left:10px;
        bottom:5px;
}
#contents h2 span{
    margin-top: 0.1em;
}
#contents h2 span:after{
   width: 10em;
    bottom: -0.3em;
}


}
@media (max-width: 768px){
.recommend-unit{
	width:49%;
	padding:1%;
	margin:0 auto;
}
.seller-unit{
	width:49%;
	padding:1%;
	margin:0 auto;
}


}

/*li.recommend-unit,li.seller-unit{
	max-width:320px;
}*/


body {
  counter-reset: number 0;           /* number のカウンタを 0 にセット */
}

li.top_ranking{
	position: relative;
}
li.top_ranking a.top_ranking_a:before {
    counter-increment: number 1;
    content: counter(number) " ";
    position: absolute;
    left: 0;
    top: 0;
    z-index: 11;
    background: #fff;
    padding: 5px 20px 10px 10px;
    border-radius: 0 0 10em;
    font-size: 22px;
	box-shadow: 4px 4px 7px rgba(0,0,0,0.2);
}

