@charset "UTF-8";
.clearfix:after {
    content:" ";
    display:block;
    clear:both;
}
body {
    /*-webkit-text-size-adjust: 100%;*/
}
#wrapper{
  max-width: 1000px;
  margin: 0 auto;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  font-size: 100%;
}
h2,h3{
  padding:.75em 15px;
  font-weight: bold;
  margin: 0.83em 0;
  background-color: #ccc;
  font-size: 1.3em;
  text-align: left;
}
h4{
  font-weight: bold;
  padding: .45em 0;
  font-size: 1.2em;
}
#wrapper h2{
  border: 1px solid #ccc;
  border-left: 0;
  border-right: 0;
  background: -webkit-linear-gradient(top,#fff 0,#f0f0f0 100%);
  background: linear-gradient(to bottom,#fff 0,#f0f0f0 100%);
  box-shadow: 0 -1px 0 rgba(255,255,255,1) inset;
}
.breadcrumb {
  padding-left:0;
  /*margin-left:0;*/
  margin: 10px;
}

.breadcrumb li{
  display:inline;/*横に並ぶように*/
  list-style: none;
  font-weight: bold;/*太字*/
}

.breadcrumb li:after{/* >を表示*/
  content: '>';
  padding: 0 3px;
  color: #555;
}

.breadcrumb li:last-child:after{
  content: '';
}

.breadcrumb li a {
    text-decoration: none;
    color: #9fb35c;/*色*/
}

.breadcrumb li a:hover {
    text-decoration: underline;
}
#pagetop{
  position:fixed;
  right:20px;
  bottom:20px;
  background-color: orange;
  color: white;
  font-size: bold;
  cursor:pointer;
  padding: 20px;
  box-shadow: 1px 1px 5px #847f7f;
}
/*menu*/
.menu ul li img{
  max-width: 90%;
}
.content{
  padding: 0 15px;
}
.content p{
  line-height: 1.85;
}
.content img{
  width: 100%;
}
.float-menu li{
  display: block;
  text-align: center;
}
/*ニュースボックス*/
/*
.news-box ul li{
  overflow:scroll;
  height:200px; 
  padding: 10px 0;
  border-bottom: 1px solid #ccc;
}
*/
/*目次*/
.mokuji li {
  padding: 9px 0;
  border-bottom: 1px solid #ddd;
}
/*新着情報*/
.info-box ul li {
  padding: 7px 0;
}
.info-box ul li:nth-child(2n){
  background-color: rgb(248, 247, 207);
}
/*文字装飾*/
span.mark{
  background-color: orange;
}
/*footer*/
.footer {
    margin-top: 15px;
    padding: 15px;
    background-color: #efefef;
}
/*ランキング部分*/
.rank.content img{
  width: 100%
}
.oil-rank-wrap.content {
    padding-top: 50px;
}
.rank-title{
  font-weight: bold;
  font-size: 1.2em;
}
.rank-1{
  background-color: gold;
}
.rank-2{
  background-color: #d3d3d3;
}
.rank-3{
  background-color: #b3700b;
}
.rank-4{
  background-color: #ab6eab;
}
.rank-5{
  background-color: #3f7fc0;
}
.rank-6{
  background-color: #53a76e;
}
.tai{}
.oil-explain h4{
margin-top: 15px;
}
.oil-explain p{
  padding:0.7em;
  border: 1px solid #ccc;
  margin-top: 15px;
  height: 100px;
  display: table-cell; /* IE8から使用可能 */
 vertical-align: middle;
}
.oil-img-box img {
    width: 48%;
}
.shop-info{
  padding-top: 25px;
  text-align: center;
}
.shop-info img{
  width: 90%;
  margin-bottom: 20px;
}

.about-box.content img{
  width: 100%;
}
.past-rank-box table{
  width: 100%;
}
.past-rank-box th,
.past-rank-box td{
  padding: 15px 0;
}
.text-area{
  margin: 25px 0;
}
/*ランプベルジェの歴史*/
.more-detail {
  padding: 15px;
  background-color: #69b1e4;
  margin: 15px 0;
  font-size: 1em;
}

/*ランプベルジェの使用方法*/
.barner_mente {
  background-color: #eaeaea;
  display: block;
  padding: .35em;
  font-size: 1.08em;
  line-height: 1.5;
  font-weight: bold;
  color: #597521;
}
.video{
  position:relative;
  width:100%;
  padding-top:56.25%;
  margin-bottom: 20px;
}
.video iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}
/*模造品について*/
.ceo-message{
  padding: .8em;
  background-color: rgb(248, 242, 186);
  margin: .5em;
}

/*rank-histroy*/
.rank-history li{
  padding: 15px;
}
.rank-history li:nth-child(2n){
  background-color: rgb(218, 247, 240);
}

/*PC表示*/
@media screen and (min-width:1024px) {
  /*　画面サイズが1024pxからはここを読み込む　*/

  /*メニュー*/
  .float-menu li{
    float: left;
    width: 33%;
    margin-bottom: 15px;
  }

  .content{
    text-align: center;
  }
  .content img{
    width: auto!important;
  }

  p.long-text{
    text-align: left;
    padding-bottom: 1em;
    width: 80%;
    margin: 0 auto;
  }

  .shop-button-box{
    width: 100%;
    text-align: center;
  }
  .shop-button-box a{
    width: 300px;
    display: inline-block;
  }
  .shop-button-box img{
    width: 100%!important;
  }

  /*オイルランキング*/
  .oil-img-box img{
    width: 50%!important;
    float: left;
  }

  .oil-explain p{
    min-height: 100px;
    width: 97.2%;
    display: block;
    height: auto;
    text-align: left;
  }

  .mokuji{
    text-align: left;
    width: 400px;
    margin: 20px auto;
    border: 1px solid #ccc;
    padding: 20px;
  }

  /*歴史*/
  .history-detail-box{
    padding: 1em;
    background-color: #f5eaa0;
    text-align: left;
  }
  /*使用方法*/
  .section{
    margin: 3.5em 0;
  }
}