@charset "UTF-8";
/* ////////////////////////////////////////////////////////////////////////////////////////////////////
 *
 * 00 reset
 * 01 base
 * 02 header
 * 03 footer
 * 04 lp
 * 05 responsive
 *
 * ///////////////////////////////////////////////////////////////////////////////////////////////// */
 
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}
/* not selected : script, noscript, template */
html, body, article, section, nav, aside, h1, h2, h3, h4, h5, h6, header, footer, address, p, hr, pre, blockquote, ol, ul, li, dl, dt, dd, figure, figcaption, div, main, a, em, strong, small, s, cite, q, dfn, abbr, data, time, code, var, samp, kbd, sub, sup, i, b, u, mark, ruby, rb, rt, rtc, rp, bdi, bdo, span, br, wbr, ins, del, img, iframe, embed, object, param, video, audio, source, track, map, area, table, caption, colgroup, col, tbody, thead, tfoot, tr, td, th, form, label, input, button, select, datalist, optgroup, option, textarea, keygen, output, progress, meter, fieldset, legend, canvas {
	border: 0;
	margin: 0;
	outline: 0;
	padding: 0;
	background: transparent;
	font: inherit;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	text-decoration: none;
	vertical-align: baseline;
}
html {
	font-size: 62.5%;
	width: 100%;
	height: 100%;
}
ul, ol {
	list-style: none;
}
@font-face {
	font-family: 'Noto Serif Japanese';
	font-style: normal;
	font-weight: 400;
	src: url(../font/NotoSerifCJKjp-Regular.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Serif Japanese';
	font-style: normal;
	font-weight: 500;
	src: url(../font/NotoSerifCJKjp-Medium.otf) format('opentype');
}
/*=================================================
 * 01 base
 * ================================================= */
body {
	color: #22201f;
	font-family: 'Noto Sans Japanese', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'Meiryo', 'メイリオ', 'MS PGothic', 'ＭＳ Ｐゴシック', Helvetica, Arial, sans-serif;
	font-size: 1.4rem;
	line-height: 1;
	width: 100%;
	height: 100%;
	position: relative;
}
a:link, a:visited {
	color: #22201f;
	text-decoration: none;
	transition: .3s;
}
a:hover {
	opacity: .6;
}

.inner {
	width: 1366px;
	margin: 0 auto;
	padding: 0 33px;
	position: relative;
}
.innerB {
	width: 89.4%;
	margin: 0 auto;
	position: relative;
}
.innerS {
	width: 960px;
	margin: 0 auto;
	position: relative;
}
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: ".";
	clear: both;
	height: 0;
}
.fontFamilyMincho { 
	font-family: 'Noto Serif Japanese', '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', serif;
	font-feature-settings : "palt";
	/*letter-spacing: .03em;*/
}
.pcHide {
	display: none !important;
}
/*=================================================
 * 02 header
 * ================================================= */

header {
	width: 100%;
	background: #fff;
	display: table;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10;
}
header h1 {
	display: table-cell;
	width: 15%;
}
header h1 a {
	padding: 12% 0;
	display: block;
	background: #22201f;
	text-align: center;
}
header h1 a img {
	width: 63%;
	height: auto;
}
header nav {
	text-align: right;
	display: table-cell;
	vertical-align: middle;
}
header nav ul li {
	display: inline-block;
	padding-right: 40px;
}
header nav ul li a {
	display: block;
	letter-spacing: .03em;
	font-size: 1.3rem;
}
header #headerCart {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	background: #b6202e;
	width: 10%;
}
header #headerCart a {
	width: 100%;
	display: block;
	color: #fff;
	font-size: 1.3rem;
	padding: 18.5% 0;
}

header #headerCart a img {
	width: 22px;
	padding-right: 5px;
}

/*=================================================
 * 03 footer
 * ================================================= */

footer {
	width: 100%;
}

footer #footerNaviBg {
	background: #22201f;
}

footer #footerNaviBg #footerNavi {
	display: flex;
}

footer #footerNaviBg #footerNavi li:first-child {
	margin-right: auto;
}

footer #footerNaviBg #footerNavi li:first-child a img {
	height: 10px;
	width: auto;
}

footer #footerNaviBg #footerNavi li a {
	padding: 70px 25px;
	display: block;
	color: #fff;
	font-size: 1.2rem;
}

footer #footerNaviBg #footerNavi li.footerFaq a {
	padding-right: 50px;
}

footer #footerNaviBg #footerNavi li.footerContact a {
	background: #bd9e78;
	width: 150px;
	text-align: center;
}

footer #footerNaviBg #footerNavi li.footerOrder a {
	background: #b6202e;
	width: 150px;
	text-align: center;
}

footer #footerCopyrightBg {
	background: #bd9e78;
	font-size: 1.2rem;
	padding: 30px 0;
}

footer #footerCopyrightBg .inner {
	display: flex;
}

footer #footerCopyrightBg .inner p a {
	color: #fff;
	padding: 0 25px;
}

footer #footerCopyrightBg .inner #footerCopyright {
	color: #fff;
	margin-left: auto;
}

/*=================================================
 * 04 lp
 * ================================================= */

/*#main { 
	margin-top: 4.8%;
	background: url(../img/img_main_pc.png) center center no-repeat;
	background-size: auto 100%;
}*/
#main { 
	margin-top: 4.8%;
	position: relative;
}
#main img { width: 100%; }

#main #btnOrderMain { 
	width: 14.5%;
	position: absolute;
	bottom: 8.4%;
	right:15.5% ;
}

#copyArea { 
	background: #22201f;
	padding: 36px 0;
	text-align: center;
	width: 100%;
	font-weight: 100;
}

/* effectFeeling */
#effectFeeling {
	background: #f7f2ef ;
	padding: 80px 0;
	text-align: center;
}

#effectFeeling #effectFeelingTit {
	font-size: 4.3rem;
	line-height: 1.3;
}

#effectFeeling #effectFeelingList {
	margin-top: 45px ;
}

#effectFeeling #effectFeelingAnnotation {
	margin-top: 50px ;
	text-align: left ;
	font-size: 1.2rem;
	line-height: 1.6;
}

#effectFeeling #effectFeelingAnnotation span {
	font-weight: 500;
}

/* apple */
#apple {
	width: 100%;
}

#apple #appleWrap {
	display: table;
	width: 100%;
}
#apple #appleWrap > div {
	width: 50%;
	display: table-cell;
}

#apple #appleWrap > div img {
	width: 100%;
}

#magazine {
	width: 100%;
	padding-top: 120px;
	text-align: center;
}

/* magazine */
#magazine #magazineTit {
	font-size: 5.3rem ;
	line-height: 1.3;
}

#magazine div {
	margin-top: 50px;
}

#magazine div img {
	width: 100%;
}

/* scene */
#scene {
	width: 100%;
	padding-top: 100px;
}

#scene > div img {
	width: 100%;
}

/* merit01 */
#merit01 {
	text-align: center;
	padding-top: 85px;
}

#merit01 #merit01Tit {
	font-size: 4.3rem;
	line-height: 1.3;
	margin-top: 40px;
}

#merit01 div img {
	width: 100%;
}

/* cvArea */
.cvArea {
	margin-top: 100px !important;
	padding: 0 33px;
}

.cvArea .cvTit img {
	width: 100%;
}

.cvArea .cvWrap {
	width: 100%;
	border: 2px solid #22201f;
	margin-top: 18px;
	padding: 53px;
	display: table;
}

.cvArea .cvWrap > div {
	display: table-cell;
	vertical-align: top;
	width: 50%;
}

.cvArea .cvWrap .itemInfo {
	position: relative;
}

.cvArea .cvWrap .itemInfo .itemMerit {
	position: absolute;
	top:-18px ;
	right:33px ;
}

.cvArea .cvWrap .itemInfo .itemName {
	margin-top: 40px;
	padding-left: 5px;
}

.cvArea .cvWrap .itemInfo .itemPrice {
	margin-top: 50px;
	padding-left: 5px;
}

.cvArea .cvWrap .itemInfo .btnOrder {
	margin-top: 34px;
}

/* product */
#product {
	padding-top: 150px;
}

.tit { text-align: center; margin: 0 auto; }
.tit img { width: 100% ; }
.titSub { font-size: 1.7rem; text-align: center; margin-top: 20px; }

#product .tit { width: 264px ; height: auto; }
#step .tit { width: 113px ;height: auto;  }
#review .tit { width: 214px ;height: auto;  }
#story .tit { width: 179px ;height: auto;  }
#faq .tit { width: 164px ;height: auto;  }

#product #reason01 {
}

#product #reason02,
#product #reason03 {
	border-top: 1px solid #dedede;
	margin-top: 120px;
}
	
#product .reasonWrap {
	width: 100%;
	display: table;
	margin-top: 78px;
}

#product .reasonWrap .imgArea {
	display: table-cell;
	width: 50%;
	height: 700px ;
	position: relative;
}

#product .reasonWrap .imgArea .imgAreaDecoR {
	position: absolute;
	right: -29px;
	bottom: 2px;
}

#product .reasonWrap .imgArea .imgAreaDecoL {
	position: absolute;
	left: -29px;
	bottom: 2px;
}

#product #reason01 .reasonWrap .imgArea { background: url(../img/img_reason01_pc.png) center center no-repeat; }
#product #reason02 .reasonWrap .imgArea { background: url(../img/img_reason02_pc.png) center center no-repeat; }
#product #reason03 .reasonWrap .imgArea { background: url(../img/img_reason03_pc.png) center center no-repeat; }

#product .reasonWrap .txtArea {
	display: table-cell;
	vertical-align: middle;
	position: relative;
}

#product #reason01 .reasonWrap .txtArea { background: url(../img/txt_01.png) left 430px top 0px no-repeat; }
#product #reason02 .reasonWrap .txtArea { background: url(../img/txt_02.png) right 86px top 18px no-repeat; }
#product #reason03 .reasonWrap .txtArea { background: url(../img/txt_03.png) left 410px top 10px no-repeat; }

#product #reason01 .reasonWrap .txtArea .txtAreaWrap {
	width: 580px;
	padding-left: 90px;
}

#product #reason02 .reasonWrap .txtArea .txtAreaWrap {
	width: 570px;
	margin: 0 80px 0 auto;
}

#product #reason03 .reasonWrap .txtArea .txtAreaWrap {
	width: 620px;
	padding-left: 90px;
}

#product .reasonWrap .txtArea .txtAreaWrap .reasonEn {
	font-size: 1.4rem;
	letter-spacing: .2em;
	padding-bottom: 17px;
	position: relative;
}

#product .reasonWrap .txtArea .txtAreaWrap .reasonEn::after {
	position: absolute;
	content: "";
	width: 22px;
	height: 2px;
	background: #e0e0e0;
	top:28px ;
	left:0 ;
}

#product .reasonWrap .txtArea .txtAreaWrap .reasonJp {
	font-size: 2.4rem;
	margin-top: 19px;
}

#product .reasonWrap .txtArea .txtAreaWrap .reasonTit {
	margin-top: 18px;
	font-size: 6.3rem;
	line-height: 1.1;
}

#product .reasonWrap .txtArea .txtAreaWrap .reasonTit span {
	font-size: 25%;
	vertical-align: top;
	position: relative;
	top: .7em;
}

#product .reasonWrap .txtArea .txtAreaWrap .reasonHeading {
	font-size: 2.6rem;
	line-height: 1.1;
	color: #b08232;
	margin-top: 40px;
}

#product .reasonWrap .txtArea .txtAreaWrap .reasonTxt {
	line-height: 1.7;
	margin-top: 20px;
	text-align: justify;
}

#product .reasonWrap .txtArea .txtAreaWrap .reasonAnnotation {
	font-size: 1.2rem;
	line-height: 1.7;
	margin-top: 25px;
	text-align: justify;
}

#product .reasonWrap .txtArea .txtAreaWrap .btnOrderS {
	margin-top: 48px;
}

#product .graphArea {
	padding:0 33px ;
	text-align: center;
	display: table;
	margin-top: 100px;
}

#product .graphArea > div {
	display: table-cell;
}

#product .graphArea > div.left div { text-align: left; }
#product .graphArea > div.right div { text-align: right; }

#product .graphArea > div p {
	font-size: 2.2rem;
	margin-top: 18px;
}

#product #merit02 {
	background: #f8e9e6;
	padding: 125px 0 165px 0;
	text-align: center;
	margin-top: 140px;
}

#product #merit02 #meritTit {
	font-size: 4.3rem;
	line-height: 1.1;
}

#product #merit02 #meritList {
	margin-top: 71px;
}

/* step */
#step { padding-top: 150px ;}
#step > div {
	text-align: center;
	margin-top: 72px;
}

/* review */
#review {
	padding: 120px 0 ;
	margin-top: 150px;
	background: #f8e9e6 url(../img/bg_review.png) 0 0 no-repeat;
}

#review #reviewList {
	flex-wrap: wrap;
	justify-content: space-between;
	display: inline-flex;
	width: 100%;
	margin-top: 75px;
	padding: 0 33px;
}

#review #reviewList li {
	width: 48.5%;
	background: #fff;
	padding: 90px;
}

#review #reviewList li:nth-child(3),
#review #reviewList li:nth-child(4){
	margin-top: 40px;
}

#review #reviewList li .reviewHeading {
	font-size: 2.6rem;
	color: #b08232;
	line-height: 1.3;
}

#review #reviewList li .reviewName {
	margin-top: 30px;
}

#review #reviewList li .reviewName span {
	font-weight: 500;
}

#review #reviewList li .reviewTxt {
	line-height: 1.7;
	margin-top: 12px;
	text-align: justify;
}


/* story */
#story {
	padding: 150px 0 0 0;
	text-align: center;
}

#story #storyTit {
	font-size:5rem ;
	line-height: 1.1;
	margin-top: 50px;
}

#story #storyTxt {
	margin-top: 30px;
	line-height: 1.7;
}

#story #storyPeople {
	display: flex;
	justify-content: space-between;
	width: 80%;
	margin: 45px auto 0 auto;
}

#story #storyPeople li {
	width: 27%;
}

#story #storyPeople li div img {
	width: 100%;
}

#story #storyPeople li .storyPeopleName {
	color:#b08232 ;
	font-size: 2.2rem;
	font-weight: 500;
	margin-top: 20px;
}

#story #storyPeople li .storyPeoplePosition {
	margin-top: 15px;
	font-size: 1.6rem;
	font-weight: 500;
}

#story #storyPeople li .storyPeopleTxt {
	text-align: left;
	text-align: justify;
	line-height: 1.7;
	margin-top: 10px;
	padding: 0 20px;
}


/* faq */
#faq {
	padding: 150px 0;
}

#faq #faqWrap {
	width: 100%;
	display: table;
	margin-top: 80px;
}

#faq #faqWrap #faqContents {
	width: 45%;
	display: table-cell;
	vertical-align: top;
}

#faq #faqWrap #faqContents dl {
	width:470px ;
	margin: 0 90px 0 auto;
}

#faq #faqWrap #faqContents dl dt {
	color: #b08232;
	font-size: 2.6rem;
	font-family: 'Noto Serif Japanese', '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'ＭＳ Ｐ明朝', 'ＭＳ 明朝', serif;
	font-feature-settings : "palt";
	margin-top: 50px;
	line-height: 1.3;
	text-indent: -1em;
  padding-left: 1em;
}

#faq #faqWrap #faqContents dl dt:first-child {
	margin-top: 0;
}

#faq #faqWrap #faqContents dl dd {
	margin-top: 15px;
	line-height: 1.7;
	text-align: justify;
}

#faq #faqWrap #faqImg {
	width: 55%;
	height: 1035px;
	display: table-cell;
	background: url(../img/img_faq_pc.png) center center no-repeat;
	vertical-align: top;
}

/*=================================================
 * 05 responsive
 * ================================================= */

@media screen and (max-width: 1365px) {
	.inner {
			width: 100%;
	}
	.innerB {
			width: 100%;
			padding: 0 33px;
	}
	.innerS {
			width: 70%;
	}
	
	/* copyArea */
	#copyArea {
			padding: 2% 0;
	}
	#copyArea img {
			width: 100%;
	}
	
	/* effectFeeling */
	#effectFeeling {
			padding: 5% 0;
	}
	#effectFeeling #effectFeelingList img {
			width: 100%;
	}
	
	/* magazine */
	#magazine {
			padding-top: 6%;
	}
	#magazine #magazineTit {
			font-size: 4.3rem;
	}
	#magazine div {
			margin-top: 3%;
	}
	
	/*scene*/
	#scene {
			padding-top: 6%;
	}
	
	/* product */
	#product #reason01 .reasonWrap .txtArea .txtAreaWrap,
	#product #reason03 .reasonWrap .txtArea .txtAreaWrap{
			width: 82%;
			padding-left: 13%;
	}
	#product #reason02 .reasonWrap .txtArea .txtAreaWrap {
			width: 78%;
			margin: 0 12% 0 auto;
	}
	#product .reasonWrap .txtArea .txtAreaWrap .reasonTit {
			font-size: 4.3rem;
	}
	#product #reason01 .reasonWrap .imgArea {
			background: url(../img/img_reason01_pc.png) center center no-repeat;
	}
	
	#product #merit02 #meritList img {
			width: 100%;
	}
	#product .graphArea > div img {
			width: 98%;
	}
	#product #reason01 .reasonWrap .txtArea { background: none; }
	#product #reason02 .reasonWrap .txtArea { background: none; }
	#product #reason03 .reasonWrap .txtArea { background: none; }
	
	/* cvArea */
	.cvArea .cvWrap > div img {
			width: 100%;
	}
	.cvArea .cvWrap {
			padding: 4%;
	}
	.cvArea .cvWrap .itemInfo {
			padding-left: 4%;
	}
	.cvArea .cvWrap .itemInfo .itemMerit {
		text-align: right;
		width: 41%;
	}
	.cvArea .cvWrap .itemInfo .itemMerit {
		position: absolute;
		top: -2%;
		right: 0;
	}
	.cvArea .cvWrap .itemInfo .itemMerit img {
		width: 100%;
	}
	.cvArea .cvWrap .itemInfo .itemName {
			margin-top: 10%;
			padding-left: 0;
	}
	.cvArea .cvWrap .itemInfo .itemPrice {
			margin-top: 9%;
			padding-left: 0;
	}
	.cvArea .cvWrap .itemInfo .btnOrder {
			margin-top: 6%;
	}
	
	/* step */
	#step > div img {
		max-width: 100%;
	}
	
	/* review */
	#review #reviewList {
			padding: 0;
	}
	#review #reviewList li {
			padding: 8%;
	}
	
	#story #storyPeople {
			width: 90%;
	}
	#story #storyPeople li .storyPeopleTxt {
			padding: 0;
	}
	
	#faq #faqWrap #faqContents {
			width: 50%;
	}
	#faq #faqWrap #faqContents dl {
			width: 77%;
			margin: 0 13% 0 auto;
	}
	#faq #faqWrap #faqImg {
			width: 50%;
			background: url(../img/img_faq_pc.png) center top no-repeat;
	}
}

@media screen and (max-width: 1023px) {
	#product .reasonWrap .imgArea {
		width: 40%;
	}
	#faq #faqWrap #faqContents {
		width: 60%;
	}
	#faq #faqWrap #faqImg {
		width: 40%;
	}
	header #headerCart a span.spHide {
		display: none;
	}
	footer #footerNaviBg #footerNavi li a {
		padding: 70px 10px;
	}
	footer #footerNaviBg #footerNavi li.footerContact a {
		width: 140px;
	}
	footer #footerNaviBg #footerNavi li.footerFaq a {
		padding-right: 30px;
	}
	footer #footerCopyrightBg .inner p:first-child a {
		padding-left: 0;
	}
}

@media screen and (max-width: 768px) {
	body {
		font-size: 1.4rem;
		font-size: calc(100vw/29);
	}

	.pcHide {
		display: block !important;
	}
	.spHide {
		display: none !important;
	}
	.inner { width: 100%; padding: 0; }
	.innerS { width: 100%; }
	img { max-width: 100%; }
	
	#main { margin-top: 70px; }
	
	/* header */
	header {
		height: 70px;
		z-index: 10;
		display: block;
	}
	header h1 {
			display: table;
			width: 30%;
			position: absolute;
			top: 0;
			left: 0;
	}
	header h1 a {
			height: 70px;
			display: table-cell;
			background: #22201f;
			text-align: center;
			vertical-align: middle;
			padding: 0;
	}
	header h1 a img {
			width: 67%;
	}
	header nav {
			width: 100%;
			text-align: inherit;
			position: absolute;
			top: 70px;
			left: 0;
		
	}
	header nav #menu {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 0;
		overflow: hidden;
		background: rgba(0,0,0,0.9);
		transition: all .4s;
	}
	header nav #menu.active {
		height: 436px;
	}

	header nav #menu li {
		display: table;
		width: 100%;
		height: 80px;
		padding-right: 0;
	}
	header nav #menu li:first-child {
		margin-top: 20px;
	}
	header nav #menu li:last-child {
		margin-bottom: 20px;
	}
	header nav #menu li a {
		display: table-cell;
		text-align: center;
		vertical-align: middle;
		width: 100%;
		color: #fff;
	}
	header #headerCart {
			width: 13%;
			display: table;
			position: absolute;
			top: 0;
			right: 0;
	}
	header #headerCart a {
			display: table-cell;
			height: 70px;
			width: 100%;
			padding: 0;
			vertical-align: middle;
	}
	header #headerCart a img {
			width: 28%;
			padding: 0;
	}
	.menuTrigger {
		display: block;
	}
	.menuTrigger,  .menuTrigger span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
	}
	.menuTrigger {
		position: absolute;
		top: 27px;
		right: 17%;
		width: 20px;
		height: 14px;
	}
	.menuTrigger:hover {
		cursor: pointer;
	}
	.menuTrigger span {
		position: absolute;
		left: 0;
		width: 20px;
		height: 2px;
		background-color: #22201f;
		border-radius: 2px;
	}
	.menuTrigger span:nth-of-type(1) {
		top: 0;
	}
	.menuTrigger span:nth-of-type(2) {
		top: 6px;
	}
	.menuTrigger span:nth-of-type(3) {
		bottom: 0;
	}
	.menuTrigger.active span::before {
		content: none;
	}
	.menuTrigger.active span:nth-of-type(1) {
		-webkit-transform: translateY(6px) rotate(-45deg);
		transform: translateY(6px) rotate(-45deg);
	}
	.menuTrigger.active span:nth-of-type(2) {
		opacity: 0;
	}
	.menuTrigger.active span:nth-of-type(3) {
		-webkit-transform: translateY(-6px) rotate(45deg);
		transform: translateY(-6px) rotate(45deg);
	}

	/* footer */
	footer {
	}
	footer #footerNaviBg {
		padding: 12% 0 0;
		text-align: center;
	}
	footer #footerNaviBg #footerNavi {
			display: block;
	}
	footer #footerNaviBg #footerNavi li {
		display: inline-block;
		margin: 10.7% 3% 12%;
	}
	footer #footerNaviBg #footerNavi li:first-child {
		display: block;
		margin: 0;
	}
	footer #footerNaviBg #footerNavi li.footerFaq a {
    padding-right:0;
	}
	footer #footerNaviBg #footerNavi li.footerContact {
    width: 50%;
		float: left;
		margin: 0;
	}
	footer #footerNaviBg #footerNavi li.footerOrder {
    width: 50%;
		float: right;
		margin: 0;
	}
	footer #footerNaviBg #footerNavi li.footerContact a {
		width: 100%;
		padding: 13.4% 0;
	}
	footer #footerNaviBg #footerNavi li.footerOrder a {
		width: 100%;
		padding: 13.4% 0;
	}
	footer #footerNaviBg #footerNavi li a {
		padding: 0;
    font-size: .6rem;
		font-size: calc(100vw/31);
}
	footer #footerNaviBg #footerNavi li:first-child a img {
			width: 25.2%;
			height: auto;
	}
	footer #footerCopyrightBg {
			font-size: .6rem;
			font-size: calc(100vw/31);
			padding: 6.7% 0;
	}
	footer #footerCopyrightBg .inner {
			display: block;
			text-align: center;
	}
	footer #footerCopyrightBg .inner p {
		margin-top: 6.7%;
	}
	footer #footerCopyrightBg .inner p:first-child {
		margin-top: 0;
	}
	
	/* copyArea */
	#copyArea { padding: 0; }
	#copyArea .inner { padding: 0; }
	
	/* effectFeeling */
	#effectFeeling {
		padding: 7.5% 5.3% 9% 5.3%; 
	}
	#effectFeeling #effectFeelingTit {
		font-size: 25px;
		font-size: calc(100vw/15);
	}
	#effectFeeling #effectFeelingList {
		margin-top: 8%;
	}
	#effectFeeling #effectFeelingAnnotation {
		margin-top: 9.3%;
		font-size: 11px;
		font-size: calc(100vw/38);
		text-align: justify;
	}
	
	/* apple */
	#apple #appleTit {
		line-height: 0;
	}
	#apple #appleTit img {
		width: 100%;
	}
	#apple #appleWrap {
		display: block;
	}
	#apple #appleWrap > div {
		width: 100%;
		display: block;
		line-height: 0;
	}
	
	/* magazine */
	#magazine {
		padding-top: 13%;
	}
	#magazine #magazineTit {
		font-size: 25px;
		font-size: calc(100vw/14);
	}
	#magazine div {
		margin-top: 7%;
		padding: 0 5.3%;
	}
	
	/* scene */
	#scene {
		padding-top: 13%;
	}
	#scene #sceneTit {
		font-size: 25px;
		font-size: calc(100vw/14);
		line-height: 1.3;
		text-align: center;
	}
	#scene div {
		margin-top: 7%;
		padding: 0 5.3%;
	}
	
	/* cvArea */
	.cvArea {
		margin-top: 11% !important;
		padding: 0 5.3%;
	}
	.cvArea .cvWrap {
			margin-top: 2.5%;
			padding: 6.4%;
			display: block;
			border: 1px solid #22201f;
	}	
	.cvArea .cvWrap > div {
			display: block;
			width: 100%;
	}
	.cvArea .cvWrap .itemInfo {
			padding-left: 0;
	}
	.cvArea .cvWrap .itemInfo .itemMerit {
			position: relative;
			top: inherit;
			right: inherit;
			margin-top: 6.3%;
			width: 100%;
	}	
	.cvArea .cvWrap .itemInfo .itemName {
			margin-top: 5.9%;
			padding-left: 0;
	}	
	.cvArea .cvWrap .itemInfo .itemPrice {
			margin-top: 5.9%;
			padding-left: 0;
	}	
	.cvArea .cvWrap .itemInfo .btnOrder {
			margin-top: 6%;
	}	
	
	/* merit01 */
	#merit01 #merit01Tit {
		font-size: 25px;
		font-size: calc(100vw/16);
		margin-top: 6%;
	}
	#merit01 {
		text-align: center;
		padding: 9.3% 5.3% 0 5.3%;
	}
	
	/* product */
	#product {
			padding-top: 18%;
	}
	#product .tit {
		width: 42%;
	}
	.titSub {
		font-size: 1.2rem;
		font-size: calc(100vw/30);
		margin-top: 3.3%;
	}
	#product .reasonWrap {
		display: block;
		margin-top: 9%;
	}
	#product .reasonWrap .imgArea {
		width: 100%;
		height: inherit;
	}
	#product .reasonWrap .imgAreaSp {
		width: 100%;
	}
	#product #reason01 .reasonWrap .txtArea .txtAreaWrap {
		width: 100%;
		padding: 0;
	}
	#product .graphArea {
		display: block;
		margin-top: 11%;
		padding: 0 5.3%;
	}
	#product .graphArea > div {
		display: block;
		width: 100%;
	}
	#product .graphArea > div.right {
		margin-top: 9%;
	}
	#product .graphArea > div img {
			width: 100%;
	}
	#product .graphArea > div p {
			font-size: 1.1rem;
			font-size: calc(100vw/25);
			margin-top: 3.3%;
	}
	#product .reasonWrap .txtArea {
		display: block;
		vertical-align: inherit;
		padding: 6.6% 9.3% 0 9.3%;
	}
	#product .reasonWrap .txtArea .txtAreaWrap .reasonEn {
			font-size: .7rem;
			font-size: calc(100vw/42);
			padding-bottom: 4%;
	}
	#product .reasonWrap .txtArea .txtAreaWrap .reasonEn::after {
			width: 3.6%;
			background: #e0e0e0;
			top: unset;
			bottom: 0;
	}
	#product .reasonWrap .txtArea .txtAreaWrap .reasonTit {
			margin-top: 2.9%;
			font-size: 3.1rem;
			font-size: calc(100vw/10);
	}
	#product .reasonWrap .txtArea .txtAreaWrap .reasonHeading {
			font-size: 1.3rem;
			font-size: calc(100vw/19);
			line-height: 1.3;
			margin-top: 5.6%;
	}
	#product .reasonWrap .txtArea .txtAreaWrap .reasonJp {
			font-size: 1.2rem;
			font-size: calc(100vw/25);
			margin-top: 3.4%;
	}
	#product .reasonWrap .txtArea .txtAreaWrap .reasonTxt {
			margin-top: 3.4%;
	}
	#product .reasonWrap .txtArea .txtAreaWrap .reasonAnnotation {
			font-size: .6rem;
			font-size: calc(100vw/34);
			margin-top: 8%;
	}
	#product .reasonWrap .txtArea .txtAreaWrap .btnOrderS {
			margin-top: 8.7%;
			width: 50%;
			margin-left: auto;
	}
	#product #reason02, #product #reason03 {
			margin-top: 13.3%;
	}
	#product #reason02 .reasonWrap .txtArea .txtAreaWrap {
		width: 100%;
		margin: 0;
	}
	#product #reason03 .reasonWrap .txtArea .txtAreaWrap {
		width: 100%;
		padding: 0;
	}
	#product #merit02 {
			padding: 12% 0;
			margin-top: 15.3%;
	}
	#product #merit02 #meritTit {
			font-size: 4.3rem;
			font-size: calc(100vw/16);
			line-height: 1.3;
	}
	#product #merit02 #meritList {
			margin: 7.3% auto 0 auto;
			width: 73.6%;
	}
	
	/* step */
	#step {
			padding-top: 18%;
	}
	#step .tit {
			width: 18.5%;
	}
	#step > div {
			margin-top: 8%;
			padding: 0 5.3%;
	}
	
	/* review */
	#review {
			padding: 14.6% 0 5.3%;
			margin-top: 18%;
			background: #f8e9e6;
	}
	#review .tit {
			width: 34%;
	}
	#review #reviewList {
		flex-wrap: nowrap;
		display: block;
		margin-top: 7.6%;
		padding:0 5.3% ;
	}
	#review #reviewList li {
		width: 100%;
		padding:11%;
		margin-top: 6% !important;
	}
	#review #reviewList li:first-child {
		margin-top: 0;
	}
	#review #reviewList li .reviewHeading {
			font-size: 1.3rem;
			font-size: calc(100vw/19);
			line-height: 1.3;
	}
	#review #reviewList li .reviewName {
			margin-top: 7%;
	}
	#review #reviewList li .reviewTxt {
			margin-top: 3%;
	}
	
	
	/* story */
	#story {
			padding: 18% 0 0 0;
	}
	#story .tit {
			width: 27.3%;
	}
	#story #storyTit {
			font-size: 2.5rem;
			font-size: calc(100vw/16);
			line-height: 1.3;
			margin-top: 8%;
	}
	#story #storyTxt {
			margin-top: 5.3%;
			text-align: left;
			text-align: justify;
			padding: 0 9.3%;
	}	
	#story #storyPeople {
			display: block;
			width: 100%;
			padding: 0 9.3%;
			margin: 8% auto 0 auto;
	}
	#story #storyPeople li {
			width: 100%;
			margin-top: 12%;
	}
	#story #storyPeople li:first-child {
			margin-top: 0;
	}
	
	#story #storyPeople li > div {
		padding: 0 17.2%;
	}
	#story #storyPeople li .storyPeopleName {
			font-size: 1.1rem;
			font-size: calc(100vw/20);
			margin-top: 4.7%;
	}
	#story #storyPeople li .storyPeoplePosition {
			margin-top: 2.3%;
			font-size: .8rem;
			font-size: calc(100vw/27);
	}
	#story #storyPeople li .storyPeopleTxt {
			margin-top: 4%;
			padding: 0;
	}
	
	/* faq */
	#faq {
			padding: 30% 0 18% 0;
	}
	#faq .tit {
			width: 26%;
	}
	#faq #faqWrap {
		width: 100%;
		display: block;
		margin-top: 9.3%;
	}
	#faq #faqWrap #faqContents {
		width: 100%;
		padding: 0 9.3%;
		display: block;
	}	
	#faq #faqWrap #faqContents dl {
		width: 100%;
		margin: 0;
	}
	#faq #faqWrap #faqContents dl dt {
			font-size: 1.3rem;
			font-size: calc(100vw/18);
			margin-top: 9%;
			text-align: justify;
	}
	#faq #faqWrap #faqContents dl dd {
			margin-top: 3%;
			line-height: 1.7;
	}
	#faq #faqWrap #faqImg {
			width: 100%;
			height: inherit;
			display: block;
			background: none;
			margin-top: 9.3%;
	}
	#faq #faqWrap #faqImg img {
		width: 100%;
	}
}


@media screen and (max-width: 480px) {
	a:hover {
		opacity: inherit;
	}
	
	#main {
		margin-top: 50px;
	}
	/* header */
	header {
		height: 50px;
		z-index: 10;
		display: block;
	}
	header h1 {
			display: table;
			width: 35%;
			position: absolute;
			top: 0;
			left: 0;
	}
	header h1 a {
			height: 50px;
			display: table-cell;
			background: #22201f;
			text-align: center;
			vertical-align: middle;
			padding: 0;
	}
	header h1 a img {
			width: 70%;
	}
	header nav {
			width: 100%;
			text-align: inherit;
			position: absolute;
			top: 50px;
			left: 0;
		
	}
	header nav #menu {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 0;
		overflow: hidden;
		background: rgba(0,0,0,0.9);
		transition: all .4s;
	}
	header nav #menu.active {
		height: 436px;
	}

	header nav #menu li {
		display: table;
		width: 100%;
		height: 80px;
		padding-right: 0;
	}
	header nav #menu li:first-child {
		margin-top: 20px;
	}
	header nav #menu li:last-child {
		margin-bottom: 20px;
	}
	header nav #menu li a {
		display: table-cell;
		text-align: center;
		vertical-align: middle;
		width: 100%;
		color: #fff;
	}
	header #headerCart {
			width: 15%;
			display: table;
			position: absolute;
			top: 0;
			right: 0;
	}
	header #headerCart a {
			display: table-cell;
			height: 50px;
			width: 100%;
			padding: 0;
			vertical-align: middle;
	}
	header #headerCart a img {
			width: 37%;
			padding: 0;
	}
	.menuTrigger {
		display: block;
	}
	.menuTrigger,  .menuTrigger span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
	}
	.menuTrigger {
		position: absolute;
		top: 18px;
		right: 19%;
		width: 20px;
		height: 14px;
	}
	.menuTrigger:hover {
		cursor: pointer;
	}
	.menuTrigger span {
		position: absolute;
		left: 0;
		width: 20px;
		height: 2px;
		background-color: #22201f;
		border-radius: 2px;
	}
	.menuTrigger span:nth-of-type(1) {
		top: 0;
	}
	.menuTrigger span:nth-of-type(2) {
		top: 6px;
	}
	.menuTrigger span:nth-of-type(3) {
		bottom: 0;
	}
	.menuTrigger.active span::before {
		content: none;
	}
	.menuTrigger.active span:nth-of-type(1) {
		-webkit-transform: translateY(6px) rotate(-45deg);
		transform: translateY(6px) rotate(-45deg);
	}
	.menuTrigger.active span:nth-of-type(2) {
		opacity: 0;
	}
	.menuTrigger.active span:nth-of-type(3) {
		-webkit-transform: translateY(-6px) rotate(45deg);
		transform: translateY(-6px) rotate(45deg);
	}
}