@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&family=Questrial&display=swap');
/*基本設定*/
*{
	margin: 0;
}
html, body {
  /* ルートのフォントサイズを10pxに設定しておく */
	font-size: 62.5%;
	color: #000;
}

img{
	width: 100%;
	height: auto;
}
figure img {
	max-width: 100%;	
	vertical-align: bottom;
}
a{
	color: #000;
}
/*ページ全体の設定-----------------------*/
.wrapper{
	font-size: 1.6em;/* ルートのフォントサイズを1.6em（16pxと同等のサイズ）に設定 */
	font-family: 'Noto Sans JP', sans-serif;
	/*font-family: 'Questrial', sans-serif;*/
}
.maker_y{
	background: linear-gradient(transparent 60%, #ffff66 60%);
	font-weight: 600;
}

/*セール情報-----------------------*/
#sale-fv{
	width: 100%;
	padding: 0 10px;
	box-sizing: border-box;
}
#sale-fv .pc, .sale-product-info .pc{
	display: none;
}
#sale-fv .sp, .sale-product-info .sp{
	display: block;
	width: auto;
	max-width: 100%;
	position: relative;
}
.sale-product-info .sp p{
	text-align: center;
	color: #fff;
	left: 0;
	right: 0;
	margin: 0 auto;
}
.sale-product-info .sp p.absolute:nth-of-type(1){
	position: absolute;
	font-size: 6.0vw;
	font-weight: bold;
	top: 3.8vw;
}
.sale-product-info .sp p.absolute:nth-of-type(1) span{
	font-size: 3.0vw;
	margin: 0 0.4vw;
}
.sale-product-info .sp p.absolute:nth-of-type(2){
	position: absolute;
	font-size: 4.5vw;
	font-weight: 500;
	bottom: 7.5vw;
}
.sale-product-info .sp p.absolute:nth-of-type(2) span{
	font-size: 3.0vw;
}
.sale-product-info .sp p.absolute:nth-of-type(2) span:first-of-type{
	margin-left: -1.2vw;
}
.sale-comparison{
	position: relative;
	background-color: #DE0500;
	padding: 5px 3px;
  margin-bottom: 10px;
	border-radius: 0.4rem;
}
.sale-comparison::after{
	content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border: 5px solid transparent;
  border-top: 10px solid #DE0500;
}
.sale-comparison p{
	color: #fff;
	font-size: 1.4rem;
	line-height: 1.5rem;
}
.sale-comparison p span{
	font-size: 1.1rem;
}
.sale-comparison p:first-of-type span:first-of-type{
	margin: 0 -0.2rem 0 -0.5rem;
}
/*記事本文-----------------------*/
article{
	padding: 20px 0 0;
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows:
		[h1] auto
		[mv] auto
		[opening] auto
		[toc] auto
		[ranking] auto
		[comparison] auto
		[column] auto;
	row-gap: 20px;
	grid-row-gap: 20px;/*旧ブラウザ用記述*/
	font-size: 1.8rem;
}
/*パーツの配置*/
article > * {
	grid-column: 1;
}
/*タイトル*/
.tit_article{
	grid-row: h1;
	font-size: 2.2rem;
  margin: 0 10px;
}
/*メインビジュアル*/
.mv{
	grid-row: mv;
  margin: 0 10px;
}
.txt_mv {
  grid-row: mv;
  height: max-content;
  align-self: end;
  text-align: center;
  line-height: 1.2;
  font-size: 2.0rem;
  font-weight: 600;
  color: #fff;
  background: rgba(40,190,210,0.5);
  background-blend-mode: multiply;
  padding: 10px;
  margin: 0 10px;
}
/*冒頭文*/
.opening{
	grid-row: opening;
  margin: 0 10px;
}
.tit_sub_article,
.tit_toc {
  font-size: 2.0rem;
  border-left: 3px solid #083c8c;
  padding: 0 0 0 10px;
  margin: 0 0 10px;
}
.txt_article {
  margin: 0 0 40px;
  line-height: 1.6;
}
/*目次*/
.toc{
	grid-row: toc;
	border: 2px solid #ddd;
	padding: 15px;
	margin: 0 10px 40px;
}
.list_toc{
	padding: 0;
	list-style: none;
}
.list_toc >li{
	margin: 0 0 10px;
}
.list_toc li > ul{
	list-style: none;
	position: relative;
	padding: 0 0 0 20px;
}
.list_toc > li:before{
	content: "■";
	position: left;
	top: 0;
}
.list_toc > li > ul >li:before{
	content: "・";
	position: left;
	top: 0;
}

/*ランキング-----------------------*/
.ranking{
	background: #f5f1e9;
	padding: 40px 10px 0;
}
.list_rank{
	list-style-type: none;
	padding: 0;
}
.list_rank > li{
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows:
		[tit_rank] auto
		[photo_rank] auto
		[copy_rank] auto
		[txt_rank] auto
		[chart_rank] auto
		[chart_items_rank] auto
		[stage5] auto
		[buz_good] auto
		[buz_bad] auto
		[recommended] auto
		[sale-product-info] auto
		[cv_rank] auto;
	row-gap: 15px;
	grid-row-gap: 15px;/*旧ブラウザ用記述*/
}
/*パーツの配置*/
.list_rank > li > * {
	grid-column: 1;
}
.ranking .tit_sub_article{
	margin: 0 0 50px;
}
.ranking .txt_article{
	margin: 0 0 20px;
}
/*タイトル*/
.tit_rank {
  grid-row: tit_rank;
  font-size: 2.0rem;
  position: relative;
  display: block;
  margin: 0 auto;
}
/*.list_rank > li:nth-child(1) > .tit_rank:before {
  content: "";
  background: url(https://nelture.itembox.design/item/free-page/lp/no1/ico_rank01.png) top left no-repeat;
  background-size: contain;
  width: 45.5px;
  height: 30px;
  position: absolute;
  top: 0;
  left: -60px;
}
.list_rank > li:nth-child(2) > .tit_rank:before {
  content: "";
  background: url(https://nelture.itembox.design/item/free-page/lp/no1/ico_rank02.png) top left no-repeat;
  background-size: contain;
  width: 45.5px;
  height: 30px;
  position: absolute;
  top: 0;
  left: -60px;
}
.list_rank > li:nth-child(3) > .tit_rank:before {
  content: "";
  background: url(https://nelture.itembox.design/item/free-page/lp/no1/ico_rank03.png) top left no-repeat;
  background-size: contain;
  width: 45.5px;
  height: 30px;
  position: absolute;
  top: 0;
  left: -60px;
}
.list_rank > li:nth-child(4) > .tit_rank:before {
  content: "";
  background: url(https://nelture.itembox.design/item/free-page/lp/no1/ico_rank04.png) top left no-repeat;
  background-size: contain;
  width: 45.5px;
  height: 30px;
  position: absolute;
  top: 0;
  left: -60px;
}
.list_rank > li:nth-child(5) > .tit_rank:before {
  content: "";
  background: url(https://nelture.itembox.design/item/free-page/lp/no1/ico_rank05.png) top left no-repeat;
  background-size: contain;
  width: 45.5px;
  height: 30px;
  position: absolute;
  top: 0;
  left: -60px;
}*/
/*商品画像*/
.photo_item{
	grid-row: photo_rank;
}
.evaluation {
  grid-row: photo_rank;
  width: max-content;
  height: max-content;
  text-align: center;
  color: #fff;
  font-size: 1.4rem;
  background: #28bed2;
  margin: 10px;
  padding: 5px 10px;
}
.list_rank > li:nth-child(even) .evaluation{
	margin: 10px 10px 0 auto;
}
.evaluation .num {
  font-size: 4.5rem;
  font-family: 'Questrial', sans-serif;
}
/*キャッチコピー*/
.copy_rank_item {
  grid-row: copy_rank;
  font-size: 2.0rem;
  font-weight: 600;
  color: #f36996;
}
/*説明文*/
.ranking .txt_article{
	grid-row: txt_rank;
	margin: 0;
}
/*チャート*/
.chart_rank{
	grid-row: chart_rank;
	margin: 0 0 20px;
}
/*チャート内訳*/
.chart_items{
	grid-row: chart_items_rank;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5px 15px;
	grid-gap: 5px 15px;/*旧ブラウザ用表記*/
	font-size: 1.4rem;
	margin: 0 0 20px;
}
.list_chart_items{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 5px 5px;
	grid-gap: 5px 5px;/*旧ブラウザ用表記*/
}
.stage5{
	grid-row: stage5;
	margin: 0 0 40px;
}
.stage5 figure + figure{
  margin-top: 30px;
}
.stage5 figure figcaption{
  font-size: 90%;
  color: #fff;
  text-align: center;
  background-color: #999;
  border-radius: 20px;
  padding: 3px 0;
  margin-bottom: 10px;
}

.chart_rank, .stage5 {
  max-width: 450px;
  margin: 20px auto;
}

/*評価の高い口コミ*/
.buzz_good{
	grid-row: buz_good;
	margin: 0 0 10px;
}
.tit_buzz_good{
	grid-row: copy_rank;
  font-size: 2.0rem;
  font-weight: 600;
  color: #f36996;
  padding: 0 0 5px 65px;
  position: relative;
}
.tit_buzz_good:before{
	content: "";
	width: 55px;
	height: 55px;
	background: url(https://nelture.itembox.design/item/free-page/lp/no1/ico_good.png) top left no-repeat;
	background-size: 100% 100%;
	position: absolute;
	top: -15px;
	left: 0;
}
.list_buzz_good {
  list-style-type: disc;
  background: #fff;
  border: 1px solid #f36996;
  padding: 20px 15px;
  border-radius: 10px;
}
.list_buzz_good > li{
	margin: 0 0 5px 30px;
	position: relative;
}

/*評価の低い口コミ*/
.buzz_bad{
	grid-row: buz_bad;
	margin: 0 0 10px;
}
.tit_buzz_bad{
	grid-row: copy_rank;
  font-size: 2.0rem;
  font-weight: 600;
  color: #808080;
  padding: 0 0 5px 65px;
  position: relative;
}
.tit_buzz_bad:before{
	content: "";
	width: 55px;
	height: 55px;
	background: url(https://nelture.itembox.design/item/free-page/lp/no1/ico_bad.png) top left no-repeat;
	background-size: 100% 100%;
	position: absolute;
	top: -15px;
	left: 0;
}
.list_buzz_bad {
  list-style-type: disc;
  background: #fff;
  border: 1px solid #808080;
  padding: 20px 15px;
  border-radius: 10px;
}
.list_buzz_bad > li{
	margin: 0 0 5px 30px;
	position: relative;
}


/*こんな人にオススメ*/
.recommended{
	grid-row: recommended;
	margin: 0 0 10px;
}
.tit_recommended{
	grid-row: copy_rank;
  font-size: 2.0rem;
  font-weight: 600;
  color: #28bed2;
  padding: 0 0 5px 65px;
  position: relative;
}
.tit_recommended:before{
	content: "";
	width: 55px;
	height: 55px;
	background: url(https://nelture.itembox.design/item/free-page/lp/no1/ico_star.png) top left no-repeat;
	background-size: 100% 100%;
	position: absolute;
	top: -15px;
	left: 0;
}
.list_recommended {
  list-style-type: disc;
  border: 1px solid #28bed2;
  background: rgba(40,190,210,0.1);
  padding: 20px 15px;
  border-radius: 10px;
}
.list_recommended > li{
	margin: 0 0 5px 30px;
	position: relative;
}

/*CV ランキング*/
.cv_rank{
	grid-row: cv_rank;
	text-align: center;
	padding: 0 0 80px;
}
.txt_cv{
	font-weight: 600;
	margin: 0 0 10px;
}
.btn_cv {
  display: block;
  background: #F7931E;
  border-radius: 10px;
  text-decoration: none !important;
  text-shadow: 2px 2px 2px #f15a24;
  box-shadow: 0 5px 0 #f15a24;
  font-size: 2.2rem;
  font-weight: 600;
  color: #fff !important;
  padding: 15px 0;
}

/*比較テーブル-----------------------*/
.comparison{
	grid-row: comparison;
	margin: 20px 0;
}
.comparison .tit_sub_article{
	margin: 0 10px 20px;
}
.scroll-table {
	width: 100vw;
	overflow: auto;
	white-space: nowrap;
}
.tbl_comparison{
	font-size: 1.4rem;
	text-align: center;
	border-collapse: collapse;
	border: 1px solid #ddd;
	margin: 0 10px;
}
.tbl_comparison td{
	min-width: 200px;
}
.tbl_comparison td,
.tbl_comparison th{
	border: 1px solid #ddd;
	padding: 7px;
}
.tbl_comparison .num th img {
  width: 45.5px;
  height: auto;
}
.tbl_comparison .title{
	color: #28bed2;
	font-weight: 600;
	text-align: left;
}
.tbl_comparison .item_name td img {
  width: 150px;
  height: auto;
}
.tbl_comparison .txt_item_name{
	margin: 0 0 5px;
}
.tbl_comparison .price{
	font-weight: 600;
}
.tbl_comparison .tbl_evaluation{
	color: #cda037;
	font-weight: 600;
}
.btn_cv_comparison {
  display: block;
  background: #F7931E;
  border-radius: 5px;
  text-decoration: none !important;
  text-shadow: 2px 2px 2px #f15a24;
  box-shadow: 0 2px 0 #f15a24;
  font-weight: 600;
  color: #fff !important;
  padding: 10px 0;
}
/*枕の選び方コラム-----------------------*/
.column{
	background: #f5f1e9;
	padding: 40px 10px;
}
.column .txt_article{
	margin: 0 0 20px;
}
.column .list_article{
	margin: 0 0 20px;
}
.column .tit_tertiary_article {
  color: #083c8c;
  font-size: 2.0rem;
  font-weight: 600;
  text-align: center;
  margin: 0 0 10px;
  padding: 20px 0 0;
  border-top: 2px dotted #ddd;
}
.txt_article + .tit_tertiary_article {
  margin: 30px 0 10px;
}
.tit_male_recommended {
  font-size: 1.8rem;
  font-weight: 600;
  color: #fff;
  text-align: center;
  background: #28bed2;
  border-radius: 20px;
  display: inline-block;
  padding: 0 20px;
}
.list_male_recommended{
	list-style-type: disc;
	list-style-position: inside;
	border: 2px dotted #28bed2;
	background: #fff;
	padding: 20px 15px 15px;
	margin: -10px 0 15px;
}
.tit_female_recommended {
  font-weight: 600;
  color: #fff;
  text-align: center;
  background: #f36996;
  border-radius: 20px;
  display: inline-block;
  padding: 0 20px;
}
.list_female_recommended{
	list-style-type: disc;
	list-style-position: inside;
	border: 2px dotted #f36996;
	background: #fff;
	padding: 20px 15px 15px;
	margin: -10px 0 30px;
}
.sleep_style{
	list-style-type: disc;
	list-style-position: inside;
	border: 2px dotted #ddd;
	background: #fff;
	padding: 15px;
	margin: 0 0 20px;
}
.sleep_style dl{
	display: grid;
	grid-template-columns: auto auto;
	gap: 10px 10px;
	grid-gap: 10px 10px;/*旧ブラウザ用記述*/
}
.sleep_style dl dt{
	font-weight: 600;
}
.img_sleep_style{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 10px;
	grid-gap: 10px 10px;/*旧ブラウザ用記述*/
	margin: 0 0 30px;
}
.material{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 10px;
	grid-gap: 10px 10px;/*旧ブラウザ用記述*/
	margin: 0 0 30px;
}

.tit_small_recommended {
  font-weight: 600;
  color: #fff;
  text-align: center;
  background: #f36996;
  border-radius: 20px;
  display: inline-block;
  padding: 0 20px;
}
.list_small_recommended{
	list-style-type: disc;
	list-style-position: inside;
	border: 2px dotted #f36996;
	background: #fff;
	padding: 20px 15px 15px;
	margin: -10px 0 15px;
}
.tit_middle_recommended {
  font-weight: 600;
  color: #fff;
  text-align: center;
  background: #f7931e;
  border-radius: 20px;
  display: inline-block;
  padding: 0 20px;
}
.list_middle_recommended{
	list-style-type: disc;
	list-style-position: inside;
	border: 2px dotted #f7931e;
	background: #fff;
	padding: 20px 15px 15px;
	margin: -10px 0 15px;
}

.tit_large_recommended {
  font-weight: 600;
  color: #fff;
  text-align: center;
  background: #28bed2;
  border-radius: 20px;
  display: inline-block;
  padding: 0 20px;
}
.list_large_recommended{
	list-style-type: disc;
	list-style-position: inside;
	border: 2px dotted #28bed2;
	background: #fff;
	padding: 20px 15px 15px;
	margin: -10px 0 15px;
}
.img_size_variation {
  margin: 0 0 30px;
}


.tit_normal_recommended {
  font-weight: 600;
  color: #fff;
  text-align: center;
  background: #f7931e;
  border-radius: 20px;
  display: inline-block;
  padding: 0 10px;
  font-size: 1.7rem;
}
.list_normal_recommended{
	list-style-type: disc;
	list-style-position: inside;
	border: 2px dotted #f7931e;
	padding: 20px 15px 15px;
	margin: -10px 0 15px;
	z-index: 1;
	background: #fff;
}

.tit_wave_recommended {
  font-weight: 600;
  color: #fff;
  text-align: center;
  background: #28bed2;
  border-radius: 20px;
  display: inline-block;
  padding: 0 10px;
  font-size: 1.6rem;
}
.list_wave_recommended{
	list-style-type: disc;
	list-style-position: inside;
	border: 2px dotted #28bed2;
	padding: 20px 15px 15px;
	margin: -10px 0 15px;
	z-index: 1;
	background: #fff;
}
.tit_split_recommended {
  font-weight: 600;
  color: #fff;
  text-align: center;
  background: #f36996;
  border-radius: 20px;
  display: inline-block;
  padding: 0 10px;
  font-size: 1.7rem;
}
.list_split_recommended{
	list-style-type: disc;
	list-style-position: inside;
	border: 2px dotted #f36996;
	padding: 20px 15px 15px;
	z-index: 1;
	margin: -10px 0 30px;
	background: #fff;
}

.tit_feature_recommended {
  font-weight: 600;
  color: #fff;
  text-align: center;
  background: #28bed2;
  border-radius: 20px;
  display: inline-block;
  padding: 0 20px;
}
.list_feature_recommended{
	list-style-type: disc;
	list-style-position: inside;
	border: 2px dotted #28bed2;
	padding: 20px 15px 15px;
	margin: -10px 0 15px;
	z-index: 1;
	background: #fff;
}
.annotation {
  margin: 5px 0 0;
  text-align: left;
  font-size: 1.2rem;
}


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

/*デスクトップ/タブレット横用記述*/

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

@media screen and (min-width: 769px)  {
	body{
		background-color: rgba(39, 190, 207, 0.1);
	}
	#sale-fv{
		width: 100%;
		padding: 0 20px;
		box-sizing: border-box;
	}
	#sale-fv .pc, .sale-product-info .pc{
		display: block;
		width: auto;
		max-width: 100%;
		position: relative;
	}
	.sale-product-info .pc p{
		text-align: center;
		color: #fff;
		left: 0;
		right: 0;
		margin: 0 auto;
	}
	.sale-product-info .pc p.absolute:nth-of-type(1){
		position: absolute;
		font-size: 35px;
		font-weight: bold;
		top: 23px;
	}
	.sale-product-info .pc p.absolute:nth-of-type(1) span{
		font-size: 20px;
		margin: 0 3px;
	}
	.sale-product-info .pc p.absolute:nth-of-type(2){
		position: absolute;
		font-size: 30px;
		font-weight: 500;
		bottom: 40px;
	}
	.sale-product-info .pc p.absolute:nth-of-type(2) span{
		font-size: 20px;
	}
	.sale-product-info .pc p.absolute:nth-of-type(2) span:first-of-type{
		margin-left: -8px;
	}
	#sale-fv .sp, .sale-product-info .sp{
		display: none;
	}
	.sale-comparison{
		color: #CB0400;
	}
	.sale-comparison::after{
		
	}
	.sale-comparison p{

	}
	.sale-comparison p span{

	}
	
	article{
		grid-template-columns: none;
		grid-auto-columns: 100%;
	}

	article > * {
		grid-column: 1;
	}
	.tit_article,
	.mv,
	.txt_mv,
	.opening,
	.toc{
		margin: 0 20px;
	}
	.ranking{
		padding: 40px 20px 0;
	}
	.chart_rank, .stage5 {
    max-width: 450px;
    margin: 30px auto;
	}
	.chart_items {
    font-size: 1.8rem;
    margin: 0 auto;
	}
	.img_feature {
    margin: 0 0 50px;
	}
	.scroll-table {
		width: auto;
	}
	.tbl_comparison {
    margin: 0 20px;
	}
	.column {
    padding: 40px 20px;
	}

	.annotation {
    margin: 5px 0 0;
    text-align: right;
    font-size: 1.2rem;
	}	
}