@charset "utf-8";
/*-------------------
   clearfix
-------------------*/
.cf:before, .cf:after {
	content: " ";
	display: table;
}
.cf:after {
	clear: both;
}
.cf {
 *zoom: 1;
}
/*-------------------
   common
-------------------*/
.wrapper {
	font: 1.0em/1.2 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-feature-settings: "palt";
	letter-spacing: .1em;
	padding: 0;
	position: relative;
}
.wrapper * {
	box-sizing: border-box;
}
.wrapper a {
	color: inherit;
	display: block;
}
.wrapper img {
	height: auto;
	max-width: 100%;
}

/*---7esthe_mobile.css リセットOP対策----*/
#container h3,
#container h4,
#container h5 {
	background: none;
	color: #000;
	cursor: auto;
	float: none;
}
#container h3 span,
#container h4 span,
#container h5 span {
	background: none;
	color: #000;
	cursor: auto;
	float: none;
}
#container .flex {
    align-items: flex-start;
	display: flex;
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	flex-wrap: wrap;
	margin: 0 auto;
}
/*--7esthe_mobile.css 商品ページ用リセットOP対策　----*/
.write_box {
    margin: 0;
    padding: 0;
}
.write_box dl {
    overflow: inherit;
    margin-top: 0;
}
#mobile_detail_content {
	font-size: 1.0em;
}
.write_box dl dd {
    color: #666;
    overflow: initial;
}
.item_explanation .cont {
	margin: 0;
	padding: 0;
}
/*ブレイクポイントのルール*/
/* -スマホ基本設計 解像度に依存しない-
 *350pxまで：SP縦 i5 SE
 *350px〜480px：SP縦 i6-8　****一番重要****
 *480px〜960px：SP横からタブレット
 *960px〜小型PC　大型PC
 
 /*  全体指定 スマホ縦 i5 i5SE　350pxまで  */
 
 
/* ボタンデザイン自由に変えてください  */
#container .buy-btn {
	background: #9dd53a;
	border: #99b61e 1px solid;
	border-radius: 1.5em;
	color: #fff;
	display: block;
	font: bold 1.4rem/2.2 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	position: relative;
	margin: 8px auto 45px;
	text-align: center;
	width: 90%;
}
#container .buy-btn a {
	font-weight:bold;
	color: #fff;
	display: block;
	text-decoration: none;
}
#container .buy-btn a::before {
	border: solid 5px transparent;
	border-left: solid 7px #fff;
	content: "";
	display: inline-block;
	width: 0;
	height: 0;
	position: relative;
	top: -1px;
}
#container .buy-btn:hover {
	filter: alpha(opacity=90);
	opacity: 0.7;
	transition: all ease-in 0.4s;
}
/*-- 画面外にいる状態 --*/
.fadein {
	opacity : 0;
	transform : translate(0, 30px);
	transition: ease-in 400ms;
}
/*-- 画面内に入った状態 --*/
.fadein.scrollin {
	opacity : 1;
	transform : translate(0, 0);
}
#container section {
	margin: 0 auto;
	padding: 0;
}

#container .wrapper p{
	color:#675c4e;
}
/*-------------------
   mainvisual
-------------------*/
.mainvisual{
	text-align:center;
	background-image:url(/contents/shop/sevenbeauty/img/freepage/essentialoil202003/mv-bg.jpg);
	background-size:cover;
	background-repeat:no-repeat;
	background-position:22% top;
}
.wrapper .mainvisual .title-desc{
	font:normal 1.2rem/1.5 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	color:#675c4e;
	padding:0.8rem 0 0;
}
.wrapper .mainvisual .headtitle{
	font:normal 2rem/1.3 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
    color:#ef9a00;
    text-shadow:0px 0px 2px #fff,0px 0px 5px #fff;}
    
.mainvisual img{
	width:80%;
	margin:20px 0 5px 20%;
}
/*-------------------
   section 1
-------------------*/
#container .wrapper .sec1{
	background-image:url(/contents/shop/sevenbeauty/img/freepage/essentialoil202003/2003brendoil_02.jpg);
    background-size:33%;
    background-repeat:no-repeat;
    background-position:top right;
    padding-top:10px}

#container .sec1 h2{
	font: normal 1rem/1.3 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	color:#675c4e;
	border-top:1px solid #ef9a00;
	border-bottom:1px solid #ef9a00;
	padding:10px 0;
	margin:15px 25% 15px 5%;
	text-align:center;
}

.sec1 h2 em{
	font-size:1.2em;
}
.sec1 h2 em:before{
	content:"\A";
	white-space:pre;
}
#container .wrapper .sec1 p{
	margin:25px 5%;
	line-height:160%;
}

.point-box{
	background-color:#fff;
	margin:0 5%;
	padding:10px;
	position:relative
}

#container .point-box p{
	font: normal 0.9rem/1.5 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	letter-spacing:-0.05rem;
	margin-top:20px;
	line-height:170%;
	text-align:left;
}
.point-box img{
	width:50%;
	margin:10px auto 0;
}
.point-box .point-circle{
	position:absolute;
	top:-45px;
	left:-10px;
	width:20%;
}
/*-------------------
   section 2
-------------------*/
#container .wrapper .sec2{
	background-color:#fafad8;
	background-image:url(/contents/shop/sevenbeauty/img/freepage/essentialoil202003/yuzu-l.jpg),url(/contents/shop/sevenbeauty/img/freepage/essentialoil202003/yuzu-r.jpg);
	background-repeat:no-repeat;
	background-size:33%;
	background-position:0 250px,100% 380px;
}
.desc-h2 {
    text-align: center;
    padding-top: 1.4em;
}
#container .sec2 .item-name, #container .sec3 .item-name {
    font-size: 1.4em;
    color: #766b54;
}
#container .wrapper .sec2 h2,
#container .wrapper .sec3 h2,
#container .wrapper .sec4 h2{
	font:normal 2rem/1.5 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
    color:#ef9a00;
text-align:center;
text-shadow:0px 0px 2px #fff,0px 0px 7px #fff;
}
.sec2 ul,
.sec3 ul{
	margin:10px 10%;
	text-align:center;
}
.sec2 .howto ul,
.sec3 .howto ul{
	margin:10px 0%;
	text-align:left;
}

.item-main{
	margin:5px 15%;
	width:70%;
}
#container .sec2 .item-name,
#container .sec3 .item-name{
	font-size:1.2em;
	color:#766b54;
}
#container .sec2 .item-name em,
#container .sec3 .item-name em{
	font-size:0.8rem
}

#container .wrapper .sec2 h3,
#container .wrapper .sec3 h3{
	font:normal 1.8rem/1.3 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	color:#796d58;
	text-align:center;
	margin:1em 0;
}
#container .wrapper .sec2 h3:before,
#container .wrapper .sec3 h3:before{
	content:"―― ";
	letter-spacing:0
}
#container .wrapper .sec2 h3:after,
#container .wrapper .sec3 h3:after{
	content:" ――";
	letter-spacing:0
}

.howto{
	background-color:#fff;
	margin:0 3% 20px;
	padding:15px;
}
#container .wrapper .howto p{
	margin:12px 0 20px;
	line-height:170%;
	font: normal 0.9rem/1.5 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	letter-spacing:-0.05rem;
}
#container .wrapper .sec2 h4,
#container .wrapper .sec3 h4{
	font:normal 1.4rem/1.3 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	color:#796d58;
	background-repeat:no-repeat;
	background-size:16%;
	padding-left:18%;
	padding-bottom:10px;
}
#container .osusume-1{
	background-image:url(/contents/shop/sevenbeauty/img/freepage/essentialoil202003/osusume1.png);
}
#container .osusume-2{
	background-image:url(/contents/shop/sevenbeauty/img/freepage/essentialoil202003/osusume2.png);
}

#container .wrapper .sec2 h5,
#container .wrapper .sec3 h5{
	font:normal 1.5rem/1.8 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	color:#796d58;
	width:100%;
	text-align:center;
}


.recipe-box{
	background-color:#f8f8f8;
	padding:2px;
	display:flex;
	flex-flow:wrap;
}
.recipe-box dl{
	flex-flow:wrap;
}

.recipe-box dl{
    width:46%;
    margin:0 2%;
    text-align:center;
}
.recipe-box dl dd {
	font: normal 0.9rem/1.5 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	letter-spacing:-0.05rem;
    color: #675c4e;
}

#container .wrapper .recipe-box .buy-btn{
	border-radius: 25px;
	font: bold 1rem/2.2 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	margin: 5px auto 5px;
	width: 95%;
	letter-spacing:0;
}
#container .wrapper .sec2 .voice,
#container .wrapper .sec3 .voice{
	text-align:center;
	padding-left: 0;
}
.memoboard{
	width:96%;
	margin:0 2%;
	padding-bottom:15px;
}
/*-------------------
   section 3
-------------------*/
#container .wrapper .sec3{
	background-color:#f6eaea;
		background-image:url(/contents/shop/sevenbeauty/img/freepage/essentialoil202003/orange-l.jpg),url(/contents/shop/sevenbeauty/img/freepage/essentialoil202003/orage-r.jpg);
	background-repeat:no-repeat;
	background-size:32%;
	background-position:0 290px,100% 370px;
}
/*-------------------
   section 4
-------------------*/
#container .wrapper .sec4{
	background-color:#f8f8f8;
	}

#container .wrapper .sec4 ul li{
	width:80%;
	margin:10px 10% 20px;
	text-align:center;
	padding-bottom:10px;

}
#container .wrapper .sec4 ul li:nth-child(1){
	border-bottom:1px solid #ccc;
}

#container .sec4 h3{
	font-size:1.3em;
	color:#766b54;
}
#container .sec4 em{
	font-size:0.8rem
}

#container .wrapper .sec4 .buy-btn{
	font: bold 1.3rem/2 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	margin: 10px auto 5px;
	width: 95%;
}

/*-------------------
   section 5
-------------------*/
#container .wrapper .sec5 h2{
	font:normal 1.4rem/1.5 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
    color:#ef9a00;
	text-align:center;
	padding:5px 8%;
}
#container .wrapper .sec5 ul{
	display:flex;
	flex-flow:wrap-reverse;
	margin:5px 2rem 30px;
}
#container .wrapper .sec5 ul img{
	margin:0 20%;
	width:60%;
}
#container .wrapper .sec5 h3{
	margin:10px 0;
	font: normal 1rem/1.2 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	color:#765e2b;
	border-top:1px solid #ef9a00;
	border-bottom:1px solid #ef9a00;
	padding:10px 0 5px;
	margin:10px 0 10px 0;
	text-align:center;
}
#container .wrapper .sec5 h3 em{
	font-size:1.5em;
}
#container .wrapper .sec5 li p {
	font: normal 0.9rem/1.5 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;

}

@media screen and (min-width:350px) and ( max-width:480px) {
/*　スマホ縦　i6 / i6plus / i7  350pxから480pxまではここを読み込む　*/
#container .sec1 h2{
	font: normal 1rem/1.5 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	padding:10px 0;
	margin:20px 25% 20px 5%;
	text-align:center;
}
#container .wrapper .sec2{
	background-size:35%;
	background-position:0 285px,100% 400px;
}
#container .wrapper .sec2 h2,
#container .wrapper .sec3 h2,
#container .wrapper .sec4 h2{
	font:normal 2.4rem/1.3 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
}
#container .wrapper .desc-h2 {
    font: normal 1.1rem/1.4 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	letter-spacing:-0.05rem;
    padding-top: 30px;
}
#container .wrapper .sec2 h4,
#container .wrapper .sec3 h4{
	font:normal 1.5rem/1.4 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	background-size:16%;
	padding-left:18%;
	padding-bottom:15px;
}
#container .wrapper .sec3{
	background-size:35%;
	background-position:0 330px,100% 420px;
}
}

 @media screen and (min-width:480px) {
/*　スマホ横～タブレット 480pxから読み込む　*/
#container  {
	margin:0 auto;
	max-width:1040px;
}
/*-------------------
   mainvisual t
-------------------*/
.mainvisual{
	background-size:125%;
}
.wrapper .mainvisual .title-desc{
	font:normal 2rem/1.5 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	padding:0.8rem 0 0;
}
.wrapper .mainvisual .headtitle{
	font:normal 3.4rem/1.3 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
    text-shadow:0px 0px 3px #fff,0px 0px 6px #fff;
	word-break:keep-all;
    }
.mainvisual img{
	width:auto;
	margin:5px 0 5px 43%;
}
/*-------------------
   section 1 t
-------------------*/
#container .wrapper .sec1{
    background-size:38%;
    background-position:top right;
    padding-top:10px}

#container .sec1 h2{
	font: normal 1.2rem/1.1 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	letter-spacing:-0.05rem;
	padding:12px 0;
	margin:20px 40% 0 5%;
	text-align:center;
}

.sec1 h2 em{
	font-size:1.5em;
}
.sec1 h2 em:before{
	content:"\A";
	white-space:pre;
}
#container .wrapper .sec1 p{
	margin:25px 40% 0 5%;
	line-height:170%;
	padding-bottom:20px;
	font-size:1.2rem
}
/*-------------------
   section 2-3 t
-------------------*/
.sec2 ul,
.sec3 ul{
	display:flex;
	margin:10px 10%;
	text-align:center;
}
#container .wrapper .sec2,
#container .wrapper .sec3{
	background-size:20%;
	background-position:0 5px,100% 0px;
}
#container .wrapper .sec2 h2,
#container .wrapper .sec3 h2{
	font:normal 3rem/1.5 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
}
#container .wrapper .desc-h2{
	font:normal 1.6rem/1.5 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	padding-top:30px
}
.item-main{
	margin:0 auto;
	width:auto;
}
#container .buy-btn {
	font: bold 1.8rem/2.5 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	margin: 20px auto 40px;
	width: 50%;
}
.point-box img{
	margin:12px;
}
.point-box .point-circle{
	position:absolute;
	top:-75px;
	left:-15px;
	width:12%;
}
.point-box {
	display:flex;
	padding:10px 5px 10px 25px;
}
#container .wrapper .point-box p{
	font-size:1.2rem;
}
#container .wrapper .sec2 h3,
#container .wrapper .sec3 h3{
	font:normal 2.8rem/1.3 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	color:#796d58;
	text-align:center;
	margin:1.5em 0 1em;
}
#container .wrapper .sec2 h3:before,
#container .wrapper .sec3 h3:before{
	content:"―――― ";
}
#container .wrapper .sec2 h3:after,
#container .wrapper .sec3 h3:after{
	content:" ――――";
}
.howto{
	margin:0 15px 20px;
	padding:25px;
	box-shadow:2px 2px 5px #f1eddf;
}
.sec3 .howto{
	box-shadow:2px 2px 5px #e6e2de;
}
#container .wrapper .sec2 h4,
#container .wrapper .sec3 h4{
	font:normal 2.2rem/1.3 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	letter-spacing:-0.05rem;
	background-size:10%;
	padding-left:12%;
	padding-bottom:20px;
}
#container .wrapper .sec2 .osusume-1{
	padding-top:1rem;
}
#container .wrapper .howto p{
	margin:0px 0 20px;
	font-size:1.2rem;

}
.recipe-box dl{
    width:48%;
    margin:0 1%;
    padding-bottom:10px;
    text-align:center;
    display:flex;
    align-items:center
}
.recipe-box dl dd{
	width:48%;
}
#container .wrapper .sec2 h5,
#container .wrapper .sec3 h5{
font:normal 2.1rem/2 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
}
#container .wrapper .sec4 h2{
	font:normal 3.5rem/1.8 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
}
#container .wrapper .sec4 ul li{
	width:45%;
	margin:10px 1% 20px;
	text-align:center;
}
#container .sec4 h3{
	font-size:1.3rem;
	margin:5px;
}
#container .wrapper .recipe-box .buy-btn{
	border-radius: 25px;
	font: bold 1.1rem/2.2 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	margin: 10px auto;
	width: 99%;
	letter-spacing:0;
}
.sec2 .howto ul li:nth-child(1),
.sec3 .howto ul li:nth-child(1){
	width:45%;
;
}
.sec2 .howto ul li:nth-child(2),
.sec3 .howto ul li:nth-child(2){
	width:55%;
	padding:0 3% 0;

}
#container .wrapper .sec2 .howto p{
	font-size:1.1rem;
	letter-spacing:-0.05rem;
}
#container .wrapper .sec2 .voice,
#container .wrapper .sec3 .voice{
	font:normal 2.2rem/1.8 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	color:#fff;
	background-color:#796d58;
	background-repeat:no-repeat;
	padding-bottom:2px;
	display:block;
	margin:-30px 20% 20px;
	position:relative;
	top:55px
}
#container .wrapper .sec4 ul{
	display:flex;
	justify-content: center;
}
#container .wrapper .sec4 .buy-btn{
	border-radius: 3rem;
	font: bold 1.4rem/2 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	margin: 10px auto;
	width: 75%;
}
.recipe-box img{
	margin-right:5px;
}
/*-------------------
   section 5 t
-------------------*/
#container .wrapper .sec5 h2{
	font:normal 1.8rem/1.5 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	padding-top:10px;
}
#container .wrapper .sec5 ul{
	display:flex;
	flex-wrap:nowrap;
}

#container .wrapper .sec5 li:nth-child(1){
	width:75%;
}
#container .wrapper .sec5 li p{
	font-size:1.2rem;
}
#container .wrapper .sec5 h3{
	font: normal 1rem/1.5 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	padding:10px 0 5px;
	margin:0 0 15px 0;
	text-align:center;
}

#container .wrapper .sec5 ul img{
	margin:0 10%;
	width:80%;
}
#container .wrapper .sec4 ul li:nth-child(1){
	border-bottom:none
}
}

 @media screen and (min-width:960px) {
/*　小・大画面デスクトップ　960pxからはここを読み込む　*/
#container  {
	margin:0 auto;
	max-width:1040px;
}
/*-------------------
   mainvisual d
-------------------*/
.mainvisual{
	background-size:100%;
	background-position:top;
}

/*-------------------
   section 1 d
-------------------*/
#container .wrapper .sec1{
    background-size:auto;
    background-position:top right;
    padding-top:10px}

#container .wrapper .sec1 h2{
	font: normal 1.2rem/1.5 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	margin:30px 40% 0 5%;
}
#container .wrapper .sec1 p{
	margin:30px 40% 0 5%;
	padding-bottom:50px;
}

/*-------------------
   section 2-3 d
-------------------*/
.sec2 ul,
.sec3 ul{
	display:flex;
	margin:20px 18%;
	text-align:center;
}
#container .wrapper .sec2 h2,
#container .wrapper .sec3 h2,
#container .wrapper .sec4 h2{
	font:normal 3rem/1.5 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
margin-top:10px;
}
#container .sec2 .item-name,
#container .sec3 .item-name{
	font-size:1.2rem;
	line-height:1.5em;
}
#container .sec2 .item-name em,
#container .sec3 .item-name em{
	font-size:0.8rem
}
.item-main{
	margin:0 0 0 20px;
}
.point-box .point-circle{
	top:-90px;
	left:-30px;
	width:auto;
}
.point-box {
	padding:25px 15px 20px 40px;
}

#container .wrapper .sec2 h4,
#container .wrapper .sec3 h4{
	font:normal 2rem/1.3 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	background-size:auto;
	padding-left:11%;
	padding-bottom:25px;
	margin-top:0;
	letter-spacing:-0.05rem;
}
#container .wrapper .sec2 h5,
#container .wrapper .sec3 h5{
font:normal 2.1rem/2 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
margin:0;
}
.recipe-box{
	padding:10px;
}

.recipe-box dl dd{
	font-size:1rem;
	color:#675c4e;
	width:60%;
}
#container .wrapper .sec2 .voice,
#container .wrapper .sec3 .voice{
	font:normal 2.2rem/1.8 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	margin:-30px 20% 20px;
	top:65px
}
.memoboard{
	width:auto;
	margin:0 4.5%;
	padding-bottom:50px;
}
#container .wrapper .recipe-box .buy-btn{
    border-radius: 2rem;
	font: bold 1.2rem/2.4 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	margin: 15px auto 0;
	width: 90%;
}

#container .wrapper .sec4 .buy-btn{
	border-radius: 2rem;
	font: bold 1.5rem/2.2 'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
	margin: 15px auto;
	width: 75%;
}
#container .wrapper .sec4 ul li{
	width:40%;
	margin:10px 0 30px;
}
#container .sec4 .item-name{
	font-size:1.2rem;
	color:#675c4e;
}
/*-------------------
   section 5 d
-------------------*/
#container .wrapper .sec5 h2{
	font:normal 2.2rem/1.5 "游明朝", YuMincho, "ヒラギノ明朝 ProN W3",'Ubuntu',"ヒラギノ角ゴ ProN W3",'Hiragino Kaku Gothic ProN','メイリオ', Meiryo,"遊ゴシック体",YuGothic,"游ゴシック","Yu Gothic",'ＭＳ ゴシック',sans-serif;
padding:10px 10px 25px;
}
#container .wrapper .sec5 li p{
	font-size:1rem;
	line-height:170%;
}
}