@charset "UTF-8";

/* ===== アイテム販売方法 ===== */
#rule1 {
  text-align: center;
}

.item-section {
  margin: 60px auto 0;
}

.item-section h2 {
  font-family: "Cinema Letter";
  font-size: min(3.7209302325581395vw, 16px);
  line-height: 2;
  color: #E8BA21;
  text-align: center;
}

.item-box {
  width: calc(100% - 40px * 2);
  margin: 20px auto 0;
  padding: 20px;
  border: 1px solid #E8BA21;
  background-color: #002F51;
}

.item-box p {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-size: min(2.7906976744186047vw, 12px);
  line-height: 2;
  color: #fff;
  text-align: left;
}

/* ===== G-SHOCK販売方法 ===== */
#rule2 {
  text-align: center;
}

.gshok-section {
  width: calc(100% - 20px * 2);
  margin: 60px auto 0;
}

.gshok-section h2 {
  font-family: "Cinema Letter";
  font-size: min(3.7209302325581395vw, 16px);
  line-height: 2;
  color: #E8BA21;
  text-align: center;
}

.gshok-section .image {
  margin: 20px auto 0;
}

/* ===== アンカーボタン/リンクボタン ===== */
.anchor-btn, 
.link-btn {
  margin: 20px auto 60px;
}

.anchor-btn a, 
.link-btn a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  padding: 10px 20px;
  background: #20AEE5;
  border: 1px solid #fff;
  border-radius: 50px;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-size: min(2.3255813953488373vw, 10px);
  line-height: 2;
  color: #fff;
  transition: .3s cubic-bezier(0.5, 1, 0.89, 1);
  cursor: pointer;
}

.anchor-btn a:hover, 
.link-btn a:hover {
  background: #fff;
  color: #20AEE5;
  transform: scale(1.1);
}

/* ===== エントリーボタン ===== */
.entry-btn {
  margin: 50px auto 60px;
}

.entry-btn a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  padding: 10px 20px;
  background: #20AEE5;
  border: 1px solid #fff;
  border-radius: 50px;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-size: min(2.3255813953488373vw, 10px);
  line-height: 2;
  color: #fff;
  transition: .3s cubic-bezier(0.5, 1, 0.89, 1);
  cursor: pointer;
}

.entry-btn a:hover {
  background: #fff;
  color: #20AEE5;
  transform: scale(1.1);
}

/* ===== ルール ===== */
.rule-section {
  width: calc(100% - 40px * 2);
  margin: 0 auto;
}

.rule-section h2 {
  font-family: "Cinema Letter";
  font-size: min(3.7209302325581395vw, 16px);
  line-height: 2;
  color: #E8BA21;
  text-align: center;
}

.rule-section h3 {
  margin: 20px auto 0;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-size: min(3.255813953488372vw, 14px);
  line-height: 2;
  color: #ffff;
  text-align: left;
}

.rule-section p {
  margin: 20px auto 0;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-size: min(2.7906976744186047vw, 12px);
  line-height: 2;
  color: #fff;
  text-align: left;
}

.rule-section a {
  text-decoration: underline;
}

.rule-section a:hover {
  text-decoration: none;
}

/* ===== ヘルプ ===== */
.help-section p {
  margin: 20px auto 0;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-size: min(2.7906976744186047vw, 12px);
  line-height: 2;
  color: #fff;
  text-align: center;
}

.help-section a {
  text-decoration: underline;
}

.help-section a:hover {
  text-decoration: none;
}

/* ===== 問い合わせ ===== */
#contact {
  text-align: center;
}

.info-section {
  margin: 60px auto 0;
}

.info-section h2 {
  font-family: "Cinema Letter";
  font-size: min(3.7209302325581395vw, 16px);
  line-height: 2;
  color: #E8BA21;
  text-align: center;
}

.info-box {
  width: calc(100% - 40px * 2);
  margin: 20px auto 0;
  padding: 20px;
  border: 1px solid #E8BA21;
  background-color: #002F51;
}

.info-box h3 {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-size: min(3.255813953488372vw, 14px);
  line-height: 2;
  color: #ffff;
  text-align: center;
}

.info-box p {
  margin: 20px auto 0;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-size: min(2.7906976744186047vw, 12px);
  line-height: 2;
  color: #fff;
  text-align: left;
}

.privacy-section {
  width: calc(100% - 40px * 2);
  margin: 50px auto 0;
}

.privacy-section p {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-size: min(2.7906976744186047vw, 12px);
  line-height: 2;
  color: #fff;
  text-align: left;
}

.privacy-section p:nth-of-type(2) {
  margin: 20px auto 0;
}

.privacy-section a {
  text-decoration: underline;
}

.privacy-section a:hover {
  text-decoration: none;
}