@charset "utf-8";

/*全体への指定です*/
body{color:#000000 ; font-family:"游明朝体", "Yu Mincho", YuMincho,"Hannari", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif"; position: relative ;overflow-x: hidden !important;}
a{ color:#000000; text-decoration:none;}
a:hover{ color:#888888;}
a:hover img{
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";}
img{border:none;vertical-align: bottom; border: none;}
section{display:block;}
p{margin: 0; padding: 0;}
br{ line-height:15pt;}
a img {border-style:none;}

.top_margin{margin-top: 40px; margin-bottom: 50px;}/*topにコンテンツが埋め込み気味になるのでこちらで解除しています*/
.top_margin2{margin-top: 40px; margin-bottom: 15px;}/*ランキングタイトルの上下マージンなど*/
.top_margin3{margin-top: 40px;}/*主にフッターに使われている指定です*/

.padding1{padding: 15px 0;}/*主にフッターに使われている指定です*/
.padding2{padding-bottom: 2px;}/*本社工場や本店のテキストマージンです*/
.padding3{padding-bottom: 10px;}/*本社工場や本店のテキストマージンです*/

.font_size{font-size: 10pt;}/*追従NAVIでデフォルトのフォントサイズを小さくせざるを得ないのでこれで大きくしています*/
.font_size2{font-size: 14pt;}/*もう少し大きいほうがいいなという場合の指定*/
.font_size3{font-size: 12pt;}/*中間が欲しい場合の指定*/
.font_size4{font-size: 11pt;}
.takasa_aida{ display: block; height: 5px;}/*コンテンツの間の高さ*/
.takasa_aida2{ display: block; height: 15px;}/*コンテンツの間の高さ*/
.takasa_aida3{ display: block; height: 25px;}/*コンテンツの間の高さ*/.float{float: left;}
.text_left{text-align: left;}
.text_justify{text-align: justify;}
.text_center{text-align: center;}
.mojikan{letter-spacing: .05em; line-height: 1.4em;}/*説明テキストのつまりを解除*/




.topics_area{
  max-width: 970px;
  margin: 0 auto;
}
.topics_area *{box-sizing: border-box;}
.topics_area h3{
  background-color: #9A0000;
  color: #FFFFFF;
  padding: 0.5em;
}
.topics_area .area {
  padding: 0.5em 1em;
  border-right: 1px solid #CCC;
  border-left: 1px solid #CCC;
  border-bottom: 1px solid #CCC;
}



/*SNSのアイコンがあるあたりの背景画像指定*/
.header_line{background-image:url(../image/back_img1.jpg) !important;}

/*各コンテンツの大枠の大きさ（幅）の指定です*/
.contents{width: 100%;}
.contents_box{width: 100%; max-width: 1200px; min-width: 1200px; margin: 0 auto !important; }
.contents_minibox{width:95%; margin: 40px auto;}
.contents_minibox2{width:96%; margin: 0 auto;}
.bottm{margin-bottom: 40px;}
.bottm2{margin-bottom: 100px;}

/*SNSがある最上部コンテンツのスタイリングです*/
.contents_box_ul{ margin:0;list-style-type: none; font-size: 10pt; font-weight: bold;letter-spacing:1pt; float: left; position: relative; top: 12px;}
.contents_box_ul li{display: inline;}
#icons{ float: right;padding-bottom: 15px !important;}
.clear{clear: both;}

/*ヘッダーにあるボタン周りのスタイリングです*/

/*▼注目キーワード*/
.btn-flat-border {display: inline-block; padding: 0.3em 0.5em !important; text-decoration: none; color: #333333; border: solid 1px #333333; border-radius: 3px; transition: .4s; font-weight: bold;}
.btn-flat-border:hover {background: #1e1b36; color: white;}

/*▼お試しへのボタン*/
.otameshi{ padding: 1em 2.8em !important; text-decoration: none; color: #FFFFFF; background: #9A0000; transition: .4s; font-weight: bold;}
.otameshi:hover {background: #E03F3F; color: white;}

/*店舗からのお知らせ*/
.oshirase{ padding: 0.5em 6em !important; text-decoration: none; color: #9A0000; background: #FFFFFF; border: solid 1px #9A0000; transition: .4s; font-size: 11pt; font-weight: bold;}
.oshirase:hover {background: #9A0000; color: white;}


/*TOP付近のスライダー*/
#gift{width: 156px; float: left !important; margin-right: 5px;}
#oga_slide{width: 1035px;float: left !important; }


/*ランキング付近のスタイリング*/

.rank{ width: 190px; position: relative; float: left; margin-right: 10px;}
.rank_no{ width: 100%; max-width: 36px; position: absolute; left: 15px; box-shadow: 1px  2px 3px 1px #555555;}
.rank_last{margin-right: 0 !important;}
.rank p{ font-size: 13pt;}
.rank_price{ font-weight: bold; color: #9A0000; text-align: right;}


/*各個別商品導線のスタイリング*/
.tab_wrap{width:100%; margin:80px auto;}/*横幅とか高さとか*/
input[type="radio"]{display:none;}
.tab_area{font-size:0; margin:0 20px;}
.tab_area label{width:24%; margin:0 5px; display:inline-block; padding:12px 0; color:#FFFFFF; background:#777777; font-size:13px; cursor:pointer; transition:ease 0.2s opacity;}
.tab_area label:hover{opacity:0.5;}

.panel_area{background:#fff; border: solid 5px #1e1b36;}/*ここから以下がアイテムが表示されているコンテンツのスタイリングです*/
.tab_panel{width:100%; padding:20px 0; display:none;}
.tab_panel p{font-size: 13pt;}

#tab1:checked ~ .tab_area .tab1_label{background:#1e1b36; color:#FFFFFF;}
#tab1:checked ~ .panel_area #panel1{display:block;}
#tab2:checked ~ .tab_area .tab2_label{background:#1e1b36; color:#FFFFFF;}
#tab2:checked ~ .panel_area #panel2{display:block;}
#tab3:checked ~ .tab_area .tab3_label{background:#1e1b36; color:#FFFFFF;}
#tab3:checked ~ .panel_area #panel3{display:block;}
#tab4:checked ~ .tab_area .tab4_label{background:#1e1b36; color:#FFFFFF;}
#tab4:checked ~ .panel_area #panel4{display:block;}

.eraberu img{display: block; margin:0 0 0 auto;}/*これで赤いボタンを右寄せしてます*/



/*===== スライダー ======*/
.slider {margin: 0px; border: 0;}
.slider img {width: 100%; height: auto;}/*ある程度の可変に耐えられるように画像のウィスは100%です*/
.single-item {max-width: 600px; margin: 0 auto;}
.multiple-item .slick-next{right: 20px; z-index: 99;}
.multiple-item .slick-prev{left: 15px; z-index: 100;}

.slick-dots {bottom:-25px;}
.multiple-item li {margin: 0 20px;}/*画像と画像の間の幅です*/
.dots_haba{padding-bottom: 25px;}

.slider{ background: #000000; padding: 20px 0;}/*下の点をコンテンツから離して表示しています*/


/*===== MOVEを中心としたコンテンツ ======*/
.line{width: 270px; margin-right: 30px;}
.line p{color:#1e1b36;}

.move{width: 645px; margin-right: 30px;}

.brand{width: 209px;}
.sen{border-bottom-style: dashed ; margin: 15px 0;}


/*===== 若杉について ======*/
.wakasuginitsuite{ padding: 10px; background: #FFFFFF; position: absolute; top: -20px; }/*コンテンツ大見出しのスタイリング*/
.wakasugi_box{position: relative; border: solid 1px #333333;}

.tenpo{ width: 540px; margin-right: 40px;}
.height_line{border-left: solid #1e1b36 3px;}/*コンテンツ見出し横の縦の線*/

.tenpo_rank{ width: 555px;}/*店舗売れ筋まわりのスタイリング*/
.shop_ranking{ width: 168px; margin-right: 15px;}


/*===== 下部コンテンツ ======*/
.left_nav{width: 190px; margin-right: 17px;}
.cate_ul{ margin:0;list-style-type: none; font-weight: bold;letter-spacing:1pt; padding: 15px 0 15px 15px;}
.cate_ul li{ margin-bottom: 10px;}

.kabu_contents{width: 990px;}
.rank2{ width: 188px; position: relative; float: left; margin-right: 10px;}/*おかずやカレーランキングのスタイリング*/


/*===== フッターコンテンツ ======*/
.bg_color{background:#1e1b36;}
.two_box1{width: 100%; max-width: 596px; margin-right: 8px; height: 380px;}
.two_box2{width: 100%; max-width: 596px; margin-right: 8px; height: 280px;}
.three_box{width: 100%; max-width: 395px; margin-right: 7px; height: 315px;}


/*===== フッターリンクのスタイリング ======*/
.blue a{color:blue;}/*===== ここでリンクを青にしてます ======*/
.blue a:hover{color:#229FF9;}

/*===== フッターの問い合わせ箇所です ======*/
.tel_box{width: 385px;}
.tel_box_img{width: 20px;}





/*IEハック　インターネットエクスプローラーだけに効かせているCSSです*/
@media all and (-ms-high-contrast: none){
.btn-flat-border {padding: 0.8em 0.5em 0.5em 0.5em !important;}
.oshirase {padding: 0.7em 6em 0.5em 6em !important;}
.text_justify{text-justify:inter-ideograph; }
}