@charset "UTF-8";
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
sassを使用しているので、cssファイルを直接編集しないでください。
先祖返りの原因となります。
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/* foundation/_reset.scss
-------------------------------------------------- */
main html, main body, main div, main span, main applet, main object, main iframe,
main h1, main h2, main h3, main h4, main h5, main h6, main p, main blockquote, main pre,
main a, main abbr, main acronym, main address, main big, main cite, main code,
main del, main dfn, main em, main img, main ins, main kbd, main q, main s, main samp,
main small, main strike, main strong, main sub, main sup, main tt, main var,
main b, main u, main i, main center,
main dl, main dt, main dd, main ol, main ul, main li,
main fieldset, main form, main label, main legend,
main table, main caption, main tbody, main tfoot, main thead, main tr, main th, main td,
main article, main aside, main canvas, main details, main embed,
main figure, main figcaption, main footer, main header, main hgroup,
main menu, main nav, main output, main ruby, main section, main summary,
main time, main mark, main audio, main video, main button {
  margin: 0;
  padding: 0;
  width: initial;
  height: initial;
  font-size: 100%;
  font: inherit;
  color: inherit;
  line-height: inherit;
  vertical-align: baseline;
  background: initial;
  border: 0;
}
main hgroup, main menu, main aside, main details,
main header, main footer, main article, main main, main section, main nav,
main figcaption, main figure, main span, main em {
  display: block;
}
main *:focus {
  outline: none;
}
main table {
  border-collapse: collapse;
  border-spacing: 0;
}
main ol, main ul {
  list-style: none;
}
main i, main em {
  font-style: normal;
}
main blockquote, main q {
  quotes: none;
}
main blockquote:before, main blockquote:after, main q:before, main q:after {
  content: "";
  content: none;
}
main *:not(table):not(tbody):not(thead):not(tfoot):not(tr):not(th):not(td) {
  position: relative;
  box-sizing: border-box;
}
main a {
  text-decoration: none;
}

body main {
  color: #fff;
  font-family: "Yu Gothic", YuGothic, "Hiragino Kaku Gothic Pro", Meiryo, sans-serif;
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (min-width: 769px) {
  body main {
    font-size: 16px;
  }
}
@media screen and (max-width: 768px) {
  body main {
    font-size: 14px;
  }
}

main img,
main svg {
  width: 100%;
  vertical-align: bottom;
}

main svg {
  height: auto;
}

a {
  text-decoration: none;
}
a[href=""] {
  pointer-events: none;
}
@media screen and (min-width: 769px) {
  a {
    transition-duration: 0.3s;
  }
  a:hover {
    opacity: 0.7;
  }
}

@media screen and (min-width: 769px) {
  [data-device=sp] {
    display: none !important;
  }
  a[href^=tel] {
    pointer-events: none;
  }
}
@media screen and (max-width: 768px) {
  [data-device=pc] {
    display: none !important;
  }
  body {
    -webkit-overflow-scrolling: touch;
  }
  main {
    overflow: hidden;
  }
  img {
    max-width: 100%;
    height: auto;
  }
}
.c-arrow::after {
  content: "";
  display: block;
  background: url(../images/arrow.svg) no-repeat 100%/contain;
  width: 12px;
  height: 7px;
  position: absolute;
  bottom: 5px;
  left: 50%;
  transform: translateX(-50%);
}

.c-bg__01 {
  background: linear-gradient(180deg, rgb(22, 26, 55) 0%, rgb(1, 6, 46) 50%, rgb(0, 8, 45) 100%);
  overflow: hidden;
}
.c-bg__01::before {
  content: "";
  display: block;
  background: url(../images/bg_01.png) no-repeat top/cover;
  width: 100%;
  height: 750px;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.1;
}

.c-bg__02 {
  background: linear-gradient(180deg, rgb(11, 19, 56) 0%, rgb(38, 57, 111) 50%, rgb(65, 94, 164) 100%);
}

.c-bg__03 {
  background: linear-gradient(180deg, rgb(219, 227, 255) 0%, rgb(142, 153, 193) 25%, rgb(38, 57, 121) 75%, rgb(15, 21, 53) 100%);
}

.c-font__14 {
  font-size: 14px;
}
.c-font__18 {
  font-size: 18px;
}
.c-font__20 {
  font-size: 20px;
}
.c-font__27 {
  font-size: 27px;
}
.c-font__12-14 {
  font-size: 12px;
}
@media screen and (min-width: 769px) {
  .c-font__12-14 {
    font-size: 14px;
  }
}
.c-font__12-20 {
  font-size: 12px;
}
@media screen and (min-width: 769px) {
  .c-font__12-20 {
    font-size: 20px;
  }
}
.c-font__14-18 {
  font-size: 14px;
}
@media screen and (min-width: 769px) {
  .c-font__14-18 {
    font-size: 18px;
  }
}
.c-font__16-18 {
  font-size: 16px;
}
@media screen and (min-width: 769px) {
  .c-font__16-18 {
    font-size: 18px;
  }
}
.c-font__16-20 {
  font-size: 16px;
}
@media screen and (min-width: 769px) {
  .c-font__16-20 {
    font-size: 20px;
  }
}
.c-font__16-22 {
  font-size: 16px;
}
@media screen and (min-width: 769px) {
  .c-font__16-22 {
    font-size: 22px;
  }
}
.c-font__20-40 {
  font-size: 20px;
}
@media screen and (min-width: 769px) {
  .c-font__20-40 {
    font-size: 40px;
  }
}
.c-font__20-27 {
  font-size: 20px;
}
@media screen and (min-width: 769px) {
  .c-font__20-27 {
    font-size: 27px;
  }
}
.c-font__27-40 {
  font-size: 27px;
}
@media screen and (min-width: 769px) {
  .c-font__27-40 {
    font-size: 40px;
  }
}
.c-font__27-60 {
  font-size: 27px;
}
@media screen and (min-width: 769px) {
  .c-font__27-60 {
    font-size: 60px;
  }
}

.c-fw-md {
  font-weight: 500;
}

.c-heading {
  text-align: center;
}
.c-heading__arrow {
  background: #F5C501;
  color: #000;
  margin-bottom: 44px;
}
@media screen and (min-width: 769px) {
  .c-heading__arrow {
    margin-bottom: 88px;
  }
}
.c-heading__arrow::after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  bottom: -44px;
  transform: translateX(-50%);
  border-style: solid;
  border-color: #F5C501 transparent transparent transparent;
  border-width: 44px 80px 0 80px;
}
@media screen and (min-width: 769px) {
  .c-heading__arrow::after {
    bottom: -88px;
    border-width: 88px 165px 0 165px;
  }
}
.c-heading__border::after {
  content: "";
  display: block;
  width: 170px;
  height: 2px;
  background: #F5C501;
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);
}

.c-ind {
  text-indent: -1em;
  padding-left: 1em;
}
.c-ind__point {
  text-indent: -30px;
  padding-left: 30px;
}

.c-inner {
  width: 95%;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.c-inner__sp {
  width: 95%;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
@media screen and (min-width: 769px) {
  .c-inner__sp {
    max-width: 100%;
  }
}

#c-link.c-link__fc {
  color: #fff;
}
#c-link.c-link__ul {
  text-decoration: underline;
}

.c-parts__flash::after {
  content: "";
  display: block;
  background: url(../images/flash.png) no-repeat 100%/contain;
  position: absolute;
}
.c-parts__light::before {
  content: "";
  display: block;
  background: url(../images/light_sp.svg) no-repeat 100%/contain;
  width: 395px;
  height: 55px;
  position: absolute;
  top: 0;
  right: 0;
}
@media screen and (min-width: 769px) {
  .c-parts__light::before {
    background: url(../images/light_pc.svg) no-repeat 100%/contain;
    width: 1200px;
    height: 220px;
  }
}
.c-parts__circle {
  color: #fff;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  text-align: center;
  line-height: 40px;
}
@media screen and (min-width: 769px) {
  .c-parts__circle {
    width: 58px;
    height: 58px;
    line-height: 58px;
  }
}

.c-zi-1 {
  z-index: 1;
}

.c-zi-2 {
  z-index: 2;
}

.l-container {
  padding-bottom: 60px;
  overflow: hidden;
}

@media screen and (min-width: 769px) {
  .l-main {
    min-width: 1024px;
  }
}

.p-index__nav {
  background: #F5C501;
}
.p-index__nav__list {
  padding: 15px 0;
  gap: 15px 4%;
}
@media screen and (min-width: 769px) {
  .p-index__nav__list {
    gap: 0;
  }
}
.p-index__nav__item {
  width: 48%;
  height: 55px;
  border: 1px solid #000;
}
@media screen and (min-width: 769px) {
  .p-index__nav__item {
    width: auto;
    height: auto;
    border: none;
  }
}
.p-index__nav__item__link {
  display: block;
  padding: 10px 15px 15px;
  width: 100%;
}
@media screen and (min-width: 769px) {
  .p-index__nav__item__link {
    padding: 10px 30px 20px;
  }
}
@media screen and (min-width: 769px) {
  .p-index__nav__item + .p-index__nav__item {
    border-left: 1px solid #000;
  }
}
.p-index__feature h2 {
  width: 135px;
  margin: 0 auto 30px;
}
@media screen and (min-width: 769px) {
  .p-index__feature h2 {
    width: 240px;
  }
}
.p-index__feature__text {
  line-height: 1;
}
.p-index__feature__text + p {
  margin-top: 10px;
  margin-bottom: 40px;
}
.p-index__feature__chara {
  margin-left: 10px;
}
@media screen and (max-width: 768px) {
  .p-index__feature__chara {
    font-size: 17px;
  }
}
@media screen and (min-width: 769px) {
  .p-index__feature__chara {
    margin-left: 20px;
  }
}
.p-index__feature__point__title {
  position: relative;
  height: 65px;
  margin-bottom: 30px;
}
@media screen and (min-width: 769px) {
  .p-index__feature__point__title {
    height: 106px;
  }
}
.p-index__feature__point__title img {
  position: absolute;
  width: auto;
  height: 83px;
  bottom: -20px;
  left: 0;
}
@media screen and (min-width: 769px) {
  .p-index__feature__point__title img {
    height: 105px;
    bottom: -12px;
  }
}
.p-index__feature__point__title::before {
  content: "";
  display: block;
  background: linear-gradient(90deg, rgb(255, 240, 0) 0%, rgb(255, 255, 255) 50%, rgb(255, 240, 0) 100%);
  width: 100%;
  height: 2px;
  position: absolute;
  bottom: -8px;
  left: 0;
}
.p-index__feature__point__item + .p-index__feature__point__item {
  margin-top: 15px;
}
.p-index__feature__point__item::before {
  content: "";
  display: inline-block;
  background: url(../images/check.svg) no-repeat center/contain;
  width: 20px;
  height: 18px;
  margin-right: 10px;
}
.p-index__feature__point__photo {
  margin-top: 60px;
}
@media screen and (min-width: 769px) {
  .p-index__feature__point__photo {
    margin-left: 30px;
  }
}
@media screen and (min-width: 769px) {
  .p-index__feature__point__photo img {
    width: 370px;
  }
}
.p-index__feature__light__01::before {
  top: -100px;
  right: -125px;
}
@media screen and (max-width: 768px) {
  .p-index__feature__light__01::before {
    opacity: 0.7;
  }
}
@media screen and (min-width: 769px) {
  .p-index__feature__light__01::before {
    top: -150px;
    right: 40px;
  }
}
.p-index__feature__light__02::before {
  top: -147px;
  right: -1430px;
  height: 420px;
  width: 1850px;
}
.p-index__feature__light__03::before {
  width: 305px;
  height: 40px;
  top: 7px;
  right: 143px;
  opacity: 0.7;
}
@media screen and (min-width: 769px) {
  .p-index__feature__light__03::before {
    width: 1660px;
    height: 300px;
    top: -230px;
    right: -400px;
  }
}
.p-index__feature__light__04::before {
  top: 10px;
  right: 10px;
}
@media screen and (max-width: 768px) {
  .p-index__feature__light__04::before {
    width: 300px;
    height: 40px;
  }
}
@media screen and (min-width: 769px) {
  .p-index__feature__light__04::before {
    top: -255px;
    right: -620px;
  }
}
.p-index__feature__flash--01 {
  width: 100%;
}
@media screen and (min-width: 769px) {
  .p-index__feature__flash--01 {
    width: 753px;
  }
}
.p-index__feature__flash--01::after {
  width: 390px;
  height: 125px;
  top: -75px;
  right: -190px;
}
@media screen and (min-width: 769px) {
  .p-index__feature__flash--01::after {
    width: 690px;
    height: 219px;
    top: -130px;
    right: -350px;
  }
}
.p-index__feature__flash--02 {
  width: 100%;
}
.p-index__usage-rules__heading {
  padding: 30px;
  margin-bottom: 100px;
}
.p-index__usage-rules__heading p::after {
  content: "";
  display: inline-block;
  background: url(../images/clock.svg) no-repeat center/contain;
  width: 20px;
  height: 19px;
}
@media screen and (min-width: 769px) {
  .p-index__usage-rules__heading p::after {
    width: 40px;
    height: 39px;
  }
}
.p-index__usage-rules__heading::before {
  content: "";
  display: block;
  background: url(../images/flash_large_sp.png) no-repeat 100%/contain;
  width: 250px;
  height: 100%;
  position: absolute;
  top: 160px;
  left: -100px;
}
@media screen and (min-width: 769px) {
  .p-index__usage-rules__heading::before {
    background: url(../images/flash_large_pc.png) no-repeat 100%/contain;
    width: 774px;
    top: 210px;
    left: -410px;
  }
}
@media screen and (max-width: 768px) {
  .p-index__usage-rules__product {
    padding: 0 110px 30px 65px;
  }
}
@media screen and (min-width: 769px) {
  .p-index__usage-rules__product {
    width: 374px;
    position: absolute;
    top: 497px;
    left: 290px;
    z-index: 1;
  }
}
.p-index__usage-rules__document {
  padding: 60px 30px;
  border: 3px solid rgb(191, 200, 222);
  -o-border-image: linear-gradient(90deg, rgb(191, 200, 222) 0%, rgb(255, 255, 255) 25%, rgb(94, 125, 209) 75%, rgb(255, 255, 255) 100%);
     border-image: linear-gradient(90deg, rgb(191, 200, 222) 0%, rgb(255, 255, 255) 25%, rgb(94, 125, 209) 75%, rgb(255, 255, 255) 100%);
  border-image-slice: 1;
}
@media screen and (min-width: 769px) {
  .p-index__usage-rules__document {
    padding: 60px 65px 115px;
    width: 50%;
    min-width: 540px;
  }
}
.p-index__usage-rules__document__heading {
  margin-bottom: 60px;
}
.p-index__usage-rules__document__heading::after {
  content: "";
  display: block;
  background: url(../images/usage-rules_heading.svg) no-repeat 100%/contain;
  width: 295px;
  height: 20px;
  margin: 10px auto 0;
}
@media screen and (min-width: 769px) {
  .p-index__usage-rules__document__heading::after {
    width: 344px;
  }
}
@media screen and (max-width: 768px) {
  .p-index__usage-rules__document + .p-index__usage-rules__document {
    margin-top: 30px;
  }
}
@media screen and (min-width: 769px) {
  .p-index__usage-rules__document + .p-index__usage-rules__document {
    margin-left: 20px;
  }
}
.p-index__usage-rules__document__first p {
  margin-bottom: 10px;
}
.p-index__usage-rules__document__first img {
  width: 206px;
}
.p-index__usage-rules__document__second p {
  margin-bottom: 10px;
}
.p-index__usage-rules__document__second img {
  width: 195px;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .p-index__usage-rules__document__second img + img {
    margin-top: 15px;
  }
}
@media screen and (min-width: 769px) {
  .p-index__usage-rules__document__second img + img {
    margin-left: 15px;
  }
}
.p-index__usage-rules__document__item + .p-index__usage-rules__document__item {
  margin-top: 60px;
}
.p-index__usage-rules__battery {
  margin-top: 60px;
}
.p-index__usage-rules__battery h3 {
  width: 162px;
  margin: 0 auto 40px;
}
@media screen and (min-width: 769px) {
  .p-index__usage-rules__battery h3 {
    width: 240px;
  }
}
.p-index__usage-rules__battery h3::after {
  background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(243, 243, 243) 15%, rgb(190, 207, 255) 25%, rgb(255, 255, 255) 30%, rgb(255, 255, 255) 70%, rgb(190, 207, 255) 75%, rgb(243, 243, 243) 85%, rgb(255, 255, 255) 100%);
  bottom: -10px;
}
@media screen and (min-width: 769px) {
  .p-index__usage-rules__battery__item {
    width: 313px;
  }
}
.p-index__usage-rules__light__01::before {
  top: 95px;
  right: 120px;
  width: 380px;
  height: 40px;
}
@media screen and (min-width: 769px) {
  .p-index__usage-rules__light__01::before {
    top: 515px;
    right: 760px;
    width: 1000px;
    height: 120px;
  }
}
.p-index__usage-rules__light__02::before {
  top: -70px;
  right: -165px;
  width: 380px;
  height: 40px;
}
.p-index__usage-rules__light__03::before {
  top: -56px;
  right: -95px;
  width: 320px;
  height: 30px;
}
@media screen and (min-width: 769px) {
  .p-index__usage-rules__light__03::before {
    top: -155px;
    right: -630px;
    width: 1100px;
    height: 200px;
  }
}
.p-index__notes h2 {
  margin-bottom: 40px;
}
@media screen and (min-width: 769px) {
  .p-index__notes h2 {
    margin-bottom: 45px;
  }
}
.p-index__notes h2 img {
  width: 216px;
  margin: auto;
}
@media screen and (min-width: 769px) {
  .p-index__notes h2 img {
    width: 479px;
  }
}
.p-index__notes h2::after {
  background: linear-gradient(90deg, rgb(16, 22, 56) 0%, rgb(113, 139, 209) 25%, rgb(26, 34, 70) 50%, rgb(113, 139, 209) 75%, rgb(26, 34, 70) 100%);
  bottom: -10px;
}
@media screen and (min-width: 769px) {
  .p-index__notes h2::after {
    bottom: -15px;
  }
}
.p-index__notes__heading {
  padding: 30px;
  margin-bottom: 60px;
}
@media screen and (min-width: 769px) {
  .p-index__notes__heading {
    margin-bottom: 105px;
  }
}
.p-index__notes__main {
  background: #fff;
  color: #000;
  padding: 60px 35px 30px;
}
@media screen and (min-width: 769px) {
  .p-index__notes__main {
    padding: 60px;
  }
}
.p-index__useful h2 {
  margin-bottom: 45px;
}
.p-index__useful h2 img {
  width: 162px;
  margin: auto;
}
@media screen and (min-width: 769px) {
  .p-index__useful h2 img {
    width: 360px;
  }
}
.p-index__useful h2::after {
  background: #fff;
  bottom: -15px;
}
.p-index__useful__heading {
  margin-bottom: 30px;
}
@media screen and (min-width: 769px) {
  .p-index__useful__heading {
    margin-bottom: 15px;
  }
}
@media screen and (min-width: 769px) {
  .p-index__useful__item {
    width: 313px;
  }
}
.p-index__useful__movie {
  margin-top: 60px;
}
@media screen and (min-width: 769px) {
  .p-index__useful__movie__inner {
    max-width: 740px;
    margin: auto;
  }
}
.p-index__useful__movie__youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  margin-top: 30px;
}
@media screen and (min-width: 769px) {
  .p-index__useful__movie__youtube {
    margin-top: 15px;
  }
}
.p-index__useful__movie__youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.p-index__useful__light__01::before {
  top: -30px;
  right: 120px;
}
@media screen and (max-width: 768px) {
  .p-index__useful__light__01::before {
    width: 370px;
  }
}
@media screen and (min-width: 769px) {
  .p-index__useful__light__01::before {
    top: 100px;
    right: 340px;
  }
}
.p-index__useful__light__02::before {
  top: -40px;
  right: -900px;
}
.p-index__useful__light__03::before {
  top: 0px;
  right: -33px;
  width: 340px;
}
@media screen and (min-width: 769px) {
  .p-index__useful__light__03::before {
    top: -260px;
    right: 580px;
    width: 980px;
  }
}
.p-index__qa h2 {
  width: 180px;
  margin: 0 auto 30px;
}
@media screen and (min-width: 769px) {
  .p-index__qa h2 {
    width: 399px;
    margin: 0 auto 60px;
  }
}
.p-index__qa h3 {
  background: #213976;
  padding: 10px;
}
.p-index__qa__content + .p-index__qa__content {
  margin-top: 60px;
}
.p-index__qa__item {
  color: #000;
}
.p-index__qa__item__inner {
  padding: 30px 10px;
  border-bottom: 1px solid #A7A7A7;
}
@media screen and (min-width: 769px) {
  .p-index__qa__item__inner {
    padding: 30px;
  }
}
.p-index__qa__item p {
  width: calc(100% - 60px);
  margin: 5px 0 0 30px;
}
@media screen and (min-width: 769px) {
  .p-index__qa__item p {
    width: calc(100% - 128px);
    margin: 15px 0 0 30px;
  }
}
.p-index__qa__item--q {
  cursor: pointer;
}
.p-index__qa__item--q span {
  background: linear-gradient(180deg, rgb(18, 20, 32) 0%, rgb(65, 94, 164) 100%);
}
.p-index__qa__item--a {
  display: none;
  background: #FFFCCB;
}
.p-index__qa__item--a span {
  background: linear-gradient(180deg, rgb(255, 158, 3) 0%, rgb(255, 188, 28) 70%, rgb(255, 239, 69) 100%);
}
.p-index__shop__list {
  background: #ADADAD;
  padding: 90px;
}
@media screen and (min-width: 769px) {
  .p-index__shop__list {
    padding: 150px;
  }
}

footer ul:first-of-type {
  padding-top: 8.66%;
}
@media screen and (min-width: 769px) {
  footer ul:first-of-type {
    padding-top: 54px;
  }
}

.u-ta-c {
  text-align: center !important;
}

.u-ta-r {
  text-align: right !important;
}

.u-ta-l {
  text-align: left !important;
}

.u-flex {
  display: flex !important;
}
@media screen and (min-width: 769px) {
  .u-flex__pc {
    display: flex !important;
  }
}

.u-fw-wr {
  flex-wrap: wrap !important;
}
@media screen and (max-width: 768px) {
  .u-fw-wr__sp {
    flex-wrap: wrap !important;
  }
}

.u-jc-c {
  justify-content: center !important;
}
@media screen and (min-width: 769px) {
  .u-jc-c__pc {
    justify-content: center !important;
  }
}

.u-jc-r {
  justify-content: right !important;
}

.u-jc-l {
  justify-content: left !important;
}

.u-jc-sb {
  justify-content: space-between !important;
}

.u-ai-c {
  align-items: center !important;
}
@media screen and (min-width: 769px) {
  .u-ai-c__pc {
    align-items: center !important;
  }
}

.u-fd-cl {
  flex-direction: column !important;
}
@media screen and (max-width: 768px) {
  .u-fd-cl__sp {
    flex-direction: column !important;
  }
}

.u-gap-30 {
  gap: 30px !important;
}

.u-lh-12 {
  line-height: 1.2 !important;
}

.u-lh-20 {
  line-height: 2 !important;
}
@media screen and (min-width: 769px) {
  .u-lh-20__pc {
    line-height: 2 !important;
  }
}

.u-lh-30 {
  line-height: 3 !important;
}
@media screen and (min-width: 769px) {
  .u-lh-30__pc {
    line-height: 3 !important;
  }
}

.u-mg__t__15 {
  margin-top: 15px !important;
}

.u-mg__tb__30 {
  margin-top: 30px !important;
  margin-bottom: 30px !important;
}

.u-pd__t__60 {
  padding-top: 60px;
}

@media screen and (max-width: 768px) {
  .u-pd__lr__20__sp {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

@media screen and (min-width: 769px) {
  .u-pd__lr__50__pc {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
}

.p-index__shop{
  background:#f5c501;	
}
.p-index__shop__main {
  background: #fff;
  color: #000;
  padding: 10px 0px 30px;
}
@media screen and (min-width: 769px) {
  .p-index__shop__main {
    padding: 10px 0px 30px;
  }
}

.p-index__shop__main table{
	margin:0 auto;
	background:#fff;
	width:80%;
}

.p-index__shop__main th,.p-index__shop__main td{
	padding:1em;
	border-bottom:1px solid #ccc;
}

.p-index__shop__main th{
	padding-left:5em;
}
.p-shop_center{
	text-align:center;
	margin-bottom:1em;
	color:#000;
}

.p-index__shop__item{
	margin:1em auto 0;
	width:80%;
	color:#000;

}
@media screen and (max-width: 769px) {
.p-index__shop__main table{
	width:100%;
}
.p-index__shop__main th,.p-index__shop__main td{
	padding:.5em;
	border-bottom:1px solid #ccc;
}



.p-shop_center{
	text-align:left;
	margin-bottom:1em;
}
.p-index__shop__item{
	margin:1em auto 0;
	width:100%;
}
}

.p-index__shop h2 {
  width: 80%;
  margin: 0 auto 0px;
  background:#f5c501;
  color:#000;
}
@media screen and (min-width: 769px) {
  .p-index__shop h2 {
    width: 60%;
    margin: 0 auto 10px;
  }
}
