.sec_ttl {
	margin: 3em 0;
}
.gray {
	color: #888;
}
h3.txt_ttl {
	font-family: Arial;
	display: inline-block;
	position: relative;
	font-size: 5vmin;
}
h3.txt_ttl + span.gray {
	display: block;
	font-size: 3vmin;
	color: #777;
	padding-top: 1em;
}
h3.txt_ttl:before {
	content: '';
	display: block;
	width: 10px;
	height: 90%;
	background: #ff9900;
	position: absolute;
	top: 10%;
	left: -1em;
}
.inner .txt_area {
	font-size: 2.8vmin;
	line-height: 2em;
}
.text-center {
	text-align: center;
}
.text-left {
	text-align: left;
}
.text-right {
	text-align: right;
}
#history {
	background-image: url(/assets/unpoulet/top/img/sec_history_bg.jpg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: bottom;
	padding-bottom: 3em;
}

#healthy .subsec .img_area {
	width: 90%;
	margin: 1.6em auto 1em auto;
}
.img_under_title {
	width: 70%;
	padding-top: 1em;
	text-align: center;
	margin: 0 auto;
}
#healthy .subsec_wrap h4 {
	color: #ff9900;
	font-size: 4vmin;
	display: inline-block;
	position: relative;
	text-align: left;
	margin-left: 2em;
}
#healthy .subsec_wrap h4 span {
	font-size: 80%;
	display: inline-block;
	padding-left: 1em;
}
#healthy .subsec_wrap h5 {
	color: #ff9900;
	font-size: 3vmin;
	display: inline-block;
	position: relative;
	text-align: left;
	font-weight: normal;
}
#healthy .subsec_wrap h4.subttl:before {
	content: '';
	display: block;
	width: 1.6em;
	height: 1.6em;
	background-image: url(/assets/unpoulet/top/img/marker_before_title.png);
	-webkit-background-size: cover;
	background-size: cover;
	background-repeat: no-repeat;
	position: absolute;
	top: -0.3em;
	left: -2em;
}
#healthy .subsec_wrap {
	text-align: left;
}
#healthy .subsec_wrap .subsec {
	margin-top: 1.6em;
}



ul.spice_list {
	margin-top: 2em;
}
ul.spice_list li {
	padding: 2em;
	text-align: left;
}
ul.spice_list li:nth-child(odd) {
	background: #F9F9F9;
}
ul.spice_list li p.img {
	text-align: center;
	padding-top: 1em;
}
ul.spice_list li p.img img {
	max-width: 50%;
}

dl.dl-table{
	width: 100%;
	overflow: hidden;
	font-size: 2.3vmin;
	line-height: 2;
}
dl.dl-table dt{
	font-weight: normal;
	margin-top: 0;
	float: left;
	box-sizing: border-box;
}
dl.dl-table dt:after{
	content: '・・・';
}
dl.dl-table dd{
	font-weight: normal;
	margin-left: 3em;
}
dl.dl-table dd:after{
	display: block;
	content: "";
	clear: both;
}
@media screen and (max-width: 320px) {
	dl.dl-table dt{
		width: 100%;
		float: none;
	}
	dl.dl-table dd{
		margin-left: auto;
		border-left: none;
	}
}
p.table-title {
	width: 100%;
	font-size: 118%;
	font-family: Arial;
	letter-spacing: 0.1em;
	color: #444;
	text-align: left;
}
p.table-desc {
	text-align: left;
	font-weight: normal;
}



.img_under_title {
	width: 70%;
	padding-top: 1em;
	text-align: center;
	margin: 0 auto;
}
#step .subsec_wrap h4 {
	color: #ff9900;
	font-size: 4vmin;
	display: inline-block;
	position: relative;
	text-align: left;
	margin-left: 2em;
}
#step .subsec_wrap h4 span {
	font-size: 80%;
	display: inline-block;
	padding-left: 1em;
}
#step .subsec_wrap h5 {
	color: #ff9900;
	font-size: 3vmin;
	display: inline-block;
	position: relative;
	text-align: left;
	font-weight: normal;
	padding-top: 1em;
}
#step .subsec_wrap h4.subttl:before {
	content: '';
	display: block;
	width: 1.6em;
	height: 1.6em;
	background-image: url(/assets/unpoulet/top/img/marker_before_title.png);
	-webkit-background-size: cover;
	background-size: cover;
	background-repeat: no-repeat;
	position: absolute;
	top: -0.3em;
	left: -2em;
}
#step .subsec_wrap {
	text-align: left;
}
#step .subsec_wrap .subsec {
	margin-top: 1em;
}
ul.step_list {
	margin-top: 2em;
}
ul.step_list li {
	padding: 2em;
	text-align: left;
}
ul.step_list li:nth-child(odd) {
	background: #f9f9f9;
}
ul.step_list li p.img {
	text-align: center;
	padding-top: 1em;
}
ul.step_list li p.img img {
	max-width: 90%;
}
#step .img_area {
	margin: 1em auto;
	max-width: 90%;
}
#step p.table-title {
	width: auto;
	font-size: 118%;
	font-family: Arial;
	letter-spacing: 0.1em;
	color: #ff9900;
	text-align: left;
	position: relative;
	display: inline-block;
}

#step p.table-title:after {
	content: '';
	display: inline-block;
	position: relative;
	top: -0.3em;
	right: -1em;
	width: 4.8em;
	height: 1px;
	background: #ff9900;
}
#step p.table-desc {
	text-align: left;
	font-weight: normal;
}


#menu {
	position: relative;
	overflow-x: clip;
}
#menu:before {
	content: '';
	z-index: -1;
	width: 200vw;
	height: 100vh;
	display: block;
	position: absolute;
	top: -10em;
	background-image: url(/assets/unpoulet/top/img/bg_coaster.jpg);
	background-repeat: no-repeat;
	background-size: cover;
}
.inner ul.menu_list {
	display: flex;
	flex-flow: row wrap;
	margin: 0 -1em;
}
.inner ul.menu_list li {
	flex: 0 1 50%;
	margin: 0;
	padding: 1em;
	box-sizing: border-box;
}
.inner ul.menu_list li figure img {
	width: 100%;
}
.inner ul.menu_list li figure figcaption {
	font-size: 85%;
	letter-spacing: 0.01em;
	margin: 0.5em 0;
	text-align: left;
	line-height: 1.5;
	font-weight: normal;
}
.inner ul.menu_list li figure figcaption span.price {
	display: block;
	padding-top: 0.6em;
}

.inner ul.menu_list_4 {
	display: flex;
	flex-flow: row wrap;
	margin: 0 -1em;
}
.inner ul.menu_list_4 li {
	flex: 0 1 50%;
	margin: 0;
	padding: 1em;
	box-sizing: border-box;
}
.inner ul.menu_list_4 li figure img {
	width: 100%;
}
.inner ul.menu_list li.horizontal {
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	flex: 1;
}
.inner ul.menu_list li.horizontal figure {
	width: 100%;
	margin-bottom: 1em;
}
.inner ul.menu_list li.horizontal figcaption {
	width: 100%;
	margin: 0;
}
.inner ul.menu_list li.caption_side {
	flex: 1;
}
.inner ul.menu_list li.caption_side figcaption {
	margin: 0;
}
.inner ul.menu_list li figure img {
	width: 100%;
}
.inner ul.menu_list li figure figcaption,
.inner ul.menu_list li figcaption {
	font-size: 80%;
	letter-spacing: 0.1em;
	margin: 0.5em 0;
	text-align: left;
	line-height: 1.5;
	font-weight: bold;
}
.inner ul.menu_list_4 li figure figcaption span.price {
	display: block;
}
.btn_area {
	text-align: center;
}
a.btn_unpoulet {
	background: #f5f5f5;
	padding: 0.5em 1em 0.6em 1em;
	color: #ff9900;
	font-size: 3.2vmin;
	font-family: Arial;
	letter-spacing: 0.2em;
	display: inline-block;
	margin: 0 auto;
}
a.btn_unpoulet:hover {
	background: #ff9900;
	color: #ffffff;
}

a.btn_unpoulet span {
	width: 1em;
	height: 1em;
	display: inline-block;
	position: relative;
}
a.btn_unpoulet span:after {
	content: "";
	position: absolute;
	top: 0.2em;
	left: 0.4em;
	border-top: 0.4em solid transparent;
	border-bottom: 0.4em solid transparent;
	border-left: 0.5em solid #ff9900;
}

/***********************
	pcのみ
	********************/

@media screen and (min-width: 769px) {
	.sec_top {
		width: 100%;
	}
	.txtArea .lead {
		text-align: left;
	}

	.txtArea .lead .img_message {
		text-align: center;
	}

	.txtArea .lead .txt_message {
		font-size: 30px;
	}
	.txtArea .lead .txt_message span:first-child {
		margin-left: 1em;
	}
	.txtArea .lead .txt_message span {
		margin-left: 0.3em;
		display: inline-block;
		border-left: 0.7em solid #ff9900; /* 右向きの三角形を作るため左のボーダーに色を付ける */
		border-top: 0.5em solid transparent; /* 上のボーダーを透過に指定 */
		border-bottom: 0.5em solid transparent; /* 下のボーダーを透過に指定 */
		position: relative;
		top: 0.1em;
	}

	/*.txtArea .lead .txt_message:after {*/
	/*	content: '';*/
	/*	width: 200px;*/
	/*	height: 1em;*/
	/*	display: inline-block;*/
	/*	position: relative;*/
	/*	top: 4px;*/
	/*	left: 20px;*/
	/*	background-image: url(/assets/unpoulet/top/img/arrow.png);*/
	/*	background-size: contain;*/
	/*	background-repeat: no-repeat;*/
	/*}*/

	h3.txt_ttl {
		font-size: 35px;
	}

	h3.txt_ttl + span.gray {
		font-size: 20px;
	}

	.inner .txt_area {
		font-size: 16px;
		line-height: 2em;
	}

	.img_under_title {
		padding-top: 20px;
	}

	#history {
		background-position: bottom right;
	}
	#healthy .subsec_wrap h4 {
		font-size: 30px;
	}

	#healthy .subsec_wrap h5 {
		font-size: 24px;
	}

	#healthy .subsec_wrap .subsec {
		position: relative;
	}

	.inner .txt_area.text-left {
		width: 70%;
	}
	#healthy .subsec_wrap .subsec:nth-of-type(1):after {
		content: '';
		display: block;
		width: 50%;
		height: 300px;
		background-image: url(/assets/unpoulet/top/img/sec_healthy_chicken_6.jpg);
		-webkit-background-size: 340px auto;
		background-size: 340px auto;
		background-position: right -60px top;
		background-repeat: no-repeat;
		position: absolute;
		top: -20px;
		right: 0;
		z-index: -1;
	}

	#healthy .subsec_wrap .subsec:nth-of-type(2) {
		margin-top: 60px;
		text-align: right;
	}

	#healthy .subsec_wrap .subsec:nth-of-type(2) .txt_area {
		text-align: right;
		margin: 0 0 0 auto;
	}

	#healthy .subsec_wrap .subsec:nth-of-type(2):after {
		content: '';
		display: block;
		width: 50%;
		height: 300px;
		background-image: url(/assets/unpoulet/top/img/sec_healthy_spice.jpg);
		-webkit-background-size: 340px auto;
		background-size: 340px auto;
		background-position: left top;
		background-repeat: no-repeat;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
	}

	dl.dl-table {
		width: 100%;
		overflow: hidden;
		font-size: 100%;
		line-height: 2;
		padding-left: 140px;
	}

	#spice .inner {
		width: 100%;
	}
	ul.spice_list li {
		position: relative;
		text-align: center;
	}
	ul.spice_list li div.li_inner {
		width: 925px;
		text-align: left;
		margin: 0 auto;
		position: relative;
	}

	ul.spice_list li p.img {
		width: 140px;
		position: absolute;
		right: 2em;
		top: 3em;
	}

	ul.spice_list li p.img img {
		max-width: 100%;
	}

	p.table-desc {
		padding-left: 80px;
	}

	#step .subsec_wrap h4 {
		font-size: 30px;
	}

	#step .subsec_wrap h5 {
		display: block;
		font-size: 24px;
		margin-top: 20px;
	}

	#step .subsec {
		display: flex;
		justify-content: space-between;
	}

	#step .subsec .img_area {
		width: 250px;
	}
	#step .subsec .txt_area.text-left {
		width: 600px;
		padding-top: 2em;
	}
	#step p.table-desc {
		width: 500px;
		padding-left: 0;
		padding-top: 40px;
	}
	#step ul.step_list li {
		position: relative;
		min-height: 300px;
		padding: 0;
	}

	#step ul.step_list li p.img {
		max-width: 250px;
		position: absolute;
		right: 50px;
		top: 50px;
	}
	#step ul.step_list li p.img img {
		max-width: 100%;
	}

	#step ul.step_list li:nth-child(even) {
		text-align: right;
	}
	#step ul.step_list li:nth-child(even) p.table-desc {
		text-align: right;
		padding-right: 0;
		margin: 0 0 0 auto;
	}
	#step ul.step_list li:nth-child(even) p.img {
		left: 30px;
	}
	#step ul.step_list li:nth-child(even) p.table-title:after {
		content: none;
	}

	#step ul.step_list li:nth-child(even) p.table-title:before {
		content: '';
		display: inline-block;
		position: relative;
		top: -0.3em;
		right: 1em;
		width: 6em;
		height: 1px;
		background: #ff9900;
	}
	#step .inner {
		width: 100%;
	}
	#step .sec_top {
		width: 925px;
		margin: 0 auto;
	}

	ul.step_list li div.li_inner {
		width: 925px;
		margin: 0 auto;
		padding: 2em;
		position: relative;
	}

	.inner ul.menu_list li {
		padding: 2em 5em;
	}
	.sec_ttl {
		margin: 5em auto !important;
	}
	.newsArea .news_ttl {
		font-size: 1.45em;
		letter-spacing: 0.2em;
	}
	.btn_instagram {
		width: 90%;
		margin: 0 auto 50px auto;
		text-align: center;
	}
	.btn_instagram img {
		width: 400px;
		border: #333 1px solid;
		border-radius: 5px;
	}
	.caution_sp {
		border: #333 1px solid;
		padding: 2em;
		text-align: left;
		line-height: 1.6;
		font-size: 90%;
	}
	#menu:before {
		content: '';
		z-index: -1;
		width: 90vw;
		height: 90vw;
		display: block;
		position: absolute;
		top: -8em;
		right: -40vw;
		background-image: url(/assets/unpoulet/top/img/bg_coaster.jpg);
		background-repeat: no-repeat;
		background-size: cover;
	}
	a.btn_unpoulet,
	a.btn_unpoulet span:after {
		transition: 0.3s;
	}
	a.btn_unpoulet:hover span:after {
		border-left: 0.5em solid #fff;
	}
}

/***********************
	spのみ
	********************/
@media screen and (max-width: 768px) {

	h3.txt_ttl {
		font-size: 5.2vmin;
	}
	#healthy .subsec_wrap h5 {
		font-size: 3.3vmin;
	}
	header .topArea .txtArea .lead {
		width: 90%;
		margin-top: 20px;
		font-weight: normal;
		font-size: 4.8vmin;
		line-height: 2;
		letter-spacing: 0.1em;
	}
	.sec_ttl:before {
		content: "";
		display: inline-block;
		width: 15% !important;
		height: 1px;
		background-color: #959595;
		vertical-align: middle;
		margin-right: 1em;
		margin-top: -5px;
	}
	.inner ul.menu_list li figure figcaption,
	.inner ul.menu_list li figcaption {
		font-size: 2.6vmin;
		letter-spacing: 0;
		color: #000;
		font-weight: 500;
		margin: 0.5em -0.2em;
	}
	#step p.table-desc {
		padding: 1em 0;
	}
	.sec_ttl {
		font-size: 75%;
	}
	#spice p.table-desc {
		padding: 1em 0 0 0;
	}
	#spice dl.dl-table {
		padding-bottom: 1em;
		font-size: 2.5vmin;
	}
	a.btn_unpoulet {
		margin-top: 2em;
		margin-bottom: 2em;
		padding: 0.7em 1.3em 0.8em 1.3em;
		font-size:3.5vmin;
		color:#f0950b;
	}
	#healthy .subsec_wrap .subsec:nth-of-type(1) {
		margin-bottom: 2em;
	}

	.txtArea .lead .txt_message span {
		margin-left: 0.3em;
		display: inline-block;
		border-left: 0.7em solid #ff9900; /* 右向きの三角形を作るため左のボーダーに色を付ける */
		border-top: 0.5em solid transparent; /* 上のボーダーを透過に指定 */
		border-bottom: 0.5em solid transparent; /* 下のボーダーを透過に指定 */
		position: relative;
		top: 0.1em;
	}
	/*.txtArea .lead .txt_message:after {*/
	/*	content: '';*/
	/*	width: 4em;*/
	/*	height: 1em;*/
	/*	display: inline-block;*/
	/*	position: relative;*/
	/*	top: 4px;*/
	/*	left: 20px;*/
	/*	background-image: url(/assets/unpoulet/top/img/arrow.png);*/
	/*	background-size: contain;*/
	/*	background-repeat: no-repeat;*/
	/*}*/
	#step p.table-title {
		font-size: 128%;
	}
	#spice p.table-title {
		font-size: 128%;
	}
	#delivery .inner .menu_list {
		padding-top: 1em;
	}
	.newsArea .news_ttl {
		width: 90%;
		margin: 0 auto 1em auto;
		font-size: 4.8vw;
		letter-spacing: 0.1em;
		text-align: left;
	}
	#menu .inner ul.menu_list li:nth-of-type(odd) {
		padding-right: 0.7em;
	}
	#menu .inner ul.menu_list li:nth-of-type(even) {
		padding-left: 0.7em;
	}
	#contents .cnt_list ul li a .ttlArea {
		min-height: 6.5em;
	}
	#contents .cnt_list ul li a .ttlArea .moreBtn {
		top: 1.8em;
	}
	ul.step_list li {
		padding: 2.5em 2em;
		text-align: left;
	}
	.btn_instagram {
		width: 90%;
		margin: 0 auto;
		text-align: center;
	}
	.btn_instagram img {
		width: 80%;
		border: #333 1px solid;
		border-radius: 0.4em;
	}
	.caution_sp {
		border: #333 1px solid;
		padding: 0.5em;
		text-align: left;
		line-height: 1.8;
		font-size: 2.5vmin;
		margin: 6em -0.7em 3em -0.7em;
	}
	#menu:before {
		content: '';
		z-index: -1;
		width: 100vw;
		height: 90vh;
		display: block;
		position: absolute;
		top: -5em;
		right: -30vw;
		background-image: url(/assets/unpoulet/top/img/bg_coaster.jpg);
		background-repeat: no-repeat;
		background-size: cover;
	}

}

