@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed&family=Sawarabi+Gothic&family=Sawarabi+Mincho&display=swap');

/* CSS Document */
.tabsize,
.spsize {
  display: none!important;
}
.pcsize {
  display: block!important;
}
::placeholder {
   color: #c0c0c0;
}
input::-webkit-input-placeholder {
    color:#c0c0c0;
    font-weight: normal;
}
input:-moz-placeholder {
    color:#c0c0c0;
    font-weight: normal;
}
input::-moz-placeholder {
    color:#c0c0c0;
    font-weight: normal;
}
input:-ms-input-placeholder {
    color:#c0c0c0;
    font-weight: normal;
}
#sweet_bean_paste img {
  width: 100%;
  height: auto;
}
#sweet_bean_paste .figureSquareCard img {
  height: 100%;
}
.page > .contents1 {
	background-color: #fff;
	padding-bottom: 0;
	padding-top: 0;
}
.contents1__inner--small {
	padding: 0;
	max-width: 100%;
  margin-bottom: 8%;
}
#sweet_bean_paste {
  background-image: url(../../contents/2202sweet_bean_paste/bg-wht.jpg);
  background-size: contain;
  background-position: top 50% left 50%;
  background-repeat: repeat;
  background-color: #fff;
  font-family: 'Sawarabi Gothic',"Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Yu Gothic Medium", "游ゴシック Medium", YuGothic,"游ゴシック体", "メイリオ", sans-serif;
  color: #441D00;
	text-align: left;
  overflow-x: hidden;
}
#sweet_bean_paste section {
  padding-bottom: 8%;
}
#sweet_bean_paste section:nth-last-of-type(1) {
  padding-bottom: 0%;
}
#sweet_bean_paste section.intro {
  padding-bottom: 4%;
}
/* Loading */
.load .photo > img {
  display: none;
}
.loading {
  width: 100%;
  transition: all 1s;
  background-color: transparent;
	display: -webkit-box;
	display: -ms-box;
	display: flex;
  top: 0;
  left: 0;
  z-index: 9999;
}
.lineup .lineup-list .item .loading {
  padding: 5vw 0;
}
.loading p {
  width: 100%;
  height: 100%;
  color: #753328;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  text-align: center;
	-webkit-box-items: center;
	-ms-flex-align: center;
	align-items: center;
  font-size: 2rem;
	display: -webkit-box;
	display: -ms-box;
	display: flex;
	flex-direction: column;
  padding: 0;
}
.recipe-list .loading p {
  height: 398px;
}
.category.other .recipe-list .loading p {
  height: 270px;
}
#sweet_bean_paste .loading img {
  width: 60px;
}
h2.title {
  margin-bottom: 4%;
  font-size: 0;
  text-align: center;
  color: #753328;
}
h2.title .sub {
  font-size: 1.6rem;
}
h2.title img {
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
}
.dotliner {
	padding-bottom: 8px;
	background: radial-gradient(circle farthest-side, #cccccc, #cccccc 40%, transparent 40%, transparent);
	-webkit-background: radial-gradient(circle farthest-side, #cccccc, #cccccc 40%, transparent 40%, transparent);
	-moz-background: radial-gradient(circle farthest-side, #cccccc, #cccccc 40%, transparent 40%, transparent);
	-o-background: radial-gradient(circle farthest-side, #cccccc, #cccccc 40%, transparent 40%, transparent);
	background-size: 16px 8px;
    background-position: left bottom;
    background-repeat: repeat-x;
  padding-left: 0.3rem;
  padding-right: 0.2rem;
  padding-bottom: 0.4rem;
}
.en {
  font-family: 'Barlow Condensed', sans-serif;
  letter-spacing: -1px;
}
.jpn {
  font-family: "Sawarabi Mincho", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho","Times New Roman", serif;
}
.note {
	font-size: 1rem;
  padding-left: 1.5rem;
  text-indent: -1.5rem;
}
.note:before {
	content: "※";
	padding-left: 0.4rem;
}
.product-price {
  text-align: right;
  margin-bottom: 0.4rem;
  font-size: 1.1rem;
}
.product-price .price {
  font-size: 2rem;
  letter-spacing: -1px;
}
.product-price .volume.en,
.pickup-item .product-price .price {
  font-size: 2rem;
}
.product-price .volume {
	font-size: 1.2rem;
	margin: 0 0.2rem 0 0;
	line-height: 1.1;
	text-align: right;
}
.product-price .volume.en {
	font-size: 1.35rem;
}
.product-price .volume:after {
	content: "/";
	padding: 0 0 0 0.2rem;
}
#sweet_bean_paste .inner {
	max-width: 920px;
	margin-left: auto!important;
	margin-right: auto!important;
  padding-left: 8px;
  padding-right: 8px;
  padding-bottom: 0;
  position: relative;
  z-index: 0;
}
#sweet_bean_paste .bg .inner {
  padding-top: 4%;
  padding-bottom: 4%;
}
#sweet_bean_paste a {
  color: #753328;
}
.column-box {
	display: -webkit-box;
	display: -ms-box;
	display: flex;
	flex-direction: row;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	flex-wrap: wrap;
}
.column-box.start {
	-webkit-box-items: start;
	-ms-flex-align: start;
	align-items: flex-start;
}
.column-box.center {
	-webkit-box-items: center;
	-ms-flex-align: center;
	align-items: center;
}
.column-box > div {
	flex-direction: column;
	display: -webkit-box;
	display: -ms-box;			
	display: flex;
	padding: 0 0.5%;
}
.column-box > div > * {
	flex-grow: 1;
	height: 100%;
}
.column-box .photo {
  padding: 0;
}
.column-box .photo img {
	flex-grow: unset;
}
#sweet_bean_paste .col84 {
	width: 84%;
}
#sweet_bean_paste .col80 {
	width: 80%;
}
#sweet_bean_paste .col70 {
	width: 70%;
}
#sweet_bean_paste .col60 {
	width: 60%;
}
#sweet_bean_paste .col50 {
	width: 50%;
}
#sweet_bean_paste .col40 {
	width: 40%;
}
#sweet_bean_paste .col33 {
	width: 33.3333%;
}
#sweet_bean_paste .col30 {
	width: 30%;
}
#sweet_bean_paste .col25 {
	width: 25%;
}
#sweet_bean_paste .col20 {
	width: 20%;
}
#sweet_bean_paste .col16 {
	width: 16.6666%;
}
#sweet_bean_paste .col100 {
	width: 100%;
}
.bg.beg {
  background-image: url("../../contents/2202sweet_bean_paste/bg-beg.jpg");
  background-size: contain;
  background-position: top 50% left 50%;
  background-repeat: repeat;
  background-color: #fff8e1;
}
.txt-c {
  text-align: center!important;
}
.txt-r {
  text-align: right!important;
}
.txt-l {
  text-align: left!important;
}
.txt-u {
	text-decoration: underline;
}
.fnt-s {
	font-size: 75%!important;
}
.fnt-m {
	font-size: 100%!important;
}
.fnt-l {
	font-size: 140%!important;
}
.fnt-b {
	font-weight: 700!important;
}
.fnt-red {
	color: #940E07!important;
}
.fnt-ylw {
	color: #ffd553!important;
}
.fnt-org {
	color: #ff7000!important;
}
.fnt-ble {
	color: #5ecaac!important;
}
.fnt-grn {
	color: #940E07!important;
}
.fnt-pnk {
	color: #c56857!important;
}
.fnt-pup {
	color: #cab8d9!important;
}
.fnt-brw {
	color: #753328!important;
}
.fnt-wht {
	color: #fff!important;
}
.fnt-gry {
	color: #666!important;
}
.fnt-border {
	text-shadow: rgb(255, 255, 255) 2px 0px 0px, rgb(255, 255, 255) 1.75517px 0.958851px 0px, rgb(255, 255, 255) 1.0806px 1.68294px 0px, rgb(255, 255, 255) 0.141474px 1.99499px 0px, rgb(255, 255, 255) -0.832294px 1.81859px 0px, rgb(255, 255, 255) -1.60229px 1.19694px 0px, rgb(255, 255, 255) -1.97998px 0.28224px 0px, rgb(255, 255, 255) -1.87291px -0.701566px 0px, rgb(255, 255, 255) -1.30729px -1.5136px 0px, rgb(255, 255, 255) -0.421592px -1.95506px 0px, rgb(255, 255, 255) 0.567324px -1.91785px 0px, rgb(255, 255, 255) 1.41734px -1.41108px 0px, rgb(255, 255, 255) 1.92034px -0.558831px 0px;
}
.mt0 {
	margin-top: 0!important;
}
.mt10 {
	margin-top: 10px!important;
}
.mt20 {
	margin-top: 20px!important;
}
.mt30 {
	margin-top: 30px!important;
}
.mb0 {
	margin-bottom: 0!important;
}
.mb10 {
	margin-bottom: 10px!important;
}
.mb20 {
	margin-bottom: 20px!important;
}
.mb30 {
	margin-bottom: 30px!important;
}
.ml0 {
	margin-left: 0!important;
}
.ml10 {
	margin-left: 10px!important;
}
.ml20 {
	margin-left: 20px!important;
}
.ml30 {
	margin-left: 30px!important;
}
.mr0 {
	margin-right: 0!important;
}
.mr10 {
	margin-right: 10px!important;
}
.mr20 {
	margin-right: 20px!important;
}
.mr30 {
	margin-right: 30px!important;
}
.pt0 {
	padding-top: 0!important;
}
.pt10 {
	padding-top: 10px!important;
}
.pt20 {
	padding-top: 20px!important;
}
.pt30 {
	padding-top: 30px!important;
}
.pb0 {
	padding-bottom: 0!important;
}
.pb10 {
	padding-bottom: 10px!important;
}
.pb20 {
	padding-bottom: 20px!important;
}
.pb30 {
	padding-bottom: 30px!important;
}
.pl0 {
	padding-left: 0!important;
}
.pl10 {
	padding-left: 10px!important;
}
.pl20 {
	padding-left: 20px!important;
}
.pl30 {
	padding-left: 30px!important;
}
.pr0 {
	padding-right: 0!important;
}
.pr10 {
	padding-right: 10px!important;
}
.pr20 {
	padding-right: 20px!important;
}
.pr30 {
	padding-right: 30px!important;
}
.liner-red {
	background: linear-gradient(transparent 60%, #FFAAA7 60%);
	background:-moz-linear-gradient(transparent 60%, #FFAAA7 60%); /* Firefox */
	background:-webkit-linear-gradient(transparent 60%, #FFAAA7 60%);/* safari Chrome */
	background:-ms-linear-gradient(transparent 60%, #FFAAA7 60%); /* IE */
	padding: 0 0.2rem;
}
.liner-pnk {
	background: linear-gradient(transparent 60%, #c56857 60%);
	background:-moz-linear-gradient(transparent 60%, #c56857 60%); /* Firefox */
	background:-webkit-linear-gradient(transparent 60%, #c56857 60%);/* safari Chrome */
	background:-ms-linear-gradient(transparent 60%, #c56857 60%); /* IE */
	padding: 0 0.2rem;
}
.liner-ylw {
	background: linear-gradient(transparent 60%, #f3ca06 60%);
	background:-moz-linear-gradient(transparent 60%, #f3ca06 60%); /* Firefox */
	background:-webkit-linear-gradient(transparent 60%, #f3ca06 60%);/* safari Chrome */
	background:-ms-linear-gradient(transparent 60%, #f3ca06 60%); /* IE */
	padding: 0 0.2rem;
}
.liner-org {
	background: linear-gradient(transparent 60%, #FFD3B4 60%);
	background:-moz-linear-gradient(transparent 60%, #FFD3B4 60%); /* Firefox */
	background:-webkit-linear-gradient(transparent 60%, #FFD3B4 60%);/* safari Chrome */
	background:-ms-linear-gradient(transparent 60%, #FFD3B4 60%); /* IE */
	padding: 0 0.2rem;
}
.liner-ble {
	background: linear-gradient(transparent 60%, #D5ECC2 60%);
	background:-moz-linear-gradient(transparent 60%, #D5ECC2 60%); /* Firefox */
	background:-webkit-linear-gradient(transparent 60%, #D5ECC2 60%);/* safari Chrome */
	background:-ms-linear-gradient(transparent 60%, #D5ECC2 60%); /* IE */
	padding: 0 0.2rem;
}
.liner-pup {
	background: linear-gradient(transparent 60%, #cab8d9 60%);
	background:-moz-linear-gradient(transparent 60%, #cab8d9 60%); /* Firefox */
	background:-webkit-linear-gradient(transparent 60%, #cab8d9 60%);/* safari Chrome */
	background:-ms-linear-gradient(transparent 60%, #cab8d9 60%); /* IE */
	padding: 0 0.2rem;
}
.liner-brw {
	background: linear-gradient(transparent 60%, #4c3332 60%);
	background:-moz-linear-gradient(transparent 60%, #4c3332 60%); /* Firefox */
	background:-webkit-linear-gradient(transparent 60%, #4c3332 60%);/* safari Chrome */
	background:-ms-linear-gradient(transparent 60%, #4c3332 60%); /* IE */
	padding: 0 0.2rem;
}
.slash {
  position: relative;
}
.slash:before,
.slash:after {
  content: "|";
  display: inline-block;
  font-size: 1rem;
  padding: 0 0.4rem;
}
.slash:before {
  -webkit-transform:rotate(-45deg);
  -moz-transform:rotate(-45deg);
  transform:rotate(-45deg);
}
.slash:after {
  -webkit-transform:rotate(45deg);
  -moz-transform:rotate(45deg);
  transform:rotate(45deg);
}
#sweet_bean_paste .btn a {
	color: #fff;
	width: 100%;
	text-align: center;
	font-weight: 700;
	text-decoration: none;
	display: -webkit-box;
	display: -ms-box;			
	display: flex;
	padding: 0.8rem 0.4rem;
	line-height: 1;
	-webkit-border-radius: 6px;/* for Safari and Chrome */
	-moz-border-radius: 6px; /* for Firefox */
	-o-border-radius: 6px; /* for opera */
	border-radius: 6px;
	position: relative;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
/*	height: 100%;*/
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-items: center;
	-ms-flex-align: center;
	align-items: center;
}
#sweet_bean_paste .btn.buy a {
	background-color:#9b4435;
}
#sweet_bean_paste .btn.link a {
	background-color: #753328;
	border:solid 2px #753328;
	color: #fff;
  padding: 4%;
}
#sweet_bean_paste .btn.recipe a {
	background-color: #fffac8;
	border:solid 2px #7D3C00;
	color: #7D3C00;
  padding: 4%;
}
a .icn-cart,
a .icn-recipe {
	background-repeat: no-repeat;
}
a .icn-cart {
	background-image: url("../../contents/2202sweet_bean_paste/icn-cart.svg");
  background-position: top 50% left 1%;
  background-size: 18px;
  padding: 4px 0 4px 24px;
  margin: 0;
  font-size: 0.9rem;
}
a .icn-recipe {
	background-image: url("../../contents/2202sweet_bean_paste/icn-recipe.svg");
  background-position: top 50% left 0%;
  background-size: 24px;
  padding: 4px 0 4px 32px;
  margin: 0;
  font-size: 1.4rem;
}
#sweet_bean_paste .btn.buy.column-box .select_quantity {
  width: 29%;
  margin-right: 1%;
}
#sweet_bean_paste .btn.buy.column-box .select_quantity select {
  min-height: 56px;
  margin-bottom: 0;
}
#sweet_bean_paste .btn.buy.column-box a {
  width: 70%;
  min-height: 56px;
  padding: 0;
}
/*----fade in setting----*/
.fadein {
	opacity : 0.1;
	transform : translate(0, 50px);
	transition : all 500ms;
}
.fadein.lr {
	opacity : 0.1;
	transform : translate(-50px, 0);
	transition : all 500ms;
}
.fadein.scrollin {
	opacity : 1;
	transform : translate(0, 0);
}
.fadein.scrollin:nth-of-type(2),
.column-box > div:nth-of-type(2) .fadein.scrollin {
	-moz-transition-delay:200ms;
	-webkit-transition-delay:200ms;
	-o-transition-delay:200ms;
	-ms-transition-delay:200ms;
}
.fadein.scrollin:nth-of-type(3),
.column-box > div:nth-of-type(3) .fadein.scrollin,
.detail .fadein.scrollin:nth-of-type(1) {
	-moz-transition-delay:300ms;
	-webkit-transition-delay:300ms;
	-o-transition-delay:300ms;
	-ms-transition-delay:300ms;
}
.fadein.scrollin:nth-of-type(4),
.column-box > div:nth-of-type(4) .fadein.scrollin,
.detail .fadein.scrollin:nth-of-type(2) {
	-moz-transition-delay:500ms;
	-webkit-transition-delay:500ms;
	-o-transition-delay:500ms;
	-ms-transition-delay:500ms;
}
.fadein.scrollin:nth-of-type(n+5),
.column-box > div:nth-of-type(n+5) .fadein.scrollin,
.detail .fadein.scrollin:nth-of-type(n+5) {
	-moz-transition-delay:n+600ms;
	-webkit-transition-delay:n+600ms;
	-o-transition-delay:n+600ms;
	-ms-transition-delay:n+600ms;
}
/*----fade in setting----*/
.video-wrapper {
  position:relative;
  width: 100%;
  padding-top:56.25%;
}
.video-wrapper iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
	box-shadow: 8px 8px 0px 0px #fbeae6;
	-moz-box-shadow: 8px 8px 0px 0px #fbeae6;
	-webkit-box-shadow: 8px 8px 0px 0px #fbeae6;
}
/*イントロ
-------------------------------------*/
.lp-menu {
  background-color: #753328;
  margin-top: 3%;
  margin-bottom: 4%;
}
.lp-menu li {
	background: radial-gradient(circle farthest-side, #ffffff, #ffffff 40%, transparent 40%, transparent);
	-webkit-background: radial-gradient(circle farthest-side, #ffffff, #ffffff 40%, transparent 40%, transparent);
	-moz-background: radial-gradient(circle farthest-side, #ffffff, #ffffff 40%, transparent 40%, transparent);
	-o-background: radial-gradient(circle farthest-side, #ffffff, #ffffff 40%, transparent 40%, transparent);
	background-size: 2px 6px;
  background-position: right top;
  background-repeat: repeat-y;
  width: 25%;
  text-align: center;
  line-height: 1.1;
	display: -webkit-box;
	display: -ms-box;
	display: flex;
}
.lp-menu li:last-child {
  background: unset;
}
#sweet_bean_paste .lp-menu li a {
  background-position: left 50% top 0%;
  background-repeat: no-repeat;
  width: 100%;
	display: -webkit-box;
	display: -ms-box;
	display: flex;
	flex-direction: row;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	flex-wrap: wrap;
	-webkit-box-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
  padding-right: 8px;
  padding-left: 8px;
  padding-top: 22px;
  padding-bottom: 20px;
  font-size: 1.4rem;
  color: #fff;
}
.lp-menu li .sub {
  font-size: 0.9rem;
}
#sweet_bean_paste .mv {
  font-size: 0;
  margin-bottom: 4%;
}
#sweet_bean_paste .mv.inner {
  padding-bottom: 0;
  margin-bottom: 2%;
  padding-left: 0;
  padding-right: 0;
}
#sweet_bean_paste .intro .inner {
  padding-top: 0%;
  padding-bottom: 0%;
}
.intro p {
  font-size: 1.2rem;
  line-height: 1.2;
  margin-top: 0.8rem;
}
.intro .slogan {
  font-size: 1.6rem;
}
/*あんこの種類
-------------------------------------*/
.kind-list .kind-title {
  font-size: 1.7rem;
  text-align: left;
  margin-bottom: 0.8rem;
  font-weight: normal;
  height: auto;
  color: #753328;
  font-weight: 700;
}
.kind-list .kind-title .sub {
  font-size: 1.3rem;
  color: #9d7300;
}
.category.kind h4.title {
  font-size: 1.6rem;
  text-align: left;
  margin-top: 8%;
  margin-bottom: 0.8rem;
  color: #753328;
}
.category.kind h4.title .sub {
  font-size: 1.3rem;
}
.kind-list .item {
  margin-right: 1%;
  margin-left: 1%;
}
.kind-list .item:last-child {
  margin-right: 0;
}
.kind-list .photo {
  width: 48%;
  position: relative;
  margin-bottom: 2%;
  padding-bottom: 4px;
  padding-right: 4px;
}
.kind-list .photo img {
	box-shadow: 4px 4px 0px 0px #9d7300;
	-moz-box-shadow: 4px 4px 0px 0px #9d7300;
	-webkit-box-shadow: 4px 4px 0px 0px #9d7300;
}
.kind-list .detail {
  background-color: #fff;
  width: 48%;
  padding: 2% 2% 3%;
  margin-bottom: 4%;
	-webkit-border-radius: 8px;/* for Safari and Chrome */
	-moz-border-radius: 8px; /* for Firefox */
	-o-border-radius: 8px; /* for opera */
	border-radius: 8px;
}
.kind-list .photo.tsubu {
  order: 1;
}
.kind-list .detail.tsubu {
  order: 3;
}
.kind-list .photo.koshi {
  order: 2;
}
.kind-list .detail.koshi {
  order: 4;
}
.kind-list .photo.ogura {
  order: 5;
}
.kind-list .detail.ogura {
  order: 7;
}
.kind-list .photo.tsubushi {
  order: 6;
}
.kind-list .detail.tsubushi {
  order: 8;
}
.kind-list .txt {
  font-size: 1.1rem;
  line-height: 1.4;
  color: #555;
}
/*ラインアップ
-------------------------------------*/
.lineup .lineup-list {
  margin-bottom: 4%;
}
.lineup .lineup-list .item {
  background-color: #fff;
  width: 32%;
  padding: 2% 2% 3%;
    -webkit-border-radius: 8px;/* for Safari and Chrome */
    -moz-border-radius: 8px; /* for Firefox */
    -o-border-radius: 8px; /* for opera */
    border-radius: 8px;
  margin-bottom: 4%;
  margin-right: 2%;
}
.lineup .lineup-list .item:nth-of-type(3n),
.lineup .lineup-list .item:last-child {
  margin-right: 0;
}
.lineup .lineup-list .type-name {
  font-size: 1.4rem;
  margin-bottom: 0.8rem;
}
.lineup .lineup-list .type-name .sub {
  font-size: 1.2rem;
}
.lineup .lineup-list .photo {
  margin-bottom: 4%;
  position: relative;
}
.lineup .lineup-list .item .type {
  background-color: #753328;
  width: 60px;
  height: 60px;
  color: #fff;
	-webkit-border-radius: 50%;/* for Safari and Chrome */
	-moz-border-radius: 50%; /* for Firefox */
	-o-border-radius: 50%; /* for opera */
	border-radius: 50%;
  padding-top: 1rem;
  font-size: 1.8rem;
  text-align: center;
  top: 0;
  left: 0;
  z-index: 1;
  position: absolute;
}
.lineup .lineup-list .item.gkoshi .type {
  background-color: #ce7779;
}
.lineup .lineup-list .item.gsogura .type {
  background-color: #77a4ce;
}
.lineup .lineup-list .item.gwhite .type {
  background-color: #cea177;
}
.lineup .lineup-list .item.koshi .type {
  background-color: #77cea1;
}
.lineup .lineup-list .item.ogura .type {
  background-color: #cecd77;
}
.lineup .txt {
  font-size: 1.1rem;
  margin-bottom: 4%;
}
#sweet_bean_paste p,
.lineup .lineup-list .type-name,
.lineup .lineup-list .photo,
.lineup .lineup-list .item .btn.buy {
  height: auto;
}
/*一目でわかる、TOMIZの人気あんこの比較チャート*/
.lineup .chart-title {
  font-size: 1.6rem;
  margin-top: 2rem;
  margin-top: 8%;
  margin-bottom: 0.8rem;
  color: #753328;
}
.lineup .chart-title .sub {
  font-size: 1.3rem;
}
.chart .photo {
    padding: 2% 3%;
    background: #fff;
    -webkit-border-radius: 16px;/* for Safari and Chrome */
    -moz-border-radius: 16px; /* for Firefox */
    -o-border-radius: 16px; /* for opera */
    border-radius: 16px;
}
/*簡単レシピ
-------------------------------------*/
.recipe-list .item {
  width: 32%;
  margin-right: 0.5%;
  margin-bottom: 3%;
}
.recipe-list .item:last-child,
.recipe-list .item:nth-of-type(3n) {
  margin-right: 0%;
}
.recipe-list .item a:hover {
  opacity: 1;
}
.recipe-list .item .photo {
  position: relative;
  margin-bottom: 0;
  overflow: hidden;
	-webkit-box-shadow: 0 0px 5px 0 #aaa;
	-moz-box-shadow: 0 0px 5px 0 #aaa;
	-o-box-shadow: 0 0px 5px 0 #aaa;
  box-shadow: 0 0px 5px 0 #aaa;
  font-size: 0;
}
.recipe-list .item .photo img {
 transition:1s all;
}
.recipe-list .item a:hover .photo img {
  transform:scale(1.2,1.2);
  transition:1s all;
}
.recipe-list .recipe-name {
  color: #9d7300;
  text-align: center;
  font-size: 1.3rem;
  padding: 1rem 0.8rem 1rem;
}
.recipe-list .recipe-name .sub {
  font-size: 1rem;
}
.recipe-list .item .txt {
  font-size: 1.1rem;
  line-height: 1.6;
  color: #666;
}
.recipe-list .item:first-child .txt {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}
/*あんこが美味しい、パンとお菓子のおすすめレシピ*/
#sweet_bean_paste .pickup-recipe .recipe-list {
  margin-bottom: 0%
}
#sweet_bean_paste .pickup-recipe {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}
.pickup-recipe .recipe-list .item {
  width: 48%;
  margin-right: 2%;
  margin-bottom: 0;
}
.pickup-recipe .recipe-list .item:nth-of-type(2n) {
  margin-right: 0%;
}
/*おすすめアイテム
-------------------------------------*/
.recommend h3.title {
  font-size: 1.6rem;
  margin-bottom: 1.8rem;
  color: #441D00;
}
.recommend h4.title {
  font-size: 1.4rem;
  margin-bottom: 0.4rem;
	padding-bottom: 0.4rem;
	display:inline-block;
  color: #753328;
  font-weight: 700;
	background: radial-gradient(circle farthest-side, #753328, #753328 40%, transparent 40%, transparent);
	-webkit-background: radial-gradient(circle farthest-side, #753328, #753328 40%, transparent 40%, transparent);
	-moz-background: radial-gradient(circle farthest-side, #753328, #753328 40%, transparent 40%, transparent);
	-o-background: radial-gradient(circle farthest-side, #753328, #753328 40%, transparent 40%, transparent);
	background-size: 6px 2px;
  background-position: right bottom;
  background-repeat: repeat-x;
}
.recommend .icn-season {
  position: absolute;
  left: 10%;
  bottom: 2%;
  width: 80px;
}
.recommend .btn.link {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 8%;
  max-width: 480px;  
}
#sweet_bean_paste .recommend .btn.link a {
  font-size: 1.3rem;
  text-align: left;
  font-weight: normal;
}
#sweet_bean_paste .recommend .btn.link .icn-beans {
	background-image: url("../../contents/2202sweet_bean_paste/icn-beans.svg");
  background-position: top 50% left 1%;
  background-repeat: no-repeat;
  background-size: 48px;
  padding: 8px 0 8px 56px;
}
.recommend-list {
  margin-top: 2%;
  margin-bottom: 8%;
}
.recommend-list.column-box > div {
  width: 25%;
}
#sweet_bean_paste .recommend-list .product-name a {
  color: #4c3332;
  font-size: 1.2rem;
  padding-bottom: 0.8rem;
}
.recommend .product-price {
  color: #4c3332;
}
#sweet_bean_paste .recommend .product-name a {
  color: #4c3332;
}
#sweet_bean_paste .recommend .product-name a .sub {
  font-size: 0.8rem;
}
.recommend-item .inner > p {
  font-size: 1.3rem;
  margin-bottom: 1rem;
}
.recommend-list .photo {
  padding: 0 2%;
  margin-bottom: 2%;
  position: relative;
}
.recommend-list .photo a {
  background-color: #fff;
  border: 1px solid #ddd;
}
#sweet_bean_paste .recommend-list .photo a img {
  height: 100%;
}
.recommend-list .photo .copy {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: rgb(255, 170, 167, 0.9);
  width: 100%;
  font-size: 1rem;
  color: #fff;
  padding: 0.8rem 0.4rem;
  text-align: center;
}
.recommend-list .detail {
  margin-bottom: 2%;
}
/*あわせてチェック
-------------------------------------*/
.outro .item {
  width: 48%;
  margin-right: 0.5%;
  margin-left: 0.5%;
  margin-bottom: 4%;
  font-size: 0;
}
.outro .item img {
	/*-webkit-box-shadow: 0 0px 5px 0 #aaa;
	-moz-box-shadow: 0 0px 5px 0 #aaa;
	-o-box-shadow: 0 0px 5px 0 #aaa;
  box-shadow: 0 0px 5px 0 #aaa;*/
}
.outro .item p {
  font-size: 1.4rem;
  margin-bottom: 0.8rem;
  text-align: center;
  color: #7D3C00;
}
@media screen and (max-width: 860px) {
  .lp-menu li .sub {
    font-size: 0.9rem;
  }
  .intro p {
    margin-bottom: 2rem;
  }
  /*あんこの種類
  -------------------------------------*/
  .category.kind .kind-list {
    max-width: 720px;
    margin-right: auto;
    margin-left: auto;
  }
  /*.category.kind h3,
  .category.kind h4.title {
    font-size: 1.4rem;
  }*/
  .category.kind h4.title span,
  .category.kind h5 span {
    font-size: 1.1rem;
  }
  .kind-list .kind-title {
    font-size: 1.25rem;
  }
  .kind-list .txt{
    font-size: 1rem;
  }
  .kind-list .photo {
    width: 240px;
    margin-left: 0;
    margin-right: 0;
  }
  .kind-list .detail {
    width: calc(100% - 240px - 2%);
    margin-left: 2%;
    margin-right: 0;
  }
  .kind-list .photo.tsubu {
    order: 1;
  }
  .kind-list .detail.tsubu {
    order: 2;
  }
  .kind-list .photo.koshi {
    order: 3;
  }
  .kind-list .detail.koshi {
    order: 4;
  }
  .kind-list .photo.ogura {
    order: 5;
  }
  .kind-list .detail.ogura {
    order: 6;
  }
  .kind-list .photo.tsubushi {
    order: 7;
  }
  .kind-list .detail.tsubushi {
    order: 8;
  }
}
@media screen and (max-width: 768px) {
    #sweet_bean_paste .inner {
      padding-left: 16px;
      padding-right: 16px;
    }
    .pcsize,
    .spsize {
      display: none!important;
    }
    .tabsize {
      display: block!important;
    }
    h2.title {
      margin-bottom: 8%;
      margin-top: 4%;
    }
    h2.title img {
      max-width: 50vw;
    }
    .lp-menu li .sub {
      font-size: 0.8rem;
    }
    #sweet_bean_paste .lp-menu li a {
      font-size: 3vw;
    }
    /*リスト共通
    -------------------------------------*/
    .lineup .lineup-list,
    .recipe-list {
      margin-bottom: 8%;
    }
    .lineup .lineup-list .item,
    .recipe-list .item {
      width: 48.5%;
      margin-right: 3%;
      margin-bottom: 3%;
    }
    .lineup .lineup-list .item:nth-of-type(2n),
    .recipe-list .item:nth-of-type(2n) {
      margin-right: 0;
    }
    .category.kind .kind-list .item:last-child,
    .recipe-list .item:last-child {
      margin-bottom: 0;
    }
    .lineup .chart-title,
    .recommend h3.title {
      font-size: 1.4rem;
    }
    .recommend h4.title {
      font-size: 1.3rem;
    }
    /*あんこの種類
    -------------------------------------*/
    .category.kind .kind-list {
      max-width: 480px;
    }
    .kind-list .photo {
      width: 100%;
    }
    .kind-list .detail {
      width: 100%;
      margin-left: 0;
      margin-right: 0;
      margin-bottom: 10%;
      padding: 1rem 1rem 1rem;
    }
    /*ラインアップ
    -------------------------------------*/
    .lineup .lineup-list .item {
      padding: 3% 3% 4%;
    }
    .lineup .lineup-list .item:nth-of-type(3n) {
      margin-right: 3%;
    }
    .lineup .lineup-list .item .type {
      width: 10vw;
      height: 10vw;
      padding-top: 2vw;
      font-size: 6vw;
    }
    /*簡単レシピ
    -------------------------------------*/
    .recipe-list .recipe-name .sub {
      font-size: 0.9rem;
    }
    .recipe-list .item:nth-of-type(3n) {
      margin-right: 3%;
    }
    .recipe-list .item:last-child {
      margin-right: 0%;
    }
    .recipe-list .loading p {
      width: 50vw;
      height: 50vw;
    }
    .recipe-list .item:last-child {
      margin-bottom: 0;
    }
    .recipe-list .item .txt {
      font-size: 1rem;
    }
    #sweet_bean_paste .recipe .inner,
    #sweet_bean_paste .pickup-recipe {
      max-width: 560px;
      margin-left: auto;
      margin-right: auto;
    }
    .recipe-list .recipe-name {
      padding: 0.6rem 0 1rem;
      font-size: 1.2rem;
    }
    /*おすすめアイテム
    -------------------------------------*/
    #sweet_bean_paste .recommend .inner {
      max-width: 480px;
      margin-left: auto;
      margin-right: auto;
    }
    .recommend-list.column-box > div {
      width: 50%;
      margin-bottom: 6%;
    }
    .recommend-list.column-box > div:nth-last-of-type(2) {
      margin-bottom: 0%;
    }
    .recommend-list .photo {
      padding: 0;
    }
    .recommend-list .photo .copy {
      font-size: 0.9rem;
    }
    .recommend-list .detail {
      padding: 0 2%;
    }
    .recommend-list .product-name a {
      font-size: 1.4rem;
    }
    .recommend .icn-season {
      width: 90px;
      left: 2%;
    }
    .recommend .btn.link {
      margin-bottom: 10%;
    }
    /*合わせてチェック
    -------------------------------------*/
    .outro .item p {
      font-size: 1.1rem;
    }
}
@media screen and (max-width:480px) {
      #sweet_bean_paste {
        background-size: 4vw auto,4vw auto,cover;
      }
      #sweet_bean_paste .recipe-list .loading p {
        width: 100%;
        height: 100vw;
        font-size: 10vw;
      }
      #sweet_bean_paste .category.other .recipe-list .loading p {
        font-size: 7vw;
      }
      #sweet_bean_paste .inner {
        padding-left: 5vw;
        padding-right: 5vw;
      }
      #sweet_bean_paste .bg .inner {
        padding-left: 5vw;
        padding-right: 5vw;
        padding-top: 5vw;
        padding-bottom: 10vw;
      }
      #sweet_bean_paste .intro .inner {
        padding-bottom: 0;
      }
      #sweet_bean_paste p {
        font-size: 4vw;
      }
      .pcsize,
      .tabsize {
        display: none!important;
      }
      .spsize {
        display: block!important;
      }
      #sweet_bean_paste a .icn-cart {
        background-size: 4vw;
        padding: 3vw 0 3vw 5vw;
        font-size: 3vw;
      }
      #sweet_bean_paste .lineup .lineup-list .item a .icn-cart {
        font-size: 4vw;
      }
      #sweet_bean_paste .loading p {
        font-size: 10vw;
      }
      #sweet_bean_paste .intro .slogan {
        font-size: 5.5vw;
      }
      .lp-menu li {
        width: 50%;
        margin-top: 0;
        margin-bottom: 0;
        padding-bottom: 0%;
        background: unset;
        border-bottom: 1px solid #fff;
        border-right: 1px solid #fff;
      }
      .lp-menu li:nth-of-type(2n) {
        background: unset;
      }
      #sweet_bean_paste .lp-menu li a {
        font-size: 5vw;
        padding-top: 1.2rem;
        padding-bottom: 1rem;
        text-align: center;
      }
      .lp-menu li .sub {
        font-size: 4vw;
      }
      /*イントロ
      -------------------------------------*/
      #sweet_bean_paste .intro .txt {
        font-size: 4.5vw;
        padding-bottom: 8%;
      }
      /*リスト共通
      -------------------------------------*/
      .lineup .lineup-list,
      .category.kind .kind-list,
      .recipe-list {
        max-width: 320px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 0%;
      }
      .lineup .lineup-list .item,
      .category.kind .kind-list .item {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
      }
      /*あんこの種類
      -------------------------------------*/
      .category.kind .kind-list .kind-title {
        font-size: 7vw;
      }
      .category.kind h4.title {
        font-size: 6vw;
        margin-top: 10%;
      }
      .category.kind .kind-list {
        margin-bottom: 10%;
      }
      .category.kind .kind-list .photo {
        margin-bottom: 4%;
      }
      #sweet_bean_paste .kind-list .photo .num {
        font-size: 12vw;
        padding-top: 2vw;
        bottom: unset;
        left: 2vw;
        top: 2vw;
        width: 16vw;
        height: 16vw;
      }
      .category.kind .kind-list .detail {
        margin-bottom: 10%;
      }
      .category.kind h3 span {
        font-size: 6vw;
      }
      /*ラインアップ*/
      .lineup .lineup-list {
        margin-bottom: 10%
      }
      .lineup .lineup-list .item {
        padding:  20px 16px 20px;
        margin-bottom: 4%;
      }
      #sweet_bean_paste .lineup .lineup-list .item .type {
        font-size: 10vw;
        padding-top: 3vw;
        bottom: unset;
        left: 2vw;
        top: 2vw;
        width: 16vw;
        height: 16vw;
      }
      /*チャート*/
      .recommend h3,
      .lineup .chart-title {
        font-size: 6vw;
      }
      .recommend h3 .sub,
      .lineup .chart-title .sub {
        font-size: 4vw;
      }
      /*レシピ
      -------------------------------------*/
      h2.title .sub {
        font-size: 4vw;
      }
      .recipe-list .item {
        margin-bottom: 4%;
      }
      #sweet_bean_paste .category.recipe .recipe-name {
        font-size: 4vw;
        padding: 0.6rem 0 2rem;
      }
      .recipe-list .recipe-name .sub {
        font-size: 3.5vw;
      }
      /*おすすめアイテム
      -------------------------------------*/
      .recommend-list .product-name a {
        font-size: 5vw;
      }
      .recommend-list .product-name a .sub {
        font-size: 4vw;
      }
      #sweet_bean_paste .btn.buy.column-box .select_quantity select,
      #sweet_bean_paste .recommend-list .product-name a {
        font-size: 4vw;
      }
      .recommend .icn-season {
        width: 18vw;
      }
      #sweet_bean_paste .recommend .product-price {
        font-size: 3.5vw;
      }
      /*合わせてチェック
      -------------------------------------*/
      #sweet_bean_paste .outro .item {
        width: 100%;
        margin-right: 0;
      }
      #sweet_bean_paste .outro .item:nth-of-type(2) {
        width: 100%;
      }
}
@media screen and (min-width: 53.125em) {
  .globalFooter .informationColumn--m20 {
    margin-left: 0;
    margin-right: 0;
  }
}