@charset "UTF-8";

html,body {padding: 0; margin: 0; line-height: 1.8;}
html {background: #000; color: #fff;}

.head-img {width: 100%; max-width: 1000px; margin: 0 auto;}
.head-img a img {width: 100%;}

.main-content {width: 100%; max-width: 1000px; margin: 0 auto; letter-spacing: -0.5px;}
.main-content>div {margin-bottom: 3.5rem; background: #151515; padding: 2rem; border-radius: 15px;}
.main-content h2 {font-size: clamp(15px, 3vw, 22px); font-weight: bold; text-decoration: underline;}
.main-content p {font-size: clamp(13px, 3vw, 16px); display: block;}
.main-content span {font-size: clamp(12px, 3vw, 15px); display: block;}

.main-content>div ul {margin: 1rem 0; padding: 0 0 0 1.5rem;}
.main-content>div ul li {margin-bottom: 1rem;}

.h3box h3 {font-size: clamp(14px, 3vw, 17px); color: #fff; margin: 0 0 0.5rem; display: inline-block; background: #ff0039; border-radius: 50rem; padding: 0 10px;}
.h3box p {background: #333; margin: 0 0 1rem 0; padding: 1rem; border-radius: 15px;}

.index-one {text-align: center; background: unset !important;}
.index-one h1 {font-size: clamp(16px, 3vw, 24px); font-weight: bold;}

.index-three span:first-child,
.index-six span:first-child {
  display: inline-block;
  background: #0c82ff;
  font-weight: bold;
  padding: 3px 10px;
  border-radius: 50rem;
  margin-bottom: 0.5rem;
}

.index-six ul ol {margin: 1rem 0 1.5rem; font-size: 14px; padding: 0 0 0 2rem;}

.index-seven strong {color: #fff; font-size: clamp(14px, 3vw, 18px);}
.index-seven p {font-size: clamp(13px, 3vw, 16px); padding: 10px 15px; background: #222; color: #fff; border-radius: 15px; line-height: 1.5; margin-top: 5px;}

@media (max-width: 767px) {
  .main-content>div {padding: 15px;}
  .main-content>div ul {list-style: none; padding: 0;}
  .index-six ul ol {margin: 1rem 0 1.5rem; font-size: 12px; padding: 0 0 0 1rem;}
}
