/* ================================
  ippuku
  MB→PC min-width:1100px
================================ */

/* ページタイトル ※調整
-------------------------------- */
#cateTitBox {margin-bottom: 0;}
#cateTitImg {background-image: url("../ippuku/img/contetitimg_ippuku.jpg");}
#cateTitTxt {background-image: url("../ippuku/img/contetitimg_ippuku_bg.jpg");}
#cateTitTxt h1 {background: rgba(143,142,60,0.9);}


/**/
.separatorLine {
border-top: 1px dotted #4c3131;
margin-top: 30px;
padding-top: 10px;
}


@media screen and (min-width: 768px) {/*調整*/
  #ippuku .btnLine {
  margin: 0 auto;
  padding: 5px 10px;
  }
}

@media screen and (min-width: 1100px), print {

  #ippuku .conteMain {/*調整*/
    width: 100%;
    max-width: initial;
    max-width: 100%;/*IE*/
  }

}


/* .ancNav
-------------------------------- */
.ancNav {
padding: 0 0 30px;
text-align: center;
}
.ancNav a {
position: relative;
display: block;
margin: 10px 5px 0;
padding: 10px;
background-color: #9aa24b;
color: #fff;
text-decoration: none;
font-weight: bold;
}
.ancNav a::before {
content: "";
width: 8px;
height: 8px;
border-top: 2px solid rgba(255,255,255,0.5);
border-right: 2px solid rgba(255,255,255,0.5);
position: absolute;
right: 10px;
top: calc(50% - 4px);
transform: rotate(135deg);
}
.ancNav a .text {
display: block;
margin-right: 15px;
}

@media screen and (min-width: 560px) {
  .ancNav a {
  display: inline-block;
  width: 48%;
  margin: 10px 0 0; 
  }
  .ancNav a:nth-child(2n) {
  margin-left: 2%;
  }
}
@media screen and (min-width: 800px), print {
  .ancNav a {
  width: 32%;
  font-size: 15px;
  margin: 5px 0 !important;
  }
  .ancNav a:nth-child(3n) {
  margin-left: 2%;
  }
}

@media screen and (min-width: 910px), print {/*調整*/

  .ancNav a {
  width: auto;
  font-size: 15px;
  margin: 10px 5px !important;
  }

}


/* 見出し
-------------------------------- */
.subTit {
margin: 0;
padding: 10px 0;
font-size: 20px;
}

.subTit::before {
content: "";
background-image: url(../sasugaichi/img/tit_s_con.png);
background-size: contain;
vertical-align: middle;
width: 30px;
height: 30px;
display: inline-block;
margin-right: 10px;
}

#ippuku .fCh {
font-size: 18px;
}


@media screen and (min-width: 1100px), print {
  .subTit {
  font-size: 26px;
  }

}


/* #entrance
-------------------------------- */
#entrance {
padding: 0 5%;
}

#entrance img {
width: 100%;
margin: 0 0 20px;
}

@media screen and (min-width: 768px), print {/**/
  #entrance {
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
  padding: 0 1%;
  }
  #entrance img {
  width: 48%;
  margin: 0 1%;
  }

}

/* 定休日
-------------------------------- */
#closed.secBox {/*調整*/
padding-top: 10px;
}
#closed dt {
position: relative;
z-index: 2;
background: #ffb8b8;
border-radius: 6px;
animation: fuwafuwa 2s infinite;
}
#closed dt.balloon::before {
border-top: 15px solid #ffb8b8;
}
#closed dd {
position: relative;
background: linear-gradient(-10deg, #fcfbe8, #f8f6d3); ;
margin: -10px 0 0;
padding: 10px 15px;
font-size: 15px;
}
#closed dd::after {
content: "";
position: absolute;
bottom: 0;
right: 0;
width: 14px;
height: 14px;
border: 7px solid #e4e19a;
border-right-color: #fff; /* 背景色 */
border-bottom-color: #fff; /* 背景色 */
box-sizing: border-box;
pointer-events: none;
}

@media screen and (min-width: 768px), print {/*調整*/
  #closed.secBox {
  padding-top: 30px;
  }
  #closed .tit {
  margin-bottom: 20px;
  }
}

/* お知らせ
-------------------------------- */
#newsbxOshirase .tit {
margin: 10px;
text-align: center;
}


#newsbxOshirase .newsBox {
width: 100%;
margin: 0 0 20px;
padding: 10px;
background-color: #f8f6d3;
}
#newsbxOshirase .newsBox dt {
font-weight: bold;
margin: 0;
padding: 10px 30px 10px 5px;
}

#newsbxOshirase .newsBox dd {
background-color: #fff;
margin: 0 0 10px;
padding: 5px 15px 15px;
}
#newsbxOshirase .newsBox dd p {
margin: 0;
padding: 10px 0 0;
}

#newsbxOshirase .newsBox dd table {
border: 1px solid #ddd;
width: 100%;
}
#newsbxOshirase .newsBox dd th,
#newsbxOshirase .newsBox dd td {
border: 1px solid #ddd;
padding: 5px;
text-align: left;
font-size: 15px;
}
#newsbxOshirase .newsBox dd th {
background: #effdca;
width: 30%;
}

@media screen and (max-width: 767px) { /*調整*/
  #newsbxOshirase .newsBox dd img {
  width: 100%;
  }
}

@media screen and (min-width: 768px), print { /*調整*/

  #newsbxOshirase .newsBox dt {
  font-size: 18px;
  }
  #newsbxOshirase .newsBox dd {
  padding: 10px 20px 20px;
  }

  #newsbxOshirase .pcFlexSec .txtBox {
  flex: 1;
  }
  #newsbxOshirase .pcFlexSec .imgBox {
  width: 50%;
  max-width: 400px;
  margin-left: 20px;
  }  
}

/* #newsRank
-------------------------------- */
#newsRank {
  overflow: hidden;
}

#newsRank .tit {
  position: relative;
  z-index: 2px;
  margin: 0 5%;
  text-align: center;
}

#newsRank .bgBox {
  background: #fff9f0;
  background-image: repeating-linear-gradient(45deg, #f5f2d5 25%, transparent 25%, transparent 75%, #f5f2d5 75%, #f5f2d5), repeating-linear-gradient(45deg, #f5f2d5 25%, #fff9f0 25%, #fff9f0 75%, #f5f2d5 75%, #f5f2d5);
  background-position: 0 0, 30px 30px;
  background-size: 60px 60px;
  margin: -30px 0 0;
  padding: 30px 0 20px;
}

#newsRank ol {
  list-style: none;
  margin: 0;
  padding: 0 4%;
}

#newsRank li {
  position: relative;
  margin: 0;
  padding: 20px 0 10px;
}

#newsRank #rank01::before {
  background: url("../shop/img/ranking_1.png") no-repeat top left;
}
#newsRank #rank02::before {
  background: url("../shop/img/ranking_2.png") no-repeat top left;
}
#newsRank #rank03::before {
  background: url("../shop/img/ranking_3.png") no-repeat top left;
}
#newsRank li::before {
  background-size: 60px 60px;
  position: absolute;
  z-index: 2;
  content: "";
  width: 60px;
  height: 60px;
  top: -10px;
  left: 5px;
}

#newsRank li .imgBox {
  margin-bottom: 10px;
}
#newsRank li .imgBox img {
  width: 100%;
  height: auto;
  border-radius: 10px;
}

#newsRank li .rankData {
  padding-top: 5px;
  font-size: 14px;
}

#newsRank li .rankTxt {
  font-size: 14px;
}

@media screen and (min-width: 768px), print { /*調整*/
  #newsRank ol {
    display: flex;
    justify-content: center;
    padding-top: 40px;
  }
  #newsRank li {
    flex-shrink: 0;
    width: 31.3%;
    margin: 0 1%;
  }
  
  #newsRank li::before {
    top: -20px;
  }
  
}

/* #gelato
-------------------------------- */
#gelatoData {
  background-color: #ffe8e8;
  border: 5px dotted #fff;
  margin: 20px 0;
  padding: 10px;
}
#gelatoData table {
  border: 3px solid #fff;
  width: 100%;
}
#gelatoData th,
#gelatoData td {
  padding: 9px;
  border: 1px solid #fff;
  font-size: 15px;
}
#gelatoData td p {
  padding: 5px 0 0;
}
#gelatoData td ul {
  padding: 0 0 0 1.8em;
}

/* .gelatoInfo */
.gelatoInfo {
  margin-bottom: 10px;
}

/* #gelatoNews */
#gelatoNews.secBox {/*調整*/
padding-bottom: 0;
}
#gelatoNews .balloon {
position: relative;
z-index: 2;
margin-left: 5%;
font-size: 20px;
animation: fuwafuwa 2s infinite;
background: #a3ca4b;
border-radius: 6px;
}
#gelatoNews .balloon::before {
border-top: 15px solid #a3ca4b;
}

#gelatoNews .layBox {
position: relative;
border-radius: 0 12px 12px 0;
border: 4px dotted #ffe8e8;
width: 95%;
margin: -10px auto 0 -4px;
padding: 20px 5% 30px;
}
#gelatoNews .layBox::before {
position: absolute;
top: 15px;
left: 15px;
content: "";
width: 100%;
height: 100%;
background: #fdffea;
border-radius: 12px;
z-index: -2;
}

.gelatoItem {
padding-top: 10px;
}

.gelatoItem .imgBox img {
border-radius: 12px;
width: 100%;
}

.gelatoItem .newsTit {
color: #ff7575;
padding: 20px 0 0;
font-size: 18px;
}
.gelatoItem p {
 font-size: 14px;
}


.gelatonote {
padding: 20px;	
border: 2px dotted #ff7575;
	color: #ff7575;
	margin-top: 30px;
	margin-bottom: 10px;
	background: #fefff3;
	border-radius: 12px;
}

@media screen and (max-width: 767px) {/*調整*/
  /*.gelatoInfo */
  .gelatoInfo {
    padding: 0 5%;
  }
.gelatonote {
font-size: 14px;
}
}

@media screen and (min-width: 768px), print {/*調整*/

  /*.gelatoInfo */
  .gelatoInfo {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .gelatoInfo .txtBox {
    padding: 0 2% 0 5%;
    flex-shrink: 0;
    width: 50%;
  }
  .gelatoInfo:nth-child(2) .txtBox {
    padding: 0 5% 0 2%;
  }
  .gelatoInfo .shopImg {
    flex-shrink: 0;
    width: 50%;
  }
  .gelatoInfo:nth-child(1) img {
  border-radius: 20px 0 0 20px;
  }
  .gelatoInfo:nth-child(2) img {
  border-radius: 0 20px 20px 0;
  }
  
  /* #gelatoNews */
  .gelatoItemFlex {
  display: flex;
  column-gap: 4%;
  flex-wrap: wrap;
  }
  .gelatoItemFlex .gelatoItem {
  flex-shrink: 0;
  width: 48%;
  padding-top: 20px;
  }
    
}

@media screen and (min-width: 1280px) {/*調整*/
  .gelatoItemFlex .gelatoItem {
  width: 30.6%;
  }
}


/* #お知らせ */
.newsItem .newsTit {
  color: #ff7575;
  padding: 20px 0 0;
  font-size: 18px;
}
.newsItem img {
	width: 100%;
}
@media screen and (min-width: 768px), print {

  .newsItemFlex {
  display: flex;
  column-gap: 4%;
  flex-wrap: wrap;
  }
  .newsItemFlex .newsItem {
  flex-shrink: 0;
  width: 48%;
  padding-top: 20px;
  }
    
 }



/* 月替わり商品
-------------------------------- */
#season .tit {
position: relative;
z-index: 2;
text-align: center;
}
#season .layBox {
position: relative;
border-radius: 12px 0 0 12px;
border: 4px dotted #e4d5a9;
width: 95%;
margin: -30px -4px 0 auto;
padding: 20px 5% 30px;
}

.seasonTeaItem {
border-top: 1px dotted #e4d5a9;
margin-top: 20px;
padding-top: 20px;
}

.seasonTeaItem .imgBox {
padding-bottom: 20px;
}
.seasonTeaItem .imgBox img {
box-shadow: 0 1px 5px -1px #888;
}


#month01 .itemTit { color: #C52A2C;}
#month02 .itemTit { color: #DC890A;}
#month03 .itemTit { color: #849A05;}
#month04 .itemTit { color: #D94091;}
#month05 .itemTit { color: #3A8100;}
#month06 .itemTit { color: #1D2C74;}
#month07 .itemTit { color: #008282;}
#month08 .itemTit { color: #640B5B;}
#month09 .itemTit { color: #2D347B;}
#month10 .itemTit { color: #600;}
#month11 .itemTit { color: #B33E96;}
#month12 .itemTit { color: #937615;}


@media screen and (min-width: 768px), print {/*調整*/
  #season .layBox {
  padding-top: 30px;
  }
  
  .seasonTeaItem {
  display: flex;
  align-items: center;
  padding-top: 30px;
  }
  .seasonTeaItem .imgBox {
  flex-shrink: 0;
  width: 400px;
  margin-right: 30px;
  }
}


/* 店内紹介
-------------------------------- */
#tennai .tit {
text-align: center;
}
#tennai #box01.secBox {
padding-top: 0;
}

@media screen and (max-width: 767px) {/*調整*/
  #tennai .secBox {
  padding: 20px 0;
  }
}

@media screen and (min-width: 768px), print {/*調整*/
  #tennai .secBox {
  display: flex;
  justify-content: space-between;
  align-items: center;
  }

    #tennai #box01 p {
  flex-shrink: 0;
  width: 48%;
  }
  #tennai #box01 p:nth-child(2) {
  margin: 0 2%;
  }
  
  #tennai #box01 img {
  width: 100%;
  }
  
  #tennai .imgBox {
  flex-shrink: 0;
  width: 480px;
  } 
  
  #tennai #box02 {
  flex-direction: row-reverse;
  }
  #tennai #box02 .imgBox {
  margin-left: 20px;
  } 
  #tennai #box03 .imgBox {
  margin-right: 20px;
  } 
}

/* map
-------------------------------- */
#map {
margin: 0 5%;
}

#map .tit {
text-align: center;
}

#map .box img {
width: 100%;
}

#map .subBox p {
padding: 20px 0 0;
}

#map .balloon {
font-size: 14px;
}

.pcType {
display: none;
}

@media screen and (max-width: 639px) {/*調整*/

  /* 拡大無効化 */
  #map #subMapBox p a {
  pointer-events: none;
  }
  #map #subMapBox p i {
  display: none;
  }
  
  #map .balloon {
  display: none;
  }
}

@media screen and (min-width: 640px) {/*調整*/
  #map .subBox {
  text-align: center;
  padding-top: 20px;
  }
  #map #subMapBox {
  display: flex;
  justify-content: center;
  margin: 20px 10px 0;
  }
  #map #subMapBox p {
  padding: 9px;
  margin: 0 10px;
  border: 1px solid #ddd;
  max-width: 270px;
  text-align: center;
  }
  #map #subMapBox p img {
  max-width: 250px;
  vertical-align: middle;
  }

  #map #subMapBox p a {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  }
  #map #subMapBox p a i {
  position: absolute;
  right: -9px;
  bottom: -9px;
  margin: 0;
  padding: 5px 6px;
  font-size: 30px;
  color: #fff;
  background-color: #690;
  z-index: 5;
  }
  .mbType {
  display: none;
  }
  .pcType {
  display: block;
  }

}

@media screen and (min-width: 1100px), print {
  #map {
  margin: 0;
  }
  
  #map .tit {
  margin-bottom: 20px;
  }
  
  #map .box {
  display: flex;
  align-items: center;
  }
  #map #gaikanImg {
  flex-shrink: 0;
  width: 710px;
  }
}


/* #info
-------------------------------- */
#info .tit {
text-align: center;
margin: 0 5%;
}

#info .gMap {
background-color: #faf2c9;
background-image: repeating-linear-gradient(-45deg, #fff, #fff 4px, transparent 0, transparent 8px);
width: 95%;
padding: 15px 15px 15px 0;
}
#info .gMap iframe {
width: 100%;
}


/* #shopGuide
-------------------------------- */
#shopGuide table th {
white-space: nowrap;
}

#shopGuide table th,
#shopGuide table td {
padding: 8px;
text-align: left;
vertical-align: top;
}
#shopGuide table td ul {
padding-top: 0;
}
#shopGuide table td li:first-child {
padding-top: 0;
}

/* #accessGuide  */
#accessGuide {
border: 1px dotted #d2efe2;
padding: 5px 15px 0;
}


@media screen and (min-width: 1100px), print {
  #accessGuide {
  padding: 15px;
  }

}


/*  oshirase 202203 */

#newsbxOshirase ul.imgBox{
  display: block;
  width: 100%;
  height: auto;
  padding: 15px 0 0;
}

#newsbxOshirase ul.imgBox li {
display: block;
margin: 0 auto;
vertical-align: top;
list-style-type: none;
}

#newsbxOshirase ul.imgBox li figure figcaption {
text-align: left;
font-size: 15px;
font-weight: bold;
}
#newsbxOshirase .pcFlexSec div.imgBox{
	margin-top: 10px;
}
#newsbxOshirase .pcFlexSec .imgBox figure figcaption {
text-align: left;
font-size: 15px;
font-weight: bold;
}
/* 3列表示 */
#newsbxOshirase ul.imgBox.col3 li:not(:last-child) {
margin-bottom: 10px;
}

@media screen and (min-width: 768px), print {

  #newsbxOshirase ul.imgBox {
    display: flex;
  }

  #newsbxOshirase ul.imgBox li {
  display: inline-block;
  margin: 0 auto;
  }

  #newsbxOshirase ul.imgBox li figure figcaption {
  text-align: left;
  }
  
  /* 3列表示 */
  #newsbxOshirase ul.imgBox.col3 li {
  margin-bottom: 0;
  }
  #newsbxOshirase ul.imgBox.col3 li img {
  width: 100%;
  max-width: 300px;
  height: auto;
  }
  #newsbxOshirase ul.imgBox.col3 li:nth-child(n+2) {
  margin-left: 20px;
  }
#newsbxOshirase .pcFlexSec div.imgBox{
	margin-top: 0px;
}
}



.newsBox table{
  border-collapse: collapse;
  width: 100%;
}
.newsBox .tb01 td{
  padding: 10px!important;
  border: solid 1px #ccc;
  text-align:center;
  box-sizing:border-box;
	background: #effdca;
}

@media screen and (max-width: 768px) {
  .newsBox .tb01 .head{
    display:none;
  }
  .newsBox .tb01 {
    width: 100%;
  }
  .newsBox table.tb01 td {
    display: block;
    width: 100%;
    border-bottom:none;
  }
  .newsBox .tb01 tr:last-child{
    border-bottom: solid 1px #ccc;
  }
}


#sale20260502 .fBox{
	display: flex;
	gap:10px;
}
@media screen and (max-width: 590px) {
	#sale20260502 .fBox{
    display: block;
  }
}


/* newsKurashiotasuke
-------------------------------- */
#newsKurashiotasuke {
  width: 100%;
  max-width: 1000px;
  margin: 20px auto;
  background-color: #fbf0d0;
}
#newsKurashiotasuke .textBox {
  margin: 0;
  padding: 15px 3%;
}

#newsKurashiotasuke p {
  margin: 0;
  padding: 5px 0 0;
}
#newsKurashiotasuke > p:first-of-type {
  padding: 0;
}

#newsKurashiotasuke p.fBig {
  font-size: 18px;
}

#newsKurashiotasuke p.periodBox {
  color: #d32c69;
}

#newsKurashiotasuke .cap p {
  font-size: 13px;
}


@media screen and (min-width: 800px) {
  
  #newsKurashiotasuke {
    display: flex;
    align-items: center;
  }
  #newsKurashiotasuke .imgBox {
    width: 50%;
    max-width: 400px;
  }
  #newsKurashiotasuke .textBox {
    flex: 1;
  }

}

