@charset "utf-8";
/* CSS Document */

.container05 {
  display: flex;
  flex-wrap: wrap;
  width: 929px; /* 横幅を929pxに設定 */
}

.item05 {
  flex: 1 0 16%;
  margin: 10px;
  text-align: center;
  padding: 10px;
}

@media screen and (max-width: 929px) {
  .item05 {
    flex: 1 0 45%;
  }
}

.container5 {
    max-width: 929px;
    margin: 0 auto;
}

.row {
    display: flex;
    flex-wrap: wrap;
}

.item5 {
    width: 20%; /* 5 items horizontally on PC */
    box-sizing: border-box;
    border: 0px solid black;
}

/* スマホの場合 */
@media (max-width: 600px) {
    .item {
        width: 50%; /* 2 items horizontally on mobile */
    }
}



.grid-container4 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 20px;
}

.grid-item3 {
	text-align: center;
}

a[href]:hover {
	text-decoration: none;
}

.grid-item3 img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 929px) {
  .grid-container4 {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  }

}

@media (min-width: 930px) {
  .grid-container4 {
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  }
}




.grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(285px, 1fr));
  gap: 20px;
}

.grid-item {
  text-align: center;
}

.grid-item img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 929px) {
  .grid-container {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  }
}



.image-container {
  display: flex;
  flex-wrap: wrap;
}

.item2 {
  flex: 1 0 25%; /* パソコンでは4等分 */
  margin: 0 10px; /* アイテム間のマージン */
  text-align: center; /* テキストを中央揃え */
}

.item2 img {
  margin-bottom: 10px; /* 画像とテキストの間のマージン */
}

@media screen and (max-width: 768px) {
  .item2 {
    flex: 1 0 50%; /* スマホでは2等分 */
  }
}



.container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around; /* アイテム間のスペースを均等に分配 */
}

.item {
  width: 48%; /* スマホでもPCでも横に2つ並ぶように設定 */
  margin: 1%; /* 余白で少し間隔を空ける */
  box-sizing: border-box; /* パディングとボーダーを含めて幅を計算 */
  padding: 5px; /* 内側の余白 */
  border: 0px solid #ccc; /* 枠線 */
  background-color: #ffffff; /* 背景色 */
}

/* ビューポートの幅が600px以上の場合のスタイル */
@media (min-width: 929px) {
  .item {
    width: 48%; /* ビューポートが広がっても2つ並ぶ */
  }
}

.bannerlist{
	display: flex;
	display: -webkit-flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	flex-wrap: wrap;
	-webkit-flex: wrap;
}

.banner10pad{
	box-sizing:border-box;
	overflow:hidden;
}


.banner2box{
	width:50%;
}

.banner2box02_L{
	width:400px;
	overflow:hidden;
	box-sizing:border-box;
}

.banner2box02_R{
	width:500px;
	overflow:hidden;
	box-sizing:border-box;
}

.banner2box02_R-1{
	width:245px;
	overflow:hidden;
	box-sizing:border-box;
}

.bannerbox290{
	width:290px;
	overflow:hidden;
	box-sizing:border-box;
}

.bannerbox303{
	width:303px;
	overflow:hidden;
	box-sizing:border-box;
}


.bannerbox220{
	width:220px;
	overflow:hidden;
	box-sizing:border-box;
}

.banner2box02_3{
	width:290px;
	overflow:hidden;
	box-sizing:border-box;
}

.banner2box03{
	width:450px;
	overflow:hidden;
	box-sizing:border-box;
}

.bannerbox450{
	width:450px;
	overflow:hidden;
	box-sizing:border-box;
}

.bannerbox606{
	width:606px;
	overflow:hidden;
	box-sizing:border-box;
}

.banner2box04_L{
	width:500px;
	overflow:hidden;
	box-sizing:border-box;
}


.bannerbox235{
	width:235px;
	overflow:hidden;
	box-sizing:border-box;
}

.bannerbox445{
	width:445px;
	overflow:hidden;
	box-sizing:border-box;
}

.banner2box04_L img{
	width:235px;
}

.banner2box04_R{
	width:400px;
	overflow:hidden;
	box-sizing:border-box;
}

.banner2box05{
	width:430px;
	overflow:auto;
	box-sizing:border-box;
}


.banner400{
	width:400px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner480{
	width:480px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner470{
	width:470px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner174{
	width:174px;
	overflow:hidden;
	box-sizing:border-box;
}

.banner280{
	width:280px;
	overflow:hidden;
	box-sizing:border-box;
}

.banner350{
	width:350px;
	overflow:hidden;
	box-sizing:border-box;
}

.banner560{
	width:560px;
	overflow:hidden;
	box-sizing:border-box;
}

.banner741{
	width:741;
	overflow:hidden;
	box-sizing:border-box;
}

.banner515{
	width:515px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner200{
	width:200px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner190{
	width:190px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner180{
	width:180px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner130{
	width:130px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner220{
	width:220px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner260{
	width:260px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner325{
	width:325px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner690{
	width:690px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner730{
	width:730px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner790{
	width:790px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner110{
	width:110px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner810{
	width:810px;
	box-sizing:border-box;
	overflow:hidden;
}


.banner650{
	width:650px;
	box-sizing:border-box;
	overflow:hidden;
}


.banner610{
	width:610px;
	box-sizing:border-box;
	overflow:hidden;
}


.banner741{
	width:741px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner440{
	width:440px;
	box-sizing:border-box;
	overflow:hidden;
}


.banner790{
	width:790px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner140{
	width:140;
	box-sizing:border-box;
	overflow:hidden;
}

.banner120{
	width:120;
	box-sizing:border-box;
	overflow:hidden;
}

.banner160{
	width:160;
	box-sizing:border-box;
	overflow:hidden;
}


.banner250{
	width:240;
	box-sizing:border-box;
	overflow:hidden;
}


.banner90{
	width:90;
	box-sizing:border-box;
	overflow:hidden;
}


.banner195{
	width:195;
	box-sizing:border-box;
	overflow:hidden;
}


.banner250box{
	width:250px;
	box-sizing:border-box;
	overflow:hidden;
	margin-right:15px;
}

.banner230{
	width:230px;
	box-sizing:border-box;
	overflow:hidden;
	margin-right:15px;
}

.banner330box{
	width:330px;
	box-sizing:border-box;
	overflow:hidden;
	margin-right:15px;
}

.banner300box{
	width:300px;
	box-sizing:border-box;
	overflow:hidden;
}


.banner450box02{
	width:450px;
	box-sizing:border-box;
	overflow:hidden;
}

.banner450box02 img{
	float:left;
	margin-right:5px;
}

@media screen and (max-width:768px){
	.banner10pad{padding:10px;}
	.banner2box{width:100%;}
	.banner2box02_L{width:100%;}
	.banner2box02_R{width:100%}
	.banner2box02_R-1{width:100%;}
	.bannerbox290{width:100%;}
	.bannerbox220{width:100%;}
	.banner2box02_3{width:97%;}
	.banner2box03{width:100%;}
	.banner2box04_L{width:100%;}
	.bannerbox235{width:100%;}
	.banner2box04_L img{width:100%;}
	.banner2box04_R{width:100%;}
	.banner2box05{width:100%;}
	.bannerbox445{width:100%;}
	.bannerbox606{width:100%;}
	.bannerbox303{width:100%;}
	.banner400{width:100%; margin-right:0px;}
	.banner480{width:100%;}
	.banner470{width:100%;}
	.banner450{width:100%;}
	.banner174{width:100%;}
	.banner280{width:100%;}
	.banner350{width:100%;}
	.banner560{width:100%;}
	.banner741{width:100%;}
	.banner515{width:100%;}
	.banner200{width:100%;}
	.banner220{width:100%;}
	.banner260{width:100%;}
	.banner325{width:100%;}
	.banner690{width:100%;}
	.banner610{width:100%;}
	.banner440{width:100%;}
	.banner790{width:100%;}
	.banner140{width:100%;}
	.banner120{width:100%;}
	.banner250{width:100%;}
	.banner230{width:100%;}
	.banner160{width:100%;}
	.banner90{width:100%;}
	.banner195{width:100%;}
	.banner190{width:100%;}
	.banner180{width:100%;}
	.banner730{width:100%;}
	.banner100{width:100%;}
	.banner830{width:100%;}
	.banner330box{width:100%;}
	.banner250box{width:100%;}
	.banner300box{width:100%;}
	.banner450box02{width:100%;}
}

.banner_img_left2 {
  float: left;
  margin-right: 10px; }


.banner_opt a{
	display:block;
}


.banner_opt a:hover{
	opacity:0.7;
}


.icon{
	float:left;
	margin-right:5px;
	margin-bottom:5px;
}


/* ---- 平野追記 ---------------------------- */

/* 見出し */

h1{
  font: bold 32px/1.5 "Hiragino Sans";
  color: revert;
  border: none; 
}

h1 span{
  font-size: 16px;
}

h2{
  font: bold 24px/1.5 "Hiragino Sans";
  color: revert;
  background: none;
}

h2 span{
  font-size: 16px;
}

h3 {
  font: bold 20px/1.5 "Hiragino Sans";
  color: revert;
}

h4{
  font: bold 16px/1.5 "Hiragino Sans";
  color: revert;
}




/* パディング */

.pdd10 {
  padding: 0 10px;
}

.pdd20 {
  padding: 0 20px;
}

.pdd30 {
  padding: 0 30px;
}

.pdd_top10 {
  padding-top: 10px;
}

.pdd_top20 {
  padding-top: 20px;
}

.pdd_top30 {
  padding-top: 30px;
}

.pdd_top40 {
  padding-top: 40px;
}

.pdd_top50 {
  padding-top: 50px;
}

.pdd_btm10 {
  padding-bottom: 10px;
}

.pdd_btm20 {
  padding-bottom: 20px;
}

.pdd_btm30 {
  padding-bottom: 30px;
}

.pdd_btm40 {
  padding-bottom: 40px;
}

.pdd_btm50 {
  padding-bottom: 50px;
}

.pdd_lft20 {
  padding-left: 20px;
}

.pdd_rgh20 {
  padding-right: 20px;
}



/* マージン */

.mrg_top-60 {
	margin-top: -60px;
}

.mrg_top10 {
	margin-top: 10px;
}

.mrg_top20 {
	margin-top: 20px;
}

.mrg_top30 {
	margin-top: 30px;
}

.mrg_top40 {
	margin-top: 40px;
}

.mrg_top50 {
	margin-top: 50px;
}

.mrg_btm10 {
	margin-bottom: 10px;
}

.mrg_btm20 {
	margin-bottom: 20px;
}

.mrg_btm30 {
	margin-bottom: 30px;
}

.mrg_btm40 {
	margin-bottom: 40px;
}

.mrg_btm50 {
	margin-bottom:50px;
}

.brd {
	border:solid 1px #EEE;
}

.brd_btm{
	border-bottom:solid 1px #EEE;
}


/* フォント、ボールド */


.txt_bld{
	font-weight: bold;
}

.txt_bld_red{
	color: red;
	font-weight: bold;
}

.txt_bld_pnk{
	color: deeppink;
	font-weight: bold;
}

.txt_cpt{
	font-size: 14px;
	line-height: 1.6em;
}

.txt_s{
	font-size: 16px;
	line-height: 1.8em;
}

.txt_m{
	font-size: 18px;
	line-height: 2.0em;
}

.txt_l{
	font-size: 20px;
	line-height: 2.2em;
}


/* 見出し */

h1.smp{
  font: bold 30px sans-serif;
  border: none; 
}

h1.smp span{
  font: bold 16px sans-serif;
  border: none; 
}

h2.smp{
  font: bold 28px sans-serif;
  color: revert;
  background: none;
}

h3.smp{
  font: bold 20px sans-serif;
  color: revert;
  margin-bottom: 20px;
}

h4.smp{
  font: bold 16px sans-serif;
  color: revert;
  margin: 5px 15px;
}

/* ノベルティページ */
.grid-item3 h3.smp {
  color: darkslategrey;
  font: bold 16px sans-serif;
  text-align: left;
  border: none;
  transition: all .5s;
  height: 35px;
}

.grid-item3 a[href].smp:hover {
  color: revert;
  text-decoration: none;
}

h3.wno {
  font: bold 16px/1.5 "Hiragino Sans";
  color: #444;
  border: none;
}

.grid-item3 img.smp {
  height: 185px;  
}

.brd_grn {
  border: solid 1px yellowgreen;
}

.brd_grd_knn {
  border: solid 1px #dadada;
}

.pnk_box {
  font-size: 14px;
  color: #743;
  background-color: #dadada;
}

.prc_pnk {
  color: hotpink;
  border: solid 1px hotpink;
}


/* 背景色スタイル */
.bgc_grey {
  background-color: #fcfaff; 
}

/* 縦位置中央寄せ */
.box_alg_cnt{
  display: flex;
  align-items: center;
}

.box_img{
  width: inherit;
  display: block;
}


/* ボタン */

a.btn-brd {
  display: block;
  padding: 10px;
  border: 2px solid #07C;
  border-radius: 0;
  background: #fff;
  transition: all .5s;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}

a.btn-brd:hover {
  color: #fff;
  background: #07C;
  text-decoration: none;
}

a.btn-brd-brw {
  color: #744;
  display: block;
  padding: 10px;
  border: 2px solid #744;
  border-radius: 0;
  background: #fff;
  transition: all .5s;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}

a.btn-brd-brw:hover {
  color: #fff;
  background: #744;
  text-decoration: none;
}

.flx_drc_clm{
  display: flex;
  flex-direction: column;
}

.tricyle {
  font: normal 18px/1.5 "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
}

/* 三輪特集ページ */
.itm_pnt {
  font-size: 14px;
  color: white;
  background-color: green;
  padding: 5px;
}

h1.trc {
  font: bold 45px/1.5 "Hiragino Sans";
  color: #147240;
  border: none; 
}

h1.trc span {
  font-size: 18px;
  color: #444;
}

h2.trc {
  font: 36px/1.5 "Hiragino Sans";
  color: #444;
  background: none;
  border-top: 1px solid #147240;
  padding-top: 10px;
}

h2.trc span {
  font: bold 36px/1.5 "Hiragino Sans";
  color: #147240;
}

h2.trc span small {
  font-size:16px;
}

h3.trc {
  font: 27px/1.5 "Hiragino Sans";
  color: #444;
  border-left: #147240 solid 6px;
}

h3.trc span{
  font: bold 27px/1.5 "Hiragino Sans";
  color: #147240;
}

.img_siz75 {
  width: 75%;
  margin: 0 auto;
}

/* ひんやりグッズ特集ページ */

h1.hny {
  font: bold 32px/1.5 "Hiragino Sans";
  color: #07C;
  border: none; 
}

h1.hny span {
  font-size: 18px;
  color: #444;
}

h2.hny {
  font: 24px/1.5 "Hiragino Sans";
  color: #444;
  background: none;
  border-top: 1px solid #07c;
  padding-top: 10px;
}

h2.hny span {
  font: bold 24px/1.5 "Hiragino Sans";
  color: #07C;
}

h3.hny {
  font: 20px/1.5 "Hiragino Sans";
  color: #444;
  border: none;
  margin: 20px 10px 0;
}

h3.hny span{
  font: bold 20px/1.5 "Hiragino Sans";
  color: #07c;
}

.content-text {
  font-size: 16px;
  line-height: 2em;
  letter-spacing: 0.05em;
  padding: 20px;
}

.content-text span {
  font-weight: bold;
}

.cnt_txt {
  font-size: 16px;
  line-height: 2em;
  letter-spacing: 0.05em;
}

.cnt_txt span {
  font-weight: bold;
  color: #07C;
}

/* サイドナビ用 */

.sid {
  width: 96%;
  text-align: center;
  border: solid 1px #CCCCCC;
  padding: 4px;
  margin-bottom: 20px;
}

.sid p {
  font-size: 15px;
  font-weight: bold;
  line-height: 25px;
  text-align: center;
  width: 100%;
  height: 25px;
  display: block;
  background-color: #CCC;
  color: #333;
}

.sid li {
  font-size: 14px;
  line-height: 2em;
  margin: 7px;
  text-align: left;
  margin-left: 20px;
}

.sid li a {
  color: #333;
  text-decoration: none;
}


/* マージン */

.m-0 {
	margin: 0px;
}

.m-10 {
	margin: 10px;
}

.m-20 {
	margin: 20px;
}

.m-30 {
	margin: 30px;
}

.m-40 {
	margin: 40px;
}

.m-50 {
	margin: 50px;
}


.mx-10 {
	margin: 0px 10px;
}

.mx-20 {
	margin: 0px 20px;
}

.mx-30 {
	margin: 0px 30px;
}

.mx-40 {
	margin: 0px 40px;
}

.mx-50 {
	margin: 0px 50px;
}


.my-10 {
	margin: 10px 0px;
}

.my-20 {
	margin: 20px 0px;
}

.my-30 {
	margin: 30px 0px;
}

.my-40 {
	margin: 40px 0px;
}

.my-50 {
	margin: 50px 0px;
}



.mt--60 {
	margin-top: -60px;
}

.mt-0 {
	margin-top: 0px;
}

.mt-10 {
	margin-top: 10px;
}

.mt-20 {
	margin-top: 20px;
}

.mt-30 {
	margin-top: 30px;
}

.mt-40 {
	margin-top: 40px;
}

.mt-50 {
	margin-top: 50px;
}


.mb-0 {
	margin-bottom: 0px;
}

.mb-10 {
	margin-bottom: 10px;
}

.mb-20 {
	margin-bottom: 20px;
}

.mb-30 {
	margin-bottom: 30px;
}

.mb-40 {
	margin-bottom: 40px;
}

.mb-50 {
	margin-bottom: 50px;
}


.ml-0 {
	margin-left: 0px;
}

.ml-10 {
	margin-left: 10px;
}

.ml-20 {
	margin-left: 20px;
}

.ml-30 {
	margin-left: 30px;
}

.ml-40 {
	margin-left: 40px;
}

.ml-50 {
	margin-left: 50px;
}


.mr-0 {
	margin-right: 0px;
}

.mr-10 {
	margin-right: 10px;
}

.mr-20 {
	margin-right: 20px;
}

.mr-30 {
	margin-right: 30px;
}

.mr-40 {
	margin-right: 40px;
}

.mr-50 {
	margin-right: 50px;
}


/* パディング */

.p-0 {
	padding: 0px;
}

.p-10 {
	padding: 10px;
}

.p-20 {
	padding: 20px;
}

.p-30 {
	padding: 30px;
}

.p-40 {
	padding: 40px;
}

.p-50 {
	padding: 50px;
}


.px-10 {
	padding: 0px 10px;
}

.px-20 {
	padding: 0px 20px;
}

.px-30 {
	padding: 0px 30px;
}

.px-40 {
	padding: 0px 40px;
}

.px-50 {
	padding: 0px 50px;
}


.py-10 {
	padding: 10px 0px;
}

.py-20 {
	padding: 20px 0px;
}

.py-30 {
	padding: 30px 0px;
}

.py-40 {
	padding: 40px 0px;
}

.py-50 {
	padding: 50px 0px;
}


.pt-0 {
	padding-top: 0px;
}

.pt-10 {
	padding-top: 10px;
}

.pt-20 {
	padding-top: 20px;
}

.pt-30 {
	padding-top: 30px;
}

.pt-40 {
	padding-top: 40px;
}

.pt-50 {
	padding-top: 50px;
}


.pb-0 {
	padding-bottom: 0px;
}

.pb-10 {
	padding-bottom: 10px;
}

.pb-20 {
	padding-bottom: 20px;
}

.pb-30 {
	padding-bottom: 30px;
}

.pb-40 {
	padding-bottom: 40px;
}

.pb-50 {
	padding-bottom: 50px;
}


.pl-0 {
	padding-left: 0px;
}

.pl-10 {
	padding-left: 10px;
}

.pl-20 {
	padding-left: 20px;
}

.pl-30 {
	padding-left: 30px;
}

.pl-40 {
	padding-left: 40px;
}

.pl-50 {
	padding-left: 50px;
}


.pr-0 {
	padding-right: 0px;
}

.pr-10 {
	padding-right: 10px;
}

.pr-20 {
	padding-right: 20px;
}

.pr-30 {
	padding-right: 30px;
}

.pr-40 {
	padding-right: 40px;
}

.pr-50 {
	padding-right: 50px;
}

/* img-width用 */

.mw-100prs {
  max-width: 100%;
}

.mw-50prs {
  max-width: 50%;
}

.mw-25prs {
  max-width: 25%;
}

.mw-20prs {
  max-width: 20%;
}

/* width用 */

.w-100 {
  width: 100px;
}

.w-200 {
  width: 200px;
}

.w-300 {
  width: 300px;
}

.w-400 {
  width: 400px;
}

.w-500 {
  width: 500px;
}

/* height用 */

.h-100 {
  height: 100px;
}

.h-200 {
  height: 200px;
}

.h-300 {
  height: 300px;
}

.h-400 {
  height: 400px;
}

.h-500 {
  height: 500px;
}


/* text */

.t-xxs {
  font: normal 12px/1.8 sans-serif;
}

.t-xs {
  font: normal 14px/1.8 sans-serif;
}

.t-s {
  font: normal 16px/1.8 sans-serif;
}

.t-m {
  font: normal 18px/1.8 sans-serif;
}

.t-l {
  font: normal 20px/1.8 sans-serif;
}

.t-xl {
  font: normal 22px/1.8 sans-serif;
}

.t-xxl {
  font: normal 24px/1.8 sans-serif;
}

.t-xxs-b {
  font: bold 12px/1.8 sans-serif;
}

.t-xs-b {
  font: bold 14px/1.8 sans-serif;
}

.t-s-b {
  font: bold 16px/1.8 sans-serif;
}

.t-m-b {
  font: bold 18px/1.8 sans-serif;
}

.t-l-b {
  font: bold 20px/1.8 sans-serif;
}

.t-xl-b {
  font: bold 22px/1.8 sans-serif;
}

.t-xxl-b {
  font: bold 24px/1.8 sans-serif;
}

.t-b {
  font-weight: bold;
}

.t-u {
  border-bottom: solid 1px #777;
}

.ta-l {
  text-align: left;
}

.ta-c {
  text-align: center;
}

.ta-r {
  text-align: right;
}

span.rank-1 {
  font-size: 10px;
  background-color: gold;
  color: #fff;
  margin: 0 5px;
  display: inline-block;
  width: 1.5em;
  height: 1.5em;
  line-height: 1.5;
  border-radius: 100vh;
}

span.rank-2 {
  font-size: 10px;
  background-color: silver;
  color: #fff;
  margin: 0 5px;
  display: inline-block;
  width: 1.5em;
  height: 1.5em;
  line-height: 1.5;
  border-radius: 100vh;
}

span.rank-3 {
  font-size: 10px;
  background-color: brown;
  color: #fff;
  margin: 0 5px;
  display: inline-block;
  width: 1.5em;
  height: 1.5em;
  line-height: 1.5;
  border-radius: 100vh;
}

/* トップに戻るボタン */
html {
  scroll-behavior: smooth;
}

.pagetop {
  height: 30px;
  width: 30px;
  position: fixed;
  right: 30px;
  bottom: 30px;
  color: #FFF;
  background: #3D7DCA;
  border: solid 2px #3D7DCA;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
}

.pagetop__arrow {
  height: 10px;
  width: 10px;
  border-top: 3px solid #FFF;
  border-right: 3px solid #FFF;
  transform: translateY(20%) rotate(-45deg);
}

/*ページ内スクロール遷移用 */
#top-novelty,
#top-event,
#top-gift,
#top-goods {
	scroll-margin-top: 150px; 
}


/*専門店サムネイル用 */
.tbn {
  border: solid 1px #dadada;
}

.tbn:hover {
  border: solid 1px #07C;
  overflow: hidden; /*はみ出した部分を隠す */
}

.tbn a img {
  padding: 10px;
  width: 180px;          /* 縦横比を維持しつつ拡大縮小 */
  height: 180px;
  object-fit: cover;    /* 中央からクロップして収める */
  object-position: center; /* 中心から調整 */
  transition: transform .3s ease;
}

.tbn:hover a img {
  transform: scale(1.04);
}

.btn,
.tbn a h3 {
  display: block;
  margin: 10px;
  padding: 10px 5px;
  color: #07C;
  border: 2px solid #07C;
  border-radius: 0;
  background: #fff;
  transition: all .5s;
  font: bold 16px/1.25 "Hiragino Sans";
  text-align: center;
}

.btn:hover,
.tbn:hover  a  h3 {
  color: #fff;
  background: #07C;
}

/* アコーディオン全体を囲むラッパー */
.accordion-wrap {
	position: relative; /* ボタンを配置しやすくするため */
	padding-bottom: 5px;
  }
  
  /* チェックボックス本体は非表示にする */
  .accordion-checkbox {
	display: none;
  }
  
  /* 説明文(p)の初期状態（3行で省略） */
  .accordion-wrap .cpt {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2; /* ここで表示したい行数を指定 */
	overflow: hidden;
	margin: 0 ;
	padding: 0 10px;
	font: normal 12px/1.4 sans-serif;
	color: #666;
	text-align: left;
  }
  
  /* チェックボックスがONになったら、行数制限を解除 */
  .accordion-checkbox:checked + .cpt {
	-webkit-line-clamp: unset; /* 制限を解除して全文表示 */
  }
  
  /* 開閉ボタン(+)のスタイル */
  .accordion-toggle {
	position: absolute;   /* 親要素(.accordion-wrap)を基準に配置 */
	bottom: 5px;            /* 親要素の下端に配置 */
	right: 5px;             /* 親要素の右端に配置 */
	width: 20px;
	height: 20px;
	cursor: pointer;
	background-color: rgba(255, 255, 255, 0.5); /* 半透明の白背景で下の文字が少し透けるように */
	border-radius: 10px;
	color: #777;
	font-size: 14px;
	text-align: center;
	line-height: 20px;    /* 文字を上下中央に */
  }
	
  /* 疑似要素で「+」の縦棒と横棒を作成 */
/* 疑似要素でボタンのテキストを「▼」にする */
.accordion-toggle::before {
  content: '▼';
}

/* チェックが入ったら、ボタンのテキストを「▲」に変更する */
.accordion-checkbox:checked ~ .accordion-toggle::before {
  content: '▲';
}

  /* 商品ページ h装飾 */

.item_h1 {
	font-size: 20px;
}

.item_h2 {
	font-size: 16px;
}

h2 span.count {
font: bold 24px / 1.5 "Hiragino Sans";
}



