/* Mypage Category */
.sp-hidden {
  display: none;}
.mypage-category {
	background: #a6a6a6;
	padding: 20px 15px;}
.mypage-category__container {
	margin: 0 auto;
	max-width: 1100px;}
.mypage-category__heading {
	color: #fff;
	font-size: 2.5rem;
	font-weight: normal;
	line-height: 1.3em;
	margin-bottom: 10px;}
  .mypage-category__heading span {
    font-size: 1.7rem;}
.mypage-category__paragraph {
	color: #fff;
	font-size: 1.45rem;
	line-height: 1.45em;
	margin-bottom: 23px;}
.mypage-category__list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-line-pack: start;
  align-content: flex-start;
  margin-right: 0;}
  .mypage-category__list li {
    margin-bottom: 10px;
    margin-right: 0;
    flex-basis: 49%;}
    .mypage-category__list li a {
      background: url(../../img/mypage/mypage-category__list__icon-arrow.png) no-repeat right center;
      -ms-background-size: 25px 25px;
      background-size: 25px 25px;
      border: 1px solid #fff;
      -ms-box-sizing: border-box;
      box-sizing: border-box;
      color: #fff;
      display: block;
      font-weight: normal;
      font-size: 1.3rem;
      height: 100%;
      padding: 10px 20px 10px 10px;
      -ms-transition: all ease 0.5s;
      transition: all ease 0.5s;
      text-decoration: none;}

/* Mypage History */
.mypage-history {
	padding: 20px 10px;}
.mypage-history__container {
	max-width: 1100px;
	margin: 0 auto;}
.mypage-history__heading {
	border-bottom: 1px solid #b3b3b3;
	color: #333;
	font-size: 1.8rem;
	line-height: 1.8;
	margin-bottom: 20px;}
.mypage-history__heading2 {
	border-bottom: 1px solid #b3b3b3;
	color: #333;
	font-size: 1.4rem;
	line-height: 1.8;
	margin-bottom: 15px;}
.mypage-history__heading2 em {
	color: #f00;
	font-style: normal;}
.mypage-history__heading3 {
	border-bottom: 1px solid #b3b3b3;
	color: #595757;
	font-size: 1.4rem;
	line-height: 1.8;
	margin-bottom: 10px;
	padding-bottom: 5px;}
.mypage-history__tbl-wrap {
  margin-bottom: 12px;
  overflow-x:auto;}
.mypage-history__tbl-wrap::-webkit-scrollbar {
    height: 5px;}
.mypage-history__tbl-wrap::-webkit-scrollbar-thumb {
    background: #9f9e9e;}
.mypage-history__tbl-wrap::-webkit-scrollbar-track {
    background: #ccc;}
.mypage-history__tbl {
	width: 980px;}
.mypage-history__tbl th,
.mypage-history__tbl td {
	border: 1px solid #b4b3b3;
	color: #000;
	font-size: 1.5rem;
	font-weight: normal;
	line-height: 1.3;
	padding: 13px 10px 8px;
	vertical-align: middle;
	text-align: center;}
.mypage-history__tbl-size1 {width: 21%;}
.mypage-history__tbl-size2 {width: 12.5%;}
.mypage-history__tbl-size3 {width: 16.5%;}
.mypage-history__tbl-size4 {width: 20%;}
.mypage-history__tbl-size5 {width: 10%;}
.mypage-history__tbl-size6 {width: 31%;}
.mypage-history__tbl-size7 {width: 15%;}
.mypage-history__tbl-size8 {width: 8.5%;}
.mypage-history__tbl-size9 {width: 16.5%;}
.mypage-history__tbl th {
	background: #f7f8f8;}
.mypage-history__tbl td {
	padding: 22px 10px;}
.mypage-history__tbl2 td {
	padding: 14px 10px 10px;}
.mypage-history__tbl .align-right {
	text-align: right;}
.mypage-history__tbl__btn-download {
	background: #666;
	border-radius: 7px;
	color: #fff;
	display: inline-block;
	font-weight: bold;
	font-size: 1.3rem;
	min-width: 180px;
	padding: 10px 0 7px;
	text-align: center;
	text-decoration: none!important;
	-webkit-transition: all ease 0.5s;
	-ms-transition: all ease 0.5s;
	transition: all ease 0.5s;}
.mypage-history__order {
	background: #f7f8f8;
	border: 1px solid #abaaaa;
	margin-bottom: 12px;
	padding: 12px 15px;
	position: relative;}
.mypage-history__order-list dt {
	color: #000;
	font-weight: bold;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.5em;}
.mypage-history__order-list dd {
	color: #000;
	font-size: 1.6rem;
	line-height: 1.5em;
	margin: -1.5em 0 0;
	padding: 0 0 0 8em;}
.mypage-history__order-btn {
	position: absolute;
	right: 10px;
	bottom: 10px;
	z-index: 10;}
.mypage-history__order-btn a {
	background: #666;
	border-radius: 7px;
	color: #fff;
	display: inline-block;
	font-weight: bold;
	font-size: 1.3rem;
  line-height: 1.3em;
	padding: 10px 10px 7px;
	text-align: center;
	text-decoration: none!important;
	-webkit-transition: all ease 0.5s;
	-ms-transition: all ease 0.5s;
	transition: all ease 0.5s;}

/* Mypage Related */
.mypage-related {
  padding: 0 15px 20px;}
.mypage-related__container {
	margin: 0 auto;
	max-width: 1100px;}
.mypage-related__heading {
    border-bottom: 1px solid #c0c0c0;
    color: #333;
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 1.3em;
    margin-bottom: 15px;
    padding-bottom: 7px;}
.mypage-related-list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: justify;
  justify-content: flex-start;
  align-content: unset;
  align-items: stretch;
  margin-right: -2%;}
.mypage-related-list > li {
  border: 1px solid #a6a6a6;
  -ms-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #595757;
  margin-bottom: 10px;
  margin-right: 2%;
  width: 48%;
  padding: 10px 10px 50px;
  position: relative;}
.mypage-related-list .mypage-related-image {
  margin-bottom: 15px;
  text-align: center;}
  .mypage-related-list .mypage-related-image a img {
    -webkit-transition: all ease 0.5s;
    -ms-transition: all ease 0.5s;
    transition: all ease 0.5s;}
.mypage-related-list .mypage-related-type {
  margin-bottom: 10px;}
.mypage-related-list .mypage-related-type li {
  color: #fff;
  display: inline-block;
  font-size: 1.1rem;
  font-weight: bold;
  line-height: 1.3em;
  min-width: 48px;
  margin: 0 2px 5px 0;
  padding: 3px 5px;
  text-align: center;}
.mypage-related-list .mypage-related-type li.blue {
  background: #46a8ff;}
.mypage-related-list .mypage-related-type li.gray {
  background: #808080;}
.mypage-related-list .mypage-related-type li.orange {
  background: #ff7800;}
.mypage-related-list .mypage-related-type li.green {
  background: #28b3b3;}
.mypage-related-list .mypage-related-type li.purple {
  background: #a078d2;}
.mypage-related-list .mypage-related-id {
  font-size: 1.1rem;
  line-height: 1.1em;
  margin-bottom: 10px;}
.mypage-related-list .mypage-related-name {
  font-size: 1.375rem;
  font-weight: normal;
  line-height: 1.3em;
  margin-bottom: 10px;}

.mypage-related-price__wrap {
  position: absolute;
  right: 0;
  bottom: 12px;
  width: 100%;
}
.mypage-related-price__inner {
  margin-bottom: 5px;
  width: 100%;
}
.mypage-related-price__inner > dt,
.mypage-related-price__inner > dd {
  font-size: 1rem;
  font-weight: bold;
  line-height: 1.3em;
  text-align: right;
}
.mypage-related-price__inner > dd > span {
  font-size: 1.25rem;
}
.mypage-related-price__inner > dt{
  width: 40%;
  float: left;
}

/* Mypage News */
.mypage-news {
  padding: 0 15px 35px;}
.mypage-news__container {
	margin: 0 auto;
	max-width: 1100px;}
.mypage-news__heading {
    color: #595757;
    font-size: 2.5rem;
    font-weight: normal;
    line-height: 1.3em;
    margin-bottom: 10px;}
.mypage-news__content {
	border: 1px solid #afafaf;
	color: #333;
	font-size: 1.4rem;
	line-height: 1.7em;
	padding: 10px 5px 10px 10px;}
.mypage-news__content-inner {
	height: 300px;
	overflow-y: scroll;
	padding: 0;}
.mypage-news__content-inner::-webkit-scrollbar {
    width: 10px;}
.mypage-news__content-inner::-webkit-scrollbar-thumb {
    background: #9f9e9e;
    -ms-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;}
.mypage-news__content-inner::-webkit-scrollbar-track {
    background: #fafafa;
	border-left: 1px solid #f3f3f3;
	border-right: 1px solid #f3f3f3;}
.mypage-news__content p {
	margin-bottom: 20px;}

@media screen and (max-width: 468px){
  .mypage-category__heading span {
    font-size: 1.3rem;}
  .mypage-category__list li a {
    background-position: right bottom 5px;
  }
  .mypage-history__order-btn {
    margin-top: 20px;
    position: static;
    text-align: center;}
}
@media screen and (max-width: 360px){
  .mypage-related-list {
    margin-right: 0;}
  .mypage-related-list > li {
    flex-basis:100%;
    margin-right: 0;
    padding-bottom: 10px;}
  .mypage-related-price__wrap {
    position: static;}
}
