/* image */
.ph, .thumb, .keyvisual {
  position: relative;
  line-height: 0;
}

.ph img, .thumb img, .keyvisual img {
  width: 100%;
}

.ph img::after, .thumb img::after, .keyvisual img::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.ph::after, .thumb::after, .keyvisual::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.ph .dummy, .thumb .dummy, .keyvisual .dummy {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

body {
  background-color: #f5f5f5;
}

a {
  color: #BF9A5E;
}
a:hover {
  color: #444;
}

.btn--main {
  background: #BF9A5E;
  color: #fff;
}
.btn--main:hover {
  background: #BF9A5E;
}

.btn--sub {
  background: transparent;
  color: #BF9A5E;
}
.btn--sub:hover {
  color: #fff;
  background: #BF9A5E;
}

.detail__btn a::before {
  border-color: #BF9A5E;
}

.btn--chevron {
  color: #BF9A5E;
}
.btn--chevron::after {
  border-color: #BF9A5E;
}
.btn--chevron:hover {
  color: #BF9A5E;
}
.btn--chevron:hover::after {
  border-color: #BF9A5E;
}

.btn--chevron-left {
  color: #BF9A5E;
}
.btn--chevron-left::after {
  border-color: #BF9A5E;
}
.btn--chevron-left:hover {
  color: #BF9A5E;
}
.btn--chevron-left:hover::after {
  border-color: #BF9A5E;
}

.flex--container {
  display: flex;
}

header {
  padding: 2em 5% 0;
}
header h1 {
  width: 20vw;
  margin: 20px auto;
  position: relative;
  max-width: 280px;
}
header h1 svg {
  fill: #BF9A5E;
}

.section--login {
  padding-top: 0;
}

.wrap {
  background: #f5f5f5;
}

.block--attention {
  font-size: 14px;
  border: 1px solid;
  padding: 20px;
  border-radius: 6px;
}

.txt--attention {
  font-size: 14px;
  background: #ffdada;
  color: #cc0000;
  padding: 15px;
  border-radius: 10px;
  margin-bottom: 40px;
}

/* SP */
/* tablet */
@media screen and (min-width: 570px) and (max-width: 960px) {
  .page--mypage h1.logo {
    width: 110px;
    margin-bottom: 5px;
  }
}
.mypage .detail__btn.app a::after {
  content: "BACK";
}

@media screen and (min-width: 1px) and (max-width: 768px) {
  header h1 {
    width: 50vw;
    margin: 6px auto 20px auto;
  }
}/*# sourceMappingURL=mypage-service.css.map */