.category {
  background-color: #2e2422;
}

.kamakura {
  background-color: #e26c50;
}

.cinnamonraisin {
  background-color: #e26c50;
}

.tombolo {
  background-color: #e26c50;
}

.chisanashiawasepan {
  background-color: #9ab697;
}

.panya-wakka {
  background-color: #d99e67;
}

.ilebagels {
  background-color: #d99e67;
}

.chisanapanya {
  background-color: #f9c206;
}

.oobaseipan {
  background-color: #2e2422;
}

Three Category Color .shop-info {
  background-color: #2e2422;
}

.pan-info {
  background-color: #2e2422;
}

.pan-another {
  background-color: #2e2422;
}

.natural-yeast {
  background-color: #ffb758;
}

/* ================================================================================
	SP Default CSS 320px-767px
================================================================================ */
@media screen and (max-width: 767px) {
  /* ================================================================================
  	1:Header CSS
  ================================================================================ */
  /* 1:Header Block CSS
  ================================================*/
  #header-main {
    background: url(../images/cinnamonraisin/bg_hero_sp_img02.webp) center 0 no-repeat;
    background-size: cover;
  }
  /* ================================================================================
  	2:Main CSS
  ================================================================================ */
  /* 1:Section1 Block CSS
  ================================================*/
  #shop-info {
    margin-top: 40px;
  }
  #shop-info .main-ti {
    font-size: 2.8rem;
    color: #231815;
    text-align: center;
  }
  #shop-info .main-ti .icon-line01 {
    background-size: auto;
  }
  #shop-info .main-row {
    padding: 0 10px;
  }
  #shop-info .main-row .logo-block {
    margin-top: 20px;
    text-align: center;
  }
  #shop-info .main-row .logo-block img {
    width: 180px;
  }
  #shop-info .main-row .lead-txt {
    margin-top: 20px;
    line-height: 1.8;
  }
  #shop-info .main-row .pic {
    margin-top: 20px;
    text-align: center;
  }
  #shop-info .main-row .basic-info {
    margin-top: 30px;
    width: 100%;
    border: 1px solid #231815;
  }
  #shop-info .main-row .basic-info th {
    padding: 10px;
    background-color: #231815;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    text-align: left;
    font-weight: normal;
    font-size: 1.3rem;
  }
  #shop-info .main-row .basic-info td {
    padding: 10px;
    border-bottom: 1px solid #231815;
    color: #231815;
    font-size: 1.3rem;
  }
  #shop-info #map-social {
    margin-top: 40px;
  }
  #shop-info #map-social .sec-ti {
    text-align: center;
  }
  #shop-info #map-social .flex-content {
    display: block;
  }
  #shop-info #map-social .google-map {
    margin-top: 30px;
    padding: 0 10px;
  }
  #shop-info #map-social .google-map #gmap {
    width: 100%;
    height: 220px;
  }
  #shop-info #map-social .google-map .more-link {
    margin-top: 20px;
    text-align: center;
  }
  #shop-info #map-social .social {
    margin-top: 30px;
    padding: 0 10px;
  }
  #shop-info #recommend-bread {
    margin-top: 40px;
  }
  #shop-info #recommend-bread .icon-line02 {
    background-size: contain;
  }
  #shop-info #recommend-bread .bread-wrap {
    margin-top: 30px;
    padding: 30px 0;
    background: url(../common/images/bg_common_mask_img02.webp) 0 0 repeat;
  }
  #shop-info #recommend-bread .bread-block {
    padding: 30px 10px;
    background: url(../common/images/bg_common_mask_img03.webp) 0 0 repeat;
  }
  #shop-info #recommend-bread .bread {
    text-align: center;
  }
  #shop-info #recommend-bread .bread:not(:first-of-type) {
    margin-top: 30px;
  }
  #shop-info #recommend-bread .bread .pic {
    text-align: center;
  }
  #shop-info #recommend-bread .bread .pic img {
    width: 100%;
  }
  #shop-info #recommend-bread .bread .bread-ti {
    margin-top: 10px;
    font-size: 2.1rem;
  }
  #shop-info #recommend-bread .bread .txt {
    margin-top: 10px;
  }
  #shop-info #recommend-bread .bread .txt .txt-wrap {
    display: inline-block;
    text-align: left;
  }
  #shop-info #related-post {
    margin-top: 40px;
    padding: 0 10px;
  }
  #shop-info #related-post .flex-content {
    display: block;
  }
  #shop-info #related-post .post {
    position: relative;
    z-index: 1;
    margin: 30px auto 0;
  }
  #shop-info #related-post .post .category {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
    padding: 2px 5px;
    color: #fff;
    text-align: center;
    font-size: 1.2rem;
  }
  #shop-info #related-post .post .pic {
    overflow: hidden;
    max-height: 274px;
  }
  #shop-info #related-post .post .pic img {
    width: 100%;
  }
  #shop-info #related-post .post .post-content {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 10;
    width: 100%;
    padding: 5px 10px;
    background-color: rgba(46, 36, 33, 0.78);
  }
  #shop-info #related-post .post .post-content .meta {
    font-size: 1.2rem;
    color: #fff;
  }
  #shop-info #related-post .post .post-content .post-ti {
    margin-top: 5px;
    font-size: 1.6rem;
    color: #fff;
  }
  #shop-info #related-post .post .post-content .post-ti {
    margin-top: 5px;
    font-size: 1.6rem;
    color: #fff;
  }
  #shop-info #related-post .post .post-content .post-ti + p {
    color: #fff;
  }
}
/* ================================================================================
	Tablet&LandScape  CSS 768px-
================================================================================ */
@media screen and (min-width: 768px) {
  /* ================================================================================
  	1:Header CSS
  ================================================================================ */
  /* 1:Header Block CSS
  ================================================*/
  #header-main {
    min-height: 600px;
    background: url(../images/cinnamonraisin/bg_hero_pc_img03.webp) center 0 no-repeat;
    background-size: cover;
  }
  #header-main #header-content .hero-catch {
    top: 45px;
  }
  #header-main #header-content .catch-ti.right {
    bottom: -160px;
  }
  /* ================================================================================
  	2:Main CSS
  ================================================================================ */
  /* 1:Section1 Block CSS
  ================================================*/
  #shop-info {
    margin-top: 40px;
  }
  #shop-info .main-ti {
    font-size: 4.2rem;
    color: #231815;
    text-align: center;
  }
  #shop-info .main-row {
    padding: 0 20px;
  }
  #shop-info .main-row .l-column {
    display: flex;
    width: 62%;
    padding-right: 20px;
  }
  #shop-info .main-row .l-column .logo-block {
    width: 20%;
    margin-top: 40px;
  }
  #shop-info .main-row .l-column .logo-block img {
    width: 130px;
  }
  #shop-info .main-row .l-column .txt-block {
    width: 82%;
    padding-left: 30px;
  }
  #shop-info .main-row .l-column .txt-block .lead-txt {
    margin-top: 40px;
    font-size: 1.6rem;
    line-height: 1.8;
  }
  #shop-info .main-row .r-column {
    width: 38%;
    text-align: right;
  }
  #shop-info .main-row .r-column .pic {
    margin-top: 40px;
  }
  #shop-info .main-row .basic-info {
    margin-top: 40px;
    width: 100%;
    border: 1px solid #231815;
  }
  #shop-info .main-row .basic-info th {
    padding: 10px 20px;
    background-color: #231815;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    text-align: left;
    font-weight: normal;
    font-size: 1.6rem;
  }
  #shop-info .main-row .basic-info td {
    padding: 10px 20px;
    border-bottom: 1px solid #231815;
    color: #231815;
    font-size: 1.6rem;
  }
  #shop-info #map-social {
    margin-top: 80px;
    padding: 0 20px;
  }
  #shop-info #map-social .sec-ti {
    text-align: center;
  }
  #shop-info #map-social .google-map {
    margin-top: 40px;
  }
  #shop-info #map-social .google-map #gmap {
    width: 100%;
    height: 425px;
  }
  #shop-info #map-social .google-map .more-link {
    margin-top: 20px;
    text-align: center;
  }
  #shop-info #recommend-bread {
    margin-top: 80px;
  }
  #shop-info #recommend-bread .bread-wrap {
    margin-top: 40px;
    padding: 50px 0 65px;
    background: url(../common/images/bg_common_mask_img02.webp) 0 0 repeat;
  }
  #shop-info #recommend-bread .bread-block {
    padding: 50px 0;
    background: url(../common/images/bg_common_mask_img03.webp) 0 0 repeat;
  }
  #shop-info #recommend-bread .flex-content {
    padding: 0 20px;
  }
  #shop-info #recommend-bread .bread {
    width: 33.3333%;
    text-align: center;
  }
  #shop-info #recommend-bread .bread:not(:first-child) {
    margin-left: 20px;
  }
  #shop-info #recommend-bread .bread .pic {
    text-align: center;
  }
  #shop-info #recommend-bread .bread .bread-ti {
    margin-top: 10px;
    font-size: 2.1rem;
  }
  #shop-info #recommend-bread .bread .bread-ti .icon-line02 {
    background-size: contain;
  }
  #shop-info #recommend-bread .bread .txt {
    margin-top: 10px;
  }
  #shop-info #recommend-bread .bread .txt .txt-wrap {
    display: inline-block;
    text-align: left;
  }
  #shop-info #related-post {
    margin-top: 60px;
    padding: 0 20px;
  }
  #shop-info #related-post .post {
    position: relative;
    z-index: 1;
    width: 33%;
    margin-top: 40px;
  }
  #shop-info #related-post .post:not(:first-child) {
    margin-left: 20px;
  }
  #shop-info #related-post .post .pic {
    overflow: hidden;
    max-height: 274px;
  }
  #shop-info #related-post .post .category {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 10;
    padding: 2px 5px;
    color: #fff;
    text-align: center;
    font-size: 1.2rem;
  }
  #shop-info #related-post .post img {
    width: 100%;
  }
  #shop-info #related-post .post .post-content {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 10;
    width: 100%;
    padding: 5px 10px;
    background-color: rgba(46, 36, 33, 0.78);
  }
  #shop-info #related-post .post .post-content .meta {
    font-size: 1.2rem;
    color: #fff;
  }
  #shop-info #related-post .post .post-content .post-ti {
    margin-top: 5px;
    font-size: 1.6rem;
    color: #fff;
  }
  #shop-info #related-post .post .post-content .post-ti + p {
    color: #fff;
  }
  #shop-info #related-post .post .post-content .txt {
    color: #fff;
  }
}
/* ================================================================================
	WidePc CSS 1280px-
================================================================================ */
@media screen and (min-width: 1280px) {
  /* ================================================================================
  	2:Main CSS
  ================================================================================ */
  /* 1:Section1 Block CSS
  ================================================*/
  #shop-info .main-row {
    padding: 0;
  }
  #shop-info #map-social {
    padding: 0;
  }
  #shop-info #map-social .google-map {
    padding-right: 0;
  }
  #shop-info #map-social .social {
    padding-left: 0;
  }
  #shop-info #recommend-bread .flex-content {
    padding: 0;
  }
  #shop-info #related-post {
    padding: 0;
  }
}/*# sourceMappingURL=cinnamonraisin.css.map */