/* カスタマイズ用CSS */

.guide-sp li {
    color: white;
    list-style: none;
    border-bottom: 1px solid white;
    padding: 5px;
    text-align: center;
}

.guide-sp a {
    color: white;
    text-decoration: none;
}
.guide-sp ul {
    padding: 0px;
}
@media (max-width: 767px) {

.ec-drawerRole {
  overflow-y: scroll;
  background: black;
  background: #7c5094;
}

.ec-drawerRole .ec-headerLinkArea {
  background: black;
  background: #7c5094;
}

.ec-itemNav {
  border: 1px solid #CDCDCD;
  border:none;
}
.ec-itemNav__nav li ul li a {
  padding: 10px 22px 10px 16px;
}

.ec-drawerRole .ec-headerCategoryArea .ec-headerCategoryArea__heading {
  border-top: 1px solid #CCCCCC;
  border-bottom: 1px solid #CCCCCC;
  padding: 10px 10px;
  font-size: 16px;
  font-weight: bold;
  color: black;
  background: #F8F8F8;
}

.ec-drawerRole .ec-headerLinkArea .ec-headerLink__item {
  display: block;
  border-bottom: 1px solid #ccc;
  padding: 7px 20px;
  font-size: 15px;
  font-weight: bold;
  color: white;
}

.ec-itemNav__nav li a {
  display: block;
  border-bottom: 1px solid #E8E8E8;
  margin: 0;
  padding: 10px;
}
}

@media (min-width: 768px) {
.ec-itemNav {
    border: 1px solid #CDCDCD;
}
}






.ec-layoutRole__contentBottom img {
    max-width: 100%;
    width: auto;
}
@media (max-width: 767px) {
.pc {
	display:none;
}

.sp {
	display:block;
}

}

@media (min-width: 768px) {
.pc {
	display:block;
}

.sp {
	display:none;

}
}






.ec-drawerRole .ec-headerLinkArea .ec-headerLink__list {
  border-top: 1px solid #ccc;
  border: none;
}

.ec-productRole img {
  width: 100%;
  width:  auto;
}

@media only screen and (min-width: 768px) {
  .ec-orderRole .ec-orderRole__detail {
    padding: 0 16px 25px;
  }
}
.ec-orderRole__detail h2 {
    margin-bottom: 20px;
    font-size: 18px;
    padding-top: 11px;
}
@media only screen and (min-width: 768px) {
  .ec-cartRole .ec-cartRole__cart {
    margin: 0 1%;
    margin-top: 25px;
  }
}

@media only screen and (min-width: 768px) {
  .ec-cartRole .ec-cartRole__actions {
    width: 30%;
    margin-right: 1%;
  }
}

.ec-layoutRole__mainWithColumn {
    padding-top: 10px;
}
.deliv-con {
    font-size: 14px;
    color: #f73434;
    margin-bottom: 12px;
    line-height: 150%;
}

.deliv-con p {
    margin-bottom: 5px;
}
.ec-price {
    color: #e03828;
}
.item_price {
    color: #e03828;
    margin-bottom: 10px;
}
@media only screen and (min-width: 768px) {
  .ec-searchnavRole .ec-searchnavRole__infos {
    padding-left: 0;
    padding-right: 0;
    border-top: 1px solid #ccc;
    padding-top: 36px;
    flex-direction: row;
  }
}

#maker_news_area h3 {
    font-weight: bold;
    font-size: 18px;
    color: #ad86c2;
}

#maker_news_area h4 {
    font-weight: bold;
    font-size: 16px;
    margin: 10px 0px;
}

.ec-productRole__category {
    font-size: 14px;
}
#maker_main_area {
    padding: 10px;
}

#maker_logo {
    float: left;
    padding-right: 15px;
    padding-bottom: 20px;
}

#maker_explain {
    line-height: 155%;

}

#maker_explain h2 {
    margin: 0px;
    margin-bottom: 15px;
    font-weight: 500;
}

@media only screen and (min-width: 768px) {
  .ec-searchnavRole img {
    width: auto;
  }
}

p.ec-maker {
    margin: 0px;
}
.ec-borderedDefs input {
    margin-bottom: 8px;
}
.entry-role {
    padding: 0px 25px 20px;
}

.attr {
    color: red;
    margin: 5px 0px;
}
.fax-title {
    text-align: center;
    margin: 30px auto 0px;
    font-size: 27px;
    font-weight: 500;
}
#footer_wrapTop p {
    margin-bottom: 5px;
}

.ec-productRole__description {
    padding-top: 15px;
}
.ec-productRole {
    padding-top: 25px;
}
.ec-productRole .ec-productRole__code {
  padding: 0px;
  border-bottom: 1px dotted #ccc;
  border: none;
}

@media only screen and (min-width: 768px) {
  .ec-productRole .ec-productRole__price {
    padding: 20px 0;
    border-bottom: 1px dotted #ccc;
    border: none;
  }
}

@media only screen and (min-width: 768px) {
  .ec-productRole .ec-productRole__title .ec-headingTitle {
    font-size: 27px;
    font-weight: 500;
    margin-bottom: 20px;
  }
}

@media only screen and (min-width: 768px) {
  .ec-productRole .ec-productRole__btn {
  
    margin-bottom: 10px;
  }
}


.ec-price .ec-price__price {
  padding: 0em;
  font-weight: bold;
}

.ec-productRole .ec-productRole__tags {
  margin-top: 16px;
  padding: 0;
padding-bottom: 0px;
  padding-bottom: 16px;
  border-bottom: 1px dotted #ccc;
  
  border: none;
  margin: 0px;
  margin-bottom: 12px;
  padding: 0px;
}




.ec-role {
    max-width: 1200px;
}



.ec-headerNav .ec-headerNav__itemIcon {
    color: #7c5094;
}

.ec-cartNavi {
  color: #7c5094;
}

@media (max-width: 767px) {
.ec-cartNavi {
  padding: 13px 0 0 12px;
}

.ec-cartRole__actions {
    margin-bottom: 30px;
}
}

.detail-banner {
    text-align: center;
    margin-top: 20px;
}

.detail-banner img {
    margin-bottom: 20px;
}

@media (max-width: 767px) {
.ec-pageHeader h1, .ec-pageHeader .h1 {
    border-top: none;
    border-bottom: 1px solid #ccc;
    margin: 10px 0px 48px;
    padding: 3px;
    font-size: 30px;
    font-weight: 500;
  }
  
  .ec-cartRole {
      padding-left: 5px;
      padding-right: 5px;
}
}
  
@media only screen and (min-width: 768px) and (min-width: 768px) {
  .ec-off1Grid .ec-off1Grid__cell {
    width: 90.3333333333%;
  }
}
@media only screen and (min-width: 768px) {
  .ec-off1Grid .ec-off1Grid__cell {
    position: relative;
    min-height: 1px;
    margin: auto;
  }
}

@media only screen and (min-width: 768px) {
  .ec-pageHeader h1, .ec-pageHeader .h1 {
    border-top: none;
    border-bottom: 1px solid #ccc;
    margin: 10px 16px 48px;
    padding: 3px;
    font-size: 30px;
    font-weight: 500;
  }
  
  h2.title {
    border-top: none;
    border-bottom: 1px solid #ccc;
    margin: 20px 16px 48px;
    padding: 3px;
    font-size: 30px;
    font-weight: 500;
  }
  
}

@media only screen and (min-width: 768px) {
  .ec-borderedDefs dd {
    line-height: 1.7;
  }
}




@media (max-width: 767px) {
  .brand_list a {
    float: left;
    width: 48%;
    margin-bottom: 15px;
    margin-left: 1%;
    margin-right: 1%;
    text-align: center;
}

.brand_list a:nth-child(2n+1) {
 clear: both;
}
}










@media only screen and (min-width: 768px) {
  .ec-borderedDefs dt {
    padding-top: 3px;
  }
  
.brand_list a {
    float: left;
    width: 23%;
    margin-bottom: 15px;
    margin-left: 1%;
    margin-right: 1%;
}

.brand_list a:nth-child(4n+1) {
 clear: both;
}

}



option:hover {
  background-color: #add8e6; /* マウスホバー時の背景色 */
  color: #000; /* テキストの色も変更可能 */
}

.flex-container {
  display: flex; /* フレックスボックスを有効化 */
  flex-wrap: wrap; /* 要素を折り返し可能に */
  justify-content: flex-start; /* 要素間のスペースを均等に配置 */
}

.flex-item {
  flex: 0 0 calc(33.33% - 10px); /* 3列にしてスペースを調整 */
  border: 1px solid #CECECE; /* 枠線を追加 */
  text-align: center;
  padding: 8px;
  margin-bottom: 10px;
  font-size: 15px;
  text-align: left;
  margin-right: 10px;
}

@media screen and (max-width: 768px) {
  .flex-item {
    flex: 0 0 48%; /* スマホサイズでは2列表示に切り替え */
    box-sizing: border-box; /* これを追加！ */
      margin: 1%;
  }
}

/* カスタマイズ用CSS */

.guide {
    text-align: center;
}

.guide p {
 
}

@media (max-width: 767px) {
.guide img {
    max-width: 90%;
    margin-bottom: 50px;
}
}

@media (min-width: 768px) {

.guide {
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
}
.guide img {
    max-width: 800px;
    margin-bottom: 50px;
}
}


.site_title {
    font-size: 13px;
    margin-left: 10px;
}
#guide_area ul {
    padding: 0px;
}

#guide_area li {
    background: black;
    color: white;
    list-style: none;
    padding: 10px;
    font-size: 15px;
    margin-bottom: 5px;
    background: #ffffff;
    border: 1px solid #CCC;
background: linear-gradient(172deg,rgba(255, 255, 255, 1) 0%, rgba(230, 230, 230, 1) 100%, rgba(209, 209, 209, 1) 100%);
}
.ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search {
  background: #7c5094;
  color: #fff;
}

@media only screen and (min-width: 768px) {
  .ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
  }
}

.ec-inlineBtn--top {
    margin-top: 12px;
    background: #7c5094;
}

@media only screen and (min-width: 768px) {
  .ec-newsRole .ec-newsRole__newsDate {
    font-size: 15px;
    color: #333;
    margin-top: 1px;
  }
}

.ec-newsRole .ec-newsRole__newsTitle {
  font-size: 15px;
  font-weight: bold;
  font-weight: normal;
  color: #333;
  line-height: 1.6;
}

@media only screen and (min-width: 768px) {
  .ec-newsRole__newsItem.is_active .ec-newsRole__newsDescription {
    margin: 10px 0 0;
  }
}

.ec-headerSearch .ec-headerSearch__category .ec-select select {
}

.ec-headerSearch .ec-headerSearch__category .ec-select select option {
  color: #000;
}

.ec-headerSearch .ec-headerSearch__category .ec-select select option:hover {
  color: #000;
}

.cate-con {
    margin-bottom: 20px;
    margin-top: 35px;
}

.cate-con li {
    border: 1px solid  #CECECE;
    padding: 10px 10px;
    text-align: center;
    list-style: none;
    display: inline-block;
    width: 32%;
}
.cate-con li a {
 
}

.flexli {
    text-align: left;
    font-size: 13px;
    padding-left: 10px;
    margin-top: 3px;
}

.ec-shelfGrid__item .item_image {
    margin-bottom: 12px;
}
.ec-shelfGrid__item h2 {
    font-size: 16px;
    font-weight: bold;
    margin: 0px;
    margin-bottom: 5px;
}

.item_comment {
    font-size: 14px;
    margin-bottom: 5px;
}
.ec-layoutRole__mainBottom {
    padding-top: 30px;
}
.login-attr {
    background-color: #E8EAE3;
    text-align: center;
  padding: 15px 10px;
  color: red;
  font-size: 13px;

}

.right-banner {
    text-align: center;
    margin-bottom: 15px;
}
.right-banner img {
    margin-bottom: 6px;
    border: 1px solid #CECECE;
}
.ec-layoutRole .ec-layoutRole__contents {
  max-width: 1220px;
  padding-bottom: 20px;
}

@media (max-width: 767px) {
.ec-shelfRole {
  padding-left: 10px;
  padding-right: 10px;
}
.ec-searchnavRole .ec-searchnavRole__infos {
  padding-left: 10px;
  padding-right: 10px;
}
}

@media (min-width: 768px) {

}

.front_page .ec-shelfRole {
  padding-left: 10px;
  padding-right: 10px;
}

.ec-role {
  padding-left: 10px;
  padding-right: 10px;
}

.ec-layoutRole__left .ec-role {
  padding-left: 20px;
  padding-right: 20px;
}

.ec-layoutRole__right .ec-role {
  padding-left: 20px;
  padding-right: 20px;
}

.item_r {
    float: right;
    margin-left: 1%;
    margin-right: 1%;
    width: 49%;
}

.recommend {
    font-size: 14px;
}

.recommend a {
    color: #555;
}
.recommend .item_image {
    float: left;
    width: 48%;
    margin-right: 1%;
    border: 1px solid #CECECE;
    margin-bottom: 12px;
}

.recommend .item_name {
    font-weight: bold;
    margin-bottom: 5px;
    
}



.category-nav {
    padding: 0px 20px;
    
}

.category-nav li {
    font-size: 15px;
    margin-bottom: 2px;
}
.category-nav h2 {
background: #ad86c2;
text-align: center;
color: white;
margin: 0px;
font-size: 16px;
padding: 9px 6px 6px;
border-bottom: 2px solid #89609e;
font-weight: 500;
}

.category-nav ul {
    border: 1px solid #eed7fa;
    padding: 10px;
}
#bn-tokuten {
    margin-bottom: 10px;
}

.bn-2colum img {
    width: 100%;
}
.bn-2colum a {
    float: left;
    width: 48%;
    margin-bottom: 12px;
    margin-right: 1%;
    margin-left: 1%;
}
.item_wrap {
    padding: 0px;
}

@media (max-width: 767px) {
.item_2colum {
    margin-bottom: 15px;
}

.item_2colum:nth-child(1n+1) {
    clear: both;
}
}

@media (min-width: 768px) {
.item_2colum {
    float: left;
    width: 50%;
    margin-bottom: 5px;
}

.item_2colum:nth-child(2n+1) {
    clear: both;
}
}


@media only screen and (min-width: 768px) {
  .ec-newsRole .ec-newsRole__news {
    border: 16px solid #F8F8F8;
    border: none;
    padding: 0px 0px;
  }
}

.ec-sliderRole { 
    max-width: 1180px;
}

.ec-headerRole__cart {
    float: right;
}


@media (max-width: 767px) {
.ec-headerNaviRole__search {
    display: none;
}
}

@media (min-width: 768px) {
.ec-headerNaviRole__search {
    clear: both;
    padding-top: 5px;
}
}



.ca-attr {
    color: red;
    font-size: 13px;
}


.ec-calendar {
    padding-left: 10px;
    padding-right: 10px;
}

.ec-categoryNaviRole {
    margin-bottom: 20px;
}
@media screen and (min-width: 768px) {
  .ec-calendar__month {
    margin-top: 0;
    margin-left: 20px;
  }
}

.ec-calendar table {
    width: 100%;
    margin-bottom: 10px;
    margin-top: 10px;
}
@media only screen and (min-width: 768px) {
  .ec-itemNav__nav li {
    width: 100%;
  }
}

.ec-sliderRole {
  padding-left: 0px;
  padding-right: 0px;
}

@media only screen and (min-width: 768px) {
  .ec-layoutRole .ec-layoutRole__left {
    display: block;
    width: 25%;
    padding-top: 25px;
  }
  
  .front_page .ec-layoutRole .ec-layoutRole__left {
    padding-top: 0px;
  }
}

@media only screen and (min-width: 768px) {
  .ec-layoutRole .ec-layoutRole__mainBetweenColumn {
    width: 57%;
  }
}

@media only screen and (min-width: 768px) {
 .ec-layoutRole .ec-layoutRole__right {
    display: block;
    width: 18%;
  }
}


.ec-footerRole {
  border-top: 1px solid #7d7d7d;
  border: none;
  margin-top: 0px;
  background: #AFA2CC;
}

  .ec-footerTitle {
    padding: 20px 0 30px;
  }

#footer_wrapTop {
	margin: 0 auto;
	padding: 10px 10px;
	width: 100%;
	color: #666;
	background-attachment: scroll;
	background-color: #F5F5F5;
	background-image: none;
	background-repeat: repeat;
	background-position: 0 0;
	margin-top: 30px;
}

#footer_wrapTop #footerTop {
    margin: auto;
    padding-top: 10px;
    max-width: 1180px;
}

@media (max-width: 767px) {
#footer_wrapTop #footerTop div.L {
    text-align: left;
}
}

@media (min-width: 768px) {
#footer_wrapTop #footerTop div.L {
    float: left;
    width: 48%;
    text-align: left;
}
}

#footer_wrapTop h2 {
    font-size: 18px;
    font-weight: bold;
    padding: 3px;
    border-bottom: 1px dotted #999;
    color: #ad86c2;
    margin-bottom: 25px;
}

#footer_wrapTop #footerTop p.padB15,
#footer_wrapTop #footerTop div.padB15 {
    padding-bottom: 15px;
}

#footer_wrapTop #footerTop p.ico {
    background: url("../img/icon/ico_arrow_02.gif") no-repeat scroll 5px 5px transparent;
    padding-bottom: 5px;
    padding-left: 20px;
    font-size: 17px;
}

#footer_wrapTop #footerTop div.L p.des {
    padding-left: 15px;
    padding-bottom: 5px;
}

#footer_wrapTop #footerTop div.R div.f {
    padding-bottom: 15px;
}


#footer_wrapTop #footerTop div.R p.des {
    padding-left: 15px;
    padding-bottom: 5px;
}

@media (max-width: 767px) {
#footer_wrapTop #footerTop div.R {
    text-align: left;
}
}

@media (min-width: 768px) {
#footer_wrapTop #footerTop div.R {
    float: right;
    width: 48%;
    text-align: left;
}
}



.ec-secHeading {
    background: #ad86c2;
    padding: 5px 10px 3px;
}

.ec-secHeading .ec-secHeading__line {
  display: inline-block;
  margin: 0 5px;
  width: 1px;
  height: 14px;
  background: black;
  background: white;
}

.ec-secHeading .ec-secHeading__en {
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0em;
  color: white;
}

.ec-secHeading .ec-secHeading__ja {
  font-size: 12px;
  font-weight: normal;
  letter-spacing: 0em;
  vertical-align: 2px;
  color: white;
}


.nh-wrap {
    background: url("../img/common/bg_header.gif") repeat-x scroll center top #FFFFFF;
  border-bottom: 1px solid #DCDCDC;
  padding-top: 15px;
  padding-bottom: 10px;
}

@media (max-width: 767px) {
.nh-l {
   text-align: center;
}

.nh-r {

}
}

@media (min-width: 768px) {
.nh-l {
    float: left;
    width: 50%;
    padding-top: 15px;
}

.nh-r {
    float: left;
    width: 50%;
}
}



@media (max-width: 767px) {
.nav {
    display: none;
}
}

@media (min-width: 768px) {
.nav {
  background: url("../img/common/bg_menu.jpg") repeat-x scroll 0 0 transparent;
  height: 48px;
  padding-bottom: 12px;
  width: 100%;
  margin-bottom: 15px;
}
}

.nav ul {
    text-align: center;
}

.nav li {
    display: inline-block;
}

.sns {
    float: right;
}

.sns i {
    font-size: 24px;
}

.c-title {
    border-bottom: 1px solid #555;
    margin-bottom: 10px;
    font-weight: bold;
    padding-bottom: 3px;
    
}