@charset "UTF-8";

/*set*/


#info_contents{
	max-width: 720px;
	margin: 0 auto;
}

.backnumber .update {
  display: none;
}

.center {
  text-align: center;
}

/*clearfix*/
.mimiyori_box:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.mimiyori_box {
  min-height: 1px;
  -webkit-font-smoothing: antialiased;
}

#info_contents h2,
#info_contents h3,
blockquote {
  clear: both;
}

.top_img {
  position: relative;
  margin-bottom: 1.5em;
}

/*.top_img p { font-size:0.88em;
	color: #fff;
	margin: 0;
}*/

/*.top_img h1,
.top_img .title {
	color: #fff;
	font-weight:bold;
	font-size: 1.5em;
}*/

.mimiyori_box h2 {
  font-size: 1.5em;
  margin-top: 2em;
  margin-bottom: 0.7em;
  border-bottom: 0.1em solid #000;
  padding-bottom: 0.2em;
}

.mimiyori_box h3 {
  font-size: 1.4em;
  margin-top: 2em;
  margin-bottom: 0.7em;
  border-left: 0.2em solid #42a5ea;
  padding-left: 0.5em;
}

.mimiyori_box h4 {
  margin-top: 1.2em;
  font-size: 1.3em;
}

.mimiyori_box h5 {
  margin-top: 1em;
  font-size: 1.15em;
  padding-left: 1em;
  text-indent: -1em;
}

#info_contents h5:before {
  content: "■";
}

.mimiyori_box p {
  font-size: 0.9em;
  /* margin-bottom: 1em; */
}

.mimiyori_box .pict img {
  max-width: 95%;
}

.source {
  text-align: left;
  margin-top: 1em;
  font-style: oblique;
  font-size: 0.75em;
  color: #999;
}

.source a {
  color: #999;
  text-decoration: underline;
}

.source:before {
  content: "引用元：";
}

.display_exact .goods_set {
  margin-bottom: 0.5em;
}

.display_exact .txt_box {
  margin-left: 145px;
}

.display_exact li + li/* .goods_set*/ {
  border-top: 0.1em dashed #fff; /*padding-top:0.5em;
	margin: 0;*/
}

.display_focus,
.display_exact {
  background: #f0f0f0;
  margin: 1em 0;
  padding: 2%;
}

.display_focus > li + li {
  margin-top: 1em;
  border-top: 0.1em dashed #fff;
  padding-top: 1em;
}

.display_focus .img_box {
  display: none;
}
.display_focus li > a {
  display: block;
  text-align: center;
  width: 40%;
  float: left;
}

.display_focus .l_img {
  max-height: 13em;
}

.display_focus .goods_set {
  /*margin-left:42%;*/
  width: 57%;
  float: right;
}

.display_focus .name {
  font-weight: bold;
}

.display_focus .btn {
  text-align: right;
}

.display_focus li {
  overflow: hidden;
}

/*==============================
正方形レイアウト
==============================*/

.thum_layout li {
  float: left;
  margin: 0.5%;
  text-align: center;
}

.thum_layout li img {
}

/*clearfix*/
.thum_layout:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.thum_layout {
  min-height: 1px;
}

* html .thum_layout {
  /*height: 1px;/*\*/ /*/
  height: auto;
  overflow: hidden;
  /**/
}

/*==============================
サンプル
==============================*/
.sample_box {
  position: relative;
  background: #fff url(/category/other/info/welcome/image/fb.png) no-repeat left
    bottom;
  background-size: auto 90%;
  -webkit-background-size: auto 90%;
  -moz-background-size: auto 90%;
  -o-background-size: auto 90%;
  -ms-background-size: auto 90%;
  padding: 0.8em 4%;
  padding-left: 5em;
  border: 0.1em solid #fe7891;
  color: #fe7891;
}

.sample_box:before {
  content: "こちらの商品は、サンプルでもお試しいただけます。";
}

.sample_box strong:before {
  content: "\aサンプル番号：";
  font-weight: normal;
  white-space: pre;
}

.sample_box a {
  font-size: 0.88em;
  display: block;
  text-align: right;
}

.sample_box a:after {
  content: "\e964";
  font-family: "icomoon";
  color: #fe7891;
}

/*==============================
table_normal
==============================*/
.table_normal th {
  background: #f0f0f0;
  white-space: nowrap;
}

.table_normal td {
  background: #fff;
  text-align: center;
  white-space: nowrap;
}

.table_normal .r_img {
  width: 5em;
}

.table_normal span {
  font-size: 0.85em;
}

.table_normal .cp_box {
  display: block;
}

/*==============================
バックナンバー
==============================*/

.backnumber li {
  border-top: 1px dotted #ccc;
  padding: 0.5em 1.5%;
}

.backnumber li:first-child {
  border-top: 1px dotted #ccc;
}

.backnumber li:hover {
  background: #ffc;
}

.backnumber h3.title {
  border-top: 0.1em solid #000;
  background-color: #f0f0f0;
  padding: 0.2em 0.5em;
  margin: 2em 0 0;
}

.backnumber a {
  display: table;
  width: 100%;
  text-decoration: none;
}

.backnumber a img,
.backnumber a span {
  display: table-cell;
  vertical-align: middle;
}

.backnumber a span {
  width: 78%;
  padding-left: 5%;
}

/*==============================
L画像切替
==============================*/

.shousai_l_ul ul {
  overflow: hidden;
  margin-top: 0.5em;
}

.shousai_l_ul li {
  float: left;
  width: 25%;
}

.shousai_l_ul li img {
  width: 95%;
  height: auto;
}

/*アパ不要要素削除*/
.shousai_l_ul_tit,
.shousai_l_ul p,
.shousai_l_ul ul:not(:first-of-type) {
  display: none;
}



/*==============================
タレントプロフィール
==============================*/
.profile_box {
  margin: 1.5em 0;
  border: 0.2em solid #ccc;
  font-size: 0.75em;
  display: table;
}

.profile_box p {
  margin-bottom: 0;
}

.profile_box .img_box,
.profile_box .txt_box {
  display: table-cell;
  padding: 1em 2%;
}

.profile_box .img_box {
  width: 35%;
  vertical-align: top;
}

.profile_box .txt_box {
  padding-left: 0;
  vertical-align: bottom;
}

.profile_box .name {
  font-size: 1.2em;
  margin-bottom: 1em;
}

/*==============================
画像位置
==============================*/

.detail_include .caption {
  margin-top: 0.2em;
  font-size: 0.73em;
  line-height: 1.3;
}

.img_right .caption,
.img_left .caption {
  max-width: 300px;
  margin-top: 0.5em;
  font-size: 0.73em;
  line-height: 1.3;
}

.detail_include .img_left .caption {
  text-align: left;
}

.detail_include .img_right .caption {
  text-align: right;
}

/*==============================
画像横並び
==============================*/
.flex_box {
  display: flex;
  width: 100%;
}

.flex_box > img {
  width: 30%;
}

.flex_box > div {
  width: 70%;
}

.attention {
  text-align: right;
  font-size: 0.85em !important;
}
/*==============================
202302 みみトピNEWテンプレート用
==============================*/

/*見た目調整
.pB1 {
  padding-bottom: 1%;
}
.pB3 {
  padding-bottom: 3%;
}

.pB5 {
  padding-bottom: 5%;
}
.pB7 {
  padding-bottom: 7%;
}
*/
/*div[id^="column0"].flex_box2{
    display: flex;
}*/
/*=========2カラム01=========*/

.column02_01box {
  margin: 3% 0;
}
/******大枠******/
#column02_01.flex_box2 {
  display: flex;
  align-items: flex-start;
  font-size: 1.2em;
  gap: 4%;
}

#column02_01.flex_box2 > div {
  text-align: center;
  width: 50%;
}

/******テキスト******/
#column02_01.flex_box2 p {
  text-align: left;
  font-size: 0.85em;
}

/******見出し******/
#column02_01.flex_box2 .headline {
  padding: 2%;
  border-radius: 5px;
  font-size: 1.2em;
  font-weight: bold;
}

#column02_01.flex_box2 .headline a {
  color: #fff;
}
/******サブコピー(見出しのところ)******/
#column02_01 .subcopy {
  font-weight: bold;
  font-size: 1.1em;
  margin: 4%;
}

/******\今回はこちら/の部分******/
#column02_01 span.sub {
  display: inline-block;
  margin-bottom: 3%;
}

/*=========2カラム01ここまで=========*/

/*=========2カラム02=========*/
#column02_02.flex_box2 {
  display: flex;
  align-items: flex-start;
  gap: 7%;
  justify-content: center;
}

#column02_02.flex_box2 > div {
  text-align: center;
  max-width: 50%;
}

/*=========2カラム02ここまで=========*/

/*=========2カラム03=========*/
#column02_03.flex_box2 {
  display: flex;
  justify-content: center;
  gap: 1%;
}
/*=========2カラム03ここまで=========*/

/*=========2カラム04=========*/
#column02_04.flex_box2 {
  display: flex;
  justify-content: center;
  gap: 5%;
}
#column02_04 .flex_text {
}
#column02_04 .flex_img {
  padding: 0%;
  flex-shrink: 0;
}
#column02_04 h4.bold {
  font-weight: bold;
  border-bottom: none !important;
  margin-bottom: 0.2em;
  margin-top: 0;
}

/*=========2カラム04ここまで=========*/

/*=========見出し装飾01=========*/
#headline01.head_line {
  font-size: 1.4em;
  font-weight: bold;
  text-align: center;
  margin: 0 0 1em 0;
  padding: 1.1em;
  border-top: 1px solid;
  border-bottom: 1px solid;
}

#headline01 .waku {
  font-size: 0.8em;
}

/*=========見出し装飾01ここまで=========*/

/*=========テキスト装飾01=========*/

#text01 {
  border: 2px solid #848484;
  margin: 7% 3% 0;
  text-align: center;
  border-radius: 7px;
}

/*=========テキスト装飾01ここまで=========*/

/*=========テキスト装飾02=========*/

#text02_yellow,
#text02_pink,
#text02_blue {
  display: inline;
}
#text02_yellow {
  background: linear-gradient(transparent 60%, #ff6 60%);
}
#text02_pink {
  background: linear-gradient(transparent 60%, #ffd5f1 60%);
}
#text02_blue {
  background: linear-gradient(transparent 60%, #d5f2ff 60%);
}
/*=========テキスト装飾02ここまで=========*/

/*=========テキスト装飾03=========*/

#text03.waku {
  border: 1px solid;
  display: inline-block;
  padding: 0.25em 0.5em;
  margin-right: 0.5em;
}

/*=========テキスト装飾03ここまで=========*/

/*=========3カラム01=========*/

#column03_01.flex_box2 ul {
  display: flex;
  gap: 1%;
  justify-content: center;
}

/*=========3カラム01ここまで=========*/

/*=========3カラム02=========*/
/******大枠******/

#column03_02.flex_box2 ul {
  display: flex;
  font-size: 1em;
  gap: 2%;
}

#column03_02.flex_box2 > ul li {
  text-align: center;
  width: 33%;
  display: flex;
  flex-direction: column;
}

#column03_02.flex_box2 img {
  margin-bottom: auto;
}

/******テキスト******/

#column03_02.flex_box2 p {
  text-align: left;
  font-size: 0.85em;
}

/******見出し******/

#column03_02.flex_box2 .headline {
  padding: 2%;
  border-radius: 5px;
  font-size: 1.2em;
  font-weight: bold;
}

#column03_02.flex_box2 .headline {
  color: #fff;
}
/******サブコピー(見出しのところ)******/

#column03_02 .subcopy {
  margin: 7% 0;
}
#column03_02 .subcopy p {
  font-weight: bold;
  font-size: 1.1em;
  text-align: center;
  margin-bottom: 0;
}

/******本文部分******/

p.ptxt {
  padding-bottom: 0.7em;
}

/*=========3カラム02ここまで=========*/

.hari {
  background: #fef1cd;
}
.uruoi {
  background: #fddde9;
}
.toumei {
  background: #d4e6fe;
}
.onayami {
  background: #ebfecd;
}
.kirei {
  background: #ffe0c6;
}

p.sample {
  font-size: 1.2em;
}

ul,
ol {
  padding: 9px;
  margin: 0;
  list-style: none;
}





@media print, screen and (min-width: 768px) {
  .mimiyori_box {
    width: 720px;
    margin: 0 auto;
  }


  /* .top_img .txt_box {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 1em;
	padding-top: 4.1em;
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	/*background: #000;
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
	background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#b3000000', GradientType=0 );
}*/

  .top_img h1,
  .top_img .title {
    letter-spacing: 0.05em;
  }
  #info_contents {
    font-size: 1.1em;
  }
  .mimiyori_box p {
    line-height: 1.7;
  }
  .display_focus .copy {
    font-size: 0.83em;
  }
  body .display_focus .btn img {
    width: 70%;
  }

  body .display_exact .btn img {
    width: 30%;
  }
  .thum_layout li {
    width: 32.3%;
  }
  .sample_box a {
    width: 10em;
    position: absolute;
    right: 1em;
    bottom: 0.8em;
  }
  .backnumber {
    overflow: hidden;
  }

  .backnumber li {
    width: 47%;
    float: left;
  }
  .display_apa {
    overflow: hidden;
  }

  .display_apa .goods_set,
  .display_apa .goods_set:after {
    clear: none;
  }

  #shousai_l_ul {
    margin-left: 42%;
  }

  .shousai_l_ul li {
    width: 14%;
  }
  .profile_box {
    font-size: 0.88em;
  }
  .profile_box .img_box {
    width: 25%;
  }
  img.img_right {
    float: right;
    margin-left: 1.2em;
    margin-bottom: 1em;
    max-width: 45%;
  }

  img.img_left {
    float: left;
    margin-right: 1.2em;
    margin-bottom: 1em;
    max-width: 45%;
  }

  div.img_right {
    float: right;
    clear: right;
    margin-left: 1.2em;
    margin-bottom: 1em;
  }

  div.img_left {
    float: left;
    clear: left;
    margin-right: 1.2em;
    margin-bottom: 1em;
  }
  #text01 {
    padding: 3% 7% 1%;
    margin: 7% 5% 3%;
  }


}

.breadcrumb-item a:link {
  color: #0058aa;
}

a.btn.btn-sm.btn-outline-primary.ml-1 {
  color: #0058aa;
}



@media print, screen and (max-width: 768px) {
  h4 {
    margin: 0;
  }



  /* .top_img .txt_box {
	background:#666;
	padding:0.5em;
	font-size:0.7em;
}*/

  .mimiyori_box h2 {
    font-size: 1.4em;
    margin: 2em 2% 0.7em 2%;
  }
  .mimiyori_box h3 {
    font-size: 1.2em;
    margin-top: 1.5em;
    margin-bottom: 2%;
  }
  .mimiyori_box h4 {
    font-size: 1em;
  }
  .mimiyori_box p {
   /*  margin: auto 0% 0.5em;*/
    line-height: 170%;
    font-size: 1.2em;
  }
  .display_focus .goods_set {
    width: 60%;
    font-size: 0.8em;
  }
  .display_focus li > a {
    width: 35%;
    display: block;
    float: left;
  }

  /* .display_focus .goods_set { margin-left:38%; }*/

  body .goods_set .name {
    font-weight: normal;
  }

  body .goods_set .copy {
    display: none;
  }
  .thum_layout li {
    width: 49%;
    font-size: 0.75em;
  }
  .sample_box {
    padding-left: 30%;
  }
  .table_normal img.r_img {
    width: 3.5em;
    max-width: inherit;
  }

  .img_right,
  .img_left {
    display: block;
    margin: 1em auto;
    text-align: center;
  }
  .flex_box {
    flex-wrap: wrap;
    justify-content: center;
  }

  .flex_box > img {
    width: 50%;
    margin-right: 0;
  }
	
	/*
  .pB3 {
    padding-bottom: 5%;
  }
  .pB7 {
    padding-bottom: 5%;
  } */
  .w60 {
    width: 60%;
  }
  .w85 {
    width: 85%;
  }
  .w90 {
    width: 90%;
  }
  #column02_01.flex_box2 {
    flex-wrap: nowrap;
  }
  #column02_01.flex_box2 p {
    font-size: 0.65em;
  }
  #column02_01.flex_box2 .headline {
    font-size: 1em;
    border-radius: 3px;
  }
  #column02_01 .subcopy {
    font-weight: bold;
    font-size: 0.9em;
    margin: 4%;
  }
  #column02_01 span.sub {
    font-size: 0.8em;
  }
  #column02_02.flex_box2 {
    flex-wrap: nowrap;
    justify-content: space-around;
    gap: 0%;
  }
  #column02_02.flex_box2 > div {
    width: 45%;
  }
  #column02_02 p {
    font-size: 0.8em;
  }
  #column02_04.flex_box2 {
    flex-direction: column;
  }
  #column02_04 .flex_text {
    padding-top: 5%;
  }
  #column02_04 .flex_img {
    width: auto;
    margin: 0 auto;
  }
  #column02_04 .flex_img img {
    width: auto;
  }
  #headline01.head_line {
    font-size: 1.2em;
    margin: 0 1em 1em 1em;
    padding: 0.8em;
  }
  #headline01 .waku {
    margin-right: 0;
    margin-bottom: 0.5em;
  }
  #text01 {
    padding: 5% 7% 1%;
    border-radius: 5px;
  }
  #text03.waku {
    margin-right: 0;
    margin-bottom: 0.5em;
  }
  #column03_01.flex_box2 ul {
    flex-wrap: nowrap;
  }
  #column03_02.flex_box2 ul {
    justify-content: space-between;
  }
  #column03_02.flex_box2 {
    flex-wrap: nowrap;
  }
  #column03_02.flex_box2 > ul li {
    width: 31%;
  }
  #column03_02.flex_box2 p {
    font-size: 0.7em;
    margin-bottom: 0;
  }
  #column03_02.flex_box2 .headline {
    font-size: 0.8em;
    border-radius: 3px;
  }
  #column03_02 .subcopy {
    font-size: 0.9em;
    margin: 6% 0% 10%;
  }
  /******カラム落ち処理******/
  #column03_02.flex_box2.row ul {
    display: block;
  }
  #column03_02.flex_box2.row > ul li {
    width: 90%;
    margin: 0 auto 10%;
  }
  #column03_02.flex_box2.row > ul li:last-child {
    margin: 0 auto;
  }
  #column03_02.row .subcopy {
    height: 15%;
  }
  #column03_02.row .subcopy {
    font-size: 1.3em;
    margin: 5% 0%;
  }
  #column03_02.flex_box2.row p {
    font-size: 1em;
  }
  #column03_02.flex_box2.row img {
    margin-top: auto;
  }
  #column03_02.flex_box2.row img {
    margin: 5% auto 0;
    width: 85%;
  }
  #column03_02.flex_box2.row .headline {
    font-size: 1em;
  }
  /*=========3カラム02ここまで=========*/

}



/*-金子追加----------------------------------------------------------------------------------------------------------------*/

.top_img img{
	width: 100%;
}

#info_contents .sample{
	margin-bottom: 5%;
}
#info_contents .item_wrapper:not(:last-of-type){
	margin-bottom: 15%;
}




	/*一商品余白調整 */
	#info_contents .c-panel{
		margin-bottom: 1rem;
		background-color: #fff;/*背景色変更*/
		padding: 5%;/*余白調整*/
		position: relative;
		padding: 3%;
	}	
	#info_contents .c-panel:not(:has(~ .c-panel)) {
		margin-bottom: 0;
	}
	/*ジャンルごと余白調整*/	
	#info_contents .cp_list{
		margin-bottom: 4rem;
	}
	#info_contents .cp_list:not(:has(~ .cp_list)) {
		margin-bottom: 0;
	}

	/*背景色変更--------------------------*/
	#info_contents .cp_list_1 .c-panel{
		background-color: #fff8e4;
	}
	#info_contents .cp_list_2 .c-panel{
		background-color: #ffebf2;
	}		
	#info_contents .cp_list_3 .c-panel{
		background-color: #e4f0ff;
	}		
	#info_contents .cp_list_4 .c-panel{
		background-color: #efffd7;
	}	
	#info_contents .cp_list_5 .c-panel{
		background-color: #ffeee0;
	}	
	/*テキストエリア*/	
	#info_contents .c-panel__body {
		margin-top: 0px;
		max-width: 70%;
		margin-left: 20px;
	}
	/*商品画像の位置*/
	#info_contents .c-panel__header {
		box-sizing: border-box;
		width: 145px;
	}
	/*商品画像の大きさ*/
	#info_contents .c-panel__header__image {
		width: 100%;
		border: 5px solid #FFF;
		background-color: #fff;
	}
	/*価格（余白確保してボタンに被るのを回避、並び方調整など）*/
	#info_contents .c-panel__price-wrapper {
		/*margin-bottom: 4rem;*/
		display: flex;
		align-items: baseline;
		flex-wrap: wrap;
		column-gap:1rem;
    --space: 3px;
	}
	

	#info_contents .c-panel__desc{
		margin-bottom: 4.9rem;
	}
	/*割引率*/
	#info_contents .c-panel__discount .badge.badge-red.c-label-discount{
		font-size: 1.4rem;
	}
	/*ボタン位置*/	
	#info_contents .c-panel__action {
		position: absolute;
		bottom: 0;
		right: 0;
	}
	/*商品とテキストを横並びに*/
	#info_contents .c-panel__link{
		display: flex;
	}
	#info_contents .more_btn{
		text-align: center;
		margin-top: 5%;
	}



	@media screen and (max-width: 768px) {
		#info_contents .sample{
	font-size: 1.4rem;
}
		
		/* 全体 */
		#info_contents{
			max-width: 100%;
			width: 100%;
		}
		/*商品のまとめ（余白確保）*/
		#info_contents .item_wrapper{
			width: 92vw;
			margin: 0 auto;
			margin-top: 8%;
		}
		/*一商品*/		
		#info_contents .c-panel {
			padding: 4% 3%;
		}
		/*商品画像*/
		#info_contents .c-panel__header {
			width: 110px;
		}
		/*タイトル余白調整*/
		#info_contents .item_title {
			margin-bottom: 3%;
		}

		/*テキスト領域*/
		#info_contents .c-panel__body {
			max-width: 63%;
			margin-left: 1.2rem;
		}
		/*商品名*/	
		#info_contents .c-panel__name {
			font-size: 1.4rem;
		}	
		/*ボタン*/
		#info_contents .btn-sm,
		#info_contents .more_btn .btn.btn-sm.btn-outline-primary{
			font-size: 1.4rem;
		}

		/*価格下に余白確保（ボタンに被るのを回避）*/		
		#info_contents .c-panel__price-wrapper {
			margin-bottom: 3.9rem;
		}
		/*商品解説SPHは非表示に*/		
		#info_contents .c-panel__desc {
    display: none;
}

		/*割引率+期日のdiv*/
		#info_contents .c-panel__discount {
			flex-basis: 100%;/*（回り込み回避）*/
			--price-space: 2px;
		}
		/*割引率*/
		#info_contents .c-panel__discount .badge.badge-red.c-label-discount {
			padding: 3px 5px;
		}
	}






/*------------------------------------------------------------------------------------------------------------------*/