@charset "utf-8";
/*---------------------------------------------
	body
---------------------------------------------*/
html { scroll-behavior: smooth; font-size: 62.5%;} /* 10px */
body { font-size: 1.6rem; color: #331214;line-height: 1.9;text-align: left;-webkit-text-size-adjust: 100%; background: #E9D2B3; } /* 16px */
p    { font-size: 1.6rem;} /* 16px */
img { width: 100%; height: auto; }

h2{font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", Georgia, serif; font-weight:500;}
/*---------------------------------------------
 **  フォント
---------------------------------------------*/
.mincho{font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "Hiragino Mincho Pro", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", Georgia, serif;}


/*---------------------------------------------
 **  フッターナビ
---------------------------------------------*/
#footer #nav ul li ul{ display: none; }
/*---------------------------------------------
 **  メイン画像
---------------------------------------------*/

/*---------------------------------------------
	Anchor
---------------------------------------------*/
a {	outline: none;}
a:link {text-decoration: none;color: #0059B2; text-decoration: underline;}
a:visited {text-decoration: none;color: #0059B2;}
a:hover {	color: color-mod(#0059B2 shade(50%)); text-decoration: none;}
a:active {	text-decoration: none;	color: #0059B2;}
a { -webkit-transition: all 0.3s;  transition: all 0.3s; }

/*---------------------------------------------
	p
---------------------------------------------*/
p {margin-bottom: 1em; }
p+a {margin-top: 1em !important ; }
p+div {margin-top: 1.5em !important ; }

/*---------------------------------------------
 ** padding
---------------------------------------------*/
.pLR_1em { padding-left: 1em; padding-right: 1em;}

/*---------------------------------------------
 ** margin
---------------------------------------------*/
.m0a { margin: 0 auto; }

/*---------------------------------------------
 ** フォント
---------------------------------------------*/
.fwb { font-weight: bold;}

/*---------------------------------------------
 ** ON OFF hover
---------------------------------------------*/
.hover {-webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out;}
.hover:hover{ opacity:0.6; filter:alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }

/*---------------------------------------------
 **  画像角丸
---------------------------------------------*/
/* img{-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px;} */

/*---------------------------------------------
 **  ページトップ
---------------------------------------------*/
#pageTop {
  position: fixed;
  bottom: 20px;
  right: 20px;
    z-index: 999;
}
#pageTop a {
  display: block;
  padding: 5px 3px 0px 3px;
  border-radius: 30px;
  background-color: #02529C;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  text-align: center;
  background: url(../img/common/page_top.png) no-repeat;
  background-size:100%;
  -moz-border-radius:0px;
  -webkit-border-radius:0px;
  border-radius:0px;
}
#pageTop a:hover {
  text-decoration: none;
  opacity: 0.7;
}

/*---------------------------------------------
 **   text-align
---------------------------------------------*/
.ter{ text-align:right;}
.tac{ text-align: center;}

/*---------------------------------------------
 **  position
---------------------------------------------*/
.por{position: relative;}

/*---------------------------------------------
 ** display
---------------------------------------------*/
.db{ display: block !important; }

/*---------------------------------------------
 ** パンくずリスト
---------------------------------------------*/
nav#breadcrumbs ol{ 
   padding:0;
}
nav#breadcrumbs ol li {
  display: inline;
  list-style-type: none;
  font-size:80%;
}
nav#breadcrumbs ol li:before {
  content: " > ";
}
nav#breadcrumbs ol li:first-child:before {
  content:"";
}

/*---------------------------------------------
 **  色関係
---------------------------------------------*/

/*---------------------------------------------
 **  ボタン
---------------------------------------------*/
.bt_01_ful_w{width:100%; padding-left: 0 !important;padding-right: 0 !important;}

/*=================================================================================================================================*/
/**  共通部分	*/
/*=================================================================================================================================*/

/*---------------------------------------------
 ** 見出し
---------------------------------------------*/
/*---------------------------------------------
 ** h2
---------------------------------------------*/
h2       {font-size: 3.9rem;line-height: 1.5;margin-bottom :1.8rem;}

/*---------------------------------------------
 ** h3
---------------------------------------------*/
h3{ margin-bottom:1.5rem; }

/*---------------------------------------------
 ** コンテンツ全体
---------------------------------------------*/
#content{
   width:100%;
}
#main{ 
   width:100%;
   margin:0 auto;
   padding:inherit;
}   
/*---------------------------------------------
 ** セクション
---------------------------------------------*/
.section_block {/* margin-bottom: 10px; */}

/*---------------------------------------------
 ** ヘッダー記述
---------------------------------------------*/
#header{width: 100%; }

/* メインイメージ */
.header_wrapper {width:100%; position:relative; text-indent:100%; white-space:nowrap; overflow:hidden;}
.header_wrapper {background: url( ../img/main_img/top_main.jpg) top center no-repeat; margin-bottom:50px;}


/* ロゴ */
#logo {}
#logo a{
	width: 100%;
	height: 100%;
	display: block;
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	background: url(../img/common/logo.png) no-repeat;
	background-size: 100%;
	z-index: 9;
	position: relative;
}
#footer #logo a{
	background: url(../img/common/footer_logo.png) no-repeat;
}


/*---------------------------------------------
 ** フッター記述
---------------------------------------------*/
#footer{
	clear:both;
   position: relative;
}
#footer{padding: 860px 0 0;box-sizing: border-box; /*通常の記述*/-webkit-box-sizing: border-box;  /*Google ChromeやSafariの機能を利用*/-moz-box-sizing: border-box;  /*Firefoxの機能を利用*/}

.footer_wrapper { background:#E9D2B3;} 







/* footerロゴ */
#footer #logo {
   margin: 0 auto 25px;
   position:relative;
   top:0;
   height: 180px;
}

/* フッターインナー */
.footer_inner{
   width: 100%;
   margin: 0 auto;
   position:relative;
   padding: 0 0 0 0;
}

/* コピーライト */
#copyright	{
   font-size: 0.8em;
   width: 100%;
   text-align:center;
   letter-spacing: 3px;
   padding: 15px 0 18px;
   background: #E9D2B3;
}

/*=================================================================================================================================*/
/**  TOPコンテンツ	*/
/*=================================================================================================================================*/
.bg_01 {background: #162520 url(../img/top/bg_01.jpg) no-repeat top center;}
.bg_02 {background:  url(../img/top/bg_02.jpg) no-repeat top center;}
.bg_03 {background: #FFF url(../img/top/bg_03.jpg) repeat-y top center;}
.bg_04 {background: #FFF url(../img/top/bg_04.jpg) no-repeat top center;}


.attention{ display: block; width:90%; margin: 15px auto; border: 3px solid #FF0000; background:#fff; padding: 25px 25px 10px 25px;}
.attention p{ text-align:center; font-weight:bold; font-size: 110%; color: #FF0000;}
.attention p span{ font-size:90%; color:#000 !important; }

.col_white { color:#FFF;} 
.banner {text-align: center; margin: 20px auto;}
.banner img{ width: auto; }

.flex_item_clounm_3_full { width:33.333%; }

.top_h2_02 { position: relative;}
.top_h2_02:after{width: 200px; height: 200px; position: absolute; background: url(../img/top/01.png) no-repeat; content: ''; }

.top_h2_03 { position: relative;}
.top_h2_03:after{width: 200px; height: 200px; position: absolute; background: url(../img/top/06.png) no-repeat; content: ''; }


.w85{width: 85% !important;}


.shop_img { position: relative;}

.dldiv {padding: 5px 20px 40px;margin: 0px 0 0px;}
.dldiv > div {
  display: -webkit-flex;
  display: flex;
  justify-content: space-between;
  overflow: hidden;
  position:relative;
}
.dldiv dt {
  padding-right: .65em;
  position: relative;
  z-index:10;
  line-height: 1.4em;
  padding-left: 50px;
}
.hot:before{position:absolute;top: 5px;left:0;background:#FFB399;display:inline-block;content: 'HOT';padding: 0px 5px 0px;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;font-size: 13px;font-weight: bold;}
.cold:before{position:absolute;top: 5px;left:0;background:#9AD3FE;display:inline-block;content: 'ICE';padding: 0px 8px 0px;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;font-size: 13px;font-weight: bold;}
.cycle:before{position:absolute;top: -11px;left:0;display:inline-block;content: '・';padding: 0px 5px 0px;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;font-size: 34px;font-weight: bold;}

.dldiv dt p {font-size:28px;padding: 4px 0px;font-style: italic;}
.drink_name {position: absolute;top: 28px;left: 56px;font-size: 12px;color: #AAAAAA;}
.nonal span {top:50px;}

.dldiv dt:before {
  background-image: radial-gradient(1px 1px, CurrentColor, rgba(0,0,0,0));
  background-position: center;
  background-size: 0.4em 100%;
  content: '';
  display: block;
  position: absolute;
  top: -11px;
  left: 100%;
  width: 100vw;
  height: 100%;
  z-index: -2;
}
.dldiv dt.nonal:before {  top: -21px !important;}

.price{background: url(../img/top/bg_03_mini.png) !important;position: relative;z-index: 10;font-size: 20px;}