@charset "UTF-8";
/*======== MIXIN ==========*/
/* Media Query */
/* Fonts */
@font-face {
  font-family: 'NeoSansWeleda-Md_0';
  src: url("/html/template/default/assets/fonts/NeoSansWeleda-Md_0.eot");
  /* IE9 Compat Modes */
  src: url("/html/template/default/assets/fonts/NeoSansWeleda-Md_0.eot?#iefix") format("embedded-opentype"), url("/html/template/default/assets/fonts/NeoSansWeleda-Md_0.woff") format("woff"), url("/html/template/default/assets/fonts/NeoSansWeleda-Md_0.ttf") format("truetype");
  /* Safari, Android, iOS */
}

@font-face {
  font-family: 'NEWWELED';
  src: url("/html/template/default/assets/fonts/NEWWELED.eot");
  /* IE9 Compat Modes */
  src: url("/html/template/default/assets/fonts/NEWWELED.eot?#iefix") format("embedded-opentype"), url("/html/template/default/assets/fonts/NEWWELED.woff") format("woff"), url("/html/template/default/assets/fonts/NEWWELED.ttf") format("truetype");
  /* Safari, Android, iOS */
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 100;
  src: url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Thin.woff2") format("woff2"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Thin.woff") format("woff"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Thin.ttf") format("truetype"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Thin.eot") format("embedded-opentype");
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 200;
  src: url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Light.woff2") format("woff2"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Light.woff") format("woff"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Light.ttf") format("truetype"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Light.eot") format("embedded-opentype");
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 300;
  src: url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-DemiLight.woff2") format("woff2"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-DemiLight.woff") format("woff"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-DemiLight.ttf") format("truetype"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-DemiLight.eot") format("embedded-opentype");
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 400;
  src: url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Regular.woff2") format("woff2"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Regular.woff") format("woff"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Regular.ttf") format("truetype"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Regular.eot") format("embedded-opentype");
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 500;
  src: url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Medium.woff2") format("woff2"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Medium.woff") format("woff"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Medium.ttf") format("truetype"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Medium.eot") format("embedded-opentype");
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 700;
  src: url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Bold.woff2") format("woff2"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Bold.woff") format("woff"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Bold.ttf") format("truetype"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Bold.eot") format("embedded-opentype");
}

@font-face {
  font-family: 'Noto Sans Japanese';
  font-style: normal;
  font-weight: 900;
  src: url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Black.woff2") format("woff2"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Black.woff") format("woff"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Black.ttf") format("truetype"), url("/html/template/default/assets/fonts/NotoSansCJKjp/NotoSansCJKjp-Black.eot") format("embedded-opentype");
}

@font-face {
  font-family: 'newweledaregular';
  src: url("/html/user_data/assets/font/newweled-webfont.eot");
  src: url("/html/user_data/assets/font/newweled-webfont.eot?#iefix") format("embedded-opentype"), url("/html/user_data/assets/font/newweled-webfont.woff2") format("woff2"), url("/html/user_data/assets/font/newweled-webfont.woff") format("woff"), url("/html/user_data/assets/font/newweled-webfont.ttf") format("truetype"), url("/html/user_data/assets/font/newweled-webfont.svg#newweledaregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Neo Sans Weleda';
  src: url("/html/user_data/assets/font/neosansweledamd0.otf") format("opentype"), url("/html/user_data/assets/font/neosansweledamd0.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Neo Sans Weleda';
  src: url("/html/user_data/assets/font/neosansweledabd.otf") format("opentype"), url("/html/user_data/assets/font/neosansweledabd.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'Neo Sans Weleda';
  src: url("/html/user_data/assets/font/neosansweledarg0.otf") format("opentype"), url("/html/user_data/assets/font/neosansweledarg0.ttf") format("truetype");
  font-weight: lighter;
  font-style: normal;
}

/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

*:focus {
  outline: none;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

/* =================================== */
/* COLOR                              */
/* =================================== */
.linkcolor {
  color: #7dae12 !important;
}

.redcolor {
  color: red;
}

/*------------------------------------*/
/* =================================== */
/* COLOR                              */
/* =================================== */
.linkcolor {
  color: #7dae12 !important;
}

.redcolor {
  color: red;
}

/*------------------------------------*/
/*------------------------------------------------------------
	書式設定
------------------------------------------------------------*/
/* テキストの位置 */
.taLeft {
  text-align: left !important;
}

.taCenter {
  text-align: center !important;
}

.taRight {
  text-align: right !important;
}

/* フォントの太さ */
.fwNormal {
  font-weight: normal !important;
}

.fwBold {
  font-weight: bold !important;
}

/*------------------------------------------------------------
	汎用スタイル
------------------------------------------------------------*/
* html .clearfix {
  zoom: 1;
}

* + html .clearfix {
  zoom: 1;
}

.clearfix:after {
  height: 0;
  visibility: hidden;
  content: ".";
  display: block;
  clear: both;
}

/*------------------------------------------------------------
	comBox
------------------------------------------------------------*/
.comBox {
  width: 1000px;
  margin: 0 auto;
}

@media all and (max-width: 767px) {
  .comBox {
    width: auto !important;
  }
}

/*------------------------------------------------------------
	comShop
------------------------------------------------------------*/
.comShop {
  width: 1000px;
  margin: -38px auto 0;
  display: flex;
  flex-wrap: wrap;
}

.comShop .item {
  margin-top: 38px;
  width: 200px;
  position: relative;
  box-sizing: border-box;
}

.comShop .item:before {
  width: 1px;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 8px;
  background: url(../img/common/line01.png) repeat-y right top;
  background-size: 1px 10px;
  content: "";
}

.comShop .item.borderNo:before {
  display: none;
}

.comShop .item.borderYes:after {
  width: 1px;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 8px;
  background: url(../img/common/line01.png) repeat-y left top;
  background-size: 1px 10px;
  content: "";
}

.comShop .item .photo {
  text-align: center;
  height: 150px;
}

.comShop .item .photo a {
  display: block;
  padding: 2px 38px 10px;
}

.comShop .item .photo img {
  max-width: 100%;
  height: auto;
}

.comShop .txtItem {
  padding: 0 20px;
}

.comShop .txtItem a:hover p {
  opacity: .7;
}

.comShop .item .ttl {
  text-align: center;
  font-size: 1.2rem;
  line-height: 1.39;
  letter-spacing: -0.8px;
  height: 55px;
}

.comShop .tag {
  margin: 0 -15px 4px;
  text-align: center;
  height: 50px;
  border-top: solid 1px #FFF;
}

.comShop .tag span {
  width: 100%;
  padding: 2px 8px;
  margin: 2px 1px;
  display: block;
  line-height: normal;
  font-size: 1.1rem;
  text-align: center;
  color: #7dae12;
  box-sizing: border-box;
  border: 1px solid #7dae12;
}

.comShop .starArea {
  text-align: center;
  height: 2rem;
  margin-bottom: 8px;
}

.comShop .star {
  margin-bottom: 5px;
}

.comShop .star img {
  width: 14px;
  margin-top: -2px;
  display: inline-block;
  vertical-align: middle;
}

.comShop .item .selectBox select {
  width: 100% !important;
}

.comShop .priceUl {
  margin-bottom: 8px;
  height: 60px;
}

.comShop .priceUl li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  line-height: 1.4;
}

.comShop .priceUl p {
  font-size: 1.2rem;
}

.comShop .priceUl .txtL {
  width: 3rem;
}

.comShop .priceUl .txtR {
  width: 100%;
  text-align: center;
  white-space: nowrap;
}

.comShop .priceUl .green {
  color: #7dae12;
}

.comShop .priceUl .size01 {
  font-size: 1.6rem;
}

.comShop .priceUl .size02 {
  font-size: 1.1rem;
}

.comShop .priceUl .size03 {
  font-size: 0.9rem;
}

.comShop .selectKikaku {
  height: 50px;
  margin-bottom: 10px;
}

.comShop .selectKikaku ul {
  display: flex;
}

.comShop .selectKikaku ul li {
  border: solid 1px #bdbdbd;
  background: #F4F5F8;
  padding: 10px;
  font-size: 11px;
  margin-right: 1px;
  position: relative;
  width: 100%;
  text-align: center;
}

.comShop .selectKikaku ul li.on {
  border: solid 1px #7dae12;
}

.comShop .selectKikaku ul li.on:before {
  width: 20px;
  height: 20px;
  position: absolute;
  right: -10px;
  top: -10px;
  background: url(../img/product_defalt/icon02.png) no-repeat;
  background-size: 20px 20px;
  content: "";
  z-index: 1;
}

.comShop .link a {
  padding: 3px 5px;
  display: block;
  text-align: center;
  color: #fff;
  background-color: #7dae12;
  border-radius: 3px;
}

.comShop .link span {
  padding: 1rem 2rem;
  display: block;
  text-align: center;
  color: #fff;
  border: solid 1px #bdbdbd;
  background-color: #bdbdbd;
  border-radius: .25rem;
  line-height: 100%;
}

.comShop a:hover {
  opacity: 0.7;
}

@media all and (max-width: 767px) {
  .comShop {
    width: auto;
  }
  .comShop .item {
    width: 166px;
  }
  .comShop .slick-slide > div {
    width: 166px;
  }
  .comShop .item:before {
    background-size: 1px 6px;
  }
  .comShop .item.borderNo:before {
    display: block;
  }
  .comShop .item:before {
    background-size: 1px 6px;
  }
  .comShop .item.borderYes:after {
    display: none;
    background-size: 1px 6px;
  }
  .comShop .item .photo a {
    padding: 3px 32px 8px;
  }
  .comShop .txtItem {
    padding: 0 33px;
  }
  .comShop .item .ttl {
    margin-bottom: 2px;
  }
  .comShop .tag span {
    font-size: 0.92rem;
    width: calc(100% - 20px);
    margin: 2px auto;
  }
  .comShop .star {
    margin-bottom: 4px;
    font-size: 1.16rem;
  }
  .comShop .star img {
    width: 12px;
    margin-top: -3px;
  }
  .comShop .priceUl {
    text-align: center;
    margin-bottom: 7px;
    height: 44px;
  }
  .comShop .priceUl p {
    font-size: 1rem;
  }
  .comShop .priceUl .txtL {
    width: 50px;
  }
  .comShop .priceUl .txtR {
    margin: auto;
  }
  .comShop .priceUl .size02 {
    font-size: 0.92rem;
  }
  .comShop .priceUl .size03 {
    font-size: 0.75rem;
  }
  .comShop .ml {
    margin: -2px -6px 9px 0;
  }
  .comShop .ml span {
    margin: 2px 2px 0 0;
    min-width: 42px;
    padding: 4px 2px;
    display: inline-block;
    box-sizing: border-box;
    text-align: center;
    font-size: 0.9rem;
    background-color: #f7f7f7;
    border: 1px solid #bdbdbd;
  }
}

/*------------------------------------------------------------
	comCheck
------------------------------------------------------------*/
.comCheck {
  width: 1000px;
  margin: 0 auto;
}

.comCheck h2 {
  margin: 0 33px 2rem;
  padding: 2px 0 1px 10px;
  line-height: 1;
  border-left: 5px solid #7dae12;
  font-size: 18px;
}

.comCheck .comShop .txtItem {
  display: none;
}

.comCheck .comShop .item.borderNo:before {
  display: block;
}

.comCheck .comShop .item .photo a {
  padding-bottom: 33px;
}

@media all and (max-width: 767px) {
  .comCheck {
    width: auto;
  }
  .comCheck .comShop .txtItem {
    display: block;
  }
  .comCheck .comShop .item .photo a {
    padding-bottom: 8px;
  }
}

/*------------------------------------------------------------
	comProduct
------------------------------------------------------------*/
.comProduct {
  width: 1000px;
  margin: 0 auto;
}

.comProduct h2 {
  margin: 0 33px 36px;
  padding: 2px 0 1px 10px;
  line-height: 1;
  border-left: 5px solid #7dae12;
  font-size: 18px;
}

@media all and (max-width: 767px) {
  .comProduct {
    width: auto;
  }
  .comProduct h2 {
    margin: 0 14px 14px;
    padding: 0 0 1px 6px;
    border-left: 3px solid #7dae12;
  }
}

/*------------------------------------------------------------
	headLine01
------------------------------------------------------------*/
.headLine01 {
  margin-bottom: 13px;
  text-align: center;
  font-size: 3.6rem !important;
  font-family: "NEWWELED";
  font-weight: normal;
  color: #58595B;
}

@media all and (max-width: 767px) {
  .headLine01 {
    margin-bottom: 8px;
    font-size: 2.5rem;
  }
}

/*------------------------------------------------------------
	comMore
------------------------------------------------------------*/
.comMore a {
  width: auto;
  margin: 0 auto;
  margin-top: 20px;
  max-width: 340px;
  padding: 10px 5px 9px;
  font-size: 1.6rem;
  font-weight: bold;
  display: block;
  text-align: center;
  background: url(../img/common/icon11.png) no-repeat right 115px center;
  background-size: 6px auto;
  background-color: #fff;
  font-family: "NeoSansWeleda-Md_0";
  letter-spacing: 2px;
}

.comMore a:hover {
  opacity: 0.7;
}

/*------------------------------------------------------------
	comNews
------------------------------------------------------------*/
.comNews {
  margin-bottom: 75px;
}

.comNews .mt-h2 {
  margin-top: 57px;
}

.comNews .headLine01 {
  margin-bottom: 31px;
}

.comNews .tabs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.comNews .tabs ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.comNews .tabs li {
  margin-bottom: 0;
  margin-right: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.comNews .tabs li a {
  color: #7ca325;
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  border: 1px solid transparent;
  border-bottom: none;
  -webkit-border-radius: 6px 6px 0 0;
  -moz-border-radius: 6px 6px 0 0;
  -ms-border-radius: 6px 6px 0 0;
  -o-border-radius: 6px 6px 0 0;
  border-radius: 6px 6px 0 0;
  text-decoration: none;
  padding: 10px;
  line-height: 1;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.comNews .tabs li.current a {
  border-color: #e6f8ca;
  background-color: #f8fbf3;
}

@media all and (max-width: 767px) {
  .comNews .tabs ul {
    flex-wrap: wrap;
  }
  .comNews .tabs li {
    margin-bottom: 0;
    margin-right: 5px;
  }
  .comNews .tabs li a {
    font-size: 14px;
    white-space: nowrap;
    padding: 10px 8px;
  }
}

@media all and (max-width: 320px) {
  .comNews .tabs {
    margin: 0 -20px;
  }
  .comNews .tabs li a {
    padding: 10px 5px;
  }
}

.comNews .inner {
  width: 992px;
  margin: 0 auto;
}

.news-list > li {
  padding: 34px 0;
  border-bottom: 1px solid #e4e4e4;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

.news-list > li .date {
  width: 96px;
  margin-right: 32px;
}

.news-list > li .right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  box-lines: multiple;
  -ms-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}

.news-list > li .right > * {
  margin-right: 20px;
  margin-bottom: 5px;
}

.news-list > li .right > *:last-child {
  margin-right: 0;
}

.news-list > li .title a,
.comNews .toList a {
  color: #7dae12;
  text-decoration: underline;
}

.news-list > li .tag {
  letter-spacing: -0.4em;
  margin-bottom: -5px;
}

@media all and (max-width: 767px) {
  .news-list > li .right {
    display: block;
  }
  .news-list li .tag {
    margin-left: 0;
    margin-top: 10px;
  }
}

.news-list li .tag li {
  display: -moz-inline-box;
  display: inline-block;
  vertical-align: top;
  letter-spacing: normal;
  line-height: 1;
  margin-right: 10px;
  padding: 7px;
  background-color: #f8fbf3;
  border: 1px solid #e6f8ca;
  color: #7ca325;
  font-size: 13px;
  font-weight: bold;
  -webkit-border-radius: 6px 6px 6px 6px;
  -moz-border-radius: 6px 6px 6px 6px;
  -ms-border-radius: 6px 6px 6px 6px;
  -o-border-radius: 6px 6px 6px 6px;
  border-radius: 6px 6px 6px 6px;
}

.news-list li .tag li a {
  color: #7ca325 !important;
  text-decoration: none;
}

.comNews .toList {
  text-align: right;
  margin-top: 1rem;
}

@media all and (max-width: 767px) {
  .comNews {
    padding: 25px 25px 42px;
  }
  .comNews .inner {
    width: auto;
  }
  .news-list > li {
    display: block;
  }
}

/*------------------------------------------------------------
	comSns
------------------------------------------------------------*/
.comSns {
  margin-bottom: 75px;
}

.comSns .headLine01 {
  margin-bottom: 31px;
}

.comSns ul {
  width: 992px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
}

.comSns ul li {
  width: 224px;
  margin-right: 32px;
}

.comSns ul li:last-child {
  margin-right: 0;
}

.comSns ul img {
  width: 100%;
}

.comSns ul a:hover {
  opacity: 0.7;
}

@media all and (max-width: 767px) {
  .comSns {
    margin-bottom: 50px;
  }
  .comSns .headLine01 {
    margin-bottom: 28px;
  }
  .comSns ul {
    width: auto;
    margin: -39px 13px 0;
    justify-content: center;
  }
  .comSns ul li {
    width: 30%;
    margin: 39px 5% 10% 10%;
  }
  .comSns ul li:nth-child(3n) {
    margin-right: 0;
  }
}

/*------------------------------------------------------------
	comStepUl
------------------------------------------------------------*/
#main .comStep {
  margin-bottom: 90px;
  text-align: center;
}

#main .comStep ul {
  font-size: 0;
  display: inline-block;
  text-align: center;
  position: relative;
}

#main .comStep ul:before {
  height: 1px;
  position: absolute;
  background-color: #67b93e;
  left: 0;
  right: 0;
  top: 50%;
  content: "";
}

#main .comStep li {
  padding-top: 8px;
  width: 45px;
  height: 45px;
  display: inline-block;
  color: #7dae12;
  font-size: 1.9rem;
  box-sizing: border-box;
  position: relative;
  background-color: #fff;
  border: 1px solid #7dae12;
  border-radius: 100%;
}

#main .comStep li:not(:last-child) {
  margin-right: 86px;
}

#main .comStep li span {
  width: 130px;
  display: block;
  color: #7f7f7f !important;
  font-size: 1.4rem;
  position: absolute;
  left: 50%;
  top: 123%;
  transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
}

#main .comStep li.on {
  color: #fff;
  background-color: #7dae12;
}

@media all and (max-width: 767px) {
  #main .comStep {
    display: none;
  }
}

/*------------------------------------------------------------
	comCategory
------------------------------------------------------------*/
.comCategory {
  width: 212px;
  box-sizing: border-box;
  position: relative;
}

.comCategory .ttl {
  padding: 17px 30px 18px 22px;
  font-size: 1.5rem;
  font-weight: bold;
  background: url(../img/common/icon14.png) no-repeat right 12px center;
  background-size: 17px 17px;
  cursor: pointer;
  border-bottom: 1px solid #7f7f7f;
}

.comCategory .ttl.on {
  background-image: url(../img/common/icon15.png);
}

.comCategory .cateUl {
  display: none;
  position: absolute;
  left: -1px;
  right: -1px;
  top: 100%;
  z-index: 100;
  background-color: #fff;
}

.comCategory .cateUl > li {
  position: relative;
  border: 1px solid #7f7f7f;
  border-top: none;
}

.comCategory .cateUl > li > a {
  padding: 13px 30px 10px 22px;
  display: block;
  font-size: 1.5rem;
  background: url(../img/common/icon14.png) no-repeat right 12px center;
  background-size: 17px 17px;
}

.comCategory .cateUl > li.on > a {
  color: #fff;
  background-color: #7dae12;
  background-image: url(../img/common/icon15.png);
}

.comCategory .checkBox {
  display: none;
  width: 176px;
  padding: 18px 10px 14px 20px;
  position: absolute;
  left: 100%;
  top: -1px;
  box-sizing: border-box;
  border: 1px solid #7f7f7f;
  background-color: #fff;
}

.comCategory .checkBox .checkUl li {
  font-size: 1.5rem;
  margin-bottom: 12px;
}

.comCategory .checkBox .checkUl li:last-child {
  margin-bottom: 0;
}

.comCategory .checkBox .checkUl input[type="checkbox"] {
  display: none;
}

.comCategory .checkBox .checkUl input[type="checkbox"] + label {
  padding-left: 33px;
  background: url(../img/common/icon16.png) no-repeat left top 2px;
  background-size: 17px 17px;
  display: inline-block;
}

.comCategory .checkBox .checkUl input[type="checkbox"]:checked + label {
  background-image: url(../img/common/icon17.png);
}

.comCategory .checkLink {
  margin-top: 15px;
}

.comCategory .checkLink a {
  padding: 6px 5px 7px;
  display: block;
  color: #fff;
  text-align: center;
  font-size: 1.36rem;
  border-radius: 3px;
  background-color: #7dae12;
}

.comCategory .checkLink a:hover {
  opacity: 0.7;
}

@media all and (max-width: 767px) {
  .comCategory {
    width: auto;
    margin: 0 25px;
  }
  .comCategory .ttl {
    padding: 10px 30px 11px 17px;
    font-size: 1.58rem;
    background-position: right 10px center;
  }
  .comCategory .cateUl > li {
    position: static;
  }
  .comCategory .cateUl > li > a {
    padding: 11px 30px 10px 33px;
    font-size: 1.58rem;
    background-position: right 10px center;
  }
  .comCategory .cateUl > li.on > a {
    color: #7f7f7f;
    background-color: transparent;
  }
  .comCategory .checkBox {
    width: auto;
    padding: 12px 51px 27px;
    position: static;
    left: inherit;
    top: inherit;
    border: none;
    border-top: 1px solid #7f7f7f;
  }
  .comCategory .checkBox .checkUl li {
    font-size: 1.58rem;
    margin-bottom: 9px;
  }
  .comCategory .checkBox .checkUl input[type="checkbox"] + label {
    padding-left: 32px;
    background-position: left top 4px;
  }
  .comCategory .checkLink {
    margin: 22px -26px 0;
  }
  .comCategory .checkLink a {
    padding: 7px 5px 6px;
  }
}

/*------------------------------------------------------------
	wp-pagenavi
------------------------------------------------------------*/
.wp-pagenavi {
  margin: 80px 0 59px;
  clear: both;
  text-align: center;
}

.wp-pagenavi a,
.wp-pagenavi span {
  min-width: 44px;
  display: inline-block;
  border: 1px solid #bdbdbd;
  padding: 9px 2px 8px;
  margin: 0 3px;
  font-size: 1.6rem;
  text-align: center;
  box-sizing: border-box;
  color: #bdbdbd;
}

.wp-pagenavi a:hover,
.wp-pagenavi span.current {
  border-color: #7dae12;
  background-color: #7dae12;
  color: #fff;
}

.wp-pagenavi .first,
.wp-pagenavi .last,
.wp-pagenavi .pages,
.wp-pagenavi .extend,
.wp-pagenavi .previouspostslink,
.wp-pagenavi .nextpostslink {
  display: none;
}

@media all and (-ms-high-contrast: none) {
  .comShop .link a,
  .comShop .link span {
    padding: 4px 5px 2px;
  }
  #main .comStep li {
    padding-top: 10px;
  }
  .comCategory .ttl {
    padding-top: 18px;
    padding-bottom: 17px;
  }
  .comCategory .checkBox .checkUl input[type="checkbox"] + label {
    background-position: left top;
  }
  .wp-pagenavi a,
  .wp-pagenavi span {
    padding-top: 11px;
    padding-bottom: 6px;
  }
}

/* =================================== */
/* COLOR                              */
/* =================================== */
.linkcolor {
  color: #7dae12 !important;
}

.redcolor {
  color: red;
}

/*------------------------------------*/
/*------------------------------------------------------------
	デフォルトスタイル
------------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  outline: 0;
  font-size: 1em;
}

html {
  font-size: 62.5%;
}

@font-face {
  font-family: 'NeoSansWeleda-Md_0';
  src: url("/html/template/default/assets/fonts/NeoSansWeleda-Md_0.eot");
  /* IE9 Compat Modes */
  src: url("/html/template/default/assets/fonts/NeoSansWeleda-Md_0.eot?#iefix") format("embedded-opentype"), url("/html/template/default/assets/fonts/NeoSansWeleda-Md_0.woff") format("woff"), url("/html/template/default/assets/fonts/NeoSansWeleda-Md_0.ttf") format("truetype");
  /* Safari, Android, iOS */
}

@font-face {
  font-family: 'NEWWELED';
  src: url("/html/template/default/assets/fonts/NEWWELED.eot");
  /* IE9 Compat Modes */
  src: url("/html/template/default/assets/fonts/NEWWELED.eot?#iefix") format("embedded-opentype"), url("/html/template/default/assets/fonts/NEWWELED.woff") format("woff"), url("/html/template/default/assets/fonts/NEWWELED.ttf") format("truetype");
  /* Safari, Android, iOS */
}

body, table, input, textarea, select, option {
  font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  display: block;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

:focus {
  outline: 0;
}

ins {
  text-decoration: none;
}

del {
  text-decoration: line-through;
}

img {
  vertical-align: top;
  max-width: 100%;
}

a,
a:link {
  color: #7f7f7f;
  text-decoration: none;
}

a:visited {
  color: #7f7f7f;
}

a:hover {
  color: #7f7f7f;
}

a:active {
  color: #7f7f7f;
}

/*------------------------------------------------------------
	レイアウト
------------------------------------------------------------*/
body {
  min-width: 1100px;
  color: #7f7f7f;
  font-size: 1.4rem;
  line-height: 1.5;
  text-size-adjust: none;
  -webkit-text-size-adjust: none;
  background-color: #FFF;
}

body.fixed {
  position: fixed;
  width: 100%;
  height: 100%;
}

#container {
  text-align: left;
}

h1.header-obi {
  padding: 7px 5px 6px;
  text-align: center;
  color: #fff;
  font-size: 1.8rem;
  background-color: #7dae12;
}

#main {
  padding-top: 24px;
}

a[href^="tel:"] {
  cursor: default;
  pointer-events: none;
}

a,
a img {
  opacity: 1;
  transition: opacity .5s;
}

a:hover img {
  opacity: .7;
}

@media all and (min-width: 768px) {
  .sp {
    display: none !important;
  }
}

@media all and (max-width: 767px) {
  body {
    min-width: inherit;
    font-size: 1.2rem;
  }
  a:hover,
  a:hover img {
    opacity: 1 !important;
  }
  .pc {
    display: none !important;
  }
  a[href^="tel:"] {
    cursor: pointer;
    pointer-events: auto;
  }
  h1 {
    padding: 12px 5px;
    font-size: 1.45rem;
  }
  #main {
    padding-top: 8px;
  }
}

/*------------------------------------------------------------
	ヘッダー
------------------------------------------------------------*/
#gHeader {
  padding: 19px 0 15px;
  background-color: #fff;
  box-sizing: border-box;
}

.headHidden {
  display: none;
  height: 63px;
}

#gHeader.fixed {
  width: 100%;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 600;
  background-color: #fff;
}

#gHeader .hBox {
  width: 971px;
  margin: 0 auto;
  position: relative;
}

#gHeader .logo {
  width: 119px;
  float: left;
}

#gHeader .hLink {
  display: flex;
  position: absolute;
  right: 0;
  top: 3px;
}

#gHeader .hLink li {
  margin-left: 20px;
}

#gHeader .hLink li input[type="search"] {
  border: solid 1px #666;
  width: 12rem;
  padding: 2px 0.5rem;
  background: #FFF;
}

#gHeader .search-form {
  width: 100%;
  max-width: 971px;
  height: 0;
  overflow: hidden;
  transition: height .5s;
  margin: auto;
}

#gHeader .search-form.active {
  height: 4rem;
}

#gHeader .search-form input[type="search"] {
  width: 100%;
  border: solid 1px #999;
  padding: .5rem 1rem;
  font-size: 14px;
  margin-top: 1rem;
}

#gHeader .hLink a {
  display: block;
  position: relative;
}

#gHeader .hLink p {
  min-width: 19px;
  min-height: 19px;
  padding: 4px 2px 1px;
  position: absolute;
  right: -10px;
  top: -9px;
  font-size: 1.2rem;
  color: #fff;
  line-height: 1;
  text-align: center;
  border-radius: 100%;
  background-color: #7dae12;
  box-sizing: border-box;
}

#gHeader .hLink img {
  height: 20px;
  width: auto;
}

#gHeader .hLink a:hover {
  opacity: 0.7;
}

.cover {
  display: none;
}

.cart {
  display: none;
  width: 52px;
  position: fixed;
  right: 0;
  bottom: 20px;
  z-index: 100;
  background: #7dae12;
  padding: 5px 0 5px 5px;
  border-radius: 5px 0 0 5px;
}

@media all and (min-width: 768px) {
  .menuBox {
    display: none !important;
  }
}

@media all and (max-width: 767px) {
  #gHeader {
    padding: 15px 24px 15px 18px;
    position: relative;
  }
  #gHeader .hBox {
    width: auto;
  }
  .headHidden {
    height: 60px;
  }
  #gHeader .logo {
    margin-left: -45px;
    width: 90px;
    position: absolute;
    left: 50%;
    top: 4px;
    float: none;
  }
  #gHeader .hLink {
    margin-left: 0;
  }
  #gHeader .hLink li {
    margin: 0;
    margin-left: 1rem;
  }
  #gHeader .hLink li:nth-child(2) {
    order: -1;
  }
  #gHeader .search-form {
    width: 100%;
    height: 0;
    overflow: hidden;
    transition: height .5s;
  }
  #gHeader .search-form.active {
    height: 4rem;
  }
  #gHeader .hLink p {
    min-width: 16px;
    min-height: 16px;
    padding: 4px 2px 2px;
    top: -5px;
    font-size: 1rem;
  }
  #gHeader .menu {
    margin-top: 3px;
    width: 30px;
    float: left;
  }
  .menuBox {
    position: fixed;
    width: calc(100% - 60px);
    height: 100%;
    left: -100%;
    top: 0;
    z-index: 999;
    box-sizing: border-box;
    transition: all 0.5s;
    overflow-y: auto;
  }
  .cover {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    visibility: hidden;
    opacity: 0;
    transition: all 0.5s;
    z-index: 700;
  }
  .cover.on {
    visibility: visible;
    opacity: 1;
  }
  .menuBox.on {
    left: 0;
  }
  .menuBox .menuInner {
    background-color: #fff;
  }
  .menuBox .menuClose {
    padding: 15px 18px 2px 0;
    text-align: right;
  }
  .menuBox .menuClose img {
    width: 23px;
  }
  .menuBox .menuLogo {
    margin: 0 0 18px 25px;
  }
  .menuBox .menuLogo img {
    width: 107px;
  }
  .menuBox .menuLogin {
    margin: 0 18px 8px 25px;
    display: flex;
    justify-content: space-between;
  }
  .menuBox .menuLogin li {
    width: 49%;
  }
  .menuBox .menuLogin a {
    padding: 10px 2px;
    display: block;
    color: #7dae12;
    text-align: center;
    border: 1px solid #7dae12;
  }
  .menuBox .menuSearch {
    margin: 0 18px 18px 25px;
  }
  .menuBox .menuSearch input {
    width: 100%;
    height: 39px;
    padding: 2px 5px 2px 47px;
    font-size: 1.2rem;
    border: 1px solid #7f7f7f;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
    background: #fff url(../img/common/icon13.png) no-repeat left 13px center;
    background-size: 16px auto;
    box-sizing: border-box;
  }
  .menuBox .menuSearch input::-webkit-input-placeholder {
    /* WebKit browsers */
    color: #c3c4c4;
    opacity: 1;
  }
  .menuBox .menuSearch input:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: #c3c4c4;
    opacity: 1;
  }
  .menuBox .menuSearch input::-moz-placeholder {
    color: #c3c4c4;
    opacity: 1;
  }
  .menuBox .menuSearch input:-ms-input-placeholder {
    /* Internet Explorer 10+ */
    color: #c3c4c4;
    opacity: 1;
  }
  .menuBox .menuUl {
    border-top: 1px solid #C8C9C9;
  }
  .menuBox .menuUl > li > a {
    padding: 19px 50px 18px 25px;
    display: block;
    font-size: 1.5rem;
    border-bottom: 1px solid #C8C9C9;
    background: url(../img/common/icon11.png) no-repeat right 39px center;
    background-size: 7px auto;
    color: #7f7f7f;
  }
  .menuBox .menuUl > li > a.hasSubmenu {
    background: url(../img/common/icon15.png) no-repeat right 35px center;
    background-size: 16px auto;
  }
  .menuBox .menuUl > li > a.hasSubmenu.open {
    background: url(../img/common/icon14.png) no-repeat right 35px center;
    background-size: 16px auto;
  }
  .menuBox .menuUl > li.on > a {
    padding: 19px 10px 18px 47px;
    font-weight: bold;
    font-family: 'ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif';
    background: #C8E3AA url(../img/common/icon12.png) no-repeat left 25px center;
    background-size: 7px auto;
  }
  .menuBox .menuUl .menuLink {
    display: none;
  }
  .menuBox .menuUl .menuLink a {
    padding: 19px 50px 18px 25px;
    display: block;
    font-size: 1.5rem;
    border-bottom: 1px solid #C8C9C9;
    background: url(../img/common/icon11.png) no-repeat right 39px center;
    background-size: 7px auto;
  }
  .menuBox .menuTxt {
    margin: 14px 18px 23px 24px;
  }
  .menuBox .menuTxt a {
    display: inline-block;
    text-decoration: underline;
    font-size: 1.3rem;
  }
  .menuBox .menuTxtBox {
    display: none;
    background-color: #E5F0D3;
  }
  .menuBox .menuNavi {
    padding: 18px 25px;
  }
  .menuBox .menuNavi li {
    margin-bottom: 1rem;
  }
  .cart {
    bottom: 10px;
  }
}

/*------------------------------------------------------------
	gNavi
------------------------------------------------------------*/
#gNavi {
  color: #58595B !important;
  position: absolute;
  top: 0;
  left: 20rem;
}

#gNavi > li {
  float: left;
}

#gNavi > li > a {
  display: block;
  padding: 4px 20px;
  transition: all .5s;
  color: #58595B !important;
}

#gNavi > li.on > a,
#gNavi > li > a:hover {
  text-decoration: underline;
}

#gNavi .gUl {
  display: none;
  width: 100vw;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  background-color: #FFF;
  padding: 40px;
  transition: all .5s;
  z-index: 0;
}

#gNavi .gUl.active {
  /* display: none; */
  display: block;
  animation: show .5s linear 0s;
  z-index: 99;
}

@keyframes show {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

#gNavi .gUl a {
  color: #7f7f7f;
  padding: 6px 12px;
  display: block;
  font-size: 1.2rem;
  font-weight: bold;
}

#gNavi .gUl a:hover {
  color: #7dae12;
}

#gNavi .gUl .inner {
  width: 940px;
  margin: 0 auto;
  position: relative;
}

#gNavi .gUl .inner .subCategory {
  display: none;
  position: absolute;
  left: 14rem;
  top: 0;
  border-left: solid 1px #c9caca;
  height: 100%;
  padding-left: 2rem;
}

#gNavi .gUl .inner .subCategory.active {
  display: block;
  animation: show .5s linear 0s;
}

@media all and (max-width: 767px) {
  #gNavi {
    display: none;
  }
}

/*------------------------------------------------------------
	フッター
------------------------------------------------------------*/
#gFooter {
  margin-top: 99px;
  padding-bottom: 64px;
}

#gFooter .fBox {
  width: 1040px;
  margin: 0 auto;
}

#gFooter .fList {
  margin: 0 19px;
}

#gFooter .fList li {
  width: 162px;
  float: left;
  margin-right: 6px;
}

#gFooter .fList li:last-child {
  margin-right: 0;
}

#gFooter .fList a {
  color: #7f7f7f;
  padding: 15px 5px 13px;
  display: block;
  border: 2px solid #7f7f7f;
  border-radius: 5px;
  text-align: center;
  font-size: 1.16rem;
}

#gFooter .fList p {
  margin-top: 14px;
}

#gFooter .fList a:hover {
  opacity: 0.7;
}

#gFooter .fTxt {
  margin: 16px 0 52px;
  text-align: center;
}

#gFooter .fTxt a {
  text-decoration: underline;
  font-size: 1.6rem;
}

#gFooter .fTxt a:hover {
  text-decoration: none;
}

#gFooter .fUl {
  display: flex;
}

#gFooter .fUl > li {
  width: calc(100% / 4);
  padding-right: 5px;
  box-sizing: border-box;
}

#gFooter .fUl .fTtl {
  color: #58595B;
  margin: 0 25px 13px 0;
  padding-bottom: 5px;
  font-size: 2.2rem;
  border-bottom: 1px solid #7f7f7f;
  font-family: 'NeoSansWeleda-Md_0';
}

#gFooter .fUl .fTtl a {
  color: #58595B;
}

#gFooter .fUl .fLink li:not(:last-child) {
  margin-bottom: 5px;
}

#gFooter .fUl .fLink a {
  color: #7f7f7f;
  display: inline-block;
  letter-spacing: -0.5px;
}

#gFooter .fUl > li:first-child .fLink {
  width: 180px;
  float: left;
}

#gFooter .fUl .onlineShop {
  margin-bottom: 21px;
}

#gFooter .fUl .onlineShop img {
  width: 172px;
}

#gFooter .fUl > li:last-child .fLink li {
  margin-bottom: 12px;
}

#gFooter .fUl a:hover {
  opacity: 0.7;
}

#gFooter .fNavi {
  margin: 63px 0 31px;
}

#gFooter .fNavi a {
  color: #7f7f7f;
}

#gFooter .fNavi li {
  margin-right: 22px;
  display: inline-block;
}

#gFooter .fNavi a:hover {
  opacity: 0.7;
}

#gFooter .fSns {
  margin-right: 40px;
  text-align: right;
}

#gFooter .fSns li {
  margin: 0 5px;
  display: inline-block;
}

#gFooter .fSns img {
  height: 34px;
  width: auto;
}

#gFooter .fSns a:hover {
  opacity: 0.7;
}

#gFooter p.link {
  text-align: center;
}

#gFooter p.link a {
  color: #7dae12;
  position: relative;
  display: inline-block;
  padding: 0 16px 0 0;
  vertical-align: middle;
  text-decoration: none;
  font-size: 15px;
}

#gFooter p.link a:before,
#gFooter p.link a:after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

#gFooter p.link a:before {
  width: 12px;
  height: 12px;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  border: 1px solid #7dae12;
}

#gFooter p.link a:hover:before {
  background: #7dae12;
}

#gFooter p.link a::after {
  right: 6px;
  width: 3px;
  height: 3px;
  border-top: 1px solid #7dae12;
  border-right: 1px solid #7dae12;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

#gFooter p.link a:hover:after {
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
}

#gFooter .copyright {
  margin-top: 2rem;
  text-align: center;
  letter-spacing: 0.5px;
}

@media all and (max-width: 767px) {
  #gFooter {
    margin-top: 37px;
    padding-bottom: 16px;
  }
  #gFooter .fSp {
    font-size: 2.5rem;
    text-align: center;
    font-family: 'NEWWELED';
  }
  #gFooter .fBox {
    width: auto;
  }
  #gFooter .fList {
    margin: 12px 23px;
  }
  #gFooter .fList li {
    width: 32.5%;
    margin: 3px 1.25% 0 0;
  }
  #gFooter .fList li:nth-child(3n) {
    margin-right: 0;
  }
  #gFooter .fList li img {
    width: 100%;
  }
  #gFooter .fList a {
    padding: 10px 3px 6px;
    font-size: 1.1rem;
  }
  #gFooter .fList p {
    margin-top: 6px;
  }
  #gFooter .fTxt {
    margin: 37px 5px 38px;
  }
  #gFooter .fTxt a {
    font-size: 1.5rem;
  }
  #gFooter .fTxt a:hover {
    text-decoration: underline;
  }
  #gFooter .fUl {
    display: none;
  }
  #gFooter .fNavi {
    display: none;
  }
  #gFooter .fSul {
    border-bottom: 1px solid #7f7f7f;
  }
  #gFooter .fSul p.off {
    padding: 13px 55px 11px 32px;
    border-top: 1px solid #7f7f7f;
    background: url(../img/common/icon10.png) no-repeat right 35px center;
    background-size: 15px 15px;
  }
  #gFooter .fSul p.on {
    background-image: url(../img/common/icon15.png);
  }
  #gFooter .fSul p > a {
    display: block;
    padding: 13px 55px 11px 32px;
    border-top: 1px solid #7f7f7f;
    background: url(../img/common/icon11.png) no-repeat right 39px center;
    background-size: 7px;
  }
  #gFooter .fSul .fOpen {
    display: none;
  }
  #gFooter .fSul .fOpen a {
    padding: 12px 32px;
    display: block;
    border-top: 1px solid #7f7f7f;
  }
  #gFooter .fLogo {
    margin: 37px 0 22px;
    text-align: center;
  }
  #gFooter .fLogo img {
    width: 148px;
  }
  #gFooter .fSns {
    margin-right: 0;
    text-align: center;
    display: flex;
    justify-content: center;
  }
  #gFooter .fSns li {
    margin: 0 17px;
    display: block;
  }
  #gFooter .fSns li:last-child {
    order: -1;
  }
  #gFooter .fSns li:first-child {
    order: -2;
  }
  #gFooter .fSns img {
    height: 31px;
  }
  #gFooter p.link {
    margin: 3rem;
  }
  #gFooter .copyright {
    margin-top: 23px;
    letter-spacing: 0;
  }
}

@media all and (-ms-high-contrast: none) {
  h1 {
    padding: 9px 5px 4px;
  }
  #gNavi .gUl a {
    padding: 10px 5px 6px;
  }
  #gHeader .hLink p {
    padding: 5px 2px 0;
  }
}

html {
  font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
  font-weight: 400;
  font-size: 62.5% !important;
}

body {
  font-size: 1.4rem;
  color: #7f7f7f;
  background: #fff;
  line-height: 1.5;
  overflow-x: hidden;
}

body.is--overmenu {
  overflow: hidden;
  background: #666;
}

.ec-link,
a {
  color: #7dae12;
  text-decoration: none;
  opacity: 1;
  transition: opacity .5s;
}

.ec-link:hover,
a:hover {
  opacity: .7;
}

input, select {
  border: transparent;
}

/* =================================== */
/* GLOBAL                              */
/* =================================== */
.site {
  overflow-x: hidden;
}

main {
  position: relative;
  z-index: 1;
}

.container {
  box-sizing: border-box;
  width: 100%;
  max-width: 65.625rem;
  /* 1080px */
  padding: 0 1.25rem;
  margin: 0 auto;
  position: relative;
}

img {
  width: 100%;
  height: auto;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.row {
  display: flex;
}

/* ripple__effect */
.ripple {
  overflow: hidden;
  position: relative;
}

.ripple__effect {
  width: 10rem;
  height: 10rem;
  position: absolute;
  border-radius: 100%;
  pointer-events: none;
  transform: scale(0);
  opacity: 0;
}

.is--orange .ripple__effect {
  background: #f1c40f;
}

.is--blue .ripple__effect {
  background: #4aa3df;
}

.is--black .ripple__effect {
  background: rgba(0, 0, 0, 0.4);
}

.is--white .ripple__effect {
  background: rgba(255, 255, 255, 0.4);
}

.ripple__effect.is--show {
  animation: ripple .25s ease-out;
}

.ec-required {
  color: red;
  white-space: nowrap;
}

/* アニメーションの定義 */
@keyframes ripple {
  from {
    opacity: 1;
  }
  to {
    transform: scale(2);
    opacity: 0;
  }
}

.asterisk {
  font-size: 60%;
  vertical-align: top;
}

.emphasize {
  color: red;
}

span.discount.num {
  color: red;
}

.alert_area {
  color: red;
  padding: 10px 0;
}

/* =================================== */
/* HEADER                              */
/* =================================== */
.global-header-banner {
  height: 5.4375rem;
  background-color: #7dae12;
  background-position: 50% calc(50% + 1.25rem);
  background-repeat: no-repeat;
  background-size: auto 10.125rem;
  transition: .4s;
}

.global-header-banner img {
  height: 100%;
  width: auto;
}

.global-header-banner a {
  display: block;
  width: 100%;
  height: 100%;
}

.global-header {
  box-sizing: border-box;
  width: 100%;
  background: #f3f3f3;
  position: absolute;
  z-index: 999;
  height: 3.125rem;
}

.global-header.fixed {
  position: fixed;
  top: 0;
}

.global-header .container {
  width: 77.5rem;
  position: relative;
  height: 3.125rem;
}

.global-header .mobile-button {
  box-sizing: border-box;
  padding: 0 .5rem;
  height: 2rem;
  line-height: 2rem;
  font-size: .875rem;
  position: absolute;
  top: 50%;
  left: .5rem;
  transform: translate(0, -50%);
  border: 1px solid #333333;
  color: #333333;
  text-align: center;
  display: none;
  cursor: pointer;
  z-index: 15;
}

.global-header .logo {
  width: 12.125rem;
  position: absolute;
  top: 50%;
  left: 1.5rem;
  transform: translate(0, -50%);
  z-index: 1;
}

.global-header .logo a {
  display: block;
}

.global-header .logo img {
  width: 12.125rem;
  vertical-align: middle;
}

.global-header .button-group {
  position: absolute;
  top: 50%;
  right: 1.5rem;
  transform: translate(0, -50%);
  display: flex;
  background: #f3f3f3;
}

.global-header .button-group a {
  display: block;
  height: 100%;
}

.global-header .button-search-group {
  display: flex;
  margin: 0 .25rem;
  width: 2rem;
}

.global-header .is--show.button-search-group {
  width: auto;
}

.global-header .button-search {
  width: 2rem;
  background: url(../img/global-header__search.png) no-repeat 50% 50%;
  background-size: .9375rem auto;
  transition: .4s;
  padding: 1.5rem 0;
}

.global-header .button-search-input {
  width: 0;
  height: 2rem;
  border-bottom: .0625rem #fff solid;
  overflow: hidden;
  cursor: pointer;
  transition: .4s;
  white-space: nowrap;
  display: flex;
  flex-shrink: 1;
}

.global-header .button-search-input form {
  display: flex;
}

.global-header .button-search-input {
  width: 0;
  padding: .5rem 0;
}

.global-header .is--show .button-search-input {
  width: 10rem;
}

.global-header .button-search-input input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 8rem;
  background: transparent;
  border: none;
  box-shadow: none;
  color: #333333;
  display: block;
}

.global-header .button-search-input input[type="submit"] {
  width: 2rem;
  height: 2rem;
  transition: .4s;
  overflow: hidden;
  text-align: center;
  color: #333333;
  display: none;
}

.global-header .button-search-input input[type="search"]:placeholder-shown + input[type="submit"] {
  background: none;
  color: #7f7f7f;
  display: none;
}

.global-header .button-icon {
  width: 2rem;
  background: url(../img/global-header__person.png) no-repeat 50% 50%;
  background-size: .9375rem auto;
  cursor: pointer;
  margin: 0 .25rem;
  transition: .4s;
  padding: 1.5rem 0;
}

.global-header .button-icon:after {
  content: '';
  display: inline-block;
  width: .5625rem;
  height: 1rem;
  background: url(../img/global-header__arrow.png) no-repeat 50% 50%;
  background-size: 100% auto;
  transition: .4s;
  margin-left: 1.8rem;
  position: absolute;
  top: 1.2rem;
}

.global-header .button-cart a {
  display: block;
  width: 2rem;
  margin: 0 .25rem;
  background: url(../img/global-header__cart.png) no-repeat 50% 50%;
  background-size: 1.125rem auto;
  cursor: pointer;
  position: relative;
  transition: .4s;
  padding: 1.5rem 0;
}

.global-header .button-cart a .number {
  display: block;
  font-size: .5625rem;
  width: 1.125rem;
  height: 1.125rem;
  line-height: 1.125rem;
  border-radius: 1.125rem;
  background: #7dae12;
  position: absolute;
  right: -.375rem;
  top: .2rem;
  text-align: center;
  color: #fff;
}

.global-header .user-name a:hover > .dropdown-menu {
  opacity: .6;
  display: block;
}

.global-header .user-name a {
  color: #333333;
  font-size: 1.0rem;
  transition: .4s;
  padding-top: 0.3rem;
  padding-right: 1.2rem;
}

.global-header .user-name a:after {
  content: '';
  display: inline-block;
  width: .5625rem;
  height: .5625rem;
  background: url(../img/global-header__arrow.png) no-repeat 50% 50%;
  background-size: 100% auto;
  margin-left: .25rem;
}

.global-header .menu-left .menu-two {
  color: #333333;
  font-size: 0.9rem;
  transition: .4s;
  padding-top: 0.3rem;
  padding-right: 1.2rem;
}

.global-header .menu-left .menu-one {
  color: #333333;
  font-size: 1.0rem;
  font-weight: bolder;
  transition: .4s;
  padding-top: 0.3rem;
  padding-right: 1.2rem;
  border-width: 20px;
  border-color: #333333;
  border-bottom: 1px solid #333333;
  padding-bottom: 7px;
}

.global-header .menu-left a:hover {
  opacity: .6;
}

.global-header td {
  padding: 0px 10px 22px 45px;
}

.global-header .user-name a:hover > .dropdown-menu {
  opacity: .6;
  display: block;
}

.global-header .user-name a {
  color: #333;
  font-size: 1.0rem;
  font-family: 'Lora', serif;
  transition: .4s;
  padding-top: 0.3rem;
  padding-right: 1.2rem;
}

.global-header .user-name a:after {
  content: '';
  display: inline-block;
  width: .5625rem;
  height: .5625rem;
  background: url(../img/global-header__arrow.png) no-repeat 50% 50%;
  background-size: 100% auto;
  margin-left: .25rem;
}

.global-header .menu-left a {
  color: #675048;
  font-size: 1.0rem;
  font-family: 'Lora', serif;
  transition: .4s;
  padding-top: 0.3rem;
  padding-right: 1.2rem;
}

.global-header-space {
  height: 3rem;
}

.global-navigation {
  width: 100%;
  height: 100%;
  color: #333333;
  transition: .4s;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
  padding: 0 9rem 0 14rem;
  box-sizing: border-box;
}

.global-navigation a {
  color: #333333;
  text-decoration: none;
}

.global-navigation h2 {
  font-weight: 200;
}

.global-navigation .navigation-list-1st {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 3.125rem;
}

.global-navigation .navigation-list-1st > li {
  margin: 0 1.2rem;
  position: relative;
  transition: .4s;
  cursor: pointer;
  padding: 1rem 0;
}

.global-navigation .navigation-list-1st .title {
  font-size: 1rem;
  font-weight: 500;
  margin: 0;
  transition: .4s;
}

.global-navigation .navigation-list-1st > li.toggle .title:after {
  content: '';
  display: inline-block;
  width: .5625rem;
  height: .5625rem;
  background: url(../img/asset__select-arrow.png) no-repeat 0;
  background-size: 100% auto;
  transition: .4s;
  margin-left: .25rem;
}

.global-navigation .navigation-list-2st {
  height: 0;
  overflow: hidden;
  position: absolute;
  transition: .4s;
  display: flex;
  flex-wrap: wrap;
  width: 400px;
  margin-top: .5625rem;
  z-index: 10;
  background: #FFF;
}

.global-navigation .is--show .navigation-list-2st {
  height: auto;
}

.global-navigation .navigation-list-2st > li {
  font-size: .75rem;
  margin: 0 0rem;
  height: 2rem;
  background: #FFF;
  width: 50%;
}

.global-navigation .navigation-list-2st a {
  display: block;
  height: 2rem;
  line-height: 2rem;
  color: #7f7f7f;
  padding: 0 1rem;
  transition: .4s;
}

.global-navigation .navigation-list-2st {
  height: 0;
  overflow: hidden;
  position: absolute;
  transition: .4s;
  display: flex;
  flex-wrap: wrap;
  width: 400px;
  margin-top: .5625rem;
  z-index: 10;
  background: #FFF;
  top: 40px;
}

.global-navigation .is--show .navigation-list-2st {
  height: auto;
}

.global-navigation .navigation-list-2st > li {
  font-size: .75rem;
  margin: 0 0rem;
  height: 2rem;
  background: #FFF;
  width: 50%;
}

.global-navigation .navigation-list-2st a {
  display: block;
  height: 2rem;
  line-height: 2rem;
  color: #7f7f7f;
  padding: 0 1rem;
  transition: .4s;
}

.ec-headerRole__cart .navigation-list-2st {
  height: 0;
  overflow: hidden;
  position: absolute;
  transition: .4s;
  display: flex;
  flex-wrap: wrap;
  width: 400px;
  margin-top: .5625rem;
  z-index: 10;
  background: #FFF;
  top: 40px;
  left: -14rem;
}

.ec-headerRole__cart .is--show .navigation-list-2st {
  height: auto;
}

.ec-headerRole__cart .navigation-list-2st > li {
  font-size: .75rem;
  margin: 0 0rem;
  height: 2rem;
  background: #FFF;
  width: 50%;
}

.ec-headerRole__cart .navigation-list-2st a {
  display: block;
  height: 2rem;
  line-height: 2rem;
  color: #7f7f7f;
  padding: 0 1rem;
  transition: .4s;
}

/* =================================== */
/* FOOTER                              */
/* =================================== */
.global-footer {
  box-sizing: border-box;
  width: 100%;
  background: #f3f3f3;
  color: #333333;
  font-size: .875rem;
  position: relative;
  z-index: 1;
  margin-top: 50px;
}

.global-footer a {
  color: #333333;
  text-decoration: none;
  transition: .4s;
}

.global-footer .container {
  width: 77.5rem;
  position: relative;
}

.global-footer .sitemap {
  box-sizing: border-box;
  padding: 2.5rem 0;
  display: flex;
  margin: 0 -1rem;
  line-height: 2;
}

.global-footer .sitemap ul.list {
  width: 100%;
  text-align: center;
}

.global-footer .sitemap ul.list li {
  display: inline-block;
  margin: 0 2rem;
}

.global-footer .sitemap .grid {
  box-sizing: border-box;
  width: calc(100% / 5 - 2rem);
  margin: 0 1rem;
}

.global-footer .sitemap .group-title {
  font-size: 1.5rem;
  border-bottom: .0625rem #fff solid;
  margin-bottom: 1rem;
}

.global-footer .online-store {
  margin: 0rem 0 1rem;
  width: 10.625rem;
}

.global-footer .sns-group {
  display: flex;
  justify-content: center;
}

.global-footer .button-twitter {
  display: block;
  width: 2rem;
  height: 2rem;
  margin: 0 .5rem;
  background: url(../img/global-footer__tw.png) no-repeat 50% 50%;
  background-size: 1.875rem auto;
}

.global-footer .button-facebook {
  display: block;
  width: 2rem;
  height: 2rem;
  margin: 0 .5rem;
  background: url(../img/global-footer__fb.png) no-repeat 50% 50%;
  background-size: 1.875rem auto;
}

.global-footer .button-instagram {
  display: block;
  width: 2rem;
  height: 2rem;
  margin: 0 .5rem;
  background: url(../img/global-footer__inst.png) no-repeat 50% 50%;
  background-size: 1.875rem auto;
}

.global-footer .copyright {
  text-align: center;
  font-size: .875rem;
  padding: 2rem 0;
  color: #333333;
  font-size: .875rem;
}

/* =================================== */
/* MODAL                              */
/* =================================== */
.ec-modal .ec-modal-wrap {
  position: relative;
  border: none;
  border-radius: 5px;
  box-shadow: 4px 4px 6px 1px #666;
}

.ec-modal.active .ec-modal-overlay {
  transform: scale(1);
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  z-index: 9997;
  overflow: auto;
}

.ec-modal ul.sns-list {
  display: flex;
  flex-wrap: wrap;
  padding: 2rem 3rem;
}

.ec-modal ul.sns-list li {
  width: calc((100% - 18px) / 3);
  margin: 3px;
  box-sizing: border-box;
}

.ec-modal ul.sns-list li a {
  display: block;
  width: 100%;
  background: #999;
  color: #FFF;
  padding: 1rem;
  box-sizing: border-box;
  border-radius: 5px;
}

.ec-modal ul.sns-list li a:hover {
  background: #589CA3;
}

#modal-Twitter #ec-modal-header {
  background: url(../img/global-footer__tw.png) no-repeat left 50%;
  background-size: 2.875rem auto;
  display: block;
  padding-left: 3rem;
  text-align: center;
  width: 15rem;
  margin: auto;
}

#modal-Facebook #ec-modal-header {
  background: url(../img/global-footer__fb.png) no-repeat left 50%;
  background-size: 2.875rem auto;
  display: block;
  padding-left: 3rem;
  text-align: center;
  width: 15rem;
  margin: auto;
}

#modal-Instagram #ec-modal-header {
  background: url(../img/global-footer__inst.png) no-repeat left 50%;
  background-size: 2.875rem auto;
  display: block;
  padding-left: 3rem;
  text-align: center;
  width: 15rem;
  margin: auto;
}

#modal-Withouthome.ec-modal .ec-modal-wrap .ec-modal-box {
  text-align: left;
  font-size: 14px;
}

.modal .modal__button {
  margin-top: 2rem;
}

.modal #ec-modal-header {
  margin-bottom: 1rem;
}

.modal #ec-modal-header .title {
  font-size: 1.8rem;
}

.modal .select-card li label {
  display: block;
  text-align: left;
  margin-top: 1rem;
  border: solid 1px #c9caca;
  margin-right: 0;
  padding-left: 30px;
}

.modal .select-card li label::before {
  top: 9px;
  left: 9px;
}

.modal .select-card li label::after {
  top: 13px !important;
  left: 13px !important;
}

.modal .select-card li label .inner {
  padding: 1rem;
}

.modal .select-address ul {
  margin-bottom: 2rem;
}

.modal .select-address li label {
  display: block;
  text-align: left;
  margin-top: 1rem;
  border: solid 1px #c9caca;
  margin-right: 0;
  padding-left: 30px;
}

.modal .select-address li label::before {
  top: 9px;
  left: 9px;
}

.modal .select-address li label::after {
  top: 13px !important;
  left: 13px !important;
}

.modal .select-address li label .inner {
  padding: 1rem;
}

/* =================================== */
/* MAIN                                */
/* =================================== */
/* =================================== */
/* PAGE                                */
/* =================================== */
/* toppage & module ====================== */
.module__brand {
  margin: 5rem 0;
  font-size: .75rem;
}

.module__brand .row {
  justify-content: space-around;
  align-items: center;
}

.module__brand .grid {
  box-sizing: border-box;
  width: calc(100% / 7);
  background: #fff;
  text-align: center;
  transition: .4s;
}

.module__brand a {
  display: block;
}

.module__servicemenu {
  margin-top: 5rem;
  font-size: .75rem;
}

.module__servicemenu .row {
  justify-content: space-around;
}

.module__servicemenu .grid {
  box-sizing: border-box;
  width: 10.25rem;
  background: #fff;
  border-radius: .25rem;
  transition: .4s;
}

.module__servicemenu a {
  display: block;
}

.marqee-carousel {
  /* SLICK Parts */
}

.marqee-carousel .marqee-carousel-item {
  max-height: 26.0625rem;
  width: 100%;
  max-width: 64rem;
  background-size: cover;
  margin: 0 .5rem;
  background-color: #FFF;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  position: relative;
  transition: .4s;
}

.marqee-carousel .marqee-carousel-item:before {
  content: '';
  display: block;
  padding: 50.8536585365854% 0 0;
}

.marqee-carousel a {
  display: block;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.marqee-carousel a:hover {
  opacity: .6;
}

.marqee-carousel .slick-prev,
.marqee-carousel .slick-next {
  cursor: pointer;
}

.marqee-carousel .slick-prev:before,
.marqee-carousel .slick-next:before {
  display: none;
}

.marqee-carousel .slick-prev {
  width: 1rem;
  height: 2rem;
  background: url(../img/arrow_prev.svg) 50% 50% no-repeat;
  background-size: cover;
  left: 5%;
  z-index: 9;
}

@media screen and (max-width: 1024px) {
  .marqee-carousel .slick-prev {
    left: 1%;
  }
}

.marqee-carousel .slick-next {
  width: 1rem;
  height: 2rem;
  background: url(../img/arrow_next.svg) 50% 50% no-repeat;
  background-size: cover;
  right: 5%;
  z-index: 9;
}

@media screen and (max-width: 1024px) {
  .marqee-carousel .slick-next {
    right: 1%;
  }
}

.toppage__banner-group-markey {
  margin: 1rem 0 5rem;
}

.toppage__banner-group-markey .container {
  /* 1050px */
}

.toppage__banner-group-markey .container .row {
  flex-wrap: wrap;
  margin: -.25rem;
}

.toppage__banner-group-markey .container .slick-track {
  /*   flex-wrap: wrap;*/
  margin: -.25rem;
}

.toppage__banner-group-markey .container .grid {
  cursor: pointer;
  width: calc((100% / 2) - .5rem);
  margin: .25rem;
  box-sizing: border-box;
  height: auto;
  background-color: #FFF;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  transition: .4s;
}

.toppage__banner-group-markey .container .grid img {
  vertical-align: top;
}

.toppage__banner-group-markey .container .grid:hover {
  opacity: .5;
}

.toppage__banner-group-markey .container .grid a {
  display: block;
  height: inherit;
}

.toppage__ourbrand {
  margin: 5rem 0;
}

.toppage__ourbrand .row {
  flex-wrap: wrap;
  margin: -.5rem;
}

.toppage__ourbrand .grid {
  width: calc((100% / 4) - 1rem);
  margin: .5rem;
}

.toppage__ourbrand a {
  display: block;
  color: #7f7f7f;
  transition: .4s;
}

.toppage__ourbrand .thumbnail {
  display: block;
  height: 6.875rem;
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

.toppage__ourbrand .name {
  font-weight: 700;
  font-size: .8125rem;
  margin: .25rem 0 0;
}

.toppage__ourbrand .text {
  font-size: .75rem;
}

.toppage__ranking {
  margin: 5rem 0;
  font-size: .75rem;
}

.toppage__ranking .container {
  position: relative;
}

.toppage__ranking .row {
  flex-wrap: wrap;
  margin: 0;
  padding-left: .0625rem;
  width: 100%;
  width: calc(100% - .0625rem);
  position: relative;
}

.toppage__ranking .row:before {
  content: '';
  display: block;
  height: 0;
  border-top: #fff solid .0625rem;
  position: absolute;
  top: -.0625rem;
  left: 0;
  width: 100%;
  z-index: 3;
}

.toppage__ranking .row:after {
  content: '';
  display: block;
  height: 0;
  border-top: #fff solid .0625rem;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 3;
}

.toppage__ranking .grid {
  box-sizing: border-box;
  width: calc((100% / 5));
  border: dashed .0625rem #ccc;
  text-align: center;
  padding: 1rem .5rem;
  margin-top: -.0625rem;
  margin-left: -.0625rem;
  transition: .4s;
}

.toppage__ranking a {
  display: block;
  color: #7f7f7f;
}

.toppage__ranking .thumbnail {
  display: inline-block;
  height: 8rem;
  width: 8rem;
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  margin-bottom: 1rem;
}

.toppage__ranking .thumbnail:hover {
  opacity: 0.5;
}

.toppage__ranking .brand,
.toppage__ranking .item,
.toppage__ranking .attribute {
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  height: 1.125rem;
}

.toppage__ranking .price-group {
  display: inline-block;
  margin-top: 1.5rem;
  font-size: .8125rem;
}

.toppage__ranking .subscription {
  display: flex;
}

.toppage__ranking .subscription .label {
  color: #7dae12;
  width: 5rem;
}

.toppage__ranking .subscription .label:after {
  content: '　';
}

.toppage__ranking .subscription .num {
  font-weight: 700;
}

.toppage__ranking .sale {
  display: flex;
}

.toppage__ranking .sale .label {
  width: 5rem;
}

.toppage__ranking .sale .label:after {
  content: '　';
}

.toppage__ranking .sale .num {
  font-weight: 700;
}

.toppage__campaign {
  background: #d9e6e8;
  padding: 3rem 0;
}

.toppage__campaign .row {
  flex-wrap: wrap;
  margin: -.125rem;
}

.toppage__campaign .grid {
  box-sizing: border-box;
  width: calc((100% / 4) - 0.25rem);
  margin: .125rem;
  background: #fff;
  border-radius: .25rem;
  transition: .4s;
}

.toppage__campaign a {
  display: block;
  color: #7f7f7f;
}

.toppage__campaign .brand-logo {
  text-align: center;
  padding: 1.5rem 0;
  height: 4.75rem;
  width: calc(100% -4rem);
  margin: 0 2rem;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: contain;
}

.toppage__campaign .thumbnail {
  width: 100%;
  position: relative;
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  display: block;
}

.toppage__campaign .thumbnail:after {
  content: '';
  display: block;
  width: 100%;
  padding: 82% 0 0;
}

.toppage__campaign .label {
  display: inline-block;
  min-width: 6.25rem;
  height: 2rem;
  line-height: 2rem;
  padding: 0 .25rem;
  font-size: .75rem;
  background-color: #7dae12;
  color: #fff;
  margin-bottom: 1rem;
  text-align: center;
  margin: 1rem;
}

.toppage__campaign .text {
  display: block;
  font-size: .875rem;
  margin-bottom: 1rem;
  padding: 0 1rem;
}

.toppage__columns {
  margin: 5rem 0;
}

.toppage__columns .row {
  flex-wrap: wrap;
  margin: -.5rem;
}

.toppage__columns .grid {
  transition: .4s;
}

.toppage__columns .three-column.row {
  margin-bottom: 2.5rem;
}

.toppage__columns .three-column .grid {
  width: calc((100% / 3) - 1rem);
  margin: .5rem;
}

.toppage__columns .three-column .grid .thumbnail {
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

.toppage__columns .three-column .grid .thumbnail:before {
  content: '';
  display: block;
  width: 100%;
  padding: 60.9467455621302% 0 0;
}

.toppage__columns .three-column .grid .label {
  display: inline-block;
  min-width: 5.625rem;
  height: 1.25rem;
  line-height: 1.25rem;
  padding: 0 .25rem;
  font-size: .75rem;
  background-color: #7dae12;
  color: #fff;
  margin: .5rem 0;
  text-align: center;
}

.toppage__columns .three-column .grid.skincare .label {
  background-color: #7DAE21;
}

.toppage__columns .three-column .grid.make .label {
  background-color: #7DAE21;
}

.toppage__columns .three-column .grid.other .label {
  background-color: #7DAE21;
}

.toppage__columns .three-column .grid .column-title {
  font-size: 14px;
  font-weight: 700;
  margin: 5px 0 .5rem;
}

.toppage__columns .three-column .grid .text {
  font-size: .75rem;
}

.toppage__columns .two-column .grid {
  width: calc((100% / 2) - 1rem);
  margin: .5rem;
}

.toppage__columns a {
  display: block;
  color: #7f7f7f;
}

.toppage__recommend {
  margin: 5rem 0;
  font-size: .75rem;
}

.toppage__recommend .row {
  flex-wrap: wrap;
  margin: 0;
  padding-left: .0625rem;
  width: 100%;
  width: calc(100% - .0625rem);
  position: relative;
}

.toppage__recommend .row:before {
  content: '';
  display: block;
  height: 0;
  border-top: #fff solid .0625rem;
  position: absolute;
  top: -.0625rem;
  left: 0;
  width: 100%;
  z-index: 3;
}

.toppage__recommend .row:after {
  content: '';
  display: block;
  height: 0;
  border-top: #fff solid .0625rem;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 3;
}

.toppage__recommend .grid {
  box-sizing: border-box;
  width: calc((100% / 5));
  border: dashed .0625rem #ccc;
  text-align: center;
  padding: 1rem .5rem;
  margin-top: -.0625rem;
  margin-left: -.0625rem;
  transition: .4s;
}

.toppage__recommend a {
  display: block;
  color: #7f7f7f;
}

.toppage__recommend .thumbnail {
  display: inline-block;
  height: 8rem;
  width: 8rem;
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  margin-bottom: 1rem;
}

.toppage__recommend .brand,
.toppage__recommend .item,
.toppage__recommend .attribute {
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  height: 1.125rem;
}

.toppage__recommend .price-group {
  display: inline-block;
  margin-top: 1.5rem;
  font-size: .8125rem;
}

.toppage__recommend .subscription {
  display: flex;
}

.toppage__recommend .subscription .label {
  color: #7dae12;
  width: 5rem;
}

.toppage__recommend .subscription .label:after {
  content: '　';
}

.toppage__recommend .subscription .num {
  font-weight: 700;
}

.toppage__recommend .sale {
  display: flex;
}

.toppage__recommend .sale .label {
  width: 5rem;
}

.toppage__recommend .sale .label:after {
  content: '　';
}

.toppage__recommend .sale .num {
  font-weight: 700;
}

.toppage__recent {
  margin: 5rem 0;
  font-size: .75rem;
}

.toppage__recent .title {
  font-size: 1.1875rem;
  font-weight: 200;
  margin-bottom: .5rem;
}

.toppage__recent .row {
  margin: -.5rem;
}

.toppage__recent .grid {
  width: calc((100% / 4) - 1rem);
  margin: .5rem;
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  transition: .4s;
  position: relative;
}

.toppage__recent .grid:before {
  content: '';
  display: block;
  width: 100%;
  padding: 100% 0 0;
}

.toppage__recent a {
  display: block;
  color: #7f7f7f;
}

.toppage__recent a {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.toppage__news {
  margin: 5rem 0;
}

.toppage__news ul.news-list {
  list-style: none;
  margin: 0 8.75rem;
}

.toppage__news .news-item {
  border-bottom: 0.0625rem solid #7f7f7f;
  transition: .4s;
}

.toppage__news a {
  box-sizing: border-box;
  display: flex;
  width: 100%;
  color: #7f7f7f;
  padding: .5rem 0;
}

.toppage__news .date {
  display: block;
  width: 7.5rem;
  font-weight: 700;
}

.toppage__news .subject {
  display: block;
  width: calc(100% - 7.5rem);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  flex-grow: 1;
}

.toppage__news .button-group {
  text-align: right;
  margin: 1rem 8.75rem 0;
}

.toppage__news .button-all {
  height: 2rem;
  line-height: 2rem;
  width: auto;
  min-width: 4.5rem;
  background: #7dae12;
  color: #fff;
  display: inline-block;
  text-align: center;
  font-weight: 700;
  transition: .4s;
  padding: 0;
}

/* brand ====================== */
.brand__marqee {
  background: #fff;
  box-shadow: 0 0.0625rem 0.625rem rgba(0, 0, 0, 0.4);
}

.brand__marqee .banner {
  line-height: 0;
  margin: 0 auto;
  max-width: 60rem;
}

.brand__feature {
  margin: 1rem 0 5rem;
}

.brand__feature .container {
  /* 1050px */
}

.brand__feature .container .row {
  flex-wrap: wrap;
  margin: -.25rem;
}

.brand__feature .container .slick-track {
  /*   flex-wrap: wrap;*/
  margin: -.25rem;
}

.brand__feature .container .grid {
  cursor: pointer;
  width: calc((100% / 2) - .5rem);
  margin: .25rem;
  box-sizing: border-box;
  background-color: #FFF;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  transition: .4s;
}

.brand__feature .container .grid img {
  vertical-align: top;
}

.brand__feature .container .grid:hover {
  opacity: .5;
}

.brand__feature .container .grid a {
  display: block;
  height: inherit;
}

.brand__ranking {
  background: #f0ede8;
  font-size: .75rem;
  margin: 0;
  padding: 3rem 0;
  /* SLICK Parts */
}

.brand__ranking .grid {
  box-sizing: border-box;
  width: 200px;
  border: dashed .0625rem #ccc;
  border-bottom: none;
  border-top: none;
  text-align: center;
  padding: 1rem .5rem;
  margin-top: -.0625rem;
  margin-left: -.0625rem;
  transition: .4s;
}

.brand__ranking a {
  display: block;
  color: #7f7f7f;
}

.brand__ranking .thumbnail {
  display: inline-block;
  height: 8rem;
  width: 8rem;
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  margin-bottom: 1rem;
}

.brand__ranking .brand,
.brand__ranking .item,
.brand__ranking .attribute {
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  height: 1.125rem;
}

.brand__ranking .price-group {
  display: inline-block;
  margin-top: 1.5rem;
  font-size: .8125rem;
}

.brand__ranking .subscription {
  display: flex;
}

.brand__ranking .subscription .label {
  color: #7dae12;
  width: 5rem;
}

.brand__ranking .subscription .label:after {
  content: '　';
}

.brand__ranking .subscription .num {
  font-weight: 700;
}

.brand__ranking .sale {
  display: flex;
}

.brand__ranking .sale .label {
  width: 5rem;
}

.brand__ranking .sale .label:after {
  content: '　';
}

.brand__ranking .sale .num {
  font-weight: 700;
}

.brand__ranking .slick-prev:before,
.brand__ranking .slick-next:before {
  display: none;
}

.brand__ranking .slick-prev {
  width: 1.125rem;
  height: 2.375rem;
  background: url(../img/brand__ranking-arrow.png) 0 0 no-repeat;
  background-size: cover;
  left: -50px;
}

.brand__ranking .slick-next {
  width: 1.125rem;
  height: 2.375rem;
  background: url(../img/brand__ranking-arrow-r.png) 100% 0 no-repeat;
  background-size: cover;
  right: -50px;
}

.brand__products {
  margin: 5rem 0;
}

.brand__products .ec-blockBtn--action {
  padding: .5rem 1rem;
}

.brand__products .ec-blockBtn--action[disabled] {
  cursor: default;
}

.brand__products .ec-shelfRole,
.brand__products .ec-searchnavRole {
  padding-left: 0;
  padding-right: 0;
}

.brand__products .ec-shelfGrid {
  margin-left: 0;
  margin-right: 0;
}

.brand__products .ec-shelfGrid form {
  height: 7.5rem;
  display: flex;
}

.brand__products .ec-shelfGrid .ec-productRole__tags {
  display: flex;
  flex-wrap: wrap;
  height: 3.5rem;
  overflow: hidden;
}

.brand__products .ec-shelfGrid .ec-productRole__tag {
  display: inline-block;
  font-size: .8rem;
  color: #FFF;
  padding: .1rem 0;
  font-weight: 500;
  width: calc((100% - 4px) / 2);
  box-sizing: border-box;
  text-align: center;
  margin: 0 1px;
  height: 1.7em;
}

.brand__products .ec-shelfGrid .ec-productRole__tag:nth-of-type(3), .brand__products .ec-shelfGrid .ec-productRole__tag:nth-of-type(4) {
  margin-top: -8px;
}

.brand__products .ec-shelfGrid .ec-productRole__tag.tag_1 {
  border: solid 1px #549faf;
  color: #549faf;
}

.brand__products .ec-shelfGrid .ec-productRole__tag.tag_2 {
  border: solid 1px #549faf;
  color: #549faf;
}

.brand__products .ec-shelfGrid .ec-productRole__tag.tag_3 {
  border: solid 1px #549faf;
  color: #549faf;
}

.brand__products .ec-shelfGrid .ec-productRole__tag.tag_4 {
  border: solid 1px #549faf;
  color: #549faf;
}

.brand__products .ec-shelfGrid .ec-productRole__tag.tag_5 {
  border: solid 1px #549faf;
  background: #549faf;
}

.brand__products .ec-shelfGrid .ec-productRole__tag.tag_6 {
  border: solid 1px #549faf;
  color: #549faf;
}

.brand__products .ec-shelfGrid .ec-select select {
  width: 100%;
}

.brand__products .ec-shelfGrid select.quantity {
  margin-bottom: 16px;
  display: inline-block;
  width: auto;
  max-width: 100px;
  text-align: right;
}

.brand__products .select-box {
  margin: 1.5rem 0;
}

.brand__products .select-item {
  display: inline-block;
  border: #7f7f7f solid 0.0625rem;
  background: url(../img/asset__select-arrow.png) calc(100% - .5rem) 50% no-repeat;
  background-size: .75rem auto;
  max-width: 100%;
  padding-right: 1rem;
}

.brand__products .ec-productRole__actions .select-item {
  margin-bottom: .5rem;
}

.brand__products .ec-productRole__actions .select-item.select-catetory {
  width: 100%;
}

.brand__products .select-item + .select-item {
  margin-left: .5rem;
}

.brand__products select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  box-shadow: none;
  height: 2rem;
  padding: 0 2rem 0 1rem;
  font-size: .875rem;
  color: #7f7f7f;
  background: transparent;
  font-size: .75rem;
}

.brand__products .row {
  flex-wrap: wrap;
  margin: 0;
  padding-left: .0625rem;
  width: 100%;
  width: calc(100% - .0625rem);
  position: relative;
}

.brand__products .row:before {
  content: '';
  display: block;
  height: 0;
  border-top: #fff solid .0625rem;
  position: absolute;
  top: -.0625rem;
  left: 0;
  width: 100%;
  z-index: 3;
}

.brand__products .row:after {
  content: '';
  display: block;
  height: 0;
  border-top: #fff solid .0625rem;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 3;
}

.brand__products .grid {
  box-sizing: border-box;
  width: calc((100% / 5));
  border: dashed .0625rem #ccc;
  text-align: center;
  padding: 1rem .5rem;
  margin-left: -1px;
  margin-top: -1px;
  transition: .4s;
  display: flex;
  flex-direction: column;
}

.brand__products .grid .ec-productRole__tags {
  text-align: left;
}

.brand__products .grid .ec-cartarea {
  margin-top: auto;
  width: 100%;
}

.brand__products a {
  display: block;
  color: #7f7f7f;
}

.brand__products .thumbnail {
  display: inline-block;
  height: 8rem;
  width: 8rem;
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  margin-bottom: 1rem;
}

.brand__products .thumbnail:hover {
  opacity: 0.5;
}

.brand__products .brand,
.brand__products .item,
.brand__products .attribute {
  width: 100%;
  text-align: left;
  line-height: 180%;
  height: 4rem;
  overflow: hidden;
}

.brand__products .item {
  height: 2.5rem;
}

.brand__products .item:hover {
  opacity: 0.5;
}

.brand__products .description {
  border-top: solid 1px #EAEAEA;
  margin-top: .5rem;
  padding-top: .5rem;
  height: 2.5rem;
  overflow: hidden;
}

.brand__products .price-group {
  display: inline-block;
  margin-top: .5rem;
  margin-bottom: .5rem;
  font-size: .8125rem;
}

.brand__products .subscription {
  display: flex;
}

.brand__products .subscription .label {
  color: #7dae12;
  width: 5rem;
}

.brand__products .subscription .label:after {
  content: '　';
}

.brand__products .subscription .num {
  font-weight: 700;
}

.brand__products .sale {
  display: flex;
}

.brand__products .sale .label {
  width: 5rem;
  display: none;
}

.brand__products .sale .label:after {
  content: '　';
}

.brand__products .sale .num {
  font-weight: 700;
}

.brand__story {
  margin: 5rem 0;
  padding: 3rem 0;
  text-align: center;
  background: #f0ede8;
  line-height: 2;
}

.brand__story .logo {
  margin: 0 auto 2rem;
}

.brand__story .catch {
  margin: 3rem auto 1.5rem;
  font-size: 1.375rem;
  font-weight: 200;
}

.brand__story .text {
  font-size: 0.875rem 0.875rem;
}

/* detail ====================== */
.detail__main-box {
  margin: 5rem 0;
}

.detail__main-box .container {
  border-bottom: dashed 0.0625rem #7f7f7f;
}

.detail__main-box .row.frame {
  margin: 0 -1rem;
}

.detail__main-box .image-column {
  width: calc((100% / 2) - 2rem);
  margin: 0 1rem;
}

.detail__main-box .text-column {
  width: calc((100% / 2) - 2rem);
  margin: 0 1rem;
}

.detail__main-box .header {
  box-sizing: border-box;
  position: relative;
  padding: 0 2.25rem .5rem 0;
  border-bottom: #7f7f7f solid 0.0625rem;
}

.detail__main-box .ec-productRole__tags {
  margin-bottom: 1rem;
  display: flex;
  flex-wrap: wrap;
}

.detail__main-box .ec-productRole__tag {
  font-size: .8rem;
  color: #FFF;
  padding: .1rem 0;
  font-weight: 500;
  width: calc((100% - 16px) / 4);
  box-sizing: border-box;
  text-align: center;
  margin: 2px;
}

.detail__main-box .ec-productRole__tag.tag_1 {
  border: solid 1px #549faf;
  color: #549faf;
}

.detail__main-box .ec-productRole__tag.tag_2 {
  border: solid 1px #549faf;
  color: #549faf;
}

.detail__main-box .ec-productRole__tag.tag_3 {
  border: solid 1px #549faf;
  color: #549faf;
}

.detail__main-box .ec-productRole__tag.tag_4 {
  border: solid 1px #549faf;
  color: #549faf;
}

.detail__main-box .ec-productRole__tag.tag_5 {
  border: solid 1px #549faf;
  background: #549faf;
}

.detail__main-box .ec-productRole__tag.tag_6 {
  border: solid 1px #549faf;
  color: #549faf;
}

.detail__main-box #anchor-addcart {
  margin-top: -50px;
  padding-top: 50px;
}

.detail__main-box #anchor-addcart input[type="radio"]:checked + label.input-radio::after {
  display: none;
}

.detail__main-box .brand-name {
  font-size: 1rem;
  font-weight: 200;
}

.detail__main-box .item-name {
  font-size: 1.3rem;
  font-weight: 200;
}

.detail__main-box .button-like {
  position: absolute;
  right: 0;
  top: 0;
  width: 1.875rem;
  height: 1.875rem;
  background: url(../img/asset__icon-like.png) 50% 50% no-repeat;
  background-size: cover;
  cursor: pointer;
  transition: .4s;
}

.detail__main-box .button-like.active {
  position: absolute;
  right: 0;
  top: 0;
  width: 1.875rem;
  height: 1.875rem;
  background: url(../img/asset__icon-like-active.png) 50% 50% no-repeat;
  background-size: cover;
  cursor: pointer;
  transition: .4s;
}

.detail__main-box .form-group.row {
  position: relative;
  font-size: 1.125rem;
  margin: 2rem 0;
  flex-wrap: wrap;
}

.detail__main-box .form-group.row .grid.left {
  box-sizing: border-box;
  width: 50%;
  margin: .5rem 0;
  padding: 0 0 0 2rem;
  position: relative;
}

.detail__main-box .form-group.row .grid.left.radio {
  padding: 0 0 0 2rem;
}

.detail__main-box .form-group.row .grid.right {
  width: 50%;
  text-align: right;
  margin: .5rem 0;
}

.detail__main-box .form-group.row .grid.right .price-old {
  display: block;
}

.detail__main-box .form-group.row .grid.right100 {
  width: 100%;
  text-align: right;
  margin: .5rem 0;
}

.detail__main-box .form-group.row .grid.submit {
  width: 100%;
  margin: .5rem 0;
}

.detail__main-box .grid.right .label,
.detail__main-box .grid.right100 .label {
  margin-right: .5rem;
}

.detail__main-box .grid.left input[type=radio] {
  display: none;
}

.detail__main-box .grid.left .input-radio {
  transition: .4s;
}

.detail__main-box .grid.left .input-radio:before {
  content: '';
  border: none;
  box-shadow: none;
  position: absolute;
  border: #7f7f7f solid 0.0625rem;
  border-radius: 50%;
  display: block;
  width: 1rem;
  height: 1rem;
  left: 0;
  top: 0;
  transition: .4s;
}

.detail__main-box .grid.left input[type=radio]:checked + .input-radio:before {
  color: #7f7f7f;
  text-align: center;
  line-height: 1rem;
  content: '●';
  font-size: .5625rem;
  transition: .4s;
}

.detail__main-box .grid.left .question {
  display: block;
  font-size: .875rem;
  padding: .125rem 0rem 0 1.5rem;
  background: url(../img/asset__icon-question.png) 0% 50% no-repeat;
  background-size: auto 1rem;
  cursor: pointer;
  transition: .4s;
}

.detail__main-box .select-item {
  display: inline-block;
  border: #7f7f7f solid 0.0625rem;
  background: url(../img/asset__select-arrow.png) calc(100% - .5rem) 50% no-repeat;
  background-size: .75rem auto;
  padding-right: 1rem;
}

.detail__main-box .select-item select {
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  box-shadow: none;
  background: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  box-shadow: none;
  height: 2rem;
  padding: 0 2rem 0 1rem;
  font-size: .875rem;
  color: #7f7f7f;
  background: transparent;
}

.detail__main-box .select-item input[name="quantity"] {
  width: 3rem;
}

.detail__main-box .submit-button {
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  box-shadow: none;
  background: none;
  display: block;
  width: 100%;
  background: #7dae12;
  height: 3.125rem;
  line-height: 3.125rem;
  padding: 0 1rem;
  font-size: 1.25rem;
  border-radius: .25rem;
  color: #fff;
  transition: .4s;
}

.detail__main-box .text-group {
  font-size: .875rem;
  margin: 1rem 0 2rem;
}

.detail__main-box .text-group p {
  margin: 0 0 2rem;
}

.detail__main-box .button-to-comment {
  font-size: 1.125rem;
  color: #7f7f7f;
  background: url(../img/asset__icon-bullet-down.png) 0% 50% no-repeat;
  background-size: 1.125rem auto;
  padding-left: 1.5rem;
  display: block;
  font-weight: 700;
  transition: .4s;
  margin: 1rem 0 2rem;
}

.detail__main-box .item-image {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  transition: .4s;
  position: relative;
  border: #A4A4A4 solid .0625rem;
}

.detail__main-box .item-image:before {
  content: '';
  display: block;
  width: 100%;
  padding: 100% 0 0;
}

.detail__main-box .row.thumbnail-group {
  flex-wrap: wrap;
  margin: .5rem -.5rem;
}

.detail__main-box .row.thumbnail-group .slick-prev,
.detail__main-box .row.thumbnail-group .slick-next {
  font-size: 0;
  line-height: 0;
  position: absolute;
  top: 50%;
  display: block;
  width: 20px;
  height: 20px;
  padding: 0;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer;
  color: transparent;
  outline: none;
  background: transparent;
  font-size: 0 !important;
}

.detail__main-box .row.thumbnail-group .slick-prev {
  left: -5px;
  z-index: 9;
  display: inline-block;
  padding: 0 0 0 16px;
  color: #000;
  vertical-align: middle;
  text-decoration: none;
}

.detail__main-box .row.thumbnail-group .slick-prev::before,
.detail__main-box .row.thumbnail-group .slick-prev::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: .5rem;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.detail__main-box .row.thumbnail-group .slick-prev::before {
  content: '';
  background: url(../img/arrow_prev.svg) 50% 50% no-repeat;
  width: 3rem;
  height: 3rem;
}

.detail__main-box .row.thumbnail-group .slick-next {
  right: -5px;
  z-index: 9;
  display: inline-block;
  padding: 0 0 0 16px;
  color: #000;
  vertical-align: middle;
  text-decoration: none;
}

.detail__main-box .row.thumbnail-group .slick-next::before,
.detail__main-box .row.thumbnail-group .slick-next::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: .5rem;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.detail__main-box .row.thumbnail-group .slick-next::before {
  content: '';
  background: url(../img/arrow_next.svg) 50% 50% no-repeat;
  width: 3rem;
  height: 3rem;
}

.detail__main-box .item-thumbnail {
  width: calc((100% / 3) - 1rem);
  margin: .5rem;
  box-sizing: border-box;
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  transition: .4s;
  position: relative;
  border: #A4A4A4 solid .0625rem;
}

.detail__main-box .item-thumbnail:before {
  content: '';
  display: block;
  width: 100%;
  padding: 100% 0 0;
}

.detail__main-box .item-thumbnail.is--active {
  border: #7f7f7f solid 0.0625rem;
}

.detail__main-box .relational-items {
  padding: 0 2rem;
  margin: 2rem 0;
}

.detail__main-box .relational-items .title {
  font-size: 1.1875rem;
  font-weight: 200;
  margin-bottom: .5rem;
}

.detail__main-box .relational-items .row {
  margin: -.5rem;
}

.detail__main-box .relational-items .grid {
  width: calc((100% / 4) - 1rem);
  margin: .5rem;
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  transition: .4s;
  position: relative;
}

.detail__main-box .relational-items .grid:before {
  content: '';
  display: block;
  width: 100%;
  padding: 100% 0 0;
}

.detail__main-box .relational-items a {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.detail__main-box .explanation {
  padding: 0 2rem;
  margin: 2rem 0;
  font-size: .875rem;
  line-height: 2;
}

.detail__main-box .explanation p {
  margin: 0 0 2rem;
}

.detail__comment .container {
  border-bottom: dashed 0.0625rem #7f7f7f;
  padding-bottom: 3rem;
}

.detail__comment .header {
  position: relative;
}

.detail__comment .title {
  height: 3.125rem;
  line-height: 3.125rem;
  font-size: 1.125rem;
  font-weight: 700;
  padding: 0 0 0 1.5rem;
  position: relative;
}

.detail__comment .title:before {
  content: '';
  display: block;
  background: #7dae12;
  width: .5rem;
  height: 2rem;
  position: absolute;
  margin: -1rem 0 0 0;
  top: 50%;
  left: 0;
}

.detail__comment .button-contribute {
  height: 3.125rem;
  line-height: 3.125rem;
  padding: 0 1rem;
  font-size: 1.125rem;
  color: #fff;
  background: #7dae12;
  color: #fff;
  display: inline-block;
  text-align: center;
  font-weight: 700;
  transition: .4s;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  min-width: 14.375rem;
  border-radius: .25rem;
}

.detail__comment .body.row {
  margin: 2rem -1rem;
  flex-wrap: wrap;
}

.detail__comment .grid.comment {
  width: calc(50% - 2rem);
  margin: 3rem 1rem;
}

.detail__comment .user {
  position: relative;
  margin-bottom: 1rem;
}

.detail__comment .username {
  font-size: 1.25rem;
  font-weight: 700;
}

.detail__comment .username:after {
  content: '　さん';
  font-size: .875rem;
  font-weight: 200;
}

.detail__comment .rating {
  position: absolute;
  right: 0;
  top: 0;
  color: #7dae12;
  font-size: 1rem;
}

.detail__comment .rating.zero:before {
  content: '☆☆☆☆☆';
}

.detail__comment .rating.one:before {
  content: '★☆☆☆☆';
}

.detail__comment .rating.two:before {
  content: '★★☆☆☆';
}

.detail__comment .rating.three:before {
  content: '★★★☆☆';
}

.detail__comment .rating.four:before {
  content: '★★★★☆';
}

.detail__comment .rating.five:before {
  content: '★★★★★';
}

.detail__comment .footer {
  text-align: center;
}

.detail__comment .button-all {
  height: 2rem;
  line-height: 2rem;
  width: auto;
  min-width: 4.5rem;
  background: #7dae12;
  color: #fff;
  display: inline-block;
  text-align: center;
  font-weight: 700;
  transition: .4s;
  padding: 0;
}

.detail__interested-items {
  margin: 5rem 0;
  font-size: .75rem;
}

.detail__interested-items .title {
  font-size: 1.1875rem;
  font-weight: 200;
  margin-bottom: .5rem;
}

.detail__interested-items .container {
  padding: 0 4rem;
}

.detail__interested-items .row {
  margin: -.5rem;
}

.detail__interested-items .grid {
  width: calc((100% / 4) - 1rem);
  margin: .5rem;
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  transition: .4s;
  position: relative;
}

.detail__interested-items .grid:before {
  content: '';
  display: block;
  width: 100%;
  padding: 100% 0 0;
}

.detail__interested-items a {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.detail__sidefixed-box {
  box-sizing: border-box;
  width: 2.5rem;
  padding: 2rem 0.5rem;
  position: fixed;
  top: 70%;
  right: -12.5rem;
  background: #7dae12;
  border-top-left-radius: 5px;
  -webkit-border-top-left-radius: 5px;
  -moz-border-radius-topleft: 5px;
  border-bottom-left-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;
  -moz-border-radius-bottomleft: 5px;
  z-index: 1000;
  transform: translate(0, -50%);
  transition: .4s;
  opacity: .8;
}

.detail__sidefixed-box .title {
  padding: 0 2.25rem 0 0;
}

.detail__sidefixed-box .button-like {
  position: absolute;
  right: .5rem;
  top: .5rem;
  width: 1.875rem;
  height: 1.875rem;
  background: url(../img/asset__icon-like.png) 50% 50% no-repeat;
  background-size: cover;
  cursor: pointer;
  transition: .4s;
}

.detail__sidefixed-box .form-box-group {
  margin: 1rem 0;
}

.detail__sidefixed-box .form-box {
  position: relative;
  padding: 0 0 0 2rem;
  font-size: .75rem;
  margin: .5rem 0;
}

.detail__sidefixed-box .form-box input[type=radio] {
  display: none;
}

.detail__sidefixed-box .form-box .input-radio {
  transition: .4s;
}

.detail__sidefixed-box .form-box .input-radio:before {
  content: '';
  border: none;
  box-shadow: none;
  position: absolute;
  border: #7f7f7f solid 0.0625rem;
  border-radius: 50%;
  display: block;
  width: 1rem;
  height: 1rem;
  left: 0;
  top: .25rem;
  transition: .4s;
}

.detail__sidefixed-box .form-box input[type=radio]:checked + .input-radio:before {
  color: #7f7f7f;
  text-align: center;
  line-height: 1rem;
  content: '●';
  font-size: .5625rem;
  transition: .4s;
}

.detail__sidefixed-box .submit-button {
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  box-shadow: none;
  background: none;
  display: block;
  width: 100%;
  background: #7dae12;
  height: 2rem;
  line-height: 2rem;
  padding: 0 1rem;
  font-size: .75rem;
  border-radius: .25rem;
  color: #fff;
  transition: .4s;
  margin: 1rem 0;
}

.detail__sidefixed-box.is--active {
  right: 0;
}

/* product_review ====================== */
#product_review_recommend_level {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}

#product_review_recommend_level label {
  position: relative;
  bottom: 0;
  left: 20px;
  line-height: normal;
}

#product_review_recommend_level label span {
  position: relative;
  top: -5px;
}

/* column list ====================== */
.column-list__list {
  margin: 5rem 0;
}

.column-list__list .container {
  max-width: 1000px;
}

.column-list__list .button-sort {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  box-shadow: none;
  color: #fff;
  display: inline-block;
  background: #589CA3;
  height: 1.5rem;
  line-height: 1.5rem;
  border-radius: .25rem;
  transition: .4s;
  padding: 0 1rem;
  vertical-align: middle;
  font-size: .875rem;
}

.column-list__list .checkbox-group {
  margin: 2rem 0;
  font-size: .875rem;
}

.column-list__list label {
  transition: .4s;
  display: inline-block;
  margin-right: 3rem;
  position: relative;
  padding-left: 1.5rem;
}

.column-list__list .button-sort:hover {
  opacity: .8;
}

.column-list__list label:hover {
  opacity: .8;
}

.column-list__list input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: none;
}

.column-list__list input + label:before {
  content: '';
  display: inline-block;
  border: #543F38 solid .0625rem;
  box-shadow: none;
  height: 1rem;
  width: 1rem;
  vertical-align: top;
  margin-right: .5rem;
  position: absolute;
  top: 0rem;
  left: 0;
}

.column-list__list input:checked + label:after {
  content: '✓';
  display: inline-block;
  font-size: 1rem;
  position: absolute;
  left: 0rem;
  top: -.125rem;
}

.column-list__list .row {
  flex-wrap: wrap;
  margin: -.5rem;
}

.column-list__list .grid {
  transition: .4s;
}

.column-list__list .three-column.row {
  margin-bottom: 2.5rem;
}

.column-list__list .three-column .grid {
  width: calc((100% / 3) - 1rem);
  margin: .5rem;
}

.column-list__list .three-column .grid .thumbnail {
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

.column-list__list .three-column .grid .thumbnail:before {
  content: '';
  display: block;
  width: 100%;
  padding: 60.9467455621302% 0 0;
}

.column-list__list .three-column .grid .label {
  display: inline-block;
  min-width: 5.625rem;
  line-height: 1.25rem;
  padding: 5px 5px;
  font-size: 12px;
  background-color: #7dae12;
  color: #fff;
  margin: .5rem 0;
  text-align: center;
  white-space: nowrap;
}

.column-list__list .three-column .grid.skincare .label {
  background-color: #7DAE21;
}

.column-list__list .three-column .grid.make .label {
  background-color: #7DAE21;
}

.column-list__list .three-column .grid.other .label {
  background-color: #7DAE21;
}

.column-list__list .three-column .grid .column-title {
  font-size: 14px;
  font-weight: 700;
  margin: 5px 0 .5rem;
}

.column-list__list .three-column .grid .text {
  font-size: .75rem;
}

.column-list__list .two-column .grid {
  width: calc((100% / 2) - 1rem);
  margin: .5rem;
}

.column-list__list a {
  display: block;
  color: #7f7f7f;
}

/* column detail ====================== */
.column-detail__header {
  margin: 4rem 0;
}

.column-detail__header .container {
  max-width: 1000px;
}

.column-detail__header .title {
  font-size: 1.5rem;
  color: #4F4B49;
  font-weight: 700;
}

.column-detail__header .tag-group {
  margin: 1rem 0;
}

.column-detail__header .tag {
  display: inline-block;
  color: #fff;
  height: 1.25rem;
  font-size: 14px;
  line-height: 1.25rem;
  background: #7DAE21;
  padding: 5px 5px;
}

.column-detail__header .date {
  font-size: .875rem;
}

.column-detail__main {
  font-size: .875rem;
  line-height: 2;
  margin: 4rem 0;
}

.column-detail__main .container {
  max-width: 1000px;
  padding: 0 50px;
  box-sizing: border-box;
}

.column-detail__main p {
  margin: 2rem 0;
}

.column-detail__main .row.frame {
  margin: 0 -1rem;
}

.column-detail__main .image-group {
  display: flex;
  margin: 0 -.25rem;
  padding: .25rem 0;
  flex-wrap: wrap;
}

.column-detail__main .image {
  display: block;
  margin: .25rem;
  width: calc((100% / 1) - .5rem);
  background-color: #ccc;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  text-decoration: none;
  overflow: hidden;
}

.column-detail__main .image:after {
  content: '';
  display: block;
  padding: 50% 0 0;
}

.column-detail__main .image-group .image.is--w50 {
  width: calc((100% / 2) - .5rem);
}

.column-detail__main .image-group .image.is--w50:after {
  padding: 100% 0 0;
}

.column-detail__main .image-group .image.is--w100 {
  width: calc((100% / 1) - .5rem);
}

.column-detail__main .image-group .image.is--w100:after {
  padding: 50% 0 0;
}

.column-detail__relational-items {
  padding: 0 2rem;
  margin: 4rem 0;
}

.column-detail__relational-items .container {
  max-width: 1000px;
}

.column-detail__relational-items h2 {
  margin: 0 0 36px;
  padding: 2px 0 1px 10px;
  line-height: 1;
  border-left: 5px solid #7dae12;
  font-size: 18px;
}

.column-detail__relational-items .title {
  font-size: 1.1875rem;
  font-weight: 200;
  margin-bottom: .5rem;
}

.column-detail__relational-items .row {
  margin: -.5rem;
}

.column-detail__relational-items .grid {
  width: calc((100% / 4) - 1rem);
  margin: .5rem;
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  transition: .4s;
  position: relative;
}

.column-detail__relational-items .grid:before {
  content: '';
  display: block;
  width: 100%;
  padding: 100% 0 0;
}

.column-detail__relational-items a {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.column-detail__relational-article {
  margin: 5rem 0;
}

.column-detail__relational-article .container {
  width: 100%;
  max-width: 1000px;
}

.column-detail__relational-article h2 {
  margin: 0 0 36px;
  padding: 2px 0 1px 10px;
  line-height: 1;
  border-left: 5px solid #7dae12;
  font-size: 18px;
}

.column-detail__relational-article .row {
  flex-wrap: wrap;
  margin: -.5rem;
}

.column-detail__relational-article .grid {
  transition: .4s;
}

.column-detail__relational-article .three-column.row {
  margin-bottom: 2.5rem;
}

.column-detail__relational-article .three-column .grid {
  width: calc((100% / 3) - 1rem);
  margin: .5rem;
}

.column-detail__relational-article .three-column .grid .thumbnail {
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

.column-detail__relational-article .three-column .grid .thumbnail:before {
  content: '';
  display: block;
  width: 100%;
  padding: 60.9467455621302% 0 0;
}

.column-detail__relational-article .three-column .grid .label {
  display: inline-block;
  min-width: 5.625rem;
  height: 1.25rem;
  line-height: 1.25rem;
  padding: 0 .25rem;
  font-size: .75rem;
  background-color: #7dae12;
  color: #fff;
  margin: .5rem 0;
  text-align: center;
}

.column-detail__relational-article .three-column .grid.skincare .label {
  background-color: #7DAE21;
}

.column-detail__relational-article .three-column .grid.make .label {
  background-color: #7DAE21;
}

.column-detail__relational-article .three-column .grid.other .label {
  background-color: #7DAE21;
}

.column-detail__relational-article .three-column .grid .column-title {
  font-size: 14px;
  font-weight: 700;
  margin: 5px 0 .5rem;
}

.column-detail__relational-article .three-column .grid .text {
  font-size: .75rem;
}

.column-detail__relational-article .two-column .grid {
  width: calc((100% / 2) - 1rem);
  margin: .5rem;
}

.column-detail__relational-article a {
  display: block;
  color: #7f7f7f;
}

.column-detail__columns {
  margin: 5rem 0;
}

.column-detail__columns .container {
  width: 100%;
  max-width: 1000px;
}

.column-detail__columns h2 {
  margin: 0 0 36px;
  padding: 2px 0 1px 10px;
  line-height: 1;
  border-left: 5px solid #7dae12;
  font-size: 18px;
}

.column-detail__columns .row {
  flex-wrap: wrap;
  margin: -.5rem;
}

.column-detail__columns .grid {
  transition: .4s;
}

.column-detail__columns .three-column.row {
  margin-bottom: 2.5rem;
}

.column-detail__columns .three-column .grid {
  width: calc((100% / 3) - 1rem);
  margin: .5rem;
}

.column-detail__columns .three-column .grid .thumbnail {
  background-color: #ccc;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

.column-detail__columns .three-column .grid .thumbnail:before {
  content: '';
  display: block;
  width: 100%;
  padding: 60.9467455621302% 0 0;
}

.column-detail__columns .three-column .grid .label {
  display: inline-block;
  min-width: 5.625rem;
  height: 1.25rem;
  line-height: 1.25rem;
  padding: 0 .25rem;
  font-size: .75rem;
  background-color: #7dae12;
  color: #fff;
  margin: .5rem 0;
  text-align: center;
}

.column-detail__columns .three-column .grid.skincare .label {
  background-color: #7DAE21;
}

.column-detail__columns .three-column .grid.make .label {
  background-color: #7DAE21;
}

.column-detail__columns .three-column .grid.other .label {
  background-color: #7DAE21;
}

.column-detail__columns .three-column .grid .column-title {
  font-size: 14px;
  font-weight: 700;
  margin: 5px 0 .5rem;
}

.column-detail__columns .three-column .grid .text {
  font-size: .75rem;
}

.column-detail__columns .two-column .grid {
  width: calc((100% / 2) - 1rem);
  margin: .5rem;
}

.column-detail__columns a {
  display: block;
  color: #7f7f7f;
}

.column-detail__link {
  text-align: center;
}

.column-detail__link a {
  color: #7dae12;
  position: relative;
  display: inline-block;
  padding: 0 16px 0 0;
  vertical-align: middle;
  text-decoration: none;
  font-size: 15px;
}

.column-detail__link a:before,
.column-detail__link a:after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.column-detail__link a:before {
  width: 12px;
  height: 12px;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  border: 1px solid #7dae12;
}

.column-detail__link a:after {
  right: 6px;
  width: 3px;
  height: 3px;
  border-top: 1px solid #7dae12;
  border-right: 1px solid #7dae12;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.column-detail__link a:hover:before {
  background: #7dae12;
}

.column-detail__link a:hover:after {
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
}

/* =================================== */
/* HTML module                         */
/* =================================== */
.is--table {
  display: table;
}

.is--table-cell {
  display: table-cell;
  vertical-align: top;
}

.is--mobile {
  display: none;
}

@media screen and (max-width: 750px) {
  .is--mobile {
    display: block;
  }
}

img.is--mobile,
br.is--mobile {
  display: none;
}

@media screen and (max-width: 750px) {
  img.is--mobile,
  br.is--mobile {
    display: inline-block;
  }
}

.is--fullscreen {
  display: block;
}

@media screen and (max-width: 750px) {
  .is--fullscreen {
    display: none;
  }
}

img.is--fullscreen,
br.is--fullscreen,
span.is--fullscreen {
  display: inline-block;
}

@media screen and (max-width: 750px) {
  img.is--fullscreen,
  br.is--fullscreen,
  span.is--fullscreen {
    display: none;
  }
}

.is--text-l {
  font-size: 1.2em;
}

.is--text-s {
  font-size: 0.86em;
}

.is--text-ss {
  font-size: 0.75em;
}

.is--align-center {
  text-align: center;
}

.is--align-left {
  text-align: left;
}

.is--align-right {
  text-align: right;
}

/* =================================== */
/* EC-CUBE Customize                   */
/* =================================== */
.ec-role {
  box-sizing: border-box;
  width: 100%;
  max-width: 900px;
  /* 1080px */
  color: #7f7f7f;
  font-size: 14px;
  line-height: 1.5;
  padding: 0 1.25rem;
  margin: 0 auto;
  position: relative;
}

.ec-shelfRole {
  font-size: .75rem;
}

/* module ====================== */
/* header  ------------------------ */
h1.weleda {
  font-size: 14px;
  font-size: 1.4rem;
  font-family: newweledaregular, sans-serif !important;
  color: #bfbfbf;
}

h1.product {
  font-size: 32px;
  font-size: 3.2rem;
  color: #4e4e4e;
  /* margin-top: 5px; */
  font-weight: bold;
}

h1.tac {
  text-align: center;
  background-color: transparent;
  padding: 0;
}

h1.mt-icon {
  margin-top: 10px;
}

.ec-pageHeader h1,
.headLine02,
.ec-pageHeader-cart h1,
.section-title,
h1.page-title {
  font-size: 3rem;
  text-align: center;
  margin-top: 3rem;
  margin-bottom: 5rem;
  color: #58595B;
  border-top: none !important;
  border-bottom: none !important;
  font-weight: 400;
  background: transparent;
}

.ec-heading-bold {
  font-size: 1rem;
  font-weight: 700;
  margin: 1rem 0 .5rem;
}

.ec-modal-title {
  margin-bottom: 2rem;
}

.ec-rectHeading h1, .ec-rectHeading h2, .ec-rectHeading h3, .ec-rectHeading h4, .ec-rectHeading h5, .ec-rectHeading h6 {
  background: none;
  padding: .5rem 0;
  border-bottom: solid 1px #c9caca;
  margin-bottom: 1rem;
  font-weight: normal;
  color: #7f7f7f;
}

.ec-rectHeading h2 > a {
  color: #7dae12;
  position: relative;
  display: inline-block;
  padding: 0 20px 0 0;
  vertical-align: middle;
  text-decoration: none;
  font-size: 14px;
  float: right;
}

.ec-rectHeading h2 > a:before,
.ec-rectHeading h2 > a:after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  content: "";
  vertical-align: middle;
}

.ec-rectHeading h2 > a:before {
  width: 15px;
  height: 15px;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  border: 1px solid #7dae12;
}

.ec-rectHeading h2 > a:after {
  right: 6px;
  width: 5px;
  height: 5px;
  border-top: 1px solid #7dae12;
  border-right: 1px solid #7dae12;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

/* button  ------------------------ */
.ec-blockBtn--action {
  background: #7dae12;
  border-color: #7dae12;
  border-radius: .25rem;
  line-height: 100%;
  padding: 2rem 2rem;
  font-weight: normal;
  color: #FFF !important;
  box-sizing: border-box;
  height: auto;
}

.ec-blockBtn--action:hover {
  background: #90C75B !important;
  border-color: #90C75B !important;
}

.ec-blockBtn--action.dropdown-toggle, .ec-blockBtn--action:active, .ec-blockBtn--action:focus {
  background: #90C75B !important;
  border-color: #90C75B !important;
}

.ec-blockBtn--action.small {
  padding: .3rem 0;
}

.ec-blockBtn--action + .ec-blockBtn--action {
  margin-top: .5rem;
}

.ec-inlineBtn--action {
  color: #FFF !important;
  background: #7dae12;
  border-color: #7dae12;
  border-radius: .25rem;
  line-height: 100%;
  padding: 1rem 2rem;
  box-sizing: border-box;
  height: auto;
  font-weight: 400;
}

.ec-inlineBtn--action:hover {
  background: #90C75B;
  border-color: #90C75B;
}

.ec-inlineBtn--action.dropdown-toggle, .ec-inlineBtn--action:active, .ec-inlineBtn--action:focus {
  background: #90C75B !important;
  border-color: #90C75B !important;
}

.ec-inlineBtn--action.small {
  padding: .3rem 0;
}

.ec-inlineBtn--action + .ec-inlineBtn--action {
  margin-top: .5rem;
}

.ec-blockBtn--cancel {
  background: #bdbdbd;
  border-color: #bdbdbd;
  border-radius: .25rem;
  line-height: 100%;
  padding: 2rem 2rem;
  box-sizing: border-box;
  height: auto;
  color: #FFF !important;
}

.ec-blockBtn--cancel:hover {
  background: #D9D9D9;
  border-color: #D9D9D9;
}

.ec-blockBtn--cancel.dropdown-toggle, .ec-blockBtn--cancel:active, .ec-blockBtn--cancel:focus {
  background: #D9D9D9 !important;
  border-color: #D9D9D9 !important;
}

.ec-blockBtn--cancel.small {
  padding: .3rem 0;
}

.ec-blockBtn--cancel + .ec-blockBtn--cancel {
  margin-top: .5rem;
}

.ec-inlineBtn--cancel {
  background: #C1C1C1;
  border-color: #C1C1C1;
  border-radius: .25rem;
  font-weight: 400;
  height: auto;
  line-height: 100%;
  padding: 1rem 2rem;
  height: auto;
}

.ec-inlineBtn--cancel:hover {
  background: #D9D9D9;
  border-color: #D9D9D9;
}

.ec-inlineBtn--cancel.dropdown-toggle, .ec-inlineBtn--cancel:active, .ec-inlineBtn--cancel:focus {
  background: #D9D9D9 !important;
  border-color: #D9D9D9 !important;
}

.ec-inlineBtn--cancel.small {
  padding: .3rem 0;
}

.ec-inlineBtn {
  color: #FFF;
  background: #C1C1C1;
  border-color: #C1C1C1;
  border-radius: .25rem;
  font-weight: 200;
  height: auto;
  line-height: 100%;
  padding: 1rem 2rem;
}

.ec-inlineBtn:hover {
  color: #FFF;
  background: #D9D9D9;
  border-color: #D9D9D9;
}

.ec-inlineBtn.dropdown-toggle, .ec-inlineBtn:active, .ec-inlineBtn:focus {
  color: #FFF;
  background: #D9D9D9 !important;
  border-color: #D9D9D9 !important;
}

.ec-inlineBtn.small {
  padding: .3rem 0;
}

.ec-blockBtn--noaction {
  background: #7dae12;
  border-color: #7dae12;
  border-radius: .25rem;
  line-height: 100%;
  padding: 2rem 2rem;
  font-weight: normal;
  color: #FFF !important;
  box-sizing: border-box;
  height: auto;
  cursor: initial !important;
}

.ec-blockBtn--noaction:hover {
  opacity: 1 !important;
}

.ec-blockBtn--noaction {
  background: #7dae12;
  border-color: #7dae12;
  border-radius: .25rem;
  line-height: 100%;
  padding: 2rem 2rem;
  font-weight: normal;
  color: #FFF !important;
  box-sizing: border-box;
  height: auto;
  cursor: initial !important;
}

.ec-blockBtn--noaction:hover {
  opacity: 1 !important;
}

/* 特定商取引法に基づく表記====================== */
.ec-borderedDefs {
  border-top: 1px solid #e4e4e4;
}

.ec-borderedDefs dl {
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  padding: 0;
  border-bottom: 1px solid #e4e4e4;
}

.ec-borderedDefs dt,
.ec-borderedDefs dd {
  padding: 17px;
  line-height: 1.8;
}

.ec-borderedDefs dt {
  background: #f8fbf3;
}

/* LOGIN PAGE====================== */
.ec-grid3__cell2.ec-login__area {
  margin: auto;
}

.ec-login {
  margin: 0 16px;
  padding: 30px 50px 60px;
  font-size: 1.3rem;
}

.ec-login .ec-blockBtn--action {
  padding: 1rem 2rem;
}

/* CART PAGE====================== */
.ec-cartRole
.ec-cartRole .ec-cartRow__sutbtotal .title,
.ec-cartRole .ec-cartRole__total .title {
  width: 50%;
  display: inline-block;
  text-align: left;
  margin-left: 0;
}

.ec-cartRole .ec-cartRole__subtotalAmount,
.ec-cartRole .ec-cartRole__totalAmount {
  font-size: 24px;
  width: 50%;
  display: inline-block;
  text-align: right;
  margin-left: 0;
}

.ec-cartRole {
  color: #7f7f7f;
}

.ec-cartRole .ec-cartRole__cart {
  margin: 2rem 10%;
}

.ec-cartRole .ec-cartRole__form {
  margin: 0 auto;
  width: 100%;
  max-width: 900px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.ec-cartRole .ec-cartRole__form .ec-cartRole__cart {
  margin: 2rem 0;
}

.ec-cartRole .ec-cartRole__actions {
  width: 25%;
  margin-right: 0;
}

.ec-cartRole__progress {
  margin-bottom: 2rem;
}

.ec-progress .ec-progress__number {
  background: #FFF;
  color: #7dae12;
  border: solid 1px #7dae12;
}

.ec-progress .ec-progress__label {
  font-weight: 200;
}

.ec-progress .ec-progress__item:after {
  background: #7dae12;
  height: 0.1em;
  top: 1.5em;
}

.ec-progress .is-complete .ec-progress__number {
  background: #7dae12;
  color: #FFF;
}

.ec-progress .is-complete .ec-progress__label {
  color: #7f7f7f;
  font-weight: 200;
  color: #7dae12;
}

.ec-progress .is-complete .ec-progress__item:after {
  background: #7dae12;
}

.ec-cartRole__totalText {
  margin-bottom: 0;
}

.ec-cartHeader .ec-cartHeader__label {
  background: #f3f3f3;
  font-weight: normal;
  border-left: dashed 1px #c9caca;
  border-bottom: solid 1px #c9caca;
}

.ec-cartHeader .ec-cartHeader__label:nth-of-type(1) {
  border-left: none;
}

.ec-cartRow .ec-cartRow__contentColumn,
.ec-cartRow .ec-cartRow__amountColumn,
.ec-cartRow .ec-cartRow__subtotalColumn,
.ec-cartRow .ec-cartRow__delColumn {
  padding: 10px;
  border-left: dashed 1px #c9caca;
  border-bottom: solid 1px #c9caca;
}

.ec-cartRow .ec-cartRow__delColumn .ec-inlineBtn--cancel {
  padding: .5rem;
}

.ec-cartRow .ec-cartRow__amountColumn .ec-cartRow__amountDownButton {
  border: 2px solid #7f7f7f;
}

.ec-cartRow .ec-cartRow__amountColumn .ec-cartRow__amountUpButton {
  border: 2px solid #7f7f7f;
}

.ec-cartRow .ec-cartRow__contentColumn {
  border-left: none;
}

.ec-cartRow .ec-cartRow__summary {
  font-weight: 200;
  font-size: .875rem;
  width: 70%;
}

.ec-cartRow .ec-cartRow__sutbtotal {
  border-bottom: dotted 1px #c9caca;
}

.ec-cartRow .ec-cartRow__sutbtotal {
  padding: 15px 0 0 0;
  text-align: right;
}

/* ORDER PAGE====================== */
.ec-orderRole {
  box-sizing: border-box;
  width: 100%;
  font-size: 14px;
  max-width: 900px;
  /* 1080px */
  color: #7f7f7f;
  line-height: 1.5;
  padding: 0 1.25rem;
  margin: 0 auto;
  position: relative;
}

.ec-orderRole .ec-imageGrid__content_confirm {
  vertical-align: top;
  display: table-cell;
}

.ec-imageGrid {
  border-top: 1px dashed #c9caca;
}

.ec-borderedList li {
  border-bottom: 1px dashed #c9caca;
}

input[type="radio"] {
  display: none;
}

input[type="radio"] + label {
  padding-left: 20px;
  position: relative;
  margin-right: 20px;
  vertical-align: top;
}

input[type="radio"] + label::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #7f7f7f;
  border-radius: 50%;
}

input[type="radio"]:checked + label::after {
  content: "";
  display: block;
  position: absolute;
  top: 3px;
  left: 3px;
  width: 9px;
  height: 9px;
  background: #7f7f7f;
  border-radius: 50%;
}

input[type="checkbox"] {
  display: none;
}

input[type="checkbox"] + label {
  padding-left: 20px;
  position: relative;
  margin-right: 20px;
  line-height: 100%;
}

input[type="checkbox"] + label::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #7f7f7f;
}

input[type="checkbox"]:checked + label::after {
  content: "";
  display: block;
  border-left: 2px solid #7dae12;
  border-bottom: 2px solid #7dae12;
  width: 15px;
  height: 9px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  left: 0;
  top: 0;
  position: absolute;
}

.ec-input input, .ec-halfInput input, .ec-numberInput input, .ec-zipInput input, .ec-telInput input, .ec-select input, .ec-birth input {
  color: #7f7f7f;
  border: solid 0.0625rem #7f7f7f;
  border-radius: 0;
}

.ec-input select, .ec-halfInput select, .ec-numberInput select, .ec-zipInput select, .ec-telInput select, .ec-select select, .ec-birth select {
  color: #7f7f7f;
  border: solid 0.0625rem #7f7f7f;
  border-radius: 0;
}

.ec-input textarea, .ec-halfInput textarea, .ec-numberInput textarea, .ec-zipInput textarea, .ec-telInput textarea, .ec-select textarea, .ec-birth textarea {
  color: #7f7f7f;
  border: solid 0.0625rem #7f7f7f;
  border-radius: 0;
}

.ec-telInput input {
  max-width: 15em;
}

.ec-zipInput input {
  margin-bottom: 0;
}

.ec-zipInputHelp span {
  color: #7dae12;
}

.ec-totalBox .ec-totalBox__btn {
  margin-top: 1rem;
}

.ec-totalBox .ec-totalBox__btn .ec-blockBtn--action {
  margin-bottom: .5rem;
}

.ec-totalBox .ec-totalBox__specItem {
  position: relative;
  border-bottom: 1px dotted #ccc;
  margin-bottom: 10px; }
  .ec-totalBox .ec-totalBox__specItem dt {
    font-weight: normal;
    position: relative;
    width: 72%;
    top: 0;
    left: 0;
    text-align: left; }
  .ec-totalBox .ec-totalBox__specItem dd {
    position: absolute;
    width: 28%;
    top: 0;
    right: 0;
    text-align: right; }

.ec-select {
  display: inline-block;
  border: #333333 solid 0.0625rem;
  background: url(../img/asset__select-arrow.png) calc(100% - .5rem) 50% no-repeat;
  background-size: .75rem auto;
  line-height: normal;
}

.ec-select select {
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  box-shadow: none;
  background: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  box-shadow: none;
  padding: 0 2rem 0 1rem;
  color: #333333;
  background: transparent;
}

.ec-selects .caution {
  margin-top: 0.5em;
  font-size: small;
}

.ec-birth select {
  margin: 0;
}

.ec-checkbox {
  margin-bottom: 1rem;
}

.ec-checkbox label {
  display: inline-block;
}

.ec-orderAccount {
  margin-bottom: 30px;
}

.ec-orderTeiki {
  margin-bottom: 30px;
}

.ec-orderTeiki .ec-definitions dt {
  vertical-align: top;
}

.ec-orderTeiki .ec-input input {
  margin-bottom: 5px;
}

.ec-orderTeiki .btn-area {
  margin-bottom: 30px;
}

.ec-orderTeiki .dl_table {
  display: table;
}

.ec-orderTeiki .dl_table dl {
  display: table-row;
  height: 30px;
}

.ec-orderTeiki .dl_table dt {
  width: 30%;
  font-weight: normal;
}

.ec-orderTeiki .dl_table dt,
.ec-orderTeiki .dl_table dd {
  display: table-cell;
  white-space: nowrap;
}

.ec-orderDelivery {
  margin-bottom: 30px;
}

.ec-orderDelivery .ec-imageGrid {
  border-top: 0;
}

.ec-orderDelivery .ec-selects {
  border-bottom: 0;
}

.ec-orderDelivery .ec-orderDelivery__address {
  position: relative;
  width: 85%;
}

.ec-orderDelivery .ec-orderDelivery__change {
  right: -80px;
  top: 0;
}

.ec-imageGrid__content_confirm .product-name {
  margin-top: 1.5em;
}

.ec-imageGrid__content_confirm .teiki-delivery-date {
  margin-top: 1em;
  margin-bottom: 1em;
  font-size: small;
}

.ec-imageGrid__content_confirm .teiki-delivery-date .caution {
  font-size: smaller;
  margin-top: 0.5em;
}

.ec-imageGrid__content_confirm .item-price-subtotal {
  margin-top: 1em;
  margin-bottom: 1em;
}

#gmo_payment_gateway_credit_form.ec-orderPayment {
  background: #f3f3f3;
  padding: 1rem 2rem;
}

#gmo_payment_gateway_credit_form.ec-orderPayment #div#shopping_order_payment_type_1_body {
  padding-left: 2rem;
}

.ec-orderPayment {
  margin-bottom: 30px;
}

.ec-orderCoupon {
  margin-bottom: 30px;
}

.ec-orderPayment {
  margin-bottom: 30px;
}

.ec-orderPayment .ec-paymentPeriod {
    margin-top: 1em;
    font-size: small;
}

.ec-paymentNotice-asterisk a {
  color: #7dae12;
}

.ec-paymentNotice-asterisk {
  margin-bottom: 20px;
}

.ec-paymentNotice-asterisk p {
  margin-bottom: 1rem;
}

.ec-paymentNotice {
  margin-bottom: 20px;
}

.ec-paymentNotice  a {
  color: #7dae12;
}

#shopping_order_payment_type_1_body .dl_table {
  margin-top: 2rem;
}

.ec-definitions dt,
.ec-definitions--soft dt {
  font-weight: 200;
}

.ec-definitions dt:after,
.ec-definitions--soft dt:after {
  content: '：';
}

#a8sales img {
  height: 0;
}

/* 新規会員登録 PAGE====================== */
.ec-registerRole__actions .ec-checkbox {
  text-align: center;
}

.ec-registerRole__actions .ec-checkbox a {
  text-decoration: underline;
  margin-left: 10px;
}

#form_search_salon {
  margin-bottom: 1rem;
}

#form_search_salon input#show_salon_id {
  background: #fff;
  width: 60%;
  margin: 0 1rem;
}

#form_search_salon #modal_search_salon {
  width: auto;
  display: inline-block;
  height: auto;
  padding: .5rem;
  line-height: initial;
  margin: 0;
}

/* MYPAGE PAGE====================== */
.ec-mypageRole {
  box-sizing: border-box;
  width: 100%;
  font-size: 14px;
  max-width: 900px;
  /* 1080px */
  color: #7f7f7f;
  line-height: 1.5;
  padding: 0 1.25rem;
  margin: 0 auto;
  position: relative;
}

.ec-welcomeMsg {
  color: #7f7f7f;
  line-height: 200%;
  font-size: 14px;
}

.ec-navlistRole .ec-navlistRole__navlist, .ec-navlistHistoryRole .ec-navlistHistoryRole__navlist {
  border-color: #7dae12;
}

.ec-navlistRole .ec-navlistRole__item,
.ec-navlistHistoryRole .ec-navlistHistoryRole__item {
  width: 100%;
  border-color: #7dae12;
  font-weight: 200;
}

.ec-navlistRole .ec-navlistRole__navlist a,
.ec-navlistHistoryRole .ec-navlistHistoryRole__navlist a {
  color: #7dae12;
  text-decoration: none;
  white-space: nowrap;
}

.ec-navlistRole .active a,
.ec-navlistHistoryRole .active a {
  background: #7dae12;
  color: #FFF;
}

.ec-navlistRole .active a:hover,
.ec-navlistHistoryRole .active a:hover {
  background: #90C75B;
}

.ec-addressList__remove input[type="radio"] {
  display: none;
}

.table-salon .salon-header {
  height: 40px;
  color: #444656;
  background: #f0f8fa;
  cursor: default;
}

.table-salon .salon-header:hover {
  height: 40px;
  color: #444656;
  background: #f0f8fa;
}

.ec-mypageRole .ec-halfInput p.ec-errorMessage {
  display: inline-block;
}

.entry-form .ec-halfInput p.ec-errorMessage {
  display: inline-block;
}

#entry_address_pref + p.ec-errorMessage {
  margin-bottom: -20px;
}

/* HISTORY PAGE====================== */
/*.ec-welcomeMsg {
    display:none;
}*/
.ec-informationRole {
  margin: 2rem 0;
}

.ec-informationRole .ec-off2Grid__cell {
  background: #f3f3f3;
  padding: 1.5rem;
  width: 50%;
  margin-left: 0;
}

.ec-informationRole .ec-off2Grid__cell:first-child {
  margin-right: 1rem;
}

.ec-informationRole .ec-off2Grid__cell h3 {
  border-bottom: solid 1px #000;
  margin-bottom: 1rem;
  padding-bottom: .5rem;
}

.ec-informationRole .mypage-information ul,
.ec-informationRole .mypage-coupons ul {
  padding: 0.5em;
  list-style-type: none;
}

.ec-informationRole .mypage-information ul li,
.ec-informationRole .mypage-coupons ul li {
  position: relative;
  padding: 0em 0.3em 0.3em 1.3em;
}

.ec-informationRole .mypage-information ul li:before,
.ec-informationRole .mypage-coupons ul li:before {
  position: absolute;
  content: '';
  top: 0.5em;
  left: 0.2em;
  height: 0;
  width: 0;
  border-style: solid;
  border-width: 3px 0 3px 5px;
  border-color: transparent transparent transparent #7dae12;
}

.ec-informationRole .mypage-information .forlist,
.ec-informationRole .mypage-coupons .forlist {
  text-align: right;
  cursor: pointer;
}

#open-coupon-modal {
  cursor: pointer;
}

#mypage-coupon-modal .ec-modal-box {
  text-align: center;
  max-height: 40rem;
  overflow: auto;
}

.coupon-item {
  display: block;
  text-align: left;
  margin-top: 1rem;
  border: solid 1px #c9caca;
  padding: 1rem;
}

.coupon-item div {
  margin: 0 !important;
}

.coupon-item .coupon-item__name {
  font-size: 1.2rem;
  color: #7dae12;
}

#coupon_button {
  font-size: 120%;
  font-weight: 400;
  color: #7dae12;
}

#coupon_box__cd .form-error-icon {
  display: none;
}

.ec-teiki_orderRole {
  margin-bottom: 5rem;
}

.ec-teiki_orderRole h3 {
  margin-bottom: .5rem;
}

.ec-teiki_orderRole .ec-historyRole .ec-historyRole__head {
  background: #f3f3f3;
  display: flex;
}

.ec-teiki_orderRole .ec-historyRole .ec-historyRole__head .table-header {
  text-align: center;
}

.ec-teiki_orderRole .ec-historyRole .ec-historyRole__contents {
  color: #7f7f7f;
  padding-top: 0;
  padding-bottom: 0;
}

.ec-teiki_orderRole .ec-historyRole .ec-historyRole__detail {
  width: 20%;
  padding: 1rem;
}

.ec-teiki_orderRole .ec-historyRole .ec-historyRole__price {
  border-left: dashed 1px #c9caca;
  width: 20%;
  padding: 1rem;
}

.ec-teiki_orderRole .ec-historyRole .ec-historyRole__nextship {
  border-left: dashed 1px #c9caca;
  width: 15%;
  padding: 1rem;
  text-align: center;
}

.ec-teiki_orderRole .ec-historyRole .ec-historyRole__nextship .ec-inlineBtn--cancel {
  width: 45%;
  padding-left: 0;
  padding-right: 0;
}

.ec-teiki_orderRole .ec-historyRole .ec-historyRole__nextship p {
  margin-bottom: .5rem;
}

.ec-teiki_orderRole .ec-historyRole .ec-historyRole__address {
  border-left: dashed 1px #c9caca;
  width: 20%;
  padding: 1rem;
}

.ec-teiki_orderRole .ec-historyRole .ec-historyRole__shippingperiod {
  border-left: dashed 1px #c9caca;
  width: 10%;
  padding: 1rem;
  text-align: center;
  white-space: nowrap;
}

.ec-teiki_orderRole .ec-historyRole .ec-historyRole__changeorder {
  border-left: dashed 1px #c9caca;
  width: 15%;
  padding: 1rem;
}

.ec-teiki_orderRole .ec-definitions {
  margin: .5rem 0;
}

.ec-teiki_orderRole .ec-definitions dt {
  font-weight: 200;
  display: block;
}

.ec-regular_orderRole {
  margin-bottom: 5rem;
}

.ec-regular_orderRole h3 {
  margin-bottom: .5rem;
}

.ec-regular_orderRole .ec-historyRole .ec-historyRole__head {
  background: #f3f3f3;
  display: flex;
}

.ec-regular_orderRole .ec-historyRole .ec-historyRole__head .table-header {
  text-align: center;
}

.ec-regular_orderRole .ec-historyRole .ec-historyRole__contents {
  color: #7f7f7f;
  padding-top: 0;
  padding-bottom: 0;
}

.ec-regular_orderRole .ec-historyRole .ec-historyRole__detail {
  width: 20%;
  padding: 1rem;
}

.ec-regular_orderRole .ec-historyRole .ec-historyRole__price {
  border-left: dashed 1px #c9caca;
  width: 20%;
  padding: 1rem;
}

.ec-regular_orderRole .ec-historyRole .ec-historyRole__nextship {
  border-left: dashed 1px #c9caca;
  width: 15%;
  padding: 1rem;
  text-align: center;
}

.ec-regular_orderRole .ec-historyRole .ec-historyRole__nextship .ec-inlineBtn--cancel {
  width: 45%;
  padding-left: 0;
  padding-right: 0;
}

.ec-regular_orderRole .ec-historyRole .ec-historyRole__nextship p {
  margin-bottom: .5rem;
}

.ec-regular_orderRole .ec-historyRole .ec-historyRole__address {
  border-left: dashed 1px #c9caca;
  width: 20%;
  padding: 1rem;
}

.ec-regular_orderRole .ec-historyRole .ec-historyRole__shippingperiod {
  border-left: dashed 1px #c9caca;
  width: 10%;
  padding: 1rem;
  text-align: center;
  white-space: nowrap;
}

.ec-regular_orderRole .ec-historyRole .ec-historyRole__changeorder {
  border-left: dashed 1px #c9caca;
  width: 15%;
  padding: 1rem;
}

.ec-regular_orderRole .ec-definitions {
  margin: .5rem 0;
}

.ec-regular_orderRole .ec-definitions dt {
  font-weight: 200;
  display: block;
}

.ec-normal_orderRole h3 {
  margin-bottom: .5rem;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__head {
  background: #f3f3f3;
  display: flex;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__head .table-header {
  text-align: center;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__contents {
  color: #7f7f7f;
  padding-top: 0;
  padding-bottom: 0;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__header {
  width: 25%;
  padding: 1rem;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__header .ec-inlineBtn,
.ec-normal_orderRole .ec-historyRole .ec-historyRole__header .ec-inlineBtn--action {
  width: 45%;
  padding-left: 0;
  padding-right: 0;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__detail {
  border-left: dashed 1px #c9caca;
  width: 60%;
  padding: 1rem;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__detail .ec-imageGrid {
  border-top: none;
  margin-bottom: 1.5rem;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__detail .ec-historyRole__detailTitle {
  font-weight: 200;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__detail .ec-historyRole__detailPrice {
  font-weight: 200;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__detail .ec-imageGrid:nth-of-type(1) {
  border-top: none;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__detail .normal_order {
  background: #B5535D;
  color: #FFF;
  padding: 0.1rem 1rem;
  font-size: .7rem;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__detail .regular_order {
  background: #595959;
  color: #FFF;
  padding: 0.1rem 1rem;
  font-size: .7rem;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__shipping {
  border-left: dashed 1px #c9caca;
  width: 15%;
  padding: 1rem;
}

.ec-normal_orderRole .ec-historyRole .ec-historyRole__shipping .ec-imageGrid:nth-of-type(1) {
  border-top: none;
}

.ec-normal_orderRole .ec-definitions {
  margin: .5rem 0;
}

.ec-normal_orderRole .ec-definitions dt {
  font-weight: 200;
  display: block;
}

/* CARD LIST PAGE====================== */
.ec-cardList {
  margin-bottom: 30px;
}

.ec-cardList .ec-checkbox {
  margin-bottom: 0;
}

.ec-cardList input[type="checkbox"] + label::before {
  top: -.75rem;
}

.ec-cardList tbody tr {
  border-bottom: solid 1px #c9caca;
}

.ec-cardList th {
  background: #f3f3f3;
  color: #7f7f7f;
}

.ec-cardList th,
.ec-cardList td {
  padding: 1rem 1rem;
  border-left: dashed 1px #c9caca;
}

.ec-cardList td a {
  color: #7dae12;
}

.ec-cardList th:first-child,
.ec-cardList td:first-child {
  border-left: none;
}

.ec-cardList + .ec-cardRole__actions {
  text-align: center;
}

/* FAQ PAGE====================== */
#faq h2.title {
  padding-top: 0;
  font-size: 1.5rem;
  font-weight: 200;
  background: #7dae12;
  padding: 0 1rem;
  color: #FFF;
  margin-bottom: 1rem;
}

#faq .pagetitle {
  margin-bottom: 30px;
}

#faq .faqcont {
  margin-bottom: 30px;
  position: relative;
  color: #696968;
}

#faq .faqcont .faqitem {
  width: 100%;
  position: relative;
  margin-top: 14px;
  line-height: 0;
}

#faq .faqcont .faqitem .mb10 {
  margin-bottom: 1em;
}

#faq .faqcont .showmore_content {
  position: relative;
  overflow: hidden;
  width: 100%;
}

#faq .faqcont li {
  line-height: normal;
}

#faq .faqcont li:first-child {
  margin: 0 10px 10px 20px;
  background: url(/html/template/default/assets/img/faq_q2.gif) top left no-repeat;
  padding: 0 20px 0 20px;
  cursor: pointer;
}

#faq .faqcont .faqitem > ul > li:nth-child(2) {
  display: none;
}

#faq .faqcont li:last-child {
  border: 1px solid #ddddd5;
  height: auto;
  background: url(/html/template/default/assets/img/faq_a.gif) 20px 20px no-repeat;
  padding: 16px 20px 16px 40px;
  margin-bottom: 20px;
  line-height: normal;
}

#faq .faqcont .showmore_trigger {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}

#faq .faqcont .showmore_trigger .more {
  background: url("/html/template/default/assets/img/faq_q.png") left top no-repeat;
}

#faq .faqcont .showmore_trigger .less {
  background: url("/html/template/default/assets/img/faq_q.png") left top no-repeat;
}

#faq .faqcont .showmore_trigger span {
  cursor: pointer;
  display: block;
  width: 790px;
  height: 30px;
}

#faq .faqcont li a {
  color: #4291a2;
  font-weight: bold;
  line-height: 2;
}

#faq .faqcont li .small {
  font-size: 10px;
  margin: 1em 0 0 0;
}

#faq .faqcont a:before {
  content: "> ";
}

#faq .produc_faq {
  margin-bottom: 40px;
}

#faq .produc_faq .faqunderline {
  text-decoration: underline;
}

#faq .produc_faq li {
  background: url("/html/template/default/assets/img/faq_q2.gif") left center no-repeat;
  padding-left: 30px;
  margin-bottom: 20px;
}

#faq .produc_faq li a {
  color: #696968;
  font-weight: bold;
}

#faq .produc_faq li a:hover {
  color: #4291a2;
  text-decoration: none;
}

#faq .faqnotept {
  margin: 50px 0;
  border: 1px solid #ccc;
  padding: 20px;
}

/* nextday PAGE====================== */
div#nextday p.singlePic_ {
  text-align: center;
}

div#nextday ul.attTxt02_ li {
  font-size: 100%;
  color: #bc281b;
}

div#nextday ul.attTxt02_ li a.link01_ {
  font-weight: normal;
}

div#nextday ul.attTxt04_ {
  margin: 0 0 20px 0;
  border-bottom: 1px solid #e1deda;
  padding: 0 0 20px 0;
}

div#nextday ul.attTxt04_ li {
  font-size: 100%;
  color: #746547;
}

/* shopping PAGE====================== */
div#shopping {
  max-width: 790px;
  margin: auto;
}

div#shopping .mb20 {
  margin-bottom: 20px;
}

div#shopping h3.subtitle, div#shopping div.menu_subtitle h3 {
  padding: 5px 0;
  margin: 0 10px 10px;
  font-size: 14px;
  font-weight: bold;
  -webkit-background-size: 10px 10px;
  background-size: 10px 10px;
}

#shopping .about_kaiin,
#shopping .mailmg,
#shopping .mailmgbtn,
#shopping .footlink,
#shopping .headlink,
#shopping .headAnchorlink,
#shopping .contact_onlineshop .wrap {
  overflow: hidden;
  position: relative;
  zoom: 1;
}

#shopping a {
  color: #4291a2;
}

label[for=shopping_order_Payment_5] + p img {
  width: 220px;
}

/* shopping_繧ｪ繝ｳ繝ｩ繧､繝ｳ繧ｷ繝ｧ繝��莨壼藤縺ｫ縺､縺�※
--------------------------------------------------------- */
#shopping h2.title {
  margin: 30px 0 10px 0;
}

#shopping li .btn_ a {
  background-color: #4291a2;
  width: 100%;
  text-align: center;
  padding: 14px 0;
  display: block;
  color: #FFF;
}

#shopping .about_kaiin {
  display: flex;
}

/*about_kaiin*/
#shopping .about_kaiin li {
  width: calc(100% / 2);
  background: url(../img/usr/cartBox.png) repeat 0 0;
  padding: 1rem;
  font-weight: bold;
  margin: 1rem 0;
  border: solid .3rem #CCC;
}

#shopping .about_kaiin li:first-child {
  margin-right: 10px;
}

#shopping .about_kaiin li .wrap {
  background: #fff;
  text-align: center;
  height: 134px;
}

#shopping .about_kaiin li p {
  padding: 30px 0 20px 0;
}

#shopping .about_kaiin li .reset_m {
  padding: 20px 0 10px 0;
}

#shopping .about_kaiin li .btn_ {
  padding: 0;
  text-align: center;
}

/*Sign_up*/
#shopping .Sign_up {
  margin-bottom: 30px;
}

#shopping .Sign_up li {
  line-height: 1.8;
  background: url(../img/shopping/guide_circle.gif) left 7px no-repeat;
  padding-left: 14px;
}

#shopping .longbtn a {
  width: 200px;
  text-align: center;
}

#shopping .longbtn2 a {
  width: 200px;
  background-color: #4291a2;
  text-align: center;
}

/*pointget*/
#shopping .pointget {
  background: url(../img/content/about_pointsys/guide_p.gif) left center no-repeat;
  padding: 5px 0 5px 30px;
  margin-bottom: 10px;
}

/*notepoint*/
#shopping .notepoint {
  border: 2px solid #ff0000;
  margin-bottom: 30px;
}

#shopping .notepoint h4 {
  background: #ff0000;
  font-weight: bold;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  font-size: 14px;
}

#shopping .notepoint ul {
  padding: 14px 20px;
}

#shopping .notepoint ul li:before {
  content: "笆�";
}

/*mailmagagine*/
#shopping .mailmg {
  margin: 20px 0 40px 0;
  padding: 20px 0;
  border-top: 1px dotted #4291a2;
}

#shopping .mailmg .wrap {
  float: left;
  width: 500px;
}

#shopping .mailmg .btn_ {
  float: right;
  background-color: #4291a2;
}

#shopping .mailmg .btn_ a,
#shopping .mailmg2 .btn_ a {
  width: 200px;
  text-align: center;
  background-color: #4291a2;
}

#shopping .mailmg .greencolor,
#shopping .mailmg2 .greencolor {
  font-weight: bold;
  font-size: 14px;
  color: #4291a2;
}

#shopping .mailmg2 p:nth-child(2) {
  margin-bottom: 20px;
}

#shopping .mailmgbtn li {
  float: left;
}

/*footlink*/
#shopping .footlink {
  margin: 50px 0;
  border: 1px solid #ddddd5;
  padding: 20px 20px 10px 20px;
}

#shopping .footlink li {
  float: left;
  width: 372px;
  margin-bottom: 10px;
}

#shopping .footlink li a {
  background: url(../img/shopping/guide_arrow_foot.gif) left center no-repeat;
  padding-left: 20px;
}

/*headlink*/
#shopping .headlink {
  border-left: 1px solid #ddddd5;
}

#shopping .headlink li {
  float: left;
  width: 263px;
  text-align: center;
}

#shopping .headlink li a,
#shopping .headlink li p {
  display: block;
  background: #f1f8fa;
  /*background: #f9f9f1;*/
  border: 1px solid #ddddd5;
  border-left: none;
  color: #696968;
  padding: 5px 0;
}

#shopping .headlink li p {
  background-color: #fff;
  border-bottom: none;
}

#shopping .headAnchorlink {
  border: 1px solid #ddddd5;
  border-top: none;
  padding: 10px 18px;
  margin-bottom: 30px;
}

#shopping .headAnchorlink li {
  float: left;
}

#shopping .headAnchorlink li {
  margin-right: 40px;
}

#shopping .headAnchorlink li a {
  background: url(../img/shopping/guide_arrow.gif) left center no-repeat;
  padding-left: 16px;
}

#shopping .headAnchorlink li a:hover {
  color: #549faf;
  text-decoration: none;
}

/* shopping_繧ｷ繝ｧ繝�ヴ繝ｳ繧ｰ繧ｬ繧､繝�
--------------------------------------------------------- */
#shopping dl {
  margin: 20px 0 30px 0;
}

#shopping dl dt {
  font-weight: bold;
  margin-bottom: 3px;
}

#shopping dl dt:before {
  content: "笆�";
}

#shopping dl dd {
  margin-bottom: 20px;
}

/*contact_onlineshop*/
#shopping .contact_onlineshop {
  border: 2px solid #549faf;
  /*border:2px solid #4291a2;*/
  margin-bottom: 30px;
}

#shopping .contact_onlineshop h4 {
  background: #549faf;
  /*background: #4291a2;*/
  font-weight: bold;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  font-size: 14px;
}

#shopping .contact_onlineshop .wrap {
  padding: 20px;
}

#shopping .contact_onlineshop .wrap .formcontact {
  float: left;
}

#shopping .contact_onlineshop .wrap .btn_ {
  float: right;
  background: #4291a2;
}

#shopping .contact_onlineshop .wrap .btn_ a {
  background: #4291a2;
}

#shopping .small {
  font-size: 10px;
  color: #696968;
}

#shopping .contact_onlineshop .wrap p.telnum {
  font-size: 28px;
  color: #4291a2;
  font-weight: bold;
  margin-bottom: 20px;
}

/*table*/
#shopping .first_ {
  border-top: none;
}

#shopping .last_ {
  border-right: none;
}

#shopping .layout01_ {
  border-right: 1px solid #ddddd5;
  margin-bottom: 0;
}

#shopping .layout01_ th {
  width: 50%;
}

#shopping table.layout02_ th {
  width: 50%;
}

/*Securitybtn*/
#shopping .Securitybtn {
  text-align: left;
  margin: 10px 0;
}

/*steparrow*/
#shopping h3.stepttl {
  background-color: #549faf;
  /*background-color: #4291a2;*/
  color: #fff;
  font-weight: bold;
  padding: 5px 10px;
  margin-bottom: 20px;
}

#shopping .steparrow {
  overflow: hidden;
  position: relative;
}

#shopping .steparrow p:first-child {
  float: left;
  width: 100%;
  background: url(../img/shopping/arrow.png) left top no-repeat;
  padding: 0 0 50px 40px;
}

#shopping .steparrow p.imgnone {
  background: none;
}

#shopping .steparrow p img {
  border: 1px solid #F4EEE4;
}

#shopping .steparrow .txtwrap {
  float: right;
  width: 480px;
}

#shopping .steparrow .txtwrap .small {
  margin-top: 20px;
}

#shopping .steparrow .txtwrap h4 {
  font-weight: bold;
  margin-bottom: 3px;
}

#shopping .steparrow .txtwrap p {
  margin-bottom: 1.5em;
}

#shopping .steparrow .txtwrap a:before {
  content: "> ";
}

/* eFirstPAGE====================== */
#eFirst {
  margin-bottom: 60px;
  vertical-align: sub;
}

#contents #eFirst .main p {
  text-align: left;
}

#eFirst .main {
  background: url(/html/template/default/assets/img/content/eFirst/) no-repeat;
  background-size: cover;
}

#container #main #eFirst h3 {
  margin: 0;
}

#eFirst .main p {
  margin: 0;
  padding: 22px 0 21px 17px;
}

#eFirst .item1 {
  background: url(/html/template/default/assets/img/content/eFirst/01_bg_pc.png) no-repeat left bottom;
  margin: 4px 0px 10px 0;
  padding: 120px 0px 0px 0px;
  width: 49%;
  display: inline-block;
}

#eFirst .item1 h3 {
  padding: 0 0 0 287px;
}

#eFirst .item1 .txt {
  width: 46%;
  margin: 0px 15px 0 auto;
  padding: 0px 10px 0px 0px;
  text-align: justify;
  line-height: 1.5;
  height: 250px;
  vertical-align: sub;
}

#eFirst .item1 .txt span {
  color: #549FAF;
  font-size: 19px;
  font-weight: 700;
  text-align: center;
}

#eFirst .item1 .name {
  width: 390px;
  margin: 0px 0px -30px 30px;
  padding-bottom: 50px;
}

#eFirst .item1 .name span {
  font-weight: 700;
}

#eFirst .item2 {
  background: url(/html/template/default/assets/img/content/eFirst/02_bg_pc.png) no-repeat left bottom;
  margin: 4px 0px 10px 10px;
  padding: 120px 0px 0px 0px;
  width: 49%;
  display: inline-block;
}

#eFirst .item2 h3 {
  padding: 0 0 0 287px;
}

#eFirst .item2 .txt {
  width: 46%;
  margin: 0px 15px 0px auto;
  padding: 0px 10px 0px 0px;
  text-align: justify;
  line-height: 1.5;
  height: 250px;
  vertical-align: sub;
}

#eFirst .item2 .txt span {
  color: #549FAF;
  font-size: 19px;
  font-weight: 700;
}

#eFirst .item2 .name {
  width: 390px;
  margin: 0px 0px -30px 30px;
  padding-bottom: 50px;
}

#eFirst .item2 .name span {
  font-weight: 700;
}

#eFirst .item3 {
  background: url(/html/template/default/assets/img/content/eFirst/03_bg_pc.png) no-repeat left bottom;
  margin: 4px 0px 10px 0;
  padding: 120px 0px 0px 0px;
  width: 49%;
  display: inline-block;
}

#eFirst .item3 h3 {
  padding: 0 0 0 287px;
}

#eFirst .item3 .txt {
  width: 46%;
  margin: 0px 15px 0 auto;
  padding: 0px 10px 0px 0px;
  text-align: justify;
  line-height: 1.5;
  height: 250px;
}

#eFirst .item3 .txt span {
  color: #549FAF;
  font-size: 19px;
  font-weight: 700;
}

#eFirst .item3 .name {
  width: 390px;
  margin: 0px 0px -30px 30px;
  padding-bottom: 50px;
}

#eFirst .item3 .name span {
  font-weight: 700;
}

#eFirst .item4 {
  background: url(/html/template/default/assets/img/content/eFirst/04_bg_pc.png) no-repeat left bottom;
  margin: 4px 0px 10px 10px;
  padding: 120px 0px 0px 0px;
  width: 49%;
  display: inline-block;
}

#eFirst .item4 h3 {
  padding: 0 0 0 287px;
}

#eFirst .item4 .txt {
  width: 46%;
  margin: 0px 15px 0px auto;
  padding: 0px 10px 0px 0px;
  text-align: justify;
  line-height: 1.5;
  height: 250px;
}

#eFirst .item4 .txt span {
  color: #549FAF;
  font-size: 19px;
  font-weight: 700;
}

#eFirst .item4 .name {
  width: 390px;
  margin: 0px 0px -30px 30px;
  padding-bottom: 50px;
}

#eFirst .item4 .name span {
  font-weight: 700;
}

#eFirst .item5 {
  background: url(/html/template/default/assets/img/content/eFirst/05_bg_pc.png) no-repeat left bottom;
  margin: 4px 0px 10px 0;
  padding: 120px 0px 0px 0px;
  width: 49%;
  display: inline-block;
}

#eFirst .item5 h3 {
  padding: 0 0 0 287px;
}

#eFirst .item5 .txt {
  width: 46%;
  margin: 0px 15px 0 auto;
  padding: 0px 10px 0px 0px;
  text-align: justify;
  line-height: 1.5;
  height: 250px;
  vertical-align: sub;
}

#eFirst .item5 .txt span {
  color: #EB8F8F;
  font-size: 19px;
  font-weight: 700;
  text-align: center;
}

#eFirst .item5 .name {
  width: 390px;
  margin: 0px 0px -30px 30px;
  padding-bottom: 50px;
}

#eFirst .item5 .name span {
  font-weight: 700;
}

#eFirst .item6 {
  background: url(/html/template/default/assets/img/content/eFirst/06_bg_pc.png) no-repeat left bottom;
  margin: 4px 0px 10px 10px;
  padding: 120px 0px 0px 0px;
  width: 49%;
  display: inline-block;
}

#eFirst .item6 h3 {
  padding: 0 0 0 287px;
}

#eFirst .item6 .txt {
  width: 46%;
  margin: 0px 15px 0px auto;
  padding: 0px 10px 0px 0px;
  text-align: justify;
  line-height: 1.5;
  height: 250px;
  vertical-align: sub;
}

#eFirst .item6 .txt span {
  color: #EB8F8F;
  font-size: 19px;
  font-weight: 700;
}

#eFirst .item6 .name {
  width: 390px;
  margin: 0px 0px -30px 30px;
  padding-bottom: 50px;
}

#eFirst .item6 .name span {
  font-weight: 700;
}

#eFirst .item7 {
  background: url(/html/template/default/assets/img/content/eFirst/07_bg_pc.png) no-repeat left bottom;
  margin: 4px 0px 10px 0;
  padding: 120px 0px 0px 0px;
  width: 49%;
  display: inline-block;
}

#eFirst .item7 h3 {
  padding: 0 0 0 287px;
}

#eFirst .item7 .txt {
  width: 46%;
  margin: 0px 15px 0 auto;
  padding: 0px 10px 0px 0px;
  text-align: justify;
  line-height: 1.5;
  height: 250px;
  vertical-align: sub;
}

#eFirst .item7 .txt span {
  color: #549FAF;
  font-size: 19px;
  font-weight: 700;
  text-align: center;
}

#eFirst .item7 .name {
  width: 390px;
  margin: 0px 0px -30px 30px;
  padding-bottom: 50px;
}

#eFirst .item7 .name span {
  font-weight: 700;
}

#eFirst .item8 {
  background: url(/html/template/default/assets/img/content/eFirst/08_bg_pc.png) no-repeat left bottom;
  margin: 4px 0px 10px 10px;
  padding: 120px 0px 0px 0px;
  width: 49%;
  display: inline-block;
}

#eFirst .item8 h3 {
  padding: 0 0 0 287px;
}

#eFirst .item8 .txt {
  width: 46%;
  margin: 0px 15px 0px auto;
  padding: 0px 10px 0px 0px;
  text-align: justify;
  line-height: 1.5;
  height: 250px;
  vertical-align: sub;
}

#eFirst .item8 .txt span {
  color: #549FAF;
  font-size: 19px;
  font-weight: 700;
}

#eFirst .item8 .name {
  width: 390px;
  margin: 0px 0px -30px 30px;
  padding-bottom: 50px;
}

#eFirst .item8 .name span {
  font-weight: 700;
}

#eFirst .item9 {
  background: url(/html/template/default/assets/img/content/eFirst/09_bg_pc.png) no-repeat left bottom;
  margin: 1px 0px 10px 0;
  padding: 320px 0px 0px 0px;
  width: 99%;
  display: inline-block;
}

#eFirst .item9 h3 {
  padding: 0 0 0 287px;
}

#eFirst .item9 .txt {
  width: 75%;
  margin: 0px 15px -25px 90px;
  text-align: justify;
  line-height: 1.5;
  height: 100px;
  vertical-align: top;
}

#eFirst .item9 .name {
  width: 300px;
  margin: 25px 0px -22px 90px;
  padding: 0px 0px 0px 0px;
}

#eFirst .item9 .name span {
  font-weight: 700;
}

#eFirst .item9 .nameR {
  width: 300px;
  margin: -145px 0px 0px 470px;
  padding: 0px 0px 30px 0px;
}

#eFirst .item9 .nameR span {
  font-weight: 700;
}

#eFirst .item10 {
  background: url(/html/template/default/assets/img/content/eFirst/10_bg_pc.png) no-repeat left bottom;
  margin: 0px 0px 10px 0;
  padding: 320px 0px 0px 0px;
  width: 99%;
  display: inline-block;
}

#eFirst .item10 h3 {
  padding: 0 0 0 287px;
}

#eFirst .item10 .txt {
  width: 85%;
  margin: 0px 15px 10px 90px;
  text-align: justify;
  line-height: 1.5;
  height: 100px;
  vertical-align: top;
}

#eFirst .item10 .name {
  width: 300px;
  margin: 5px 0px 12px 250px;
  padding: 0px 0px 0px 0px;
}

#eFirst .item10 .name span {
  font-weight: 700;
}

#eFirst .campaign {
  background-size: cover;
  margin-top: 40px;
  padding-bottom: 29px;
}

#eFirst .campaign .txt1 {
  font-size: 16px;
  margin: 0 28px 35px;
  line-height: 1;
}

#eFirst .campaign ul {
  overflow: hidden;
  padding: 0 15px;
}

#eFirst .campaign ul li {
  float: left;
  margin-left: 38px;
  width: 225px;
}

#eFirst .campaign ul li:first-child {
  margin-left: 0;
}

#eFirst .campaign ul li img {
  display: block;
}

#eFirst .campaign ul li span {
  display: block;
  margin: 10px 0 0 0;
  line-height: 1.2;
}

#eFirst .campaign .txt2 {
  margin: 18px 25px 0;
}

#eFirst .campaign .txt2 span {
  font-size: 12px;
}

/* recommend */
.comSlider01 .slick-dots,
.comSlider .slick-dots {
  margin-top: 28px;
  text-align: center;
  z-index: 10;
}

.comSlider01 .slick-dots li,
.comSlider .slick-dots li {
  margin: 0 5px;
  display: inline-block;
  width: 13px;
  height: 13px;
  border-radius: 50px;
  background: none;
  background-color: #E3E3E3;
}

.comSlider01 .slick-dots li button,
.comSlider .slick-dots li button {
  display: none;
}

@media all and (max-width: 767px) {
  .comSlider01 .slick-dots li,
  .comSlider .slick-dots li {
    margin: 0 4px;
    width: 9px;
    height: 9px;
  }
}

.comSlider01 .slick-dots li.slick-active,
.comSlider .slick-dots li.slick-active {
  background-color: #76B729;
}

@media all and (max-width: 767px) {
  .comSlider01 .slick-dots,
  .comSlider .slick-dots {
    margin-top: 12px;
  }
}

/* naturaglace nu PAGE====================== */
