@charset "utf-8";



/* base
   ========================================================================== */

#contents {
  padding-bottom: 0;
  border-top: solid 4px #444444;
  background: #F7F7F0;
  color: #333;
}

#contents .inner {
  max-width: 982px;
  padding: 0 10px;
}

#contents img {
  max-width: 100%;
}

#contents a {
  color: #E58C2C;
}

#contents .link-list {
  
}

#contents .link-list li {
  padding-left: 22px;
  background: url(../img/icon_links.png) 0 2px no-repeat;
}

#contents .link-list li + li {
  margin-top: 4px;
}



/* button
   ========================================================================== */

#contents .btn {
  display: inline-block;
  margin: 0;
  padding: 0;
  border: none;
  line-height: inherit;
  vertical-align: middle;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

#contents .btn-link:hover {
  text-decoration: underline;
}

#contents .btn-viewcart {
  min-width: 138px;
  padding: 12px 6px;
  border-radius:4px;
  background: #F8A605;
  background-image: -webkit-gradient(linear,50% 0%,50% 100%,color-stop(0, rgb(243,179,7)),color-stop(1, rgb(248,166,5)));
  background-image: -webkit-linear-gradient(-90deg,rgb(243,179,7) 0%,rgb(248,166,5) 100%);
  background-image: linear-gradient(180deg,rgb(243,179,7) 0%,rgb(248,166,5) 100%);
  color: #fff;
  text-align: center;
}

#contents .btn-viewcart:before {
  content: url(../img/icon_btn_cart_small.png);
  display: inline-block;
  margin-right: 6px;
  line-height: 1;
  vertical-align: middle;
}

#contents .btn-viewcart:hover {
  opacity: .75;
}

#contents .btn-addcart {
  padding: 18px 12px;
  border-radius:4px;
  background: #FE6D71;
  background-image: -webkit-gradient(linear,16% 0%,16% 67%,color-stop(0, rgb(254,133,136)),color-stop(1, rgb(254,109,113)));
  background-image: -webkit-linear-gradient(-90deg,rgb(254,133,136) 0%,rgb(254,109,113) 100%);
  background-image: linear-gradient(180deg,rgb(254,133,136) 0%,rgb(254,109,113) 100%);
  color: #fff;
  font-size: 14px;
  text-align: center;
}

#contents .btn-addcart:before {
  content: url(../img/icon_btn_cart_large.png);
  display: inline-block;
  margin-right: 6px;
  line-height: 1;
  vertical-align: middle;
}

#contents .btn-addcart:hover {
  opacity: .75;
}

#contents .btn-menu {
  overflow: hidden;
  width: 30px;
  height: 30px;
  border: solid 1px #EEE;
  border-radius:4px;
  background:
    url(../img/icon_btn_menu.png) 50% 50% no-repeat #F7F7F7;
  background:
    url(../img/icon_btn_menu.png) 50% 50% no-repeat,
    -webkit-gradient(linear,50% 3%,50% 58%,color-stop(0, rgb(255,255,255)),color-stop(1, rgb(247,247,247)));
  background:
    url(../img/icon_btn_menu.png) 50% 50% no-repeat,
     -webkit-linear-gradient(-90deg,rgb(255,255,255) 0%,rgb(247,247,247) 100%);
  background:
    url(../img/icon_btn_menu.png) 50% 50% no-repeat,
    linear-gradient(180deg,rgb(255,255,255) 0%,rgb(247,247,247) 100%);
  *text-indent: -9999px;
}

#contents .btn-menu:before {
  content: "";
  display: block;
  width: 0;
  height: 150%;
}

#contents .btn-menu:hover {
  opacity: .75;
}



/* status
   ========================================================================== */

#contents .status {
  display: inline-block;
  vertical-align: middle;
}

#contents .status-order {
  min-width: 100px;
  padding: 6px 10px;
  border-radius:4px;
  background: #8E8F89;
  color: #fff;
  font-size: 16px;
  text-align: center;
}

@media screen and (max-width: 600px) {
  
  #contents .status-order {
    min-width: 150px;
  }
  
}

#contents .status-order_accept {
  background: #FE6D71;
}

#contents .status-order_payment {
  background: #F092C3;
}

#contents .status-order_preparation {
  background: #78C2EF;
}

#contents .status-order_complete {
  background: #8E8F89;
}

#contents .status-order_cancel {
  background: #8E8F89;
}

#contents .status-order_return {
  background: #8E8F89;
}



/* ec-header
   ========================================================================== */

#contents .ec-header {
  display: table;
  width: 100%;
  height: 40px;
  margin: 18px 0 20px;
} 

@media screen and (max-width: 600px) {
  
  #contents .ec-header {
    position: relative;
    display: block;
    overflow: hidden;
    width: auto;
    height: auto;
    margin-top: 10px;
    margin-bottom: 10px;
  }
  
}

#contents .ec-header *,
#contents .ec-header *:before,
#contents .ec-header *:after {
  vertical-align: middle;
}

/* h1 */

#contents .ec-header h1 {
  display: table-cell;
  padding-right: 22px;
}

#contents .ec-header h1 img {
  max-width: none;
}

@media screen and (max-width: 600px) {
  
  #contents .ec-header h1 {
    display: block;
    width: auto;
    height: 40px;
  }
  
  #contents .ec-header h1 img {
    max-width: 100%;
  }
  
}

/* spacer */

#contents .ec-header .spacer {
  display: table-cell;
  width: 100%;
}

@media screen and (max-width: 600px) {
  
  #contents .ec-header .spacer {
    display: none;
  }
  
}

/* breadcrumbs */

#contents .ec-header .breadcrumbs {
  display: table-cell;
  width: 100%;
  padding-left: 19px;
  border-left: dashed 1px #E3E3E3;
  color: #AAA;
}

@media screen and (max-width: 800px) {
  
  #contents .ec-header .breadcrumbs {
    padding-left: 0;
    border-left: none;
  }
  
  #contents .ec-header .breadcrumbs ol {
    display: none;
  }
  
}

@media screen and (max-width: 600px) {
  
  #contents .ec-header .breadcrumbs {
    display: none;
  }
  
}

#contents .ec-header .breadcrumbs li {
  float: left;
  line-height: 24px;
  padding: 2px 0;
}

#contents .ec-header .breadcrumbs li + li:before {
  content: url(../img/icon_breadcrumbs_arrow.png);
  display: inline-block;
  margin: 0 6px 0 8px;
  line-height: 1;
}

#contents .ec-header .breadcrumbs img {
  display: inline-block;
}

#contents .ec-header .breadcrumbs a {
  text-decoration: underline;
}

#contents .ec-header .breadcrumbs-selector {
  display: inline-block;
  position: relative;
  z-index: 0;
  overflow: hidden;
  height: 24px;
  max-width: 220px;
  border: solid 1px #EEE;
  border-radius: 3px;
  background: #fff;
}

#contents .ec-header .breadcrumbs-selector:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: 2;
  width: 13px;
  padding: 0 6px;
  background: url(../img/icon_breadcrumbs_select.png) 50% 50% no-repeat;
}

#contents .ec-header .breadcrumbs-selector .value {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  overflow: hidden;
  padding: 4px 24px 4px 4px;
  color: #AAA;
  line-height: 16px;
}

#contents .ec-header .breadcrumbs-selector select {
  position: relative;
  z-index: 1000;
  width: 125%;
  height: 24px;
  margin: 0;
  padding: 0;
  padding-right: 20px;
  border: none;
  opacity: 0;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
}

#contents .ec-header .breadcrumbs-selector select:focus {
  filter: none;
}

#contents .ec-header .buttons {
  display: table-cell;
}

#contents .ec-header .buttons ul {
  display: table;
}

#contents .ec-header .buttons li {
  display: table-cell;
  padding-left: 10px;
  vertical-align: middle;
}

#contents .ec-header .buttons .menu {
  display: none;
}

#contents .ec-header .buttons .cart {
  width: 148px;
}

#contents .ec-header .buttons .btn {
  display: block;
  text-align: center;
}

#contents .ec-header .buttons .btn + .btn {
  margin-top: 5px;
}

@media screen and (max-width: 800px) {
  
  #contents .ec-header .buttons .menu {
    display: table-cell;
  }
  
}

@media screen and (max-width: 600px) {
  
  #contents .ec-header .buttons {
    display: block;
    width: auto;
    padding-left: 0;
  }
  
  #contents .ec-header .buttons ul {
    display: block;
  }
  
  #contents .ec-header .buttons li {
    display: block;
    padding-left: 0;
  }
  
  #contents .ec-header .buttons .menu {
    display: block;
    position: absolute;
    top: 2px;
    right: 0;
  }
  
  #contents .ec-header .buttons .cart {
    /* width: auto; */
    margin-left: auto;
  }
  
}

#contents .pagination {
  position: relative;
  overflow: hidden;
  margin: 20px 0;
}

#contents .pagination ul {
  position: relative;
  left: 50%;
  float: left;
  margin: -2px 0;
}

#contents .pagination li {
  position: relative;
  left: -50%;
  float: left;
  padding: 2px;
}

#contents .pagination .btn {
  display: block;
  padding: 10px;
  border: solid 1px #EEE;
  border-radius: 4px;
  background: #F9F7F4;
  color: inherit;
}

@media screen and (max-width: 600px) {
  
  #contents .pagination .btn {
    padding-left: 8px;
    padding-right: 8px;
  }
  
}

#contents .pagination .btn.is-active {
  background: #F8A605;
  color: #fff;
}

#contents .pagination a:hover {
  opacity: .75;
}

#contents .pagination .btn.is-active:hover {
  opacity: 1;
}



/* megamenu
   ========================================================================== */

#contents .megamenu {
  display: none;
  border: 1px #EBEBEB;
  border-style: solid none;
  background: #FDFDFD;
}

#contents .megamenu a {
  display: block;
  color: inherit;
}

#contents .megamenu a:hover {
  opacity: .75;
}

#contents .megamenu .inner > ul > li + li {
  margin: 20px 0;
}

#contents .megamenu .inner > ul > li > a {
  padding: 16px 5px 16px 24px;
  border-bottom: solid 1px #EEE;
  background: url(../img/icon_menu_cat.png) 6px 50% no-repeat;
  font-weight: bold;
}

#contents .megamenu .inner > ul > li + li > a {
  border-top: solid 1px #EEE;
}

#contents .megamenu .inner > ul > li > ul {
  overflow: hidden;
  margin: 0 -5px;
}

#contents .megamenu .inner > ul > li > ul > li {
  float: left;
  width: 25%;
  padding: 0 5px;
}

@media screen and (max-width: 800px) {
  
  #contents .megamenu .inner > ul > li > ul > li {
    width: 33.33%;
  }
  
}

@media screen and (max-width: 600px) {
  
  #contents .megamenu .inner > ul > li > ul > li {
    width: 50%;
  }
  
}

@media screen and (max-width: 480px) {
  
  #contents .megamenu .inner > ul > li > ul > li {
    float: none;
    width: auto;
  }
  
}

#contents .megamenu .inner > ul > li > ul > li > a {
  padding: 10px 5px 10px 24px;
  background: url(../img/icon_menu_arrow.png) 10px 50% no-repeat;
}



/* pagetop
   ========================================================================== */

#contents .pagetop {
  background: #AEA28E;
  color: #FFF;
  font-size: 11px;
  text-align: center;
}

#contents .pagetop a {
  display: block;
  padding: 10px;
  color: inherit;
  line-height: 1;
}

#contents .pagetop a:before {
  content: url(../img/icon_pagetop.png);
  display: inline-block;
  margin-right: 7px;
  line-height: 1;
  vertical-align: middle;
}

/* Q&A / regulation data
   ========================================================================== */

.question_answer_law{
	float:right;
}

.question_answer_law ul li{
		display:inline;
}

.question_answer_law ul li:last-child {
	border-right: none;
	padding-right: 0;
}
.question_answer_law ul li {
	border-right: 1px solid #E58C2C;
	padding-right: 5px;
}

.qa_list li{
	overflow: hidden;
	margin: 4px 0;
	border: solid 3px #FFBAB0;
	border-radius: 5px;
	background-color: #F7F7F7;
}

.qa_list .body{
	background-color:#fff;
}

.open{
	position: relative;
	margin: 0 8px;
	padding: 20px 29px;
	background: url(../../img/icon_qa_question.png) 0px 50% no-repeat;
	color: #83725F;
}

.open:after{
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: 7px;	
	margin: auto;
	width: 10px;
	height: 6px;
	background: url(../../img/icon_qa_arrow.png) no-repeat;
}

.close{
	margin: 0 8px;
	padding: 20px 7px 20px 37px;
	border-top: dashed 1px #E3E3E3;
	background: url(../../img/icon_qa_answer.png) 8px 20px no-repeat;
	color: #83725F;
}

#law-h3{
	font-weight:bold;
	font-size:120%;
}

#law-table{
	margin:0px -10px !important;
}

#law-table th{
		font-weight:bold;
}

#law-table td{
	padding:10px 15px !important;
}

@media screen and (max-width: 480px) {
#contents .ec-form .law-body{
	margin:0px 0px !important;
}
#law-h3{
	margin:0px -10px !important;
}
}