﻿@charset "utf-8";


/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
   共通事項
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/





/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
   PC版
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

.fv{
	width:100%;
	min-width:1000px;
	position:relative;
	margin:0 0 80px 0;
}

.fv .page_t{
	position:absolute;
	width:300px;
	top:49%;
	left:0;
	right:0;
	margin:0 auto;
	font-size:30px;
	color:#ffffff;
	text-align:center;
}

#content{
	width:900px;
	margin:0 auto 85px auto;
}
h3{
	width:314px;
	margin:0 auto 20px auto;
}
h4{
     margin: 60px 0 40px 0;   
}
.splink{
    display: none;
}
.ranking_warp{
    width: 886px;
    margin: 0 auto;
}

.menu_no1{
    background-image: url(../img/menu_1.png);
 }
.menu_no2{
    background-image: url(../img/menu_2.png);
 }
.menu_no3{
    background-image: url(../img/menu_3.png);
 }
.product_no1{
    background-image: url(../img/product_1.png);
 }
.product_no2{
    background-image: url(../img/product_2.png);
 }
.product_no3{
    background-image: url(../img/product_3.png);
 }
.menurank{
    float: left;
    width:292px;
    height:438px;
    background-position: top center;
    padding: 90px 0 0 0; 
    background-repeat: no-repeat;
    background-size:292px 527px;
    margin: 0 5px 0 0;
}
.productrank{
    float: left;
    width:292px;
    height:404px;
    background-position: top center;
    padding: 90px 0 0 0; 
    background-repeat: no-repeat;
    background-size:292px 494px;
    margin: 0 5px 0 0;
}
.menu_no3,.product_no3{
     margin: 0;   
}

.menurank .topic_warp,.productrank .topic_warp{
    width:250px; 
    margin: 0 auto;
}
.menurank h5{
    height: 110px;
    line-height: 1.3;
    font-size: 20px;
    color: #658405;
    text-align: center;
}
.productrank h5{
    margin: 15px 0 15px 0; 
    line-height: 1.3;
    font-size: 20px;
    color:#e56c00;
    text-align: center;
}
.menurank .pdt{
    height: 90px;
    padding-top: 20px;
}
.menurank p,.productrank p{
    font-size: 15px;
    color: #744c2c;
    line-height: 1.5;
    margin: 15px 0 0 0;
}
.menurank .detail a{
    display: block;
    width: 245px;
    height: 45px;
    color: white;
    text-align: center;
    background-color:#658405;
    border-radius: 8px;
    margin:5px auto 0 auto;
}
.menurank .detail a:hover{
    opacity: 0.7;
}
.menurank .detail a span,.productrank .detail a span{
    line-height: 45px;
    font-size: 18px;
}
.productrank .detail{
     width: 245px;
    height: 45px;
    color: white;   
        text-align: center;
    background-color:#e56c00;
    border-radius: 8px;
    margin:5px auto 0 auto;
    line-height: 45px;
    font-size: 18px;
}

.note{
    font-size: 24px;
    color:#ff0000;
    text-align: center;
    margin-top: 45px;
}

/* /_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_
   スマホ版
/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_*/

@media screen and (max-width:768px){

h1{
	padding-top:42%;
	z-index:5000;
}

.fv{
	width:100%;
	min-width:100%;
	margin:0 0 30% 0;
}

.fv .page_t{
	position:absolute;
	width:303px;
	top:49%;
	left:0;
	right:0;
	margin:0 auto;
	font-size:30px;
	color:#ffffff;
	text-align:center;
}
#content{
	width:100%;
	margin:0 auto 20px auto;
}

h3{
	width:90%;
	margin:0 auto 20px auto;
}
h4{
	width:90%;
    max-width: 500px;
     margin: 60px auto 40px auto;   
}
.splink{
    display: block;
    margin: 30px auto 30px auto;
}
.link a{
    display: block;
    width: 90%;
    max-width: 500px;
    height: 60px;
    color: white;
    text-align: center;
    border-radius: 3px;
    margin:5px auto 25px auto;
}
.link a span{
    line-height: 60px;
    font-size: 18px;
}
.green a{
     background-color:#86bb07;       
}
.orange a{
     background-color:#ee8600;       
}
.ranking_warp{
    width:95%;
    max-width: 380px;
    margin: 0 auto;
}

.menu_no1{
    background-image: url(../img/menu_1_s.png);
 }
.menu_no2{
    background-image: url(../img/menu_2_s.png);
 }
.menu_no3{
    background-image: url(../img/menu_3_s.png);
 }
.product_no1{
    background-image: url(../img/product_1_s.png);
 }
.product_no2{
    background-image: url(../img/product_2_s.png);
 }
.product_no3{
    background-image: url(../img/product_3_s.png);
 }
.menurank{
    float: none;
    height:0px;
    width:100%;
    background-position: top center;
    padding:151.5570934% 0 0 0; 
    background-repeat: no-repeat;
    background-size:contain;
    margin: 0 0 0 0;
    position:relative;
}
.menu_no3{
     padding:167.6470588% 0 0 0;        
}
.topic_warp{
  position:absolute;
   top:15%;
   right:0px;
   bottom:0px;
   left:0px;
   margin:auto auto;
}
.menurank .topic_warp,.productrank .topic_warp{
    width:80%; 
    margin: 0 auto;
}
.productrank{
    float: none;
    height:0px;
    width:100%;
    background-position: top center;
    padding:156.9204152% 0 0 0; 
    background-repeat: no-repeat;
    background-size:contain;
    margin: 0 0 0 0;
    position:relative;
}
.menurank h5{
    height:auto;
    margin: 5px 0 15px 0; 
    line-height: 1.3;
    font-size:20px;
    color: #658405;
    text-align: center;
}
.productrank h5{
    margin: 15px 0 15px 0; 
    line-height: 1.3;
    font-size:20px;
    color:#e56c00;
    text-align: center;
}
.menurank .pdt{
    height:auto;
    padding-top: 13px;
}
.menurank p,.productrank p{
    font-size: 15px;
    color: #744c2c;
    line-height: 1.6;
    margin: 15px 0 0 0;
}
.menurank .detail a{
    display: block;
    width: 80%;
    height: 45px;
    color: white;
    text-align: center;
    background-color:#658405;
    border-radius: 8px;
    margin:8px auto 0 auto;
}
.menurank .detail a span,.productrank .detail a span{
    line-height: 45px;
    font-size: 16px;
}
.productrank .detail{
     width: 245px;
    height: 45px;
    color: white;   
        text-align: center;
    background-color:#e56c00;
    border-radius: 8px;
    margin:5px auto 0 auto;
    line-height: 45px;
    font-size: 16px;
}

.note{
    width: 90%;
    margin:20px auto 35px auto;
    font-size: 17px;
    color:#ff0000;
    text-align: center;
}


}

/* 文字フォント */
@media screen and (max-width:500px){
.fv .page_t{
	position:absolute;
	width:303px;
	top:49%;
	left:0;
	right:0;
	margin:0 auto;
	font-size:20px;
	color:#ffffff;
	text-align:center;
}

}

/* ランキング　調整用 */
@media screen and (max-width:350px){
.menurank h5{
    height:auto;
    margin: 5px 0 10px 0; 
    line-height: 1.3;
    font-size:18px;
    color: #658405;
    text-align: center;
}
.menurank p,.productrank p{
    font-size: 13px;
    color: #744c2c;
    line-height: 1.5;
    margin: 15px 0 0 0;
}
.menurank .detail a,.productrank .detail{
      margin:10px auto 0 auto;  
}

}

