:root {
  --color-backg: #000;
  --color-backg-dark: #380000;
  --color-backg-header: #e7e5e4;
  --color-backg-footer: #191919;

  --color-light: #f3cfcf;
  --color-light-1: #ceaeae;
  --color-light-2: #b2b2b2;
  --color-dark: #131313;
  --color-footer: #cbcbcb;

  --line-1: 1px solid #565656;
  --line-2: 1px solid #712045;
}

*,
*::after,
*::before {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
  font-size: 62.5%;
  letter-spacing: .05rem;
}

body {
  font-family: Arial, Helvetica, Verdana, sans-serif;
  font-weight: 400;
  line-height: 1.6;
  color: var(--color-light);
  background-color: var(--color-backg);
  margin: 0;
  padding: 0;
  word-wrap: break-word;
}

h1, h2, h3, h4 {
  font-weight: normal;
  text-transform: uppercase;
  letter-spacing: .15rem;
}

h1 {
  font-size: 2rem;
  text-shadow:
      2px 2px 0 #000;
}

h2 {
  font-size: 1.8rem;
}

h3 {
  font-size: 1.7rem;
}

h4 {
  font-size: 1.6rem;
}

p {
  margin: 1rem 0;
}

.wrapper {
  margin: 0 auto;
  max-width: 108rem;
  background-color: var(--color-backg-dark);
}

.header {
  padding: 1rem;
  text-align: center;
}

.logo {
}

.header__logo {
  color: #ff9c9c;
  text-transform: uppercase;
  font-size: 2.4rem;
  font-weight: bold;
  letter-spacing: .15em;
  text-shadow: 0px 2px 3px #555;
}

.header__logo:link, .header__logo:visited {
  color: #ff9c9c;
  text-decoration: none;
}

.main {
  margin: 0 auto;
  max-width: 72.8rem;
  padding: 2.4rem;
  font-size: 1.6rem;
  color: var(--color-light-1);
}

.main a:link,
.main a:visited {
  color: var(--color-light);
  text-decoration: underline;
}

.prom-p,
.prom-tel,
.partner,
.prom-ph,
.prom-xch {
  font-size: 1.3rem;
  text-align: center;
  margin: 2rem auto;
}

.prom-p__ban img,
.pic img,
.prom-tel img,
.prom-xch img,
.prom-ph img,
.prom-xch img {
  display: inline-block;
  max-width: 100%;
  height: auto;
}

.pic {
  text-align: center;
}

.pic img {
  width: 100%;
  max-width: 310px;
}

.partner-list {
  list-style: none;
  margin: 0 auto;
  padding: 0;
}

.partner-list__item {
  padding: 1rem;
  overflow: hidden;
}

.partner-list__item img {
  display: inline-block;
}

.ban-vx {
  margin: 5rem auto;
  text-align: center;
  font-size: 1.3rem;
}

.ban-vx iframe {
  margin: 0 auto;
  width: 100%;
  max-width: 300px;
  border: none;
}

.ban-vx iframe img {
  width: 100%;
  height: auto;
  max-width: 300px;
}


.footer {
  background-color: var(--color-backg-footer);
  padding: 1rem;
  font-size: 1.3rem;
  color: var(--color-footer);
  border-top: var(--line-1);
}

.footer h4 {
  font-size: 1.3rem;
}

.weblist {
  border-bottom: var(--line-1);
  margin-bottom: 1rem;
}

.weblist, .fnav-list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  padding: 1rem 0;
  margin: 0;
}

.weblist__item,
.fnav-list__item {
  flex: 0 0 50%;
}

.weblist__item a,
.fnav-list__item a {
  padding: .7rem;
  display: block;
  text-decoration: none;
}

.weblist__item a:link,
.weblist__item a:visited,
.fnav-list__item a:link,
.fnav-list__item a:visited,
.sub-nav a:link,
.sub-nav a:visited {
  color: var(--color-light-2);
}

.weblist__item a:hover,
.weblist__item a:focus,
.fnav-list__item a:hover,
.fnav-list__item a:focus,
.sub-nav a:hover,
.sub-nav a:focus {
  color: var(--color-light-1);
}

.linklist {
  font-size: 1.4rem;
  margin: 2rem 0 4rem 2rem;
}

.linklist__item {
  padding: .8rem 0;
}

.linklist__item a:visited {
 color: var(--color-light-2);
}

.sub-nav {
  font-size: 1.4rem;
  text-align: center;
  margin: 1rem auto;
}

.sub-nav a {
  padding: .8rem;
}

@media (min-width:310px) {
  .partner-list {
    display: flex;
    flex-wrap: wrap;
  }

  .partner-list__item {
    flex: 0 0 50%;
  }
}

@media (min-width:580px) {

  .partner-list__item {
    flex: 0 0 33.33%;
  }

  .weblist__item,
  .fnav-list__item {
    flex: 0 0 33.33%;
  }

}

@media (min-width:785px) {

  .weblist__item,
  .fnav-list__item {
    flex: 0 0 25%;
  }

}

@media (min-width:950px) {

  .weblist__item,
  .fnav-list__item {
    flex: 0 0 20%;
  }

}