@charset "utf-8";
.teiki-contents img {
	width: 100%;
	height: auto;
}
.teiki-contents {
	padding: 0 7.7084% 9.2106% 7.9167%;
	font-size: 76%;
}
.teiki-contents > .inner {
	position: relative;
	padding: 3.7038% 2.963% 7.4075%;
	border : 1px solid #404040;
	background: #fff;
}
.teiki-contents sup {
	font-size: 70%;
}
/* .merit */
.teiki-contents .merit {
	overflow: hidden;
	margin-bottom: 4.607%;
	padding: 3.2895% 3.2895% 0;
	background-color: #fff7e5;
}
.teiki-contents .merit h3 {
	margin-bottom: 2.817%;
}
.teiki-contents .merit .desc {
	margin-bottom: 3.0986%;
}
.teiki-contents .merit .block {
	position: relative;
	padding: 25px 40px 0;
	background-color: #fff;
}
.teiki-contents .merit > *:nth-child(3) {
	margin-bottom: 2.817%;
	padding-bottom: 4.9296%;
}
.teiki-contents .merit > *:nth-child(4) {
	margin-bottom: 2.817%;
	padding-bottom: 3.3803%;
}
.teiki-contents .merit > *:nth-child(5) {
	float: left;
	width: auto;
	margin: 0 3.0986% 4.2254% 0;
}
.teiki-contents .merit > *:nth-child(6) {
	float: left;
	width: auto;
	margin-bottom: 4.2254%;
	padding-left: 29px;
}
.teiki-contents .merit h4 .icon {
	position: absolute;
	top: 0;
	left: 0;
	width: 15.493%;
}
.teiki-contents .merit > *:nth-child(5) h4 .icon,
.teiki-contents .merit > *:nth-child(6) h4 .icon {
	position: absolute;
	width: 31.9768%;
}
.teiki-contents .merit .coupon {
	margin-bottom: 1.9048%;
}
.teiki-contents .merit .ex {
	border: 1px solid #ff0068;
}
.teiki-contents .merit .ex .title {
	margin-bottom: 1.594%;
	padding: 2.3886% 0;
	color: #fff;
	font-size: 200%;
	font-weight: bold;
	text-align: center;
	line-height: 100%;
	background-color: #ff0068;
}
.teiki-contents .merit .ex .title span {
	display: inline-block;
	margin-right: 2.23%;
	padding: 1.2739% 2.2293%;
	color: #ff0068;
	font-size: 90%;
	font-weight: bold;
	line-height: 100%;
	background-color: #fff;
}
.teiki-contents .merit .ex > div {
	overflow: hidden;
	padding: 0 2.3886% 3.1848% 1.5924%;
}
.teiki-contents .merit .ex div > div {
	float: left;
}
.teiki-contents .merit .ex .left {
	width: 54.563%;
	margin-right: 2.324%;
}
.teiki-contents .merit .ex .left p:first-child + p {
	padding-left: 1.48842em;
	color: #ff1a6b;
	font-size: 170%;
	font-weight: bold;
	text-align: left;
	text-indent: -1em;
}
.teiki-contents .merit .ex .left p span {
	font-size: 70%;
	font-weight: bold;
}
.teiki-contents .merit .ex .right {
	width: 43.12%;
	padding-top: 2.986%
}
.teiki-contents .merit .ex .right .border {
	position: relative;
	padding: 9.6154% 0 6.9231%;
	border: 2px solid #ff1a6b;
	border-radius: 5px;
	color: #ff1a6b;
	font-size: 141.7%;
	text-align: center;
	background-color: #ffeff4;
}
.teiki-contents .merit .ex .right p:first-child {
	background-color: #fff;
}
.teiki-contents .merit .ex .right p:first-child sup {
	vertical-align: 8px;
}
.teiki-contents .merit .ex .right .border span {
	display: inline-block;
	padding-left: 4.3%;
	color: #000;
	letter-spacing: 0.08em;
}
.teiki-contents .merit .ex .right .border b {
	font-size: 157.143%;
	font-weight: bold;
}
.teiki-contents .merit .ex .right .border img {
	position: absolute;
	top: -16%;
	left: 0;
	width: 100%;
}
.teiki-contents .merit .ex .right p:nth-child(3) {
	margin-bottom: 10.3847%;
}
.teiki-contents .merit .ex .right p:nth-child(4) {
	margin-bottom: 5%;
	border-width: 4px;
}
.teiki-contents .merit .ex .right p:last-child {
	padding: 7.31% 0 0 0;
	color: #ff1a6b;
	font-size: 141.7%;
	text-align: center;
	line-height: 100%;
	letter-spacing: 0.04em;
}
.teiki-contents .merit .ex .right p:last-child span {
	display: block;
	padding-left: 0;
	font-size: 135.715%;
	font-weight: bold;
	line-height: 200%;
}
.teiki-contents .merit .ex .right p:last-child b {
	font-size: 168.4204%;
}
.teiki-contents .merit .notes {
	margin-right: -12px;
	font-size: 140%;
	text-align: right;
}
/*
* .point
*/
.teiki-contents .point {
	margin: 0 3.29% 6.58%;
	padding: 3.29%;
	border: 5px solid #ffd2de;
}
.teiki-contents .point ul {
	padding: 6.799% 0 0 24.616%;
	list-style: none;
	background: url(/cms/onlineshop/hc/shared/img/subscription/teiki_point_icon.gif) no-repeat 0 0;
}
.teiki-contents .point li {
	margin-bottom: 3.5715%;
	padding-left: 1em;
	font-size: 161.943%;
	text-indent: -1em;
	line-height: 150%;
}
.teiki-contents .point li:before {
	content: "●";
}
.teiki-contents .point li span {
	display: block;
	font-size: 87.5%;
	text-indent: inherit;
}
/*
* .order
*/
.teiki-contents .order {
	margin: 0 7.237% 10.923%;
}
.teiki-contents .order h3 {
	margin-bottom: 4.154%;
}
/*
* .teiki-caution
*/
.teiki-contents .teiki-caution {
	position: relative;
	margin: 0 3.29% 6.58%;
	padding: 5.6579% 3.29% 3.29%;
	border: 5px solid #ffd2de;
}
.teiki-contents .teiki-caution:before {
	display: block;
	position: absolute;
	top: -18%;
	left: 0;
	z-index: 2;
	width: 100%;
	padding-top: 12%;
	background: url(/cms/onlineshop/hc/shared/img/subscription/teiki_caution_icon.png) no-repeat 0 0;
	background-size: 100%  auto;
	content: "";
}
.teiki-contents .teiki-caution p {
	font-size: 160%;
	line-height: 150%;
	text-align: center;
}
.teiki-contents .teiki-caution p:first-child {
	margin-bottom: 3.694%;
}
.teiki-contents .teiki-caution p:last-child {
	margin: 0 16.77%;
}
/*
* .teiki-products
*/
.teiki-contents .teiki-products {
	margin-bottom: 10.5264%;
}
.teiki-contents .teiki-products h3 {
	margin-bottom: 3.9474%;
}
.teiki-contents .teiki-products .inner {
	position: relative;
	padding: 3px;
	border: 2px solid #000;
	box-sizing: border-box;
}
.teiki-contents .teiki-products .inner:before,
.teiki-contents .teiki-products .inner:after {
	position: absolute;
	z-index: 0;
	width: 15.874%;
	padding-top: 15.874%;
	background-repeat: no-repeat;
	background-color: #ccc;
	content: "";
}
.teiki-contents .teiki-products .inner:before {
	top: 0;
	left: 0;
	background-image: url(/cms/onlineshop/hc/shared/img/subscription/teiki_products_before.png);
}
.teiki-contents .teiki-products .inner:after {
	bottom: 0;
	right: 0;
	background-image: url(/cms/onlineshop/hc/shared/img/subscription/teiki_products_after.png);
}
.teiki-contents .teiki-products .inner2 {
	position: relative;
	z-index: 1;
	padding: 4.6667% 2.4% 2.6667%;
	overflow: hidden;
	border: 1px solid #000;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset;
	box-sizing: border-box;
}
.teiki-contents .teiki-products .block {
	overflow: hidden;
}
.teiki-contents .teiki-products .block:first-child {
	margin-bottom: 3.513%;
}
.teiki-contents .teiki-products .left {
	float: left;
	width: 30.197%;
	margin-right: 5.62%;
	padding-left: 3.794%;
}
.teiki-contents .teiki-products .left p:first-child {
	margin-bottom: 16.2791%;
}
.teiki-contents .teiki-products .left li {
	display: inline-block;
	margin-right: 6.0466%;
	font-size: 131.579%;
}
.teiki-contents .teiki-products .left li:before {
	margin-right: 2px;
	content: "●";
}
.teiki-products .right {
	float: left;
	width: 56.18%;
	padding-right: 4.214%;
}
.teiki-products .right h4 {
	margin-bottom: 4.5%;
	padding-bottom: 4.96%;
	border-bottom: 1px solid #000;
	font-size: 283.401%;
	font-weight: bold;
	line-height: 100%;
	letter-spacing: 0.03em;
}
.teiki-products .right h4 span {
	display: block;
	font-size: 70%;
}
.teiki-products .right h4 + p {
	margin-bottom: 8.25%;
	font-size: 141.7%;
	line-height: 171.4286%;
}
.teiki-products .right .price {
	margin-bottom: 3.25%;
	font-size: 321.4286%;
	line-height: 100%;
}
.teiki-products .right .price span {
	font-size: 50%;
}
.teiki-products .right .btn {
	margin-bottom: 2.5%;
}
.teiki-products .right .btn + p {
	font-size: 121.457%;
}
.teiki-products a {
	color: #000;
	text-decoration: underline;
}
.teiki-products .right .btn + p a:hover{
	opacity: 0.6;
}
.teiki-products .benefits {
	margin-bottom: 3.5113%;
	padding: 2.81% 4.354% 4.215%;
	background-color: #fffae5;
}
.teiki-products .benefits h4 {
	margin-bottom: 3.068%;
}
.teiki-products .benefits .desc div:first-child {
	display: table;
	margin: 0 auto 3.068%;
}
.teiki-products .benefits .desc .inline > * {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	border-right: 10px solid #fffae5;
}
.teiki-products .benefits .desc .inline p:first-child {
	position: relative;
	width: 42%;
	border: 2px solid #ff1a6b;
	color: #ff1a6b;
	font-size: 161.943%;
	font-weight: bold;
	border-radius: 5px;
	background-color: #fff;
}
.teiki-products .benefits .desc .inline p:first-child span {
	display: block;
	color: #000;
	font-weight: bold;
	letter-spacing: 0.08em;
}
.teiki-products .benefits .desc .inline p:first-child span b {
	font-size: 150%;
}
.teiki-products .benefits .desc .inline p:first-child img {
	position: absolute;
	top: -13%;
	left: 0;
	width: 100%;
}
.teiki-products .benefits .desc .inline p:first-child + p {
	border-left: 10px solid #fffae5;
}
.teiki-products .benefits .desc .inline + p {
	margin-bottom: 3.068%;
	color: #ff1a6b;
	font-size: 161.943%;
	font-weight: bold;
	text-align: center;
	letter-spacing: 0.08em;
}
.teiki-products .benefits .desc .inline + p span {
	font-size: 70%;
}
.teiki-products .benefits .coupon {
	position: relative;
}
.teiki-products .benefits .coupon .plus {
	display: inline-block;
	position: absolute;
	top: 11%;
	right: 2%;
	padding: 3.077% 4% 2.3077%;
	/*padding: 3.077% 3.88% 2.3077%;*/
	border: 2px solid #ff1a6b;
	border-radius: 5px;
	color: #000;
	font-size: 141.7%;
	font-weight: bold;
	line-height: 165%;
	text-align: center;
	background-color: #fff;
	box-sizing: border-box;
}
.teiki-products .benefits .coupon .plus b {
	display: block;
	font-size: 171.429%;
}
.teiki-contents .teiki-products .block.btn {
	margin: 0 4.354%;
}
.teiki-contents .teiki-products .block.btn p:first-child {
	margin-bottom: 1.8259%;
}
.teiki-contents .teiki-products .block.btn p:last-child {
	font-size: 121.458%;
	text-align: center;
}
/*
* .order-flow
*/
.order-flow {
	margin-bottom: 6.579%;
	padding: 4.6053% 3.2895%;
	background-color: #f4f1f1;
}
.order-flow h3 {
	margin-bottom: 5.9211%;
}
.order-flow li {
	position: relative;
	padding: 0 9.155% 15.493%;
	background-color: #fff;
}
.order-flow li:after {
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding-top: 9.8592%;
	background: url(/cms/onlineshop/hc/shared/img/subscription/order_flow_arrow.png) no-repeat 50% 0;
	content: "";
}
.order-flow li:last-child {
	padding-bottom: 5.6339%;
}
.order-flow li:last-child:after {
	content: none;
}
.order-flow h4 {
	margin-bottom: 4.3104%;
	border-bottom: 1px solid #000;
}
.order-flow .icon {
	position: absolute;
	top: 0;
	left: 0;
	width: 14.3662%;
}
.order-flow li p {
	font-size: 161.943%;
	line-height: 175%;
}
/*
* .read-caution
*/
.read-caution {
	margin-bottom: 8.5527%;
}



/*
* RJ
*/
#rj_lp .teiki-contents {
	background-color: #f1f1f1;
}
#rj_lp .teiki-contents .teiki-products .inner:before,
#rj_lp .teiki-contents .teiki-products .inner:after {
	background-color: #fee2cd;
}
#rj_lp  .teiki-products .right h4 {
	color: #ed7d2b;
}
/*
* collagen
*/
#collagen .teiki-contents > .inner {
	border : 1px solid #fff;
}
#collagen .teiki-contents {
	background-color: #620947;
}
#collagen .teiki-contents .teiki-products .inner:before,
#collagen .teiki-contents .teiki-products .inner:after {
	background-color: #ffdedc;
}
#collagen  .teiki-products .right h4 {
	color: #df0077;
}

@media screen and (max-width: 767px) {
 .teiki-contents {
  width: 84%;
 }
 .teiki-contents .inner,
 .teiki-contents .merit .ex{
  font-size: 70%;
 }
 .teiki-contents .inner #order-flow h4 .icon{
  width: 15% !important;
 }
 .teiki-contents .merit .block {
	padding: 4%;
}
.teiki-contents .merit .ex .right p:first-child sup {
	vertical-align: middle;
}
.teiki-contents .merit .ex .right p:nth-child(4) {
	border-width: 2px;
}
 .teiki-contents .inner .merit .block p img{
   width: 100%;
  }
 .teiki-contents .merit > *:nth-child(5),
 .teiki-contents .merit > *:nth-child(6) {
	width: 40%;
}
 .teiki-contents .merit > *:nth-child(3) .icon,
 .teiki-contents .merit > *:nth-child(4) .icon {
	width: 15% !important;
}
 .teiki-contents .merit > *:nth-child(5) .icon,
 .teiki-contents .merit > *:nth-child(6) .icon {
	width: 30% !important;
}
 .teiki-contents .point ul{
  background-size: 20% auto;
  }
 .teiki-contents .teiki-products .inner:before,
 .teiki-contents .teiki-products .inner:after,
 .order-flow li:after{
	background-size: 100% auto;
}
.teiki-products a {
  display: inline-block !important;
	color: #000;
	text-decoration: underline;
}
 .teiki-products .benefits .desc .inline p:first-child,
 .teiki-products .benefits .coupon .plus{
  font-size:95%;
  line-height: 1.2;
  }

}