@charset "utf-8";

/******************************************************************************/
/***                                                                        ***/
/***                                                                        ***/
/***     column.css                                                         ***/
/***                                                                        ***/
/***    【内容】                                                            ***/
/***                                                                        ***/
/***     ・コラム専用のスタイルを記述する                                   ***/
/***                                                                        ***/
/***                                                                        ***/
/******************************************************************************/

.area_feature {
	margin-bottom: 40px;
	font-family: "Noto Sans JP", sans-serif;
	font-feature-settings: "palt";
	font-optical-sizing: auto;
	font-style: normal;
	color: #333;
}
.area_feature * {
	box-sizing: border-box;
}
.area_feature p {
	margin-bottom: 0;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.8;
	color: #333;
}
.area_feature figure,
.area_feature .img {
	line-height: 0;
}
.area_feature .pc_vis {
	display: inline-block !important;
}
.area_feature .sp_vis {
	display: none !important;
}
.area_feature .main_img {
	border-left: none;
	line-height: 0;
	margin: 0 0 55px;
	padding: 0;
}
.area_feature h3 {
	background: none;
	padding-left: 0;
}
.area_feature .introduction {
	margin-bottom: 80px;
	text-align: center;
}
.area_feature .introduction p {
	font-size: 20px;
	font-weight: 900;
	line-height: 2.0;
}
.area_feature .introduction strong {
	background: #333333;
	color: #FFFFFF;
	margin: 0 0.1em;
	padding: 0.1em 0.2em;
}
.area_feature hr.solid_top {
	border-top: 4px solid #000000;
	margin-bottom: 20px;
}
.area_feature hr.dotted_top {
	background: url("area_feature_bg01.png") repeat-x 8px center / 44px 6px;
	height: 6px;
	margin-bottom: 70px;
}
.area_feature .profile {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 15px;
  	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.area_feature .profile figure {
	width: 320px;
}
.area_feature .profile .info_box {
	width: 555px;
}
.area_feature .profile .name_box {
	margin-bottom: 25px;
	padding-bottom: 25px;
	border-bottom: 4px solid #000;
  	display: flex;
	align-items: flex-end;
}

.area_feature .profile .job_title {
	margin-bottom: 0;
	font-size: 16px;
	font-weight: 900;
}
.area_feature .profile .job_title em {
	margin-top: 10px;
	font-size: 18px;
	font-weight: 900;
	display: block;
}
.area_feature .profile .name {
	margin-left: 15px;
	margin-bottom: 0;
	font-size: 40px;
	font-weight: 900;
}
.area_feature .profile .insta_ico {
	margin-left: 30px;
	line-height: 0;
}
.area_feature .profile p {
	margin-bottom: 30px;
	font-size: 16px;
	line-height: 1.8;
}

.other_staff_title {
	margin-bottom: 10px;
	text-align: center;

}
.area_feature .other_staff {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 60px;
	display: flex;
	justify-content: space-between;

}
.area_feature .staff_box {
	display: flex;
	align-items: center
}

.area_feature .staff_box p {
	margin-left: -30px;
	margin-bottom: 0;
	font-size: 16px;
}

.area_feature .menu {
	position: relative;
	padding: 50px 45px;
	background: url("area_feature_bg02.png") repeat-y center top / 100% auto;
	z-index: 1;
}
.area_feature .menu::before, 
.area_feature .menu::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	display: block;
	z-index: -1;

}
.area_feature .menu::before {
	top: 0;
	width: 980px;
	height: 508px;
	background-image: url("area_feature_bg03.png");
}
.area_feature .menu::after {
	bottom: 0;
	width: 980px;
	height: 442px;
	background-image: url("area_feature_bg04.png");
}

.area_feature .menu_title {
	margin-bottom: 0;
	text-align: center;
}
.area_feature .menu_catch {
	margin-top: -25px;
	margin-bottom: 10px;
	text-align: center;
}
.area_feature .menu_img {
	margin-bottom: 30px;
	text-align: center;
}

.area_feature .recommend_point {
	padding: 30px 30px 30px 40px;
	margin-bottom: 50px;
	background-color: #FFF;
	border: 3px solid #000;
  	display: flex;
	justify-content: space-between;
	align-items: center;
}
.area_feature .recommend_point figure {
	width: 113px;
}
.area_feature .recommend_point .point_box {
	width: 680px;
}
.area_feature .recommend_point .point_title {
	margin-bottom: 20px;
	font-size: 25px;
	font-weight: 900;
	line-height: 1.5;
	color: #333;
}
.area_feature .recommend_point .point_title mark {
    background:linear-gradient(transparent 50%, #F6DAE8 50%);
}
.area_feature .recommend_point p {
	font-size: 16px;
}
.area_feature .recommend_point p + p {
	margin-top: 30px;
}
.area_feature .recipe {
	max-width: 890px;
	margin-left: auto;
	margin-right: auto;
	padding: 45px 40px;
	background-color: #FFF;
	border: 3px solid #000;

}
.area_feature .recipe + .recipe {
	margin-top: 20px;
}
.area_feature .recipe_inner {
	max-width: 770px;
	margin-left: auto;
	margin-right: auto;

}
.area_feature .recipe .headline {
	margin-bottom: 30px;
	display: grid;
	grid-template-columns: 350px 380px;
	grid-template-rows: auto 1fr;
	justify-content: space-between;
}
.area_feature .recipe .recipe_title { grid-area: 1 / 2 / 2 / 3; }
.area_feature .recipe figure { grid-area: 1 / 1 / 3 / 2; }
.area_feature .recipe .recipe_txt { grid-area: 2 / 2 / 3 / 3; }

.area_feature .headline .recipe_title {
	margin-bottom: 20px;
	text-align: center;
	line-height: 0;
}
.area_feature .headline p {
	margin-bottom: 20px;
}

.area_feature .recipe_info {
	margin-bottom: 0;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.8;
	color: #333;
}
.area_feature .cooking_time, 
.area_feature .energy {
	position: relative;
	padding-left: 25px;
}
.area_feature .cooking_time::before, 
.area_feature .energy::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 20px;
	height: 23px;
	margin: auto 0;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	display: block;
}
.area_feature .cooking_time::before {
	background-image: url("area_feature_ico02.png");
}
.area_feature .energy::before {
	background-image: url("area_feature_ico03.png");
}
.area_feature .tips {
	margin-bottom: 40px;
  	display: flex;
	justify-content: space-between;
}
.area_feature .tips_title {
	width: 174px;
	margin-bottom: 0;
}
.area_feature .tips p {
	width: 555px;
	margin-bottom: 0;
}
.area_feature .btn_set {
  	display: flex;
	justify-content: space-between;
}
.area_feature .recipe_btn, 
.area_feature .print_btn {
	width: calc(50% - 25px);
  	display: flex;
}
.area_feature .recipe_btn a, 
.area_feature .print_btn a {
	position: relative;
	width: 100%;
	padding-top: 15px;
	padding-bottom: 15px;
	font-size: 20px;
	font-weight: 900;
	text-decoration: none;
	font-feature-settings: normal;
	line-height: 1.2;
	color: #FFF;
	background-color: #C59666;
	border: 5px solid #DECBAC;
	border-radius: 10px;
  	display: flex;
	align-items: center;
	transition: .2s ease;
}
.area_feature .recipe_btn a {
	padding-left: 60px;
	padding-right: 40px;
}
.area_feature .print_btn a {
	padding-left: 80px;
	padding-right: 35px;
}
.area_feature .recipe_btn a:hover {
	padding-left: 65px;
	padding-right: 35px;
	transition: .2s ease;
	filter: brightness(1.1);
}
.area_feature .print_btn a:hover {
	padding-left: 85px;
	padding-right: 30px;
	transition: .2s ease;
	filter: brightness(1.1);
}
.area_feature .recipe_btn a::before, 
.area_feature .print_btn a::before, 
.area_feature .recipe_btn a::after, 
.area_feature .print_btn a::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto 0;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	display: block;
	transition: .2s ease;
}
.area_feature .recipe_btn a::before, 
.area_feature .print_btn a::before {
	left: 20px;
}
.area_feature .recipe_btn a:hover::before, 
.area_feature .print_btn a:hover::before {
	left: 25px;
	transition: .2s ease;
}
.area_feature .recipe_btn a::before {
	width: 30px;
	height: 41px;
	background-image: url("area_feature_ico04.png");
}
.area_feature .print_btn a::before {
	width: 45px;
	height: 42px;
	background-image: url("area_feature_ico05.png");
}
.area_feature .recipe_btn a::after, 
.area_feature .print_btn a::after {
 	right: 20px;
}
.area_feature .recipe_btn a:hover::after, 
.area_feature .print_btn a:hover::after {
 	right: 15px;
	transition: .2s ease;
}
.area_feature .recipe_btn a::after {
	width: 16px;
	height: 16px;
	background-image: url("area_feature_ico06.png");
	transition: transform 0.3s ease, background-image 0.3s ease;
	transition: .2s ease;
}
.area_feature .recipe_btn a.active::after {
	background-image: url('area_feature_ico07.png');
}
.area_feature .print_btn a::after {
	width: 9px;
	height: 14px;
	background-image: url("area_feature_ico08.png");
}
.recipe_btn.is-open::after {
  background-image: url("area_feature_ico05.png");
}

.area_feature .recipe_detail {
	max-width: 760px;
	margin-left: auto;
	margin-right: auto;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease;
}
.area_feature .recipe_detail_inner {
	overflow: visible;
}
/* 確認用アコーディオン開きっぱなし */
/*
.area_feature .recipe_detail {
	max-height: none !important;
	overflow: visible;
}
*/
.area_feature .detail_title {
	margin-top: 30px;
	margin-bottom: 20px;
	padding-bottom: 10px;
	font-size: 20px;
	font-weight: 900;
	text-align: center;
	line-height: 1.3;
	border-bottom: 3px solid #000;

}
.area_feature .material_box {
  	display: flex;
	justify-content: space-between;
}
.area_feature .material {
	min-width: 330px;
	margin-bottom: 0;
}
.area_feature .material.seasoning {
	min-width: 310px;
}
.area_feature .material li {
 	font-size: 16px;
	font-weight: 500;
	font-feature-settings: normal;
	line-height: 1.8;
 	display: -webkit-box;
  	display: -ms-flexbox;
  	display: flex;
  	-ms-flex-wrap: wrap;
  	flex-wrap: wrap;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	background: url("area_feature_line01.png") repeat-x center bottom 12px / 16px 4px;
}
.area_feature .material li em {
	position: relative;
	padding-left: 10px;
	padding-right: 5px;
	font-weight: 500;
	background-color: #FFF;
	z-index: 1;
}
.area_feature .material.seasoning li em {
	padding-left: 25px;
}
.area_feature .material li em::before {
	content: "";
	position: absolute;
	top: 10px;
	left: 0;
	width: 8px;
	height: 8px;
	background-color: #EAA5C5;
	border-radius: 50%;
	z-index: -1;
}
.area_feature .material.seasoning li em::before {
	top: 5px;
	width: 22px;
	height: 22px;
	background: #FFF url("area_feature_ico09.png") no-repeat center center / contain;
}
.area_feature .material li b {
	min-width: 6em;
	margin-left: auto;
	padding-left: 5px;
	font-weight: 500;
	text-align: left;
	background-color: #FFF;
	display: block;
	word-break: break-all;
}
.area_feature .material.seasoning li b {
	min-width: 4.5em;
	margin-left: auto;
	padding-left: 5px;
	font-weight: 500;
	text-align: left;
	background-color: #FFF;
	display: block;
	word-break: break-all;
}


.area_feature .directions {
	padding-top: 20px;
	padding-bottom: 20px;
	border-top: 1px solid #D6D6D6;
  	display: flex;
	flex-wrap: wrap;
}
.area_feature .directions.bn,
.area_feature .detail_title + .directions {
	padding-top: 0;
	border-top: none;
}
.area_feature .directions:last-of-type {
	padding-bottom: 0;
}
.area_feature .directions .step {
	width: 70px;
	padding-left: 10px;
}
.area_feature .directions figure {
	width: 250px;
	margin-right: 20px;
}
.area_feature .directions .explain {
	width: 400px;
}
.area_feature .directions .step + .explain {
	width: 670px;
}
.area_feature .directions .explain p {
	margin-bottom: 0;
	font-feature-settings: normal;
	font-weight: 500;
}
.area_feature .directions .explain p .a {
	position: relative;
	top: 5px;
	padding-left: 2px;
	padding-right: 2px;
	display: inline-block;
}
.area_feature .directions .point {
	position: relative;
	margin-top: 30px;
	padding: 25px 5px 20px 10px;
	border: 3px solid #F6DAE8;
	z-index: 1;
}
.area_feature .directions .point::before {
	content: "";
	position: absolute;
	top: -20px;
	left: -3px;
	width: 85px;
	height: 35px;
	background: url("area_feature_ico17.png") no-repeat center center / contain;
	display: block;
}
.area_feature .directions.bn .point {
	margin-top: 20px;
}
.area_feature .directions .point p {
}
.area_feature .important_point {
	width: 100%;
	margin-top: 20px;
	padding: 20px 30px 20px 35px;
	border: 3px solid #F6DAE8;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.area_feature .important_point figure {
	width: 300px;
}
.area_feature .important_point .point_txt {
	width: 360px;
}
.area_feature .important_point .point_ico {
	margin-bottom: 10px;
	line-height: 0;
}
.area_feature .important_point p {
	font-weight: 500;
}
.area_feature .comment {
	padding-top: 20px;
	text-align: center;
	border-top: 1px solid #D6D6D6;
}
.area_feature .comment figure {
	margin-bottom: 0;
}
.area_feature .feature_ending {
	max-width: 800px;
	margin-top: 80px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 80px;
  	display: flex;
	justify-content: space-between;
}
.area_feature .feature_ending figure {
	width: 380px;
}
.area_feature .feature_ending .txt_box {
	width: 380px;
	margin-bottom: 0;
}
.area_feature .feature_ending p {
	font-size: 16px;
	margin-bottom: 0;
}
.area_feature .feature_ending p + p {
	margin-top: 30px;
}
.area_feature hr.dotted_bottom {
  background: url("area_feature_bg01.png") repeat 8px center / 44px 6px;
  height: 6px;
  margin-bottom: 20px;
}
.area_feature hr.solid_bottom {
  border-top: 4px solid #000000;
  margin-bottom: 120px;
}


.area_feature .redeem_point {
	margin-bottom: 70px;
	padding: 20px;
	background-color: #F6DAE8;
}
.area_feature .apron {
	position: relative;
	padding: 30px 40px 0;
	background-color: #FFF;
}
.area_feature .apron .balloon_catch {
	position: absolute;
	top: -83px;
	left: -7px;
	display: block;
}
.area_feature .apron_inner {
	max-width: 764px;
	margin-left: auto;
	margin-right: auto;
}
.area_feature .apron .apron_title {
	margin-bottom: 40px;
	text-align: center;
}
.area_feature .apron .apron_item {
	max-width: 710px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
}
.area_feature .apron .apron_item figure {
	width: 304px;
}
.area_feature .apron .apron_item_txt {
	width: 380px;
}
.area_feature .apron .apron_note {
	margin-top: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.area_feature .apron .apron_note_txt {
	position: relative;
	width: 580px;
	padding-left: 60px;
}
.area_feature .apron .apron_note_txt::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 49px;
	height: 122px;
	margin: auto 0;
	background: url("area_feature_bg05.png") no-repeat center center / contain;
	display: block;
}
.area_feature .apron .apron_note_txt p {
}
.area_feature .apron .apron_note_txt mark {
    background:linear-gradient(transparent 50%, #F6DAE8 50%);
}
.area_feature .apron .apron_note figure {
	width: 169px;
}
.area_feature .kitchen {
	padding: 35px 30px 50px; 
}
.area_feature .kitchen_inner {
	max-width: 850px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.area_feature .kitchen figure {
	width: 342px;
}
.area_feature .kitchen .kitchen_txt {
	width: 466px;
}
.area_feature .kitchen .kitchen_title {
	margin-bottom: 15px;
	padding: 5px;
	font-size: 25px;
	font-weight: 900;
	line-height: 1.5;
	text-align: center;
	background-color: #FFF;
}


.area_feature .column_common_btn {
	max-width: 370px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
}

.area_feature .column_common_btn a {
	position: relative;
	padding-top: 20px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 20px;
	text-decoration: none;
	text-align: center;
	color: #FFF;
	background-color: #C59666;
	border: 5px solid #DECBAC;
	border-radius: 10px;
  	display: block;
	transition: .2s ease;
}
.area_feature .column_common_btn a:hover {
	padding-left: 15px;
	padding-right: 5px;
	filter: brightness(1.1);
	transition: .2s ease;

}

.area_feature .column_common_btn span {
	position: relative;
	padding-right: 18px;
	font-size: 20px;
	font-weight: 900;
	font-feature-settings: normal;
	line-height: 1.2;
	display: inline-block;
}
.area_feature .column_common_btn span:after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 9px;
	height: 14px;
	margin: auto 0;
	background:  url("area_feature_ico08.png") no-repeat center center / contain;
	display: block;
}
.area_feature .thx_txt {
	margin-bottom: 30px;
}
.area_feature .thx_txt p {
	font-size: 20px;
	text-align: center;
}
.area_feature .thx_txt figure {
	margin-top: 0;
	text-align: center;
}

.area_feature .present .apply_btn {
  margin-bottom: 40px;
}
.area_feature .present .apply_btn a {
  background: #FAF175;
  border: 4px solid #2B2B2B;
  position: relative;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  max-width: 570px;
  padding: 25px 25px 25px 0;
  color: #313131;
  transition: none;
  font-weight: 600;
  box-shadow: 6px 6px 0 #2B2B2B;
  color: #2B2B2B;
  font-size: 25px;
  font-weight: 800;
  transition: .15s ease;
}
.area_feature .present .apply_btn a:before {
  font-family: 'Font Awesome 5 Free';
  font-size: 1.6rem;
  line-height: 1;
  position: absolute;
  top: calc(50% - .8rem);
  right: 2.5rem;
  margin: 0;
  padding: 0;
  content: '\f054';
}

.area_feature .present .apply_btn a:hover {
  background-color: #FAF175;
  box-shadow: 0 0 0;
  transition: none;
  text-decoration: none;
  top: 6px;
  left: 6px;
	transition: .15s ease;
}
.area_feature .present .regist_info {
  border: 5px solid #CCCCCC;
  margin: 0 50px 50px;
  padding: 30px 10px;
}
.area_feature .present .regist_info p {
  font-size: 18px;
  margin-bottom: 20px;
  text-align: center;
}
.area_feature .present .regist_info p:last-child {
  margin-bottom: 0;
  padding-left: 1.0em;
  text-indent: -1.0em;
}
.area_feature .present .regist_info p a {
  text-decoration: underline;
  text-underline-offset: 6px;
}
.area_feature .present .regist_info p a:hover {
  text-decoration: none;
}
.area_feature .present .regist_info .regist_btn_box {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  margin-bottom: 20px;
}
.area_feature .present .regist_info .regist_btn_box a {
  border: 4px solid #2B2B2B;
  box-shadow: 6px 6px 0 #2B2B2B;
  color: #000000;
  display: block;
  font-size: 18px;
  font-weight: 800;
  padding: 20px 20px 20px 10px;
  transition: none;
  position: relative;
  top: 0;
  left: 0;
  width: 40%;
  text-align: center;
  transition: .1s ease;
}
.area_feature .present .regist_info .regist_btn_box a:before {
  font-family: 'Font Awesome 5 Free';
  font-size: 1.2rem;
  line-height: 1;
  position: absolute;
  top: calc(50% - .6rem);
  right: 1.0rem;
  margin: 0;
  padding: 0;
  content: '\f054';
}
.area_feature .present .regist_info .regist_btn_box a:hover {
  box-shadow: 0 0 0;
  transition: none;
  text-decoration: none;
  top: 6px;
  left: 6px;
  transition: .1s ease;
}
.area_feature .present .regist_info .regist_btn_box a:first-child {
  background-color: #F8C166;
}
.area_feature .present .regist_info .regist_btn_box a:last-child {
  background-color: #A7CE75;
}

.area_feature + .common_btn a {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.00rem;
}
.area_feature + .annotation,
.area_feature + .common_btn + .annotation {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 1.00rem;
}

@media screen and (max-width: 767px) {
.area_feature {
	margin-bottom: 30px;
}
.area_feature p {
	font-size: 14px;
}
.area_feature .pc_vis {
	display: none !important;
}
.area_feature .sp_vis {
	display: inline-block !important;
}
.area_feature .main_img {
	margin: 0 -20px 40px;
}
.area_feature .introduction {
	margin-bottom: 60px;
	text-align: center;
}
.area_feature .introduction p {
	font-size: 16px;
	text-align: left;
}
.area_feature hr.solid_top {
	border-top: 3px solid #000000;
	margin-bottom: 15px;
}
.area_feature hr.dotted_top {
	background: url("area_feature_bg01.png") repeat-x center center / calc(44px * 0.8) calc(6px * 0.8);
	margin-bottom: 40px;
}
.area_feature .profile {
	margin-bottom: 40px;
  	display: block;
}
.area_feature .profile figure {
	width: 100%;
	margin-bottom: 10px;
	text-align: center;
}
.area_feature .profile .info_box {
	width: 100%;
	float: none;
	margin-right: 0;
	padding-right: 0;
}
.area_feature .profile .name_box {
	position: relative;
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 3px solid #000;
  	display: block;
}

.area_feature .profile .job_title {
	margin-bottom: 0;
	font-size: 14px;
}
.area_feature .profile .job_title em {
	margin-top: 10px;
	font-size: 16px;
	display: block;
}
.area_feature .profile .name {
	margin-top: 10px;
	margin-left: 0;
	font-size: 30px;
}
.area_feature .profile .insta_ico {
	position: absolute;
	right: 0;
	bottom: 15px;
	width: 40px;
	height: 40px;
	margin-left: 0;
}
.area_feature .profile p {
	margin-bottom: 0;
	font-size: 14px;
	line-height: 1.8;
}
.other_staff_title {
	margin-bottom: 10px;
	text-align: center;
}
.area_feature .other_staff {
	margin-bottom: 60px;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.area_feature .staff_box {
	display: flex;
	align-items: center;
}
.area_feature .staff_box img {
	width: calc(234px * 0.8);
	height: calc(173px * 0.8);
}
.area_feature .staff_box + .staff_box {
	margin-top: 20px;
}
.area_feature .staff_box p {
	margin-left: -10px;
	font-size: 14px;
}
.area_feature .menu {
	margin-left: -20px;
	margin-right: -20px;
	padding: 40px 20px;
}
.area_feature .menu::before {
	width: 100%;
	height: 672px;
	background-image: url("area_feature_bg03-sp.png");
	background-position: center top;
}
.area_feature .menu::after {
	width: 100%;
	height: 346px;
	background-image: url("area_feature_bg04-sp.png");
	background-position: center bottom;
}
.area_feature .menu_title {
	max-width: calc(364px * 0.6);
	margin-left: auto;
	margin-right: auto;
}
.area_feature .menu_catch {
	margin-top: 5px;
	margin-bottom: 20px;
	text-align: center;
}
.area_feature .menu_img {
	margin-left: -10px;
	margin-right: -10px;
	margin-bottom: 40px;
}
.area_feature .recommend_point {
	padding: 30px 20px 40px;
	margin-bottom: 40px;
	background-color: #FFF;
	border: 2px solid #000;
  	display: block;
}
.area_feature .recommend_point figure {
	width: 100%;
	margin-bottom: 10px;
	text-align: center;
}
.area_feature .recommend_point .point_box {
	width: 100%;
}
.area_feature .recommend_point .point_title {
	margin-bottom: 15px;
	font-size: 22px;
	text-align: center;
}
.area_feature .recommend_point p {
	font-size: 14px;
}
.area_feature .recommend_point p + p {
	margin-top: 20px;
}

.area_feature .recipe {
	padding: 40px 20px;
	border: 2px solid #000;

}
.area_feature .recipe + .recipe {
	margin-top: 20px;
}
.area_feature .recipe .headline {
	margin-bottom: 20px;
	display: block;
}
.area_feature .headline .recipe_title {
	max-width: calc(353px * 0.8);
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 15px;
}
.area_feature .recipe figure {
	margin-bottom: 20px;
	text-align: center;
}
.area_feature .headline p {
	margin-bottom: 20px;
}
.area_feature .recipe_info {
	font-size: 14px;
}
.area_feature .tips {
	margin-bottom: 40px;
  	display: block;
}
.area_feature .tips_title {
	width: 100%;
	max-width: calc(174px * 0.9);
	margin-bottom: 10px;
}
.area_feature .tips p {
	width: 100%;
	margin-bottom: 0;
}
.area_feature .btn_set {
  	display: block;
}
.area_feature .recipe_btn, 
.area_feature .print_btn {
	width: 100%;
}
.area_feature .recipe_btn {
	margin-bottom: 20px;

}

.area_feature .recipe_btn a, 
.area_feature .print_btn a {
	width: 100%;
	padding-top: 15px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 15px;
	text-align: center;
	text-decoration: none;
	color: #FFF;
	background-color: #C59666;
	border: 4px solid #DECBAC;
	border-radius: 10px;
  	display: flex;
	justify-content: center;
	align-items: center;
	transition: .2s ease;
}
.area_feature .recipe_btn a {
	padding-top: 25px;
	padding-bottom: 25px;
}
.area_feature .recipe_btn a:hover, 
.area_feature .print_btn a:hover {
	padding-left: 25px;
	padding-right: 15px;
	filter: brightness(1.1);
	transition: .2s ease;
}
.area_feature .recipe_btn a::before, 
.area_feature .print_btn a::before, 
.area_feature .recipe_btn a::after, 
.area_feature .print_btn a::after {
	display: none;
}

.area_feature .recipe_btn span, 
.area_feature .print_btn span {
	position: relative;
	padding-left: 50px;
	padding-right: 25px;
	font-size: clamp(15px, 2.34vw, 18px);
	font-weight: 900;
	text-align: left;
	line-height: 1.4;
	display: inline-block;
}
.area_feature .recipe_btn span::before, 
.area_feature .print_btn span::before, 
.area_feature .recipe_btn span::after, 
.area_feature .print_btn span::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto 0;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	display: block;
	transition: .2s ease;
}
.area_feature .recipe_btn span::before, 
.area_feature .print_btn span::before {
	left: 0;
}
.area_feature .recipe_btn span::before {
	width: calc(30px * 0.8);
	height: calc(41px * 0.8);
	left: 10px;
	background-image: url("area_feature_ico04.png");
}
.area_feature .print_btn span::before {
	width: calc(45px * 0.8);
	height: calc(42px * 0.8);
	background-image: url("area_feature_ico05.png");
}
.area_feature .recipe_btn span::after, 
.area_feature .print_btn span::after {
 	right: 0;
}
.area_feature .recipe_btn span::after {
	width: 16px;
	height: 16px;
	background-image: url("area_feature_ico06.png");
	transition: transform 0.3s ease, background-image 0.3s ease;
	transition: .2s ease;
}
.area_feature .recipe_btn a.active span::after {
	background-image: url('area_feature_ico07.png');
}
.area_feature .print_btn span::after {
	width: 9px;
	height: 14px;
	right: 2px;
	background-image: url("area_feature_ico08.png");
}
.area_feature .detail_title {
	margin-top: 40px;
	font-size: 18px;
	border-bottom: 2px solid #000;
}
.area_feature .material_box {
  	display: block;
}
.area_feature .material {
	min-width: 100%;
}
.area_feature .material.seasoning {
	margin-top: 20px;
	min-width: 100%;
}
.area_feature .material li {
 	font-size: 15px;
	background: url("area_feature_line01.png") repeat-x center bottom 10px / 8px 2px;
}
.area_feature .material li b {
	min-width: inherit;
	text-align: right;
}
.area_feature .material.seasoning li b {
	min-width: inherit;
}


.area_feature .directions {
	padding-top: 20px;
	padding-bottom: 20px;
	border-top: 1px solid #D6D6D6;
  	display: flex;
	flex-wrap: wrap;
}
.area_feature .detail_title + .directions {
	padding-top: 0;
	border-top: none;
}
.area_feature .directions:last-of-type {
	padding-bottom: 0;
}
.area_feature .directions .step {
	width: 70px;
	margin-bottom: 10px;
	padding-left: 10px;
}
.area_feature .directions figure {
	width: calc(100% - 70px - 10px);
	margin-right: 0;
	text-align: left;
}
.area_feature .directions .explain {
	width: 100%;
}
.area_feature .directions .step + .explain {
	width: 100%;
}
.area_feature .directions .point::before {
	top: -15px;
	width: calc(85px * 0.8);
	height: calc(35px * 0.8);
}
.area_feature .important_point {
	padding: 20px ;
	border: 3px solid #F6DAE8;
	display: block;
}
.area_feature .important_point figure {
	width: 100%;
	margin-bottom: 10px;
	padding-right: 0;
	text-align: center;
}
.area_feature .important_point .point_txt {
	width: 100%;
}
.area_feature .important_point .point_ico {
	width: calc(108px * 0.7);
	height: calc(48px * 0.7);
	margin-bottom: 10px;
	line-height: 0;
}
.area_feature .comment {
	padding-top: 20px;
	text-align: center;
	border-top: 1px solid #D6D6D6;
}
.area_feature .comment figure {
	margin-bottom: 0;
}
.area_feature .feature_ending {
	margin-top: 40px;
	margin-bottom: 40px;
  	display: block;
}
.area_feature .feature_ending figure {
	width: 100%;
	margin-bottom: 20px;
	text-align: center;
}
.area_feature .feature_ending .txt_box {
	width: 100%;
}
.area_feature .feature_ending p {
	margin-bottom: 0;
	font-size: 14px;
}
.area_feature .feature_ending p + p {
	margin-top: 20px;
}

.area_feature hr.dotted_bottom {
	background: url("area_feature_bg01.png") repeat-x center center / calc(44px * 0.8) calc(6px * 0.8);
	height: calc(6px * 0.8);
	margin-bottom: 15px;
}
.area_feature hr.solid_bottom {
	border-top: 3px solid #000000;
	margin-bottom: 120px;
}
.area_feature .redeem_point {
	margin-bottom: 60px;
	padding: 10px;
}
.area_feature .apron {
	position: relative;
	padding: 50px 20px 0;
}
.area_feature .apron .balloon_catch {
	position: absolute;
	top: -60px;
	left: -30px;
	width: calc(408px * 0.8);
	height: calc(139px * 0.8);
}
.area_feature .apron .apron_title {
	margin-bottom: 20px;
}
.area_feature .apron .apron_item {
	display: block;
	justify-content: space-between;
}
.area_feature .apron .apron_item figure {
	width: 100%;
	max-width: calc(304px * 0.8);
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	text-align: center;
}
.area_feature .apron .apron_item_txt {
	width: 100%;
}
.area_feature .apron .apron_note {
	margin-top: 0;
	display: block;
}
.area_feature .apron .apron_note_txt {
	position: relative;
	width: 100%;
	margin-top: 40px;
	margin-bottom: 20px;
	padding-top: 47px;
	padding-left: 0;
}
.area_feature .apron .apron_note_txt::before {
	top: 0;
	left: 0;
	right: 0;
	bottom: auto;
	width: 124px;
	height: 45px;
	margin: 0 auto;
	background: url("area_feature_bg05-sp.png") no-repeat center center / contain;
}
.area_feature .apron .apron_note_txt p {
}
.area_feature .apron .apron_note_txt mark {
    background:linear-gradient(transparent 50%, #F6DAE8 50%);
}
.area_feature .apron .apron_note figure {
	width: 100%;
	max-width: calc(169px * 0.8);
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
.area_feature .kitchen {
	padding: 30px 20px 30px; 
}
.area_feature .kitchen_inner {
	display: block;
}
.area_feature .kitchen figure {
	width: 100%;
	margin-left: -20px;
	margin-bottom: 20px;
	text-align: center;
}
.area_feature .kitchen .kitchen_txt {
	width: 100%;
}
.area_feature .kitchen .kitchen_title {
	margin-bottom: 15px;
	padding: 5px;
	font-size: 20px;
}

.area_feature .column_common_btn {
	max-width: inherit;
}
.area_feature .column_common_btn a {
	padding-top: 15px;
	padding-bottom: 15px;
	border: 4px solid #DECBAC;
}
.area_feature .column_common_btn span {
	font-size: clamp(15px, 2.34vw, 18px);
}
.area_feature .thx_txt {
	max-width: calc(594px * 0.8);
	margin-left: auto;
	margin-right: auto;

	margin-bottom: 30px;
}
.area_feature .thx_txt p {
	font-size: 16px;
}
.area_feature .thx_txt figure {
	max-width: calc(594px * 0.8);
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
}

  .area_feature .present .apply_btn {
    margin-bottom: 40px;
  }
  .area_feature .present .apply_btn a {
    border: 4px solid #2B2B2B;
    justify-content: center;
    line-height: 1.6;
    max-width: 90%;
    padding: 10px;
    box-shadow: 4px 4px 0 #2B2B2B;
    font-size: 18px;
  }
  .area_feature .present .apply_btn a:before {
    font-size: 1.0rem;
    top: calc(50% - .5rem);
    right: 1.0rem;
  }
  .area_feature .present .apply_btn a:hover {
    top: 4px;
    left: 4px;
  }


  .area_feature .present .regist_info {
    border: 3px solid #CCCCCC;
    margin: 0 15px 30px;
    padding: 20px;
  }
  .area_feature .present .regist_info p {
    font-size: 14px;
    text-align: left;
  }
  .area_feature .present .regist_info .regist_btn_box {
    flex-direction: column;
  }
  .area_feature .present .regist_info .regist_btn_box a {
    box-shadow: 4px 4px 0 #2B2B2B;
    margin-bottom: 30px;
    padding: 15px 15px 15px 10px;
	font-size: 16px;
    transition: none;
    width: 100%;
  }
  .area_feature .present .regist_info .regist_btn_box a:hover {
    top: 4px;
    left: 4px;
  }
  .area_feature .present .regist_info .regist_btn_box a:last-child {
    margin-bottom: 10px;
  }

  .area_feature .information .box img {
    width: 100%;
  }
  .area_feature + .common_btn a {
    font-size: 1.20rem;
    padding: 15px 0;
  }
}


@media screen and (max-width: 680px) {
  .area_feature .pickup h3 {
    font-size: 1.5em;
    line-height: 160px;
  }
  .area_feature .present .period::before {
    left: 120px;
  }
  .area_feature .present .period::after {
    right: 120px;
  }
}


@media screen and (max-width: 520px) {
  .area_feature .pickup h3 {
    font-size: 1.2em;
    line-height: 160px;
  }
  .area_feature .present .period::before {
    left: 60px;
  }
  .area_feature .present .period::after {
    right: 60px;
  }
}

@media screen and (max-width: 414px) {
.area_feature .comment {
	margin-left: -10px;
	margin-right: -10px;
}
.area_feature .apron .apron_title {
	margin-left: -10px;
	margin-right: -10px;
}
.area_feature .recipe_btn a, 
.area_feature .print_btn a {
	font-feature-settings: "palt";
}
  .area_feature .introduction {
    font-size: 0.9em;
  }
  .area_feature .pickup h3 {
    font-size: 1.1em;
    line-height: 160px;
  }
  .area_feature .present .period::before {
    left: 50px;
  }
  .area_feature .present .period::after {
    right: 50px;
  }
}


@media screen and (max-width: 390px) {
  .area_feature .introduction {
    font-size: 0.85em;
  }
  .area_feature .pickup h3 {
    font-size: 1.0em;
    line-height: 160px;
  }
}


@media screen and (max-width: 375px) {
  .area_feature .introduction {
    font-size: 0.8em;
  }
  .area_feature .pickup h3 {
    font-size: 0.9em;
  }
  .area_feature .title_box .box_content {
    font-size: 1.1em;
  }
  
  /*
  .area_feature .present {
    border: 3.5px solid #000000;
    outline: 3.5px solid #000000;
    outline-offset: 7px;
  }
  */
  .area_feature .present .link_btn a::before {
    right: 0.7rem;
  }
  .area_feature .present h5 {
    padding: 0 40px;
  }
  .area_feature .present h5:before,
  .area_feature .present h5:after {
    width: 40px;
  }
  .area_feature .present .period::before {
    left: 40px;
  }
  .area_feature .present .period::after {
    right: 40px;
  }
  .area_feature .present .apply_end {
    font-size: 0.95em;
  }
}


/*
@media screen and (max-width: 767px) and ((-webkit-min-device-pixel-ratio: 2) and (resolution: 2dppx)) {
  .area_feature .present {
    border: 2.5px solid #000000;
    outline: 2.5px solid #000000;
    outline-offset: 6px;
  }
}

@media screen and (max-width: 767px) and ((-webkit-device-pixel-ratio: 3) and (resolution: 3dppx)) {
  .area_feature .present {
    border: 2.9px solid #000000 !important;
    outline: 2.9px solid #000000 !important;
    outline-offset: 6px !important;
  }
}
*/

@media print {
  body {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .area_feature .introduction .marker,
  .area_feature .lead strong,
  .area_feature .pickup strong,
  .area_feature .check strong {
    background: linear-gradient(#FFFFFF 50%, #F9ED52 50%);
  }
  .area_feature .present {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .area_feature .present h3 {
    margin-top: 40px;
  }
  .area_feature .present:before {
    top: -44px;
    left: -44px;
  }
  .area_feature .present:after {
    bottom: -38px;
    right: -44px;
  }
  .area_feature .present .yellow p {
    margin: 0 50px 30px;
    padding-bottom: 30px;
  }
  .area_feature .present .apply_btn {
    margin-bottom: 40px;
  }
  .sp_menu_panel,
  .page_top {
    display: none;
  }
}
