/******************** common */
#page-wrapper{
	width: 760px;
	margin: 0 auto;
	font-size: 15px;
	color: #47372c;
	font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background-image: url(./img/bg02.jpg);
	background-repeat: repeat-y;
	background-size: contain;
	padding-bottom: 10px;
	position: relative;
	overflow: hidden;
}


a:hover{
	opacity: 0.8;
}

#page-wrapper img {
	width: 100%;
}



/************** 共通設定 */
#page-wrapper .flex-box{
	display: flex;
}

#page-wrapper .bg-deco {
	position: absolute;
	top: 7%;
	left: 0;
	right: 0;
	margin: auto;
	width: 100%;
}



/************** header */
#page-wrapper h2 img{
	width: 100%;
}

#page-wrapper .header {
	position: relative;
}

#page-wrapper .header-comment{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 50px;
}
#page-wrapper .header-comment p {
	color: #492b1e;
	font-size: 16px;
	font-weight: bold;
	line-height: 1.75;
	text-align: center;
}



/********************* contents */

#page-wrapper .contents{
	background-image: url(img/bg01.jpg);
	background-size: cover;
	box-sizing: border-box;
	margin: 0 auto;
	padding: 2em 1em;
}
#page-wrapper .contents .flex-box {
	flex-wrap: wrap;
	padding: 1em 0;
	position: relative;
	z-index: 2;
}
#page-wrapper .contents .flex-box li {
	width: calc(100% / 3);
}

#page-wrapper .teacher {
	align-items: flex-end;
	display: flex;
	flex-wrap: wrap;
	position: relative;
	max-width: 700px;
	margin: auto;
	padding: 1em 0;
	z-index: 2;
}
#page-wrapper .teacher .bg {
	margin-right: 10px;
	width: 325px;
}
#page-wrapper .teacher .text {
	color: #fff;
	margin-bottom: 5px;
	width: calc(100% - 335px);
}



/****************************** recipe */

#page-wrapper .recipe {
	background-color: #fff;
	border-radius: 30px;
	max-width: 700px;
	margin: 30px auto;
	padding-top: 20px;
	padding-bottom: 50px;
	position: relative;
}
#page-wrapper .recipe .bg {
	position: absolute;
	width: 740px;
	height: 1870px;
	top: 770px;
	left: -20px;
	margin: auto;
	z-index: 0;
}
#page-wrapper .recipe .bg2 {
	position: absolute;
	width: 740px;
	height: 1870px;
	top: 840px;
	left: -20px;
	margin: auto;
	z-index: 0;
}
#page-wrapper .recipe .bg3 {
	position: absolute;
	width: 740px;
	height: 1870px;
	top: 890px;
	left: -20px;
	margin: auto;
	z-index: 0;
}
#page-wrapper .recipe .name {
	max-width: 760px;
	margin: 0 -30px;
	position: relative;
	z-index: 2;
}
#page-wrapper .recipe .head {
	max-width: 650px;
	margin: 0 auto 30px;
	position: relative;
	z-index: 1;
}
#page-wrapper .recipe .head2 {
	max-width: 650px;
	margin: 30px auto;
	position: relative;
	z-index: 1;
}
#page-wrapper .recipe .head3 {
	max-width: 650px;
	margin: -15px -25px 30px auto;
	position: relative;
	z-index: 1;
}
#page-wrapper .recipe .flex-box {
	align-items: center;
	flex-wrap: wrap;
	max-width: 650px;
	margin: 35px auto;
	position: relative;
	z-index: 1;
}
#page-wrapper .recipe .flex-box .img {
	width: 305px;
}
#page-wrapper .recipe .flex-box .img.r05 {
	width: 350px;
	margin-left: -45px;
}
#page-wrapper .recipe .flex-box .txt {
	color: #492b1e;
	line-height: 1.55;
	width: calc(100% - 325px);
}
#page-wrapper .recipe .flex-box .txt.right {
	margin-left: 20px;
}
#page-wrapper .recipe .flex-box .txt.left {
	margin-right: 20px;
}
#page-wrapper .recipe .flex-box .txt strong {
	display: block;
	font-weight: bold;
	padding: 1em 0 .25em;
}
#page-wrapper .recipe .flex-box .txt small {
	display: block;
	font-size: 13px;
	margin-top: 1.5em;
}
#page-wrapper .recipe .flex-box .txt .no {
	width: 55px;
	margin-bottom: 10px;
}

#page-wrapper .recipe .flex-box .txt.col{
    width: 100%;
}
#page-wrapper .recipe .flex-box .txt.col p {
    padding-top: 12px;
}

#page-wrapper .recipe .flex-box .txt.col p.no {
    width: 55px;
    margin-bottom: 10px;
    float: left;
    margin-right: 20px;
    padding: 0;
}

#page-wrapper .recipe .point {
	max-width: 650px;
	margin: auto;
	position: relative;
	z-index: 1;
}
#page-wrapper .recipe .point li {
	color: #492b1e;
	line-height: 1.55;
	margin: 1em auto;
}
#page-wrapper .recipe .point li span {
	display: table-cell;
}
#page-wrapper .recipe .point li span:nth-child(1){
	color: #39b54a;
	font-size: 16px;
	padding-right: 3px;
}

#page-wrapper .recipe .reserve {
	color: #492b1e;
	max-width: 650px;
	margin: auto;
	position: relative;
	z-index: 1;
}
#page-wrapper .recipe .reserve .block-ttl {
	font-weight: bold;
	margin-bottom: 1em;
	text-align: center;
}
#page-wrapper .recipe .reserve .flex-box {
	margin: auto;
}
#page-wrapper .recipe .reserve li {
	margin: 0 15px;
	width: calc(100% / 3 - 30px);
}

#page-wrapper .recipe .movie {
	max-width: 600px;
	margin: auto;
	position: relative;
	z-index: 1;
}
#page-wrapper .recipe .movie iframe {
	width: 100%;
}