@charset "UTF-8";


/*================================================================================================
reset
================================================================================================*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, img, dl, dt, dd, ol, ul, li, form, label, legend, table, tbody, tr, th, td, article, embed, footer, header, hgroup, nav, section, time{margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;font-weight:normal;}

/* HTML5 display-role reset for older browsers */
article, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none;}
table {border-collapse: collapse;border-spacing: 0;}

img{vertical-align:bottom; max-width: 100%;}
body,html{height:100%;}
*{box-sizing:border-box;}

body{-webkit-text-size-adjust: none;}
button{cursor:pointer;}



/*================================================================================================
font
================================================================================================*/
/* font-family */
body{font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic,"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","Meiryo","メイリオ","MS PGothic","MS Pゴシック",sans-serif;}

/* font-size */
body{ font-size: 18px; }

/* color */
body{ color: #191919; }

/* line-height */
body{ line-height: 1.8;}


/*================================================================================================
useful
================================================================================================*/
/* float */
.fL{float: left;}
.fR{ float: right;}

/* clear */
.cl{display: block; min-height: 1%;}
.cl:after{clear: both;content:".";display: block;	height: 0;visibility: hidden;}
* html .cl{height: 1%; /*\*//*/height: auto;overflow: hidden;/**/}
.clears {clear:both;}

/* link */
a{text-decoration: none; color: #191919;}
a:link,a:visited{ text-decoration:none;}
/*a:hover,a:active{ text-decoration:underline;}*/

a.line:link,a.line:visited{ text-decoration:underline;}
a.line:hover,a.line:active{ text-decoration:none;}

a:hover img{ opacity:0.9; transition: 0.5s; }



/*================================================================================================
common
================================================================================================*/
.wrapper{
  width: 980px;
  margin: 0 auto;
}
.secArea{
  text-align: center;
}
.TtlArea{
  color: #fff;
}
.secMenuSP, .mainSp{
  display: none;
}
.pcNone{
  display: none;
}


/*================================================================================================
itemArea
================================================================================================*/
.itemArea{
  background: #f7f2e1;
  padding-bottom: 30px;
}
.itemArea h3{
  background: #3e1900;
  color: #fff;
  font-size: 44px;
  padding: 10px 0;
}
.itemArea .csvSec{
  padding: 30px 0;
}
.itemArea .csvSec .wrapper > ul{
  font-size: 0;
  text-align: left;
}
.itemArea .csvSec .wrapper > ul > li{
  font-size: 18px;
  text-align: center;
  display: inline-block;
  padding: 30px 10px 10px;
}
.itemArea .csvSec.col3 .wrapper > ul > li{
  width: 33.33%;
  vertical-align: top;
}
.itemArea .csvSec.col4 .wrapper > ul > li{
  width: 25%;
}
.itemArea .csvSec .wrapper > ul > li > a{
  display: inline-block;
}
.itemArea .csvSec .wrapper > ul > li > a::after{
  content: '';
  display: inline-block;
  vertical-align: middle;
}
.itemArea .csvSec.col3 .wrapper > ul > li > a::after{
  background: url('../img/btn_item02.png') no-repeat;
  background-size: contain;
  width: 100%;
  height: 52px;
}
.itemArea .csvSec.col4 .wrapper > ul > li > a::after{
  background: url('../img/btn_item01.png') no-repeat;
  background-size: contain;
  width: 100%;
  height: 52px;
}
.itemArea .csvSec .wrapper > ul > li > a li{
  line-height: 1.3;
}
.itemArea .csvSec .wrapper > ul > li > a li.itemImg{
  margin-bottom: 10px;
}
.itemArea .csvSec .wrapper > ul > li > a li.itemImg img{
  width: 100%;
}
.itemArea .csvSec .wrapper > ul > li > a li.itemName{
  font-weight: bold;
  font-size: 16px;
}
.itemArea .csvSec .wrapper > ul > li > a li.itemPrice{
  color: #a40101;
  font-size: 28px;
  margin-bottom: 5px;
}
.itemArea .csvSec .wrapper > ul > li > a li.itemPrice span::after{
  content: '円(税別)〜';
  font-size: 18px;
}
.itemArea .moreLink a{
  display: block;
  width: 980px;
  margin: 0 auto;
  color: #a40101;
  font-size: 42px;
  border: solid 3px #a40101;
  border-radius: 5px;
}
.itemArea .itemAreaInfo{
  background: #562800;
  padding: 80px 0;
}
.itemArea .itemAreaInfo.wht{
  background: none;
  padding: 40px 0;
}
.itemArea .itemAreaInfo .itemAreaInfoInner{
  padding: 20px;
  background: #f9f5e9;
}
.itemArea .itemAreaInfo.wht .itemAreaInfoInner{
  padding: 50px;
  background: #fff;
  border: solid 1px #aa9654;
}
.itemArea .itemAreaInfo .itemAreaInfoInner .forBorderSec{
  border: solid 1px #e6e0cf;
  padding: 30px;
}
.itemArea .itemAreaInfo .itemAreaInfoInner h3{
  background: #f9f5e9;
  font-size: inherit;
  padding: 0 0 40px 0;
}
.itemArea .itemAreaInfo .itemAreaInfoInner ul{
  font-size: 0;
}
.itemArea .itemAreaInfo .itemAreaInfoInner ul li{
  display: inline-block;
  font-size: 15px;
  vertical-align: top;
}
.itemArea .itemAreaInfo .itemAreaInfoInner ul li.img{
  width: 45%;
  padding-right:50px;
}
.itemArea .itemAreaInfo .itemAreaInfoInner ul li.txt{
  width: 55%;
  text-align: left;
}
.itemArea .itemAreaInfo.wht .itemAreaInfoInner ul li.img{
  width: 35%;
}
.itemArea .itemAreaInfo.wht .itemAreaInfoInner ul li.txt{
  width: 65%;
}
.itemArea .itemAreaInfo .itemAreaInfoInner ul li.txt h4{
  margin-bottom: 20px;
}
.itemArea .itemAreaInfo .itemAreaInfoInner .infoMoreLink a{
  display: block;
  background: #aa9654;
  color: #fff;
  line-height: 2.5;
  margin-top: 20px;
}
.itemArea .itemAreaInfo .itemAreaInfoInner .infoMoreLink a::after{
  content: '';
  display: inline-block;
  width: 9px;
  height: 10px;
  margin-left: 1em;
  vertical-align: middle;
  background: url('../img/ico_arrow.png') no-repeat;
}



/*================================================================================================
itemArea
================================================================================================*/
#floatMenu{
  position: fixed;
  right: 0;
  bottom: 50px;
  background: #fff;
  text-align: center;
  padding: 8px 0 8px 8px;
  z-index: 9999;
}
#floatMenu li:not(:last-child){
  margin-bottom: 3px;
}
#floatMenu li a{
  display: block;
  background: #141414;
  font-size: 15px;
  color: #fff;
  line-height: 1.3;
  padding: 8px 12px;
}
#floatMenu li.coupon a{
  position: relative;
  font-size: 17px;
  font-weight: bold;
  color: #222;
  background: #c0a735;
}
#floatMenu li.coupon a::before{
  position: absolute;
  left: 6px;
  top: 25px;
  content: '';
  display: inline-block;
  width: 11px;
  height: 11px;
  vertical-align: middle;
  background: url('../img/tab_ico01.png') no-repeat;
}
#floatMenu li.pagetop a{
  background: #9a0101;
}
#floatMenu li.pagetop a::before{
  content: '';
  display: inline-block;
  width: 15px;
  height: 12px;
  vertical-align: middle;
  margin-right: 5px;
  background: url('../img/tab_ico02.png') no-repeat;
}


/*================================================================================================
mainPc
================================================================================================*/
@media screen and (min-width: 1301px) {
.mainPc .mainVis02{
  display: none;
}
.mainPc .mainVis{
  height: 460px;
  background-image:
    url('../img/main_bg01.png'),
    url('../img/main_bg02.png'),
    url('../img/main_bg00.png');
  background-repeat:
    no-repeat,
    no-repeat,
    repeat;
  background-position:
    left bottom,
    right bottom,
    left top;
}
.mainPc .mainVisImg{
  text-align: center;
  padding-top: 55px;
}
} /* @media screen and (max-width: 1301px) */

@media screen and (max-width: 1300px) {
.mainPc .mainVis {
  display: none;
}
} /* @media screen and (max-width: 1300px) */

@media screen and (max-width: 1125px) {
#floatMenu {
  display: none;
}
} /* @media screen and (max-width: 1125px) */


/*================================================================================================
secMenu
================================================================================================*/
.secMenu{
  background: #ece3ba;
  padding: 80px 0 50px;
}
.secMenu a{
  color: #fff;
}
.secMenu > ul{
  font-size: 0;
  text-align: center;
}
.secMenu > ul > li{
  display: inline-block;
  background: #141414;
  text-align: center;
  width: 250px;
  height: 200px;
  font-size: 30px;
  margin-left: 2px;
  margin-right: 2px;
  vertical-align: bottom;
}
.secMenu > ul > li:nth-of-type(-n+3){
  margin-bottom: 60px;
}
.secMenu > ul > li > a::after{
  content: '';
  display: inline-block;
  width: 20px;
  height: 10px;
  vertical-align: middle;
  background: url('../img/menu_arrow.png') no-repeat;
}
.secMenu ul.innerUl li{
  line-height: 1.3;
}
.secMenu li.thumbs{
  margin-top: -40px;
}
.secMenu > ul > li > a > ul:not(.text2row) li.thumbs{
  margin-bottom: 20px;
}
.secMenu > ul > li > a > ul.text2row li.thumbs{
  margin-top: -59px;
}



/*================================================================================================
secInfo
================================================================================================*/
.secInfo{
  background: #e4cb57;
  padding: 30px 0;
}
.secInfoCont{
  background: #fffae9;
  padding: 50px;
}
.secInfoCont h2{
  text-align: center;
  margin-bottom: 30px;
}



/*================================================================================================
sec01
================================================================================================*/
.sec01{
  background: #210606;
  padding: 50px;
}
.sec01 h2{
  color:#FFFFFF;
  font-size:40px;
  font-weight:bold;
}
.sec01 img{
  margin-bottom: 30px;
}
.sec01 p{
  color:#FFFFFF;
  margin-bottom:20px;
  font-size:18px;
  line-height: 120%;
 } 
  .sec01 p span{
  font-size:15px;
 } 


/*================================================================================================
sec02
================================================================================================*/
.sec02{
  background: #fdf6d7;
  padding: 100px 0;
}
.sec02 h2{
  margin-bottom: 100px;
}
.sec02 .sec02Conts:not(:first-of-type){
  margin-top: 50px;
}
.sec02 .sec02Conts ul{
  display: flex;
  display:-ms-flexbox;
  justify-content: space-between;
  -ms-flex-pack:justify;
}



/*================================================================================================
sec03
================================================================================================*/
.sec03 .sec03Ttl{
  background: #290f0c;
}
.sec03 .sec03Ttl h2{
  margin-bottom: 30px;
}
.sec03 .sec03Ttl p.txt{
  margin-bottom: 30px;
  text-shadow: 2px 2px 1px #960101,
               -2px 2px 1px #960101,
               2px -2px 1px #960101,
               -2px -2px 1px #960101;
}
.sec03 .sec03More{
  background: #25150b;
  padding: 50px 0;
}
.sec03 .sec03More h3{
  margin-bottom: 30px;
}
.sec03 .sec03MoreLink a{
  display: block;
  background: #960101;
  color: #fff;
  font-size: 42px;
  font-weight: bold;
  line-height: 2.5;
  border-radius: 5px;
}



/*================================================================================================
sec04
================================================================================================*/
.sec04 .sec04Ttl{
  background: #290f0c;
}
.sec04 .sec04Ttl h2{
  margin-bottom: 30px;
}



/*================================================================================================
sec05
================================================================================================*/
.sec05 .sec05Ttl{
  background: #290f0c;
}
.sec05 .sec05Ttl h2{
  margin-bottom: 30px;
}



/*================================================================================================
sec06
================================================================================================*/
.sec06 .sec06Ttl{
  background: #290f0c;
}
.sec06 .sec06Ttl h2{
  margin-bottom: 30px;
}



/*================================================================================================
sec07
================================================================================================*/


.sec07{
  background: #3e1900;
  padding: 50px 0;
  color: #fff;
}



/*================================================================================================
footer
================================================================================================*/
.footer{
  padding: 20px 0;
  text-align: center;
}
.footer ul li{
  display: inline-block;
}
.footer ul li:not(:last-child)::after{
  content: '　｜　';
}







/*================================================================================================
smartphone
================================================================================================*/
@media screen and (max-width: 768px) {

/*================================================================================================
pc reset
================================================================================================*/
.wrapper, .sec07 .wrapper{
  width: 100%;
}
#floatMenu,.spNone{
  display: none;
}
.pcNone{
  display: block;
  margin: auto;
}



/*================================================================================================
common
================================================================================================*/
body{
  font-size: 14px;
}



/*================================================================================================
mainSp
================================================================================================*/
.mainPc{
  display: none;
}
.mainSp{
  height: 110vh;
  display: block;
  background:
    url('../img/main_bg01_sp.png'),
    url('../img/main_bg00.png');
  background-repeat:
    no-repeat,
    repeat;
  background-position:
    bottom,
    top left;
  background-size:
    contain,
    auto;
}
.mainSp h1{
  width: 80%;
  margin: auto;
  padding-top: 25%;
  text-align: center;
}



/*================================================================================================
secMenu
================================================================================================*/
.secMenu{
  display: none;
}
.secMenuSP{
  display: block;
  background: #ece3ba;
  padding: 20px 0;
}
.secMenuSP ul{
  display: flex;
  flex-wrap: wrap;
}
.secMenuSP li{
  display: inline-block;
  width: 32.3%;
  margin: 0 0.5% 3px;
}
.secMenuSP li:nth-of-type(n+4){
  width: 49%;
  margin: 0 0.5% 3px;
}



/*================================================================================================
itemArea
================================================================================================*/
.itemArea h3{
  font-size: 18px;
}
.itemArea .moreLink a{
  width: 90%;
  font-size: 18px;
}
.itemArea .csvSec{
  padding: 20px 5px 0;
}
.itemArea .csvSec .wrapper > ul > li > a li.itemPrice{
  font-size: 15px;
}
.itemArea .csvSec .wrapper > ul > li{
  padding: 5px 5px 5px;
}
.itemArea .csvSec.col2_sp .wrapper > ul > li{
  width: 50%;
}
.itemArea .csvSec.col3_sp .wrapper > ul > li{
  padding: 5px 5px 15px;
}
.itemArea .csvSec.col3_sp .wrapper > ul > li > a::after{
  background: url(../img/btn_item01.png) no-repeat;
  background-size: contain;
  width: 100%;
  height: 32px;
}
.itemArea .csvSec .wrapper > ul > li > a li.itemImg{
  margin-bottom: 8px;
}
.itemArea .csvSec .wrapper > ul > li > a li.itemName{
  font-size: 12px;
}
.itemArea .csvSec .wrapper > ul > li > a li.itemPrice span::after{
  font-size: 12px;
}
.itemArea .itemAreaInfo{
  padding: 20px 10px;
}
.itemArea .itemAreaInfo .itemAreaInfoInner{
  padding: 10px;
}
.itemArea .itemAreaInfo .itemAreaInfoInner .forBorderSec{
  padding: 10px;
}
.itemArea .itemAreaInfo .itemAreaInfoInner h3{
  padding: 0 0 20px 0;
}
.itemArea .itemAreaInfo .itemAreaInfoInner ul li{
  width: 100% !important;
}
.itemArea .itemAreaInfo .itemAreaInfoInner ul li.img{
  padding-right: 0;
  margin-bottom: 10px;
}
.itemArea .itemAreaInfo .itemAreaInfoInner ul li{
  font-size: 14px;
}
.itemArea .itemAreaInfo.wht{
  padding: 40px 0 0px;
}
.itemArea .itemAreaInfo.wht .itemAreaInfoInner{
  padding: 20px;
  width: 90%;
}
.itemArea .itemAreaInfo .itemAreaInfoInner .infoMoreLink a{
  font-size: 12px;
  margin-top: 10px;
}



/*================================================================================================
secInfoCont
================================================================================================*/
.secInfoCont{
  padding: 20px;
}
.secInfoCont h2{
  margin-bottom: 20px;
  text-align: center;
}



/*================================================================================================
sec01
================================================================================================*/
.sec01{
  padding: 30px;
}
.sec01 h2,
.sec01 .couponImg{
  margin-bottom: 20px;
  line-height: 120%;
}
.sec01 p{
  color:#FFFFFF;
  margin-bottom:20px;
  font-size:4vw;
  line-height: 120%;
 } 



/*================================================================================================
sec02
================================================================================================*/
.sec02{
  padding: 30px 10px;
}
.sec02 h2{
  margin: 0 auto 30px;
}
.sec02 .sec02Conts:not(:first-of-type){
  margin-top: 10px;
}
.sec02 .sec02Conts.itemCol2 li:nth-of-type(odd){
  margin-right: 8px;
}



/*================================================================================================
sec03
================================================================================================*/
.sec03 .sec03Ttl{
  padding: 0 10px;
  background-position:
    right -9999px top,
    left top;
  background-size:
    cover,
    auto;
}
.sec03 .sec03Ttl h2{
  margin-bottom: 20px;
}
.sec03 .sec03Ttl p.txt{
  margin-bottom: 20px;
  font-size: 13px;
}
.sec03 .sec03More h3{
  width: 90%;
  margin: 0 auto 10px;
}
.sec03 .sec03More{
  padding: 30px 0;
}
.sec03 .sec03MoreLink a{
  font-size: 18px;
  width: 90%;
  margin: 0 auto;
}



/*================================================================================================
sec04
================================================================================================*/
.sec04 .sec04Ttl{
  padding:  0 10px;
  background-position: right -20px top 10px, right -90px;
  background-size: 160px ,auto;
}
.sec04 .sec04Ttl h2{
  margin-bottom: 20px;
}



/*================================================================================================
sec05
================================================================================================*/
.sec05 .sec05Ttl{
  padding:  0 10px;
  background-position:
    right -9999px top 70px,
    left top;
  background-size:
    100px,
    auto;
}



/*================================================================================================
sec06
================================================================================================*/
.sec06 .sec06Ttl{
  padding:  0 10px;
}
.sec06 .sec06Ttl h2{
  margin-bottom: 0;
}



/*================================================================================================
sec07
================================================================================================*/

.sec07{
  padding: 40px 20px 20px;
  font-size: 12px;
}
.sec07 h2{
  margin-bottom: 40px;
}
.sec07 ul.bnrBig{
  margin-bottom: 10px;
}
.sec07 ul.bnrNormal > li{
  font-size: 12px;
  line-height: 1.3;
  margin-bottom: 10px;
}
.sec07 ul.bnrNormal > li:nth-of-type(even){
  padding-left: 5px;
}
.sec07 ul.bnrNormal > li:nth-of-type(odd){
  padding-right: 5px;
}



/*================================================================================================
footer
================================================================================================*/
.footer ul li{
  font-size: 12px;
}
.footer ul li:not(:last-child)::after{
  content: ' | ';
}





}  /* @media screen and (max-width: 480px) */