html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline
}

html {
  line-height: 1
}

ol,
ul {
  list-style: none
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

caption,
th,
td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle
}

q,
blockquote {
  quotes: none
}

q:before,
q:after,
blockquote:before,
blockquote:after {
  content: "";
  content: none
}

a img {
  border: none
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block
}

main {
  height: 7000px;
  padding-bottom: 30px
}

@media screen and (max-width: 767px) {
  main {
    padding-bottom: 20%;
    position: relative
  }
}

#header a {
  text-decoration: none;
  color: #000;
  -webkit-transition: all .3s;
  transition: all .3s
}

#header a:visited {
  color: #000
}

#header a:hover {
  color: #fff
}

#header .header_box .navToggle {
  display: block;
  position: fixed;
  top: 135px;
  right: 20px;
  cursor: pointer;
  z-index: 998;
  padding: 15px;
  -webkit-transition: all .4s;
  transition: all .4s;
  background: none;
  border: none
}

#header .header_box .navToggle span {
  position: absolute;
  background: #8e8f93;
  width: 100%;
  height: 2px;
  right: 0;
  margin: auto
}

#header .header_box .navToggle span:nth-child(1) {
  top: 3px
}

#header .header_box .navToggle span:nth-child(2) {
  top: 0;
  bottom: 0
}

#header .header_box .navToggle span:nth-child(3) {
  bottom: 3px
}

#header .header_box .navToggle.active {
  padding: 20px;
  top: 20px
}

#header .header_box .navToggle.active span {
  position: absolute;
  background: #fff;
  display: block;
  width: 100%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%)
}

#header .header_box .navToggle.active span:nth-child(1) {
  top: 50%;
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
  -moz-transform: translate(-50%, -50%) rotate(-45deg);
  transform: translate(-50%, -50%) rotate(-45deg)
}

#header .header_box .navToggle.active span:nth-child(2) {
  display: none
}

#header .header_box .navToggle.active span:nth-child(3) {
  top: 15%;
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
  -moz-transform: translate(-50%, -50%) rotate(45deg);
  transform: translate(-50%, -50%) rotate(45deg)
}

#header .header_box .navToggle:hover {
  opacity: 0.7
}

#header .nav_custom {
  position: fixed;
  z-index: 997;
  top: 0;
  right: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background-color: rgba(82, 83, 89, 0.95);
  visibility: hidden;
  display: flex;
  align-items: center;
  justify-content: center
}

#header .nav_custom.no-active {
  animation-duration: .3s;
  animation-name: fade-out
}

#header .nav_custom.active {
  visibility: visible;
  animation-duration: .3s;
  animation-name: fade-in
}

#header .nav_custom.active .hidden {
  visibility: visible !important
}

@keyframes fade-in {
  0% {
    visibility: hidden;
    opacity: 0
  }

  50% {
    visibility: visible;
    opacity: 0.5
  }

  100% {
    visibility: visible;
    opacity: 1
  }
}

@keyframes fade-out {
  0% {
    visibility: visible;
    opacity: 1
  }

  50% {
    visibility: visible;
    opacity: 0.5
  }

  100% {
    visibility: hidden;
    opacity: 0
  }
}

#header .nav_custom .hidden {
  visibility: hidden !important
}

#header .nav_custom .nav_custom_inner {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: 95%;
  max-width: 1000px
}

#header .nav_custom .nav_custom_inner div {
  max-width: 290px;
  margin-right: 150px
}

@media screen and (max-width: 1440px) {
  #header .nav_custom .nav_custom_inner div {
    margin-right: 15%
  }
}

#header .nav_custom .nav_custom_inner div p {
  width: 286px;
  height: 151px;
  background-image: url(../images/header_main_text.png)
}

@media screen and (max-width: 1440px) {
  #header .nav_custom .nav_custom_inner div p {
    width: 19.86vw;
    height: 10.5vw
  }
}

#header .nav_custom .nav_custom_inner div dl {
  margin-top: 35px
}

#header .nav_custom .nav_custom_inner div dl dd {
  width: 164px;
  height: 17px;
  background-image: url(../images/header_sub_text.png)
}

@media screen and (max-width: 1440px) {
  #header .nav_custom .nav_custom_inner div dl dd {
    width: 11.39vw;
    height: 1.18vw
  }
}

#header .nav_custom .nav_custom_inner div dl dt {
  width: 80%;
  margin-top: 35px
}

#header .nav_custom .nav_custom_inner div dl dt img {
  max-width: 100%
}

#header .nav_custom .nav_custom_inner nav {
  width: 100%;
  max-width: 560px;
  font-family: a-otf-ryumin-pr6n, sans-serif
}

#header .nav_custom .nav_custom_inner nav ul li {
  border-top: 1px solid #fff
}

#header .nav_custom .nav_custom_inner nav ul li:last-child {
  border-bottom: 1px solid #fff
}

#header .nav_custom .nav_custom_inner nav ul li a {
  padding: 25px 20px;
  display: block;
  font-size: 26px;
  color: #fff;
  background-color: rgba(82, 83, 89, 0);
  -webkit-transition: background-color .3s;
  transition: background-color .3s;
  letter-spacing: 0.15em;
  position: relative
}

@media screen and (max-width: 1440px) {
  #header .nav_custom .nav_custom_inner nav ul li a {
    font-size: 1.81vw
  }
}

#header .nav_custom .nav_custom_inner nav ul li a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  background-image: url(../images/icon_arrow.png);
  background-size: contain;
  width: 37px;
  height: 10px
}

#header .nav_custom .nav_custom_inner nav ul li a:hover {
  background-color: #3b3b40
}

@media screen and (max-width: 767px) {
  #header .header_box .navToggle {
    top: 10px;
    right: 3%;
    position: absolute
  }

  #header .header_box .navToggle.active {
    top: 12px
  }

  #header .nav_custom .nav_custom_inner {
    display: block;
    width: 90%;
    max-width: none
  }

  #header .nav_custom .nav_custom_inner div {
    max-width: none;
    margin-right: 0
  }

  #header .nav_custom .nav_custom_inner div p {
    display: none
  }

  #header .nav_custom .nav_custom_inner div dl {
    margin-top: 0;
    display: flex;
    align-items: center;
    justify-content: space-between
  }

  #header .nav_custom .nav_custom_inner div dl dd {
    width: 40vw;
    height: 4vw
  }

  #header .nav_custom .nav_custom_inner div dl dt {
    width: 45%;
    margin-top: 0
  }

  #header .nav_custom .nav_custom_inner nav {
    max-width: none;
    margin-top: 10%
  }

  #header .nav_custom .nav_custom_inner nav ul li a {
    padding: 7% 4%;
    font-size: 4.5vw
  }

  #header .nav_custom .nav_custom_inner nav ul li a:after {
    right: 2.5%;
    width: 9.5vw;
    height: 2.2vw
  }
}

.side {
  position: fixed;
  top: 65%;
  right: 0;
  -webkit-transform: translate(100%, -50%);
  transform: translate(100%, -50%);
  -webkit-transition: transform .5s;
  transition: transform .5s;
  z-index: 995
}

.side a {
  text-align: center;
  border: 1px solid #8c8c8c;
  border-right: none;
  background-color: #fff;
  display: block;
  padding: 28px 10px 15px 15px;
  -webkit-transition: all .3s;
  transition: all .3s
}

.side a:hover {
  opacity: 0.7
}

.side a span {
  display: block;
  margin: auto
}

.side a span.side_text1 {
  width: 18px;
  height: 152px;
  background-image: url(../images/side_text1.png);
  margin-bottom: 15px
}

.side a span.side_text2 {
  width: 92px;
  height: 10px;
  background-image: url(../images/side_text2.png);
  margin-top: 18px
}

@media screen and (max-width: 1440px) {
  .side a img {
    width: 6.12vw
  }

  .side a span.side_text1 {
    width: 20.44%;
    height: 10.56vw;
    margin-bottom: 17%
  }

  .side a span.side_text2 {
    width: 104.6%;
    height: 1.11vw;
    margin-top: 20%
  }
}

@media screen and (max-width: 767px) {
  .side {
    top: auto;
    bottom: 0;
    -webkit-transform: none;
    transform: none;
    display: none;
  }

  .side a {
    border-left: none;
    padding: 5% 8%
  }

  .side a:hover {
    opacity: 1
  }

  .side a img {
    position: absolute;
    top: 50%;
    right: 8%;
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    width: 30vw
  }

  .side a span {
    margin: 0 auto 0 0
  }

  .side a span.side_text1 {
    width: 54%;
    height: 6vw;
    background-image: url(../images/side_text1_sp.png);
    background-position: top;
    margin-bottom: 3.5%;
    padding-bottom: 3.5%;
    position: relative
  }

  .side a span.side_text1:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 26%;
    height: 1px;
    background-color: #8c8c8c
  }

  .side a span.side_text2 {
    width: 38%;
    height: 3.8vw;
    margin-top: 0
  }
}

.hidden {
  text-indent: -9999px;
  white-space: nowrap;
  overflow: hidden;
  display: block;
  visibility: visible !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain
}

article {
  font-size: 100%;
  font-family: "YuGothic", "游ゴシック", "ヒラギノ角ゴ Pro W3", "HiraKakuPro-W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;
  color: #434445;
  background-color: #f5f5f5
}

article img {
  max-width: 100%
}

article a {
  text-decoration: none;
  color: #000;
  -webkit-transition: all .3s;
  transition: all .3s
}

article a:visited {
  color: #000
}

article a:hover {
  color: #fff;
  text-decoration: none
}

article section {
  width: 100%;
  max-width: 1440px;
  margin: auto
}

article section h2 {
  font-size: 34px;
  text-align: center
}

@media screen and (max-width: 767px) {
  article section {
    max-width: none
  }

  article section h2 {
    font-size: 9vw
  }
}

article #mv {
  max-width: none;
  margin-bottom: 100px
}

article #mv .mv_canvas {
  width: 73.6%;
  padding-bottom: 60.2%;
  position: relative
}

article #mv .mv_canvas div p {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  display: none
}

article #mv .mv_canvas div p img {
  width: 100%
}

article #mv .mv_inner {
  width: 100%;
  max-width: 1440px;
  margin: auto
}

article #mv .mv_inner .mv_text {
  position: absolute;
  top: 2.78%;
  left: 70.3%
}

article #mv .mv_inner .mv_text p {
  width: 286px;
  height: 152px;
  background-image: url(../images/mv_text.png);
  display: none
}

@media screen and (max-width: 1440px) {
  article #mv .mv_inner .mv_text p {
    width: 20.21vw;
    height: 10.6vw
  }
}

article #mv .mv_inner .mv_text dl {
  margin-top: 35px
}

article #mv .mv_inner .mv_text dl dd {
  width: 200px;
  height: 20px;
  background-image: url(../images/mv_sub_text.png);
  display: none
}

article #mv .mv_inner .mv_text dl dt {
  width: 84%;
  margin: 45px 0 0 0
}

@media screen and (max-width: 1440px) {
  article #mv .mv_inner .mv_text dl dt {
    margin: 20.2% 0 0 0
  }
}

article #mv .mv_inner .mv_text dl dt a {
  -webkit-transition: all .3s;
  transition: all .3s
}

article #mv .mv_inner .mv_text dl dt a:hover {
  opacity: 0.7
}

article #mv .mv_under {
  padding-top: 80px;
  margin-left: 8.94vw;
  width: 64.5%;
  display: flex;
  justify-content: flex-end;
  position: relative
}

@media screen and (max-width: 1440px) {
  article #mv .mv_under {
    width: 68.3%;
    margin-left: calc(2.6vw + 1em + 20px)
  }
}

article #mv .mv_under .mv_cap {
  color: #626161;
  font-size: 11px;
  margin: 6px auto 0 0;
  position: absolute;
  top: 5px;
  left: -0.3vw;
  line-height: 1.6
}

@media screen and (max-width: 1440px) {
  article #mv .mv_under ul {
    display: flex;
    align-items: center
  }
}

article #mv .mv_under ul li {
  display: inline-block;
  vertical-align: middle;
  margin: 0 33.7px
}

@media screen and (max-width: 1440px) {
  article #mv .mv_under ul li {
    margin: 0 2.52vw
  }
}

article #mv .mv_under ul li:first-child {
  margin-left: 0;
  margin-right: 50px
}

@media screen and (max-width: 1440px) {
  article #mv .mv_under ul li:first-child {
    margin-right: 3.5vw
  }
}

article #mv .mv_under ul li:first-child p {
  width: 100%;
  max-width: 80px
}

article #mv .mv_under ul li:last-child {
  margin-right: 0
}

article #mv .mv_under ul li .mv_product_img {
  width: 100%;
  max-width: 165px
}

article #mv .mv_under ul li.mv_link {
  width: 276px
}

article #mv .mv_under ul li.mv_link p:nth-child(1) {
  margin-bottom: 15px
}

article #mv .mv_under ul li.mv_link p a {
  display: block;
  width: calc(100% - 76px);
  background-color: #525359;
  color: #fff;
  font-size: 13px;
  letter-spacing: 0.2em;
  padding: 23px 38px;
  text-align: center;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s
}

@media screen and (max-width: 1440px) {
  article #mv .mv_under ul li.mv_link p a {
    font-size: 0.9vw;
    padding: 8.4% 14%;
    width: 72%
  }
}

article #mv .mv_under ul li.mv_link p a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  background-image: url(../images/icon_arrow.png);
  background-size: contain;
  width: 37px;
  height: 10px
}

@media screen and (max-width: 1440px) {
  article #mv .mv_under ul li.mv_link p a:after {
    width: 2.6vw;
    height: 0.7vw
  }
}

article #mv .mv_under ul li.mv_link p a:hover {
  background-color: #3b3b40
}

article #mv .mv_under ul li .mv_product_text {
  font-size: 13px;
  text-align: center;
  letter-spacing: 0.1em;
  margin-top: 15px;
  color: #626161;
  line-height: 1.6
}

article #mv .mv_scroll {
  display: none
}

@media screen and (max-width: 767px) {
  article #mv {
    position: relative;
    margin-bottom: 15%
  }

  article #mv .mv_canvas {
    width: 100%;
    padding-bottom: 111.8%
  }

  article #mv .mv_inner .mv_text {
    position: relative;
    top: 0;
    left: 0;
    width: 80%;
    margin: auto;
    padding-top: 25%
  }

  article #mv .mv_inner .mv_text p {
    width: 67vw;
    height: 35vw
  }

  article #mv .mv_inner .mv_text dl {
    margin-top: 0
  }

  article #mv .mv_inner .mv_text dl dd {
    font-size: 4.8vw;
    font-weight: bold;
    position: absolute;
    top: 8%;
    right: -8.5%;
    width: 40vw;
    height: 4vw
  }

  article #mv .mv_inner .mv_text dl dt {
    margin: 0;
    position: absolute;
    top: -15%;
    left: -5%;
    width: 60%
  }

  article #mv .mv_under {
    width: 80%;
    margin: auto;
    display: block;
    padding-top: 0
  }

  article #mv .mv_under .mv_cap {
    font-size: 3.4vw;
    margin-top: 12.5%;
    line-height: 1.6;
    position: relative;
    left: 0 !important
  }

  article #mv .mv_under ul {
    display: block;
    margin: 45% auto 0;
    position: relative
  }

  article #mv .mv_under ul li {
    margin: 0 auto 10%;
    display: flex;
    align-items: center;
    justify-content: space-between
  }

  article #mv .mv_under ul li.mv_link {
    display: block;
    width: 100%;
    max-width: none
  }

  article #mv .mv_under ul li.mv_link p {
    width: 100%
  }

  article #mv .mv_under ul li.mv_link p a {
    width: 90%;
    font-size: 4.5vw;
    padding: 9% 5%
  }

  article #mv .mv_under ul li.mv_link p a:after {
    right: 12px;
    width: 12%;
    height: 2.6vw
  }

  article #mv .mv_under ul li.mv_link p:nth-child(1) {
    margin-bottom: 6%
  }

  article #mv .mv_under ul li p {
    width: 45%
  }

  article #mv .mv_under ul li p img {
    width: 100%
  }

  article #mv .mv_under ul li .mv_product_text {
    width: 85%;
    font-size: 3.8vw;
    line-height: 1.3;
    text-align: left;
    margin-top: 0;
    margin-left: 7%
  }

  article #mv .mv_scroll {
    display: block;
    position: absolute;
    right: 3%;
    top: 55%;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    letter-spacing: 0.2em;
    font-size: 3.8vw;
    height: 4em;
    padding: 0 0 45%
  }

  article #mv .mv_scroll:before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 1px;
    height: 70%;
    background: #d3d4d4
  }

  article #mv .mv_scroll:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 1px;
    height: 70%;
    background: #000;
    animation: sdl 1.5s cubic-bezier(1, 0, 0, 1) infinite
  }
}

article #mv_atl {
  max-width: none;
  margin-bottom: 100px
}

article #mv_atl .mv_atl_box {
  position: relative
}

article #mv_atl .mv_atl_box p img {
  width: 100%
}

article #mv_atl .mv_atl_box dl {
  position: absolute;
  bottom: -38px;
  right: 9.2%
}

@media screen and (max-width: 1440px) {
  article #mv_atl .mv_atl_box dl {
    top: 83%;
    bottom: auto
  }
}

article #mv_atl .mv_atl_box dl dt {
  width: 100%;
  max-width: 216px;
  margin-bottom: 20px
}

@media screen and (max-width: 1440px) {
  article #mv_atl .mv_atl_box dl dt {
    width: 15vw;
    margin-bottom: 9.4%
  }
}

article #mv_atl .mv_atl_box dl dt a {
  -webkit-transition: all .3s;
  transition: all .3s
}

article #mv_atl .mv_atl_box dl dt a:hover {
  opacity: 0.7
}

article #mv_atl .mv_atl_box dl dd {
  width: 200px;
  height: 20px;
  background-image: url(../images/mv_sub_text.png)
}

@media screen and (max-width: 1440px) {
  article #mv_atl .mv_atl_box dl dd {
    width: 13.9vw;
    height: 1.4vw
  }
}

article #mv_atl .mv_atl_box div {
  position: absolute;
  bottom: -84px;
  left: 9%
}

article #mv_atl .mv_atl_box div .mv_atl_title {
  width: 830px;
  height: 23px;
  background-image: url(../images/mv_atl_text.png)
}

article #mv_atl .mv_atl_box div .mv_atl_cap {
  color: #626161;
  font-size: 11px;
  margin: 12px auto 0 0;
  line-height: 1.6
}

@media screen and (max-width: 1440px) {
  article #mv_atl .mv_atl_box div {
    top: 101.9%;
    bottom: auto;
    left: 8.9vw
  }

  article #mv_atl .mv_atl_box div .mv_atl_title {
    width: 57.64vw;
    height: 1.6vw
  }

  article #mv_atl .mv_atl_box div .mv_atl_cap {
    font-size: 0.765vw;
    margin: 1.4% auto 0 0;
    width: 57.6vw
  }
}

article #mv_atl .mv_inner p {
  display: none
}

article #mv_atl .mv_under {
  padding-top: 150px
}

article #mv_atl .mv_under .mv_cap {
  display: none
}

article #mv_atl .mv_under .mv_under_title {
  width: 100%;
  max-width: 104px;
  margin: auto
}

@media screen and (max-width: 1440px) {
  article #mv_atl .mv_under .mv_under_title {
    width: 7.3vw
  }
}

article #mv_atl .mv_under ul {
  display: flex;
  align-items: center;
  margin-top: 50px;
  position: relative;
  max-width: 864px;
  width: 100%;
}

article #mv_atl .mv_under ul:first-of-type {
  justify-content: flex-start;
}

article #mv_atl .mv_under ul:last-of-type {
  margin-bottom: 64px;
  justify-content: flex-end;


}

article #mv_atl .mv_under ul li {
  margin: 0 40px;
}

article #mv_atl .mv_under ul li .mv_product_img {
  width: 100%;
  max-width: 160px;
  margin: auto
}

@media screen and (max-width: 1440px) {
  article #mv_atl .mv_under ul li .mv_product_img {
    width: 11.2vw
  }
}

article #mv_atl .mv_under ul li.mv_link {
  width: 100%;
  max-width: 276px
}

@media screen and (max-width: 1440px) {
  article #mv_atl .mv_under ul li.mv_link {
    width: 19.2vw
  }
}

article #mv_atl .mv_under ul li.mv_link p:nth-child(1) {
  margin-bottom: 15px
}

article #mv_atl .mv_under ul li.mv_link p a {
  display: block;
  width: calc(100% - 76px);
  background-color: #525359;
  color: #fff;
  font-size: 13px;
  letter-spacing: 0.2em;
  padding: 23px 38px;
  text-align: center;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s
}

@media screen and (max-width: 1440px) {
  article #mv_atl .mv_under ul li.mv_link p a {
    font-size: 0.9vw;
    padding: 8.4% 14%;
    width: 72%
  }
}

article #mv_atl .mv_under ul li.mv_link p a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  background-image: url(../images/icon_arrow.png);
  background-size: contain;
  width: 37px;
  height: 10px
}

@media screen and (max-width: 1440px) {
  article #mv_atl .mv_under ul li.mv_link p a:after {
    width: 2.6vw;
    height: 0.7vw
  }
}

article #mv_atl .mv_under ul li.mv_link p a:hover {
  background-color: #3b3b40
}

article #mv_atl .mv_under ul li .mv_product_text {
  font-size: 13px;
  text-align: center;
  letter-spacing: 0.1em;
  margin-top: 15px;
  color: #626161;
  line-height: 1.6;
  font-style: italic;
}

article #mv_atl .mv_scroll {
  display: none
}

@media screen and (max-width: 767px) {
  article #mv_atl {
    position: relative;
    margin-bottom: 15%
  }

  article #mv_atl .mv_atl_box dl {
    position: static;
    top: auto;
    bottom: auto;
    right: auto
  }

  article #mv_atl .mv_atl_box dl dt {
    position: absolute;
    bottom: -22%;
    left: 8%;
    width: 46vw;
    height: 30vw;
    margin-bottom: 0
  }

  article #mv_atl .mv_atl_box dl dd {
    position: absolute;
    bottom: -8%;
    right: 3%;
    width: 40vw;
    height: 4vw
  }

  article #mv_atl .mv_atl_box div {
    display: none
  }

  article #mv_atl .mv_inner {
    padding-top: 32%;
    width: 80%;
    margin: auto
  }

  article #mv_atl .mv_inner p {
    display: block;
    width: 67vw;
    height: 35vw;
    background-image: url(../images/mv_text.png)
  }

  article #mv_atl .mv_under {
    width: 80%;
    margin: auto;
    display: block;
    padding-top: 0
  }

  article #mv_atl .mv_under .mv_cap {
    display: block;
    font-size: 3.4vw;
    margin-top: 12.5%;
    line-height: 1.6;
    position: relative;
    left: 0 !important;
    color: #626161;
    top: 5px
  }

  article #mv_atl .mv_under .mv_under_title {
    width: 100%;
    max-width: 80px;
    margin: 45% 0 10%
  }

  article #mv_atl .mv_under ul {
    margin-top: 0
  }

  article #mv_atl .mv_under ul li {
    margin: 0 auto 10%;
    display: flex;
    align-items: center;
    justify-content: space-between
  }

  article #mv_atl .mv_under ul li.mv_link {
    display: block;
    width: 100%;
    max-width: none
  }

  article #mv_atl .mv_under ul li.mv_link p {
    width: 100%
  }

  article #mv_atl .mv_under ul li.mv_link p a {
    width: 90%;
    font-size: 4.5vw;
    padding: 9% 5%
  }

  article #mv_atl .mv_under ul li.mv_link p a:after {
    right: 12px;
    width: 12%;
    height: 2.6vw
  }

  article #mv_atl .mv_under ul li.mv_link p:nth-child(1) {
    margin-bottom: 6%
  }

  article #mv_atl .mv_under ul li .mv_product_img {
    width: 100%
  }

  article #mv_atl .mv_under ul li .mv_product_img img {
    width: 100%;
    min-width: 138px;
    max-width: 277px;
  }

  article #mv_atl .mv_under ul li .mv_product_text {
    width: 85%;
    font-size: 3.8vw;
    line-height: 1.3;
    text-align: left;
    margin-top: 0;
    margin-left: 7%
  }

  article #mv_atl .mv_scroll {
    display: block;
    position: absolute;
    right: 3%;
    top: 55%;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    letter-spacing: 0.2em;
    font-size: 3.8vw;
    height: 4em;
    padding: 0 0 45%
  }

  article #mv_atl .mv_scroll:before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 1px;
    height: 70%;
    background: #d3d4d4
  }

  article #mv_atl .mv_scroll:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 1px;
    height: 70%;
    background: #000;
    animation: sdl 1.5s cubic-bezier(1, 0, 0, 1) infinite
  }
}

article #about {
  margin-bottom: 110px
}

article #about h2 {
  width: 491px;
  height: 19px;
  margin: auto;
  background-image: url(../images/about_title.png)
}

article #about ul {
  margin: 50px auto 0;
  width: 95%;
  max-width: 874px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap
}

article #about ul li {
  width: calc(50% - 15px);
  margin: 0 15px 30px
}

article #about ul li:nth-child(2n) {
  margin-right: 0
}

article #about ul li:nth-child(2n+1) {
  margin-left: 0
}

article #about ul li:nth-child(3),
article #about ul li:nth-child(4) {
  margin-bottom: 0
}

article #about ul li img {
  display: block
}

article #about ul li .details_link {
  margin-top: 6px
}

article #about ul li .details_link a {
  color: #000;
  border: 1px solid #b6b6b6;
  text-align: center;
  font-size: 14px;
  padding: 22px;
  display: block;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s
}

article #about ul li .details_link a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  background-image: url(../images/icon_arrow.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 37px;
  height: 10px
}

@media screen and (max-width: 1440px) {
  article #about ul li .details_link a:after {
    width: 2.6vw;
    height: 0.7vw
  }
}

article #about ul li .details_link a:hover {
  background-color: #fff
}

@media screen and (max-width: 767px) {
  article #about {
    width: 80%;
    margin-bottom: 12%
  }

  article #about h2 {
    margin: 0;
    width: 54vw;
    height: 13.5vw;
    background-image: url(../images/about_title_sp.png)
  }

  article #about ul {
    margin: 8% auto 0;
    width: 100%;
    max-width: none;
    display: block
  }

  article #about ul li {
    width: 100%;
    margin: 0 0 6%
  }

  article #about ul li:nth-child(3) {
    margin-bottom: 6%
  }

  article #about ul li:nth-child(4) {
    margin-bottom: 0
  }

  article #about ul li .details_link a {
    font-size: 4.5vw;
    padding: 8% 5%
  }

  article #about ul li .details_link a:after {
    right: 12px;
    width: 12%;
    height: 2.6vw
  }
}

article #about_artist {
  max-width: none;
  margin-bottom: 150px;
  padding: 55px 0;
  background-color: #525359
}

article #about_artist h3 {
  width: 636px;
  height: 23px;
  margin: auto;
  background-image: url(../images/about_artist_title.png)
}

article #about_artist .about_artist_inner {
  width: 95%;
  max-width: 1080px;
  margin: 35px auto 40px;
  font-size: 0
}

article #about_artist .about_artist_inner li {
  width: 19.999%;
  font-size: 12px;
  vertical-align: top;
  line-height: 1.6;
  box-sizing: border-box;
  display: inline-block;
  padding: 0 8px;
  color: #fff
}

article #about_artist .about_artist_inner li .about_artist_innerImg {
  margin: 0 auto;
  width: 100%;
  font-size: 0
}

article #about_artist .about_artist_inner li .about_artist_innerTxt {
  margin: 5px auto
}

article #about_artist p {
  width: 100%;
  max-width: 420px;
  margin: 40px auto 0
}

article #about_artist p a {
  color: #fff;
  border: 1px solid #b6b6b6;
  text-align: center;
  font-size: 14px;
  padding: 22px;
  display: block;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s
}

article #about_artist p a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  background-image: url(../images/icon_arrow.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 37px;
  height: 10px
}

@media screen and (max-width: 1440px) {
  article #about_artist p a:after {
    width: 2.6vw;
    height: 0.7vw
  }
}

article #about_artist p a:hover {
  border: 1px solid #3b3b40;
  background-color: #3b3b40
}

@media screen and (max-width: 767px) {
  article #about_artist {
    margin-bottom: 15%;
    padding: 14% 0
  }

  article #about_artist h3 {
    width: 75%;
    height: 13.5vw;
    margin: 0 auto 0 10%;
    background-image: url(../images/about_artist_title_sp.png)
  }

  article #about_artist .about_artist_inner {
    width: 80%;
    margin: 20px auto 0
  }

  article #about_artist .about_artist_inner li {
    width: 50%;
    font-size: 0;
    padding: 0
  }

  article #about_artist .about_artist_inner li:last-child {
    width: 100%
  }

  article #about_artist .about_artist_inner li .about_artist_innerImg {
    width: 100%
  }

  article #about_artist .about_artist_inner li .about_artist_innerTxt {
    display: none
  }

  article #about_artist p {
    width: 80%;
    max-width: none;
    margin: 6% auto 0
  }

  article #about_artist p a {
    font-size: 4.5vw;
    padding: 8% 5%
  }

  article #about_artist p a:after {
    right: 12px;
    width: 12%;
    height: 2.6vw
  }
}

article #product ol li {
  position: relative
}

article #product ol li .product_main_img {
  position: relative
}

article #product ol li .product_main_img .ver-rl {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  position: absolute;
  bottom: 0;
  transform: rotate(180deg);
  color: #868686;
  font-size: 14px;
  letter-spacing: 0.04em
}

@media screen and (max-width: 1440px) {
  article #product ol li .product_main_img .ver-rl {
    font-size: 1vw
  }
}

article #product ol li .product_main_img .ver-rl span {
  position: relative;
  padding-bottom: 40px
}

article #product ol li .product_main_img .ver-rl span:after {
  content: "";
  position: absolute;
  bottom: 5px;
  left: 50%;
  -webkit-transform: translate(-50%, 0%);
  transform: translate(-50%, 0%);
  -ms-transform: translate(7%, 0%);
  width: 1px;
  height: 30px;
  background-color: #868686
}

article #product ol li .product_main_text {
  position: absolute
}

article #product ol li .product_main_text strong {
  margin-right: 60px
}

article #product ol li .product_main_text p {
  margin-top: 30px;
  margin-right: 60px
}

@media screen and (max-width: 1440px) {
  article #product ol li .product_main_text p {
    margin-top: 8%
  }
}

article #product ol li .product_main_text .more_link {
  margin-top: 50px;
  margin-right: 0 !important;
  text-align: right
}

@media screen and (max-width: 1440px) {
  article #product ol li .product_main_text .more_link {
    margin-top: 12.2%
  }
}

article #product ol li .product_main_text .more_link a {
  display: block;
  width: calc(105.4% - 61px);
  max-width: 236px;
  background-color: #525359;
  color: #fff;
  font-size: 14px;
  letter-spacing: 0.1em;
  padding: 20px;
  text-align: center;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s
}

@media screen and (max-width: 1440px) {
  article #product ol li .product_main_text .more_link a {
    font-size: 1vw;
    width: 16.4vw;
    padding: 4.8%
  }
}

article #product ol li .product_main_text .more_link a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  background-image: url(../images/icon_arrow.png);
  background-size: contain;
  width: 37px;
  height: 10px
}

@media screen and (max-width: 1440px) {
  article #product ol li .product_main_text .more_link a:after {
    width: 2.6vw;
    height: 0.7vw
  }
}

article #product ol li .product_main_text .more_link a:hover {
  background-color: #3b3b40
}

article #product ol li:nth-child(1) {
  width: 95%;
  max-width: 1240px;
  margin: auto
}

article #product ol li:nth-child(1) .product_main_img {
  padding-left: calc(1em + 20px)
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(1) .product_main_img {
    width: 58%
  }
}

article #product ol li:nth-child(1) .product_main_img .ver-rl {
  left: 0
}

article #product ol li:nth-child(1) .product_main_text {
  top: 40px;
  left: 780px
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(1) .product_main_text {
    top: 6.2%;
    left: 62.9%
  }
}

article #product ol li:nth-child(1) .product_main_text strong {
  width: 292px;
  height: 63px;
  background-image: url(../images/product_main_text1.png);
  margin-top: 80px
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(1) .product_main_text strong {
    width: 20.28vw;
    height: 4.38vw;
    margin-top: 19%
  }
}

article #product ol li:nth-child(1) .product_main_text .product_sub_text {
  width: 354px;
  height: 18px;
  background-image: url(../images/product_sub_text1.png)
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(1) .product_main_text .product_sub_text {
    width: 24.59vw;
    height: 1.25vw
  }
}

article #product ol li:nth-child(1) .product_sub_img {
  width: 30%;
  margin: -150px 90px 0 auto;
  z-index: 2;
  position: relative
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(1) .product_sub_img {
    margin: -12% 7.2% 0 auto
  }
}

article #product ol li:nth-child(2) {
  margin-top: 100px
}

article #product ol li:nth-child(2) .product_main_img {
  width: 24.2%;
  top: 0;
  left: 60px;
  margin-top: -182px;
  padding-left: calc(1em + 20px)
}

article #product ol li:nth-child(2) .product_main_img .ver-rl {
  left: 0
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(2) .product_main_img {
    left: 4.2%;
    margin-top: -12.65%
  }
}

article #product ol li:nth-child(2) .product_main_img p {
  position: relative
}

article #product ol li:nth-child(2) .product_main_img p img:nth-child(2) {
  position: absolute;
  top: 0;
  left: 0;
  display: none
}

article #product ol li:nth-child(2) .product_sub_img {
  width: calc(100% - 410px);
  position: relative;
  left: 410px
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(2) .product_sub_img {
    width: 71.2%;
    left: 28.8%
  }
}

article #product ol li:nth-child(2) .product_main_text {
  left: 520px;
  bottom: -40px
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(2) .product_main_text {
    left: 36.5%;
    bottom: -4.26%
  }
}

article #product ol li:nth-child(2) .product_main_text strong.ios {
  width: 413px;
  height: 62px;
  background-image: url(../images/product_main_text2_ios.png)
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(2) .product_main_text strong.ios {
    width: 28.68vw;
    height: 4.31vw
  }
}

article #product ol li:nth-child(2) .product_main_text strong.win {
  width: 379px;
  height: 60px;
  background-image: url(../images/product_main_text2_win.png)
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(2) .product_main_text strong.win {
    width: 26.32vw;
    height: 4.17vw
  }
}

article #product ol li:nth-child(2) .product_main_text .product_sub_text {
  position: absolute;
  top: -530px;
  left: -330px;
  width: 282px;
  height: 50px;
  background-image: url(../images/product_sub_text2.png)
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(2) .product_main_text .product_sub_text {
    width: 19.59vw;
    height: 3.48vw;
    top: -36.8vw;
    left: -23vw
  }
}

article #product ol li:nth-child(2) .product_img p {
  transition: 1s;
  position: absolute
}

article #product ol li:nth-child(2) .product_img p:nth-child(1) {
  left: 1180px;
  bottom: 30px
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(2) .product_img p:nth-child(1) {
    left: 81.95%;
    bottom: 3.2%;
    width: 9.1%
  }
}

article #product ol li:nth-child(2) .product_img p:nth-child(2) {
  left: 1060px;
  bottom: -20px
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(2) .product_img p:nth-child(2) {
    left: 73.6%;
    bottom: -2.1%;
    width: 5.7%
  }
}

article #product ol li:nth-child(2) .high_quality_sound_common {
  position: relative
}

article #product ol li:nth-child(2) .high_quality_sound_box {
  margin: 170px auto 0
}

article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_main_img {
  width: 60.3%
}

article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_sub_img {
  width: 19.31%;
  margin: -270px 240px 0 auto
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_sub_img {
    margin: -18.9% 16.9% 0 auto
  }
}

article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_sub_img p {
  position: relative
}

article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_sub_img p img:nth-child(2) {
  position: absolute;
  top: 0;
  left: 0;
  display: none
}

article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_main_text {
  position: relative;
  z-index: 2
}

article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_main_text strong {
  margin: -60px auto 0 160px;
  width: 419px;
  height: 60px;
  background-image: url(../images/product_main_text2-2.png)
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_main_text strong {
    margin: -4.25% auto 0 11.25%;
    width: 29.1vw;
    height: 4.2vw
  }
}

article #product ol li:nth-child(3) {
  width: 95%;
  margin: 220px auto 0
}

article #product ol li:nth-child(3) .product_main_img {
  width: 72.6%;
  margin: auto;
  padding-right: calc(1em + 20px)
}

article #product ol li:nth-child(3) .product_main_img .ver-rl {
  right: 0
}

article #product ol li:nth-child(3) .product_sub_img p {
  position: absolute
}

article #product ol li:nth-child(3) .product_sub_img p:nth-child(1) {
  bottom: 275px;
  left: 61.5%;
  -webkit-transform: translate(-50%, 0%);
  transform: translate(-50%, 0%);
  border-radius: 50%;
  width: 16.67%;
  padding-bottom: 16.67%;
  overflow: hidden
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(3) .product_sub_img p:nth-child(1) {
    bottom: 28%;
    width: 16.7%
  }
}

article #product ol li:nth-child(3) .product_sub_img p:nth-child(1) img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-width: none;
  transform: scale(1);
  transition: transform 3s
}

article #product ol li:nth-child(3) .product_sub_img p:nth-child(2) {
  bottom: 240px;
  left: 73.5%;
  -webkit-transform: translate(-50%, 0%);
  transform: translate(-50%, 0%)
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(3) .product_sub_img p:nth-child(2) {
    bottom: 23%;
    width: 8%
  }
}

article #product ol li:nth-child(3) .product_sub_img p img {
  display: block
}

article #product ol li:nth-child(3) .product_main_text {
  display: inline-block;
  position: relative;
  left: calc(50% - 160px);
  -webkit-transform: translate(-50%, 0%);
  transform: translate(-50%, 0%);
  margin-top: 50px
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(3) .product_main_text {
    left: 38.2%;
    margin-top: 3.7%
  }
}

article #product ol li:nth-child(3) .product_main_text strong {
  width: 222px;
  height: 62px;
  background-image: url(../images/product_main_text3.png)
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(3) .product_main_text strong {
    width: 15.7vw;
    height: 4.3vw
  }
}

article #product ol li:nth-child(3) .product_main_text .product_sub_text {
  position: absolute;
  top: -620px;
  left: 650px;
  width: 269px;
  height: 50px;
  background-image: url(../images/product_sub_text3.png)
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(3) .product_main_text .product_sub_text {
    width: 18.7vw;
    height: 3.47vw;
    top: -43vw;
    left: 45.2vw
  }
}

article #product ol li:nth-child(3) .product_img {
  width: calc(100% - 150px);
  position: relative;
  margin-top: 170px;
  left: 150px
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(3) .product_img {
    width: 89%;
    margin-top: 12.44%;
    left: 11%
  }
}

article #product ol li:nth-child(3) .product_img p {
  display: inline-block;
  vertical-align: bottom
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(3) .product_img p {
    width: 17.5%
  }
}

article #product ol li:nth-child(3) .product_img p:nth-child(1) {
  margin-right: 50px
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(3) .product_img p:nth-child(1) {
    margin-right: 4%
  }
}

article #product ol li:nth-child(3) .product_img p:nth-child(2) {
  position: relative
}

article #product ol li:nth-child(3) .product_img p:nth-child(2) img:nth-child(2) {
  position: absolute;
  bottom: 10px;
  left: -14px;
  max-width: none;
  display: none
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(3) .product_img p:nth-child(2) img:nth-child(2) {
    width: 127%;
    bottom: 8%
  }
}

article #product ol li:nth-child(4) {
  width: 95%;
  margin: 100px auto 0
}

article #product ol li:nth-child(4) .product_main_img {
  width: 61.4%;
  top: 0;
  left: 160px;
  margin: auto;
  padding-right: calc(1em + 20px)
}

article #product ol li:nth-child(4) .product_main_img .ver-rl {
  right: 0
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(4) .product_main_img {
    left: 11.8%
  }
}

article #product ol li:nth-child(4) .product_main_text {
  display: inline-block;
  position: relative;
  left: 320px;
  margin-top: 50px
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(4) .product_main_text {
    left: 23.4%;
    margin-top: 3.65%
  }
}

article #product ol li:nth-child(4) .product_main_text strong {
  width: 322px;
  height: 103px;
  background-image: url(../images/product_main_text4.png)
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(4) .product_main_text strong {
    width: 22.4vw;
    height: 7.15vw
  }
}

article #product ol li:nth-child(4) .product_main_text .product_sub_text {
  position: absolute;
  top: -260px;
  width: 265px;
  height: 19px;
  background-image: url(../images/product_sub_text4.png)
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(4) .product_main_text .product_sub_text {
    width: 18.41vw;
    height: 1.32vw;
    top: -18vw
  }
}

article #product ol li:nth-child(4) .product_img {
  width: calc(100% - 780px);
  position: relative;
  margin-top: 25px;
  left: 780px
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(4) .product_img {
    width: 18.9%;
    left: 57%
  }
}

article #product ol li:nth-child(4) .product_img p:nth-child(1) {
  position: absolute;
  top: -230px;
  left: 140px
}

article #product ol li:nth-child(4) .product_img p:nth-child(1).scroll_img {
  -webkit-animation: move_phone 1.2s ease .8s forwards;
  animation: move_phone 1.2s ease .8s forwards
}

article #product ol li:nth-child(4) .product_img p:nth-child(1).scroll_img_tab {
  -webkit-animation: move_phone_tab 1.2s ease .8s forwards;
  animation: move_phone_tab 1.2s ease .8s forwards
}

article #product ol li:nth-child(4) .product_img p:nth-child(1).scroll_img_sp {
  -webkit-animation: move_phone_sp 1.2s ease .8s forwards;
  animation: move_phone_sp 1.2s ease .8s forwards
}

@media screen and (max-width: 1440px) {
  article #product ol li:nth-child(4) .product_img p:nth-child(1) {
    width: 38.2%;
    top: -130%;
    left: 54.2%
  }
}

@media screen and (max-width: 767px) {
  article #product ol li {
    position: relative
  }

  article #product ol li .product_main_img {
    position: relative
  }

  article #product ol li .product_main_img .ver-rl {
    bottom: auto;
    top: 0;
    font-size: 3.4vw;
    height: 50%
  }

  article #product ol li .product_main_img .ver-rl span {
    padding-bottom: 20%
  }

  article #product ol li .product_main_img .ver-rl span:after {
    height: 50%
  }

  article #product ol li .product_main_img img {
    width: 100%
  }

  article #product ol li .product_sub_img img {
    width: 100%
  }

  article #product ol li .product_main_text strong {
    margin-right: 10%
  }

  article #product ol li .product_main_text p {
    margin-top: 8vw;
    margin-right: 10%
  }

  article #product ol li .product_main_text .more_link {
    margin-top: 10%
  }

  article #product ol li .product_main_text .more_link a {
    font-size: 4vw;
    padding: 9% 5%;
    width: 100%;
    max-width: none
  }

  article #product ol li .product_main_text .more_link a:after {
    width: 9vw;
    height: 2.2vw
  }

  article #product ol li:nth-child(1) {
    width: 100%;
    max-width: none;
    padding-bottom: 58%
  }

  article #product ol li:nth-child(1) .product_main_img {
    width: 85%;
    padding-left: 0;
    padding-right: calc(1em + 2%)
  }

  article #product ol li:nth-child(1) .product_main_img .ver-rl {
    left: auto;
    right: 0
  }

  article #product ol li:nth-child(1) .product_main_text {
    top: auto;
    bottom: 0;
    left: 5%;
    width: 80%;
    z-index: 3
  }

  article #product ol li:nth-child(1) .product_main_text strong {
    width: 70vw;
    height: 15.2vw;
    margin-left: 5%;
    margin-top: 38%
  }

  article #product ol li:nth-child(1) .product_main_text .product_sub_text {
    width: 45.2vw;
    height: 10vw;
    background-image: url(../images/product_sub_text1_sp.png)
  }

  article #product ol li:nth-child(1) .product_main_text .more_link {
    margin-left: 5%
  }

  article #product ol li:nth-child(1) .product_sub_img {
    margin: 3% 0 0 auto;
    width: 42%
  }

  article #product ol li:nth-child(2) {
    margin-top: 15%;
    padding-bottom: 25%
  }

  article #product ol li:nth-child(2) .product_main_img {
    width: 45%;
    top: 0;
    left: 0;
    margin-top: -18%;
    padding-left: 0
  }

  article #product ol li:nth-child(2) .product_main_img .ver-rl {
    left: calc(40% - 1em);
    top: -98%;
    height: 83%
  }

  article #product ol li:nth-child(2) .product_sub_img {
    width: 78%;
    left: auto;
    margin: 0 0 0 auto
  }

  article #product ol li:nth-child(2) .product_main_text {
    width: 80%;
    left: 50%;
    bottom: 0;
    -webkit-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%)
  }

  article #product ol li:nth-child(2) .product_main_text strong.ios {
    width: 58vw;
    height: 26vw;
    background-image: url(../images/product_main_text2_ios_sp.png)
  }

  article #product ol li:nth-child(2) .product_main_text strong.win {
    width: 58vw;
    height: 26vw;
    background-image: url(../images/product_main_text2_win_sp.png)
  }

  article #product ol li:nth-child(2) .product_main_text .product_sub_text {
    top: -40vw;
    left: 40vw;
    width: 39vw;
    height: 15vw;
    background-image: url(../images/product_sub_text2_sp.png)
  }

  article #product ol li:nth-child(2) .product_main_text .more_link a {
    width: 90%
  }

  article #product ol li:nth-child(2) .product_img p:nth-child(1) {
    left: 27%;
    bottom: -16%;
    width: 16%
  }

  article #product ol li:nth-child(2) .product_img p:nth-child(2) {
    left: 7%;
    bottom: -28%;
    width: 17%;
    transform: rotate(-55deg)
  }

  article #product ol li:nth-child(2) .high_quality_sound_common {
    padding-bottom: 68%
  }

  article #product ol li:nth-child(2) .high_quality_sound_box {
    margin: 80% auto -50%
  }

  article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_main_img {
    width: 78%
  }

  article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_sub_img {
    width: 35%;
    margin: -30% 0 0 auto
  }

  article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_main_text {
    width: 80%;
    margin: auto
  }

  article #product ol li:nth-child(2) .high_quality_sound_box .high_quality_sound_box_main_text strong {
    margin: -3.5% auto 0 0;
    width: 50vw;
    height: 23vw;
    background-image: url(../images/product_main_text2-2_sp.png)
  }

  article #product ol li:nth-child(3) {
    width: 100%;
    margin: 70% auto 0
  }

  article #product ol li:nth-child(3) .product_main_img {
    width: 89%;
    padding-right: calc(1em + 2%)
  }

  article #product ol li:nth-child(3) .product_main_img .ver-rl {
    right: 0;
    top: auto;
    bottom: 0;
    height: 71%
  }

  article #product ol li:nth-child(3) .product_sub_img p {
    position: absolute
  }

  article #product ol li:nth-child(3) .product_sub_img p:nth-child(1) {
    bottom: 49.5%;
    width: 31%;
    padding-bottom: 31%;
    left: 78%
  }

  article #product ol li:nth-child(3) .product_sub_img p:nth-child(2) {
    bottom: 42%;
    width: 18%;
    left: 88%
  }

  article #product ol li:nth-child(3) .product_main_text {
    display: block;
    position: relative;
    left: 10%;
    -webkit-transform: unset;
    transform: unset;
    margin: 20% 0 0;
    width: 80%
  }

  article #product ol li:nth-child(3) .product_main_text strong {
    width: 54vw;
    height: 16.4vw
  }

  article #product ol li:nth-child(3) .product_main_text .product_sub_text {
    width: 54vw;
    height: 11vw;
    top: -35vw;
    left: -5vw
  }

  article #product ol li:nth-child(3) .product_main_text .more_link a {
    width: 90%
  }

  article #product ol li:nth-child(3) .product_img {
    width: auto;
    margin-top: 25%;
    margin-right: 5%;
    left: 0;
    text-align: right
  }

  article #product ol li:nth-child(3) .product_img p {
    width: 32%
  }

  article #product ol li:nth-child(3) .product_img p:nth-child(1) {
    margin-right: 5%
  }

  article #product ol li:nth-child(4) {
    width: 100%;
    margin: 24% auto 0
  }

  article #product ol li:nth-child(4) .product_main_img {
    width: 75%;
    top: 0;
    left: 0;
    -webkit-transform: unset;
    transform: unset;
    margin: 0 0 0 auto;
    padding-left: calc(1em + 2%);
    padding-right: 0
  }

  article #product ol li:nth-child(4) .product_main_img .ver-rl {
    left: 0;
    height: 56%
  }

  article #product ol li:nth-child(4) .product_main_text {
    margin-top: 10%;
    width: 80%;
    left: 50%;
    -webkit-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%)
  }

  article #product ol li:nth-child(4) .product_main_text strong {
    width: 80vw;
    height: 25vw
  }

  article #product ol li:nth-child(4) .product_main_text .product_sub_text {
    width: 29vw;
    height: 10vw;
    top: -43vw;
    background-image: url(../images/product_sub_text4_sp.png)
  }

  article #product ol li:nth-child(4) .product_main_text .more_link a {
    width: 90%
  }

  article #product ol li:nth-child(4) .product_img {
    width: 42%;
    left: 6%;
    margin-top: 40%
  }

  article #product ol li:nth-child(4) .product_img p:nth-child(1) {
    width: 36%;
    top: -96%;
    left: 54%
  }
}

article #spec {
  margin-top: 60px;
  margin-bottom: 70px
}

article #spec h2 {
  margin-bottom: 85px
}

article #spec .spec_inner {
  width: 95%;
  max-width: 950px;
  margin: auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between
}

article #spec .spec_inner ul {
  width: 78%;
  margin-right: 20px
}

article #spec .spec_inner ul li {
  font-size: 15px;
  margin-bottom: 4px;
  line-height: 1.8
}

article #spec .spec_inner ul li p {
  display: inline-block;
  vertical-align: top
}

article #spec .spec_inner ul li p:nth-child(1) {
  width: 12em;
  margin-right: 100px
}

article #spec .spec_inner .spec_product {
  width: 29%;
  max-width: 250px
}

article #spec .spec_inner .spec_product div {
  text-align: center;
  margin-bottom: 35px
}

article #spec .spec_inner .spec_product div p img {
  display: block;
  margin: auto;
  width: 100%;
  max-width: 150px
}

article #spec .spec_inner .spec_product div .spec_product_image {
  margin-bottom: 0
}

article #spec .spec_inner .spec_product div .spec_product_image p {
  opacity: 0;
  -webkit-transition: all 0.8s;
  transition: all 0.8s
}

article #spec .spec_inner .spec_product div .spec_product_image p.spec_product_image_active {
  opacity: 1
}

article #spec .spec_inner .spec_product div .spec_product_image p:nth-child(1) {
  margin: 30px auto 20px
}

article #spec .spec_inner .spec_product div .spec_product_image p:nth-child(2) {
  transition-delay: 1s
}

article #spec .spec_inner .spec_product .btn {
  margin-bottom: 20px
}

article #spec .spec_inner .spec_product .btn a {
  display: block;
  width: calc(100% - 76px);
  background-color: #525359;
  color: #fff;
  font-size: 13px;
  letter-spacing: 0.2em;
  padding: 20px 38px;
  text-align: center;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s
}

article #spec .spec_inner .spec_product .btn a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  background-image: url(../images/icon_arrow.png);
  background-size: contain;
  width: 37px;
  height: 10px
}

article #spec .spec_inner .spec_product .btn a:hover {
  background-color: #3b3b40
}

@media screen and (max-width: 767px) {
  article #spec {
    margin-top: 20%;
    margin-bottom: 20%
  }

  article #spec h2 {
    margin-bottom: 12%
  }

  article #spec .spec_inner {
    width: 80%;
    max-width: none;
    display: block
  }

  article #spec .spec_inner ul {
    width: 100%;
    margin-right: 0
  }

  article #spec .spec_inner ul li {
    font-size: 3.6vw
  }

  article #spec .spec_inner ul li p:nth-child(1) {
    width: 43%;
    margin-right: 1%
  }

  article #spec .spec_inner ul li p:nth-child(2) {
    width: 52%
  }

  article #spec .spec_inner .spec_product {
    width: 100%;
    max-width: none;
    margin-top: 20%
  }

  article #spec .spec_inner .spec_product div {
    margin-bottom: 15%
  }

  article #spec .spec_inner .spec_product div p:nth-child(1) {
    color: #7d7c7d;
    margin-bottom: 12%;
    font-size: 4.8vw;
    letter-spacing: 0.1em
  }

  article #spec .spec_inner .spec_product div .spec_product_image p:nth-child(1) {
    margin: 0 3% 0 0;
    display: inline-block;
    vertical-align: middle;
    width: 45%
  }

  article #spec .spec_inner .spec_product div .spec_product_image p:nth-child(2) {
    margin-left: 3%;
    display: inline-block;
    vertical-align: middle;
    width: 45%
  }

  article #spec .spec_inner .spec_product .btn {
    margin: auto auto 10%
  }

  article #spec .spec_inner .spec_product .btn a {
    width: 90%;
    font-size: 4.2vw;
    padding: 9% 5%
  }

  article #spec .spec_inner .spec_product .btn a:after {
    width: 9vw;
    height: 2.2vw
  }
}

article #share {
  max-width: none;
  padding: 60px 0;
  background-color: #fff
}

article #share h2 {
  margin-bottom: 35px
}

article #share .share_icon {
  text-align: center;
  margin-bottom: 60px
}

article #share .share_icon p {
  display: inline-block;
  margin: 0 15px
}

article #share .share_icon p a {
  display: block
}

article #share .share_icon p a img {
  display: block
}

article #share .bnr_list {
  width: 95%;
  margin: 40px auto 70px;
  display: flex;
  align-items: flex-start;
  justify-content: center
}

article #share .bnr_list li {
  width: 33.333%;
  max-width: 368px;
  margin: 0 10px
}

article #share .bnr_list li:first-child {
  margin-left: 0
}

article #share .bnr_list li:last-child {
  margin-right: 0
}

article #share .bnr_list li a:hover {
  color: #434445
}

article #share .bnr_list li span {
  font-size: 15px;
  display: block;
  margin-top: 10px
}

article #share .share_inner small {
  display: block;
  text-align: center;
  font-size: 18px;
  color: #7b7b7b;
  margin-bottom: 25px;
  letter-spacing: 0.1em
}

article #share .share_inner .share_lead {
  text-align: center;
  font-size: 18px;
  color: #5f5f5f;
  line-height: 1.8;
  letter-spacing: 0.1em
}

article #share .share_inner .share_lead sup {
  font-size: 12px;
  vertical-align: middle;
  margin-top: 0.5em;
  display: inline-block
}

article #share .share_inner ul {
  width: 95%;
  margin: 40px auto 70px;
  display: flex;
  align-items: flex-start;
  justify-content: center
}

article #share .share_inner ul li {
  width: 33.333%;
  max-width: 368px;
  margin: 0 10px
}

article #share .share_inner ul li:first-child {
  margin-left: 0
}

article #share .share_inner ul li:last-child {
  margin-right: 0
}

article #share .share_inner ul li p:nth-child(1) {
  border: 1px solid #959595;
  margin-bottom: 10px
}

article #share .share_inner ul li p:nth-child(1) img {
  width: 100%;
  display: block
}

article #share .share_inner ul li p:nth-child(2) {
  line-height: 1.7;
  font-size: 15px;
  letter-spacing: 0.1em;
  padding: 0 5px
}

article #share .share_inner ul li p:nth-child(2) a {
  color: #626161;
  display: inline-block;
  letter-spacing: 0;
  margin-left: -5px;
  padding: 0 5px;
  position: relative
}

article #share .share_inner ul li p:nth-child(2) a:before {
  content: "";
  width: 100%;
  height: 1px;
  background-color: #d3d4d4;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2
}

article #share .share_inner ul li p:nth-child(2) a:after {
  content: "";
  width: 100%;
  height: 1px;
  background-color: #000;
  position: absolute;
  bottom: 0;
  left: 0
}

article #share .share_inner ul li p:nth-child(2) a:hover:before {
  -webkit-animation: 600ms hover_line 1 ease-out;
  animation: 600ms hover_line 1 ease-out
}

article #share .share_inner .share_cap {
  width: 95%;
  max-width: 1140px;
  margin: auto;
  font-size: 12px;
  color: #939393;
  line-height: 1.8
}

@media screen and (max-width: 767px) {
  article #share {
    padding: 15% 0
  }

  article #share h2 {
    margin-bottom: 10%
  }

  article #share .share_icon {
    margin-bottom: 12%
  }

  article #share .share_icon p {
    margin: 0 3%
  }

  article #share .bnr_list {
    width: 80%;
    margin: 5% auto 10%;
    display: block
  }

  article #share .bnr_list li {
    width: 100%;
    max-width: none;
    margin: 0 0 16%
  }

  article #share .bnr_list li span {
    font-size: 4.5vw;
    margin-top: 4%
  }

  article #share .share_inner small {
    font-size: 3.8vw;
    margin-bottom: 5%
  }

  article #share .share_inner .share_lead {
    font-size: 4.8vw
  }

  article #share .share_inner .share_lead sup {
    font-size: 3vw
  }

  article #share .share_inner ul {
    width: 80%;
    margin: 5% auto 10%;
    display: block
  }

  article #share .share_inner ul li {
    width: 100%;
    max-width: none;
    margin: 0 0 16%
  }

  article #share .share_inner ul li p:nth-child(1) {
    margin-bottom: 4%
  }

  article #share .share_inner ul li p:nth-child(2) {
    font-size: 15px;
    padding: 0 5px
  }

  article #share .share_inner ul li p:nth-child(2) a {
    margin-left: -2px;
    padding: 0 20vw 0 2px
  }

  article #share .share_inner .share_cap {
    width: 80%;
    max-width: none;
    font-size: 3.2vw;
    line-height: 1.6
  }
}

#wf-popup {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  background-color: #4a4b4b;
  color: #e5e4e4;
  overflow-x: hidden;
  overflow-y: scroll;
  display: none
}

#wf-popup img {
  display: block;
  pointer-events: none;
  margin: 0 0 0 auto
}

#wf-popup .btn_popup_close {
  width: 42px;
  height: 42px;
  position: fixed;
  top: 30px;
  right: 50px;
  cursor: pointer;
  z-index: 999
}

#wf-popup .btn_popup_close .bar {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto
}

#wf-popup .btn_popup_close .bar span {
  position: absolute;
  width: 100%;
  height: 1px;
  left: 0;
  background-color: #e5e4e4;
  display: inline-block;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden
}

#wf-popup .btn_popup_close .bar span.top {
  top: 0px;
  -webkit-transform: translate3d(0, 20px, 0) rotate(-45deg);
  transform: translate3d(0, 20px, 0) rotate(-45deg)
}

#wf-popup .btn_popup_close .bar span.bottom {
  bottom: 0px;
  -webkit-transform: translate3d(0, -20px, 0) rotate(45deg);
  transform: translate3d(0, -20px, 0) rotate(45deg)
}

#wf-popup .popup_inner {
  width: 100%;
  max-width: 852px;
  margin: 0 auto;
  display: none
}

#wf-popup .popup_inner.b1 .popup_title h3 span {
  width: 282px;
  height: 33px;
  background-image: url(../images/popup_title_1.png)
}

#wf-popup .popup_inner.b2 .popup_title h3 span {
  width: 310px;
  height: 33px;
  background-image: url(../images/popup_title_2.png)
}

#wf-popup .popup_inner.b3 .popup_title h3 span {
  width: 437px;
  height: 33px;
  background-image: url(../images/popup_title_3.png)
}

#wf-popup .popup_inner.b4 .popup_title h3 span {
  width: 318px;
  height: 26px;
  background-image: url(../images/popup_title_4.png)
}

#wf-popup .popup_inner .popup_title {
  margin-bottom: 70px;
  padding-top: 80px
}

#wf-popup .popup_inner .popup_title h3 {
  position: relative;
  margin-bottom: 25px;
  padding-left: 42px
}

#wf-popup .popup_inner .popup_title h3:before {
  content: "";
  position: absolute;
  top: calc(50% - 2px);
  left: 0;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  width: 28px;
  height: 28px;
  background-image: url(../images/icon_popup.png);
  background-size: contain
}

#wf-popup .popup_inner .popup_content {
  position: relative;
  font-family: a-otf-ryumin-pr6n, sans-serif;
  padding-bottom: 80px
}

#wf-popup .popup_inner .popup_content ol li {
  margin-bottom: 90px
}

#wf-popup .popup_inner .popup_content ol li:last-child {
  margin-bottom: 0
}

#wf-popup .popup_inner .popup_content ol li .popup_sub_title {
  margin-bottom: 20px
}

#wf-popup .popup_inner .popup_content ol li .popup_sub_title p {
  font-size: 13px;
  margin-bottom: 15px;
  letter-spacing: 0.08em
}

#wf-popup .popup_inner .popup_content ol li .popup_sub_title h4 {
  font-size: 22px;
  line-height: 1.5;
  border-bottom: 1px solid #fff;
  padding-bottom: 10px;
  letter-spacing: 0.07em
}

#wf-popup .popup_inner .popup_content ol li .popup_text_box {
  display: flex;
  align-items: flex-start;
  justify-content: space-between
}

#wf-popup .popup_inner .popup_content ol li .popup_text_box .popup_text {
  width: 53.9%;
  max-width: 459px;
  margin-right: 20px;
  font-size: 16px;
  letter-spacing: 0.1em;
  line-height: 1.8
}

#wf-popup .popup_inner .popup_content ol li .popup_text_box .popup_text span {
  font-size: 12px;
  display: block;
  margin-top: 20px
}

#wf-popup .popup_inner .popup_content ol li .popup_text_box .popup_text.popup_w100 {
  width: 100%;
  max-width: none
}

#wf-popup .popup_inner .popup_content ol li .popup_text_box .popup_img {
  width: 43.8%;
  max-width: 373px
}

#wf-popup .popup_inner .popup_content .popup_buy {
  padding-top: 80px;
  display: flex;
  align-items: center;
  justify-content: center
}

#wf-popup .popup_inner .popup_content .popup_buy .btn {
  width: 48%
}

#wf-popup .popup_inner .popup_content .popup_buy .btn:nth-child(1) {
  margin-right: 1%
}

#wf-popup .popup_inner .popup_content .popup_buy .btn:nth-child(2) {
  margin-left: 1%
}

#wf-popup .popup_inner .popup_content .popup_buy .btn a {
  display: block;
  width: calc(100% - 76px);
  background-color: #6f6f6f;
  color: #fff;
  font-size: 13px;
  letter-spacing: 0.2em;
  padding: 20px 38px;
  text-align: center;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s
}

#wf-popup .popup_inner .popup_content .popup_buy .btn a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  background-image: url(../images/icon_arrow.png);
  background-size: contain;
  width: 37px;
  height: 10px
}

#wf-popup .popup_inner .popup_content .popup_buy .btn a:hover {
  text-decoration: none;
  background-color: #3b3b40
}

#wf-popup .popup_inner.popup_about_inner {
  width: 95%;
  max-width: 720px;
  margin: 0 auto
}

#wf-popup .popup_inner.popup_about_inner.d1 .popup_about_head h3 {
  width: 556px;
  height: 77px;
  background-image: url(../images/popup_about_title1.png)
}

#wf-popup .popup_inner.popup_about_inner.d1 .popup_about_content .popup_about_content_title h4 {
  width: 116px;
  height: 29px;
  background-image: url(../images/popup_about_sub_title1.png)
}

#wf-popup .popup_inner.popup_about_inner.d2 .popup_about_head h3 {
  width: 556px;
  height: 77px;
  background-image: url(../images/popup_about_title2.png)
}

#wf-popup .popup_inner.popup_about_inner.d2 .popup_about_content .popup_about_content_title h4 {
  width: 500px;
  height: 34px;
  background-image: url(../images/popup_about_sub_title2.png)
}

#wf-popup .popup_inner.popup_about_inner.d3 .popup_about_head h3 {
  width: 556px;
  height: 70px;
  background-image: url(../images/popup_about_title3.png)
}

#wf-popup .popup_inner.popup_about_inner.d3 .popup_about_content .popup_about_content_title h4 {
  width: 413px;
  height: 39px;
  background-image: url(../images/popup_about_sub_title3.png)
}

#wf-popup .popup_inner.popup_about_inner.d4 .popup_about_head h3 {
  width: 556px;
  height: 70px;
  background-image: url(../images/popup_about_title4.png)
}

#wf-popup .popup_inner.popup_about_inner.d4 .popup_about_content .popup_about_content_title h4 {
  width: 112px;
  height: 29px;
  background-image: url(../images/popup_about_sub_title4.png)
}

#wf-popup .popup_inner.popup_about_inner.d5 {
  width: 100%;
  max-width: none
}

#wf-popup .popup_inner.popup_about_inner.d5 .d5_box {
  width: 95%;
  max-width: 720px;
  margin: 0 auto
}

#wf-popup .popup_inner.popup_about_inner.d5 .popup_about_head h3 {
  width: 394px;
  height: 68px;
  background-image: url(../images/popup_about_title5.png)
}

#wf-popup .popup_inner.popup_about_inner.d5 .popup_about_content .popup_about_content_title .about_artist1 {
  width: 340px;
  height: 28px;
  background-image: url(../images/popup_about_sub_title5.png)
}

#wf-popup .popup_inner.popup_about_inner.d5 .popup_about_content .popup_about_content_title .about_artist2 {
  width: 217px;
  height: 24px;
  background-image: url(../images/popup_about_sub_title6.png)
}

#wf-popup .popup_inner.popup_about_inner.d5 .popup_about_content .popup_about_content_title .about_artist3 {
  width: 131px;
  height: 28px;
  background-image: url(../images/popup_about_sub_title7.png)
}

#wf-popup .popup_inner.popup_about_inner.d5 .popup_about_content .popup_about_content_title .about_artist4 {
  width: 282px;
  height: 28px;
  background-image: url(../images/popup_about_sub_title8.png)
}

#wf-popup .popup_inner.popup_about_inner.d5 .popup_about_content .popup_about_content_title .about_artist5 {
  width: 284px;
  height: 28px;
  background-image: url(../images/popup_about_sub_title9.png)
}

#wf-popup .popup_inner.popup_about_inner .popup_about_head {
  padding-top: 100px;
  margin-bottom: 30px
}

#wf-popup .popup_inner.popup_about_inner .popup_about_img {
  margin-bottom: 50px
}

#wf-popup .popup_inner.popup_about_inner .popup_about_img img {
  width: 100%
}

#wf-popup .popup_inner.popup_about_inner .popup_about_img2 {
  margin-top: 80px
}

#wf-popup .popup_inner.popup_about_inner .popup_about_youtube .youtube_box {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%
}

#wf-popup .popup_inner.popup_about_inner .popup_about_youtube .youtube_box iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%
}

#wf-popup .popup_inner.popup_about_inner .popup_about_youtube .youtube_text a {
  margin: 5px 0 0 auto;
  width: 177px;
  height: 21px;
  background-image: url(../images/youtube_text.png);
  -webkit-transition: all .3s;
  transition: all .3s
}

#wf-popup .popup_inner.popup_about_inner .popup_about_youtube .youtube_text a:hover {
  opacity: .7
}

#wf-popup .popup_inner.popup_about_inner .popup_about_content {
  font-family: a-otf-ryumin-pr6n, sans-serif;
  position: relative
}

#wf-popup .popup_inner.popup_about_inner .popup_about_content:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 172px;
  height: 100px;
  background-image: url(../images/mv_product.png);
  background-size: contain;
  background-repeat: no-repeat
}

#wf-popup .popup_inner.popup_about_inner .popup_about_content .popup_about_content_title {
  margin: 30px auto;
  padding-bottom: 35px;
  position: relative
}

#wf-popup .popup_inner.popup_about_inner .popup_about_content .popup_about_content_title:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 78px;
  height: 2px;
  background-color: #949495
}

#wf-popup .popup_inner.popup_about_inner .popup_about_content .popup_about_content_title h4 {
  margin-bottom: 8px
}

#wf-popup .popup_inner.popup_about_inner .popup_about_content .popup_about_content_title p {
  font-size: 18px;
  letter-spacing: 0.18em
}

#wf-popup .popup_inner.popup_about_inner .popup_about_content .popup_about_content_inner {
  line-height: 2;
  letter-spacing: 0.08em
}

#wf-popup .popup_inner.popup_about_inner .popup_about_content .popup_about_content_inner a {
  text-decoration: underline
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy,
#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky {
  margin-top: 35px;
  padding-bottom: 100px
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy p,
#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p {
  margin-bottom: 15px;
  width: 100%;
  max-width: 276px
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy p:last-child,
#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p:last-child {
  margin-bottom: 0
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy p a,
#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p a {
  color: #fff;
  border: 1px solid #b0b0af;
  text-align: center;
  font-size: 13px;
  letter-spacing: 0.15em;
  padding: 22px;
  display: block;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy p a:after,
#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  background-image: url(../images/icon_arrow.png);
  background-size: contain;
  width: 37px;
  height: 10px
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy p a:hover,
#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p a:hover {
  background-color: #3b3b40;
  text-decoration: none
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy .js-popup_close a,
#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky .js-popup_close a {
  border: 1px solid #353338;
  background-color: #353338
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy .js-popup_close a:hover,
#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky .js-popup_close a:hover {
  border: 1px solid #000;
  background-color: #000
}

#wf-popup .popup_inner.popup_about_inner.d5 .popup_about_buy {
  padding-bottom: 0
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky {
  position: -webkit-sticky;
  position: sticky;
  bottom: 0;
  z-index: 10;
  display: flex;
  justify-content: center;
  background-color: rgba(53, 51, 56, 0.7);
  padding: 26px 0
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p {
  margin: 0 13px
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p:first-child {
  margin-left: 0
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p:last-child {
  margin-right: 0
}

#wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p a {
  background-color: #4a4b4b
}

@media screen and (max-width: 767px) {
  #wf-popup img {
    margin: 0 auto;
    width: 100%
  }

  #wf-popup .btn_popup_close {
    width: 35px;
    height: 35px;
    top: 2.5%;
    right: 5%
  }

  #wf-popup .btn_popup_close .bar span.top {
    -webkit-transform: translate3d(0, 17px, 0) rotate(-45deg);
    transform: translate3d(0, 17px, 0) rotate(-45deg)
  }

  #wf-popup .btn_popup_close .bar span.bottom {
    -webkit-transform: translate3d(0, -17px, 0) rotate(45deg);
    transform: translate3d(0, -17px, 0) rotate(45deg)
  }

  #wf-popup .popup_inner {
    width: 90%;
    max-width: none;
    left: auto;
    -webkit-transform: none;
    transform: none
  }

  #wf-popup .popup_inner.b1 .popup_title h3 span {
    width: 58vw;
    height: 7vw
  }

  #wf-popup .popup_inner.b2 .popup_title h3 span {
    width: 62vw;
    height: 6.6vw
  }

  #wf-popup .popup_inner.b3 .popup_title h3 span {
    width: 79vw;
    height: 6vw
  }

  #wf-popup .popup_inner.b4 .popup_title h3 span {
    width: 63vw;
    height: 6vw
  }

  #wf-popup .popup_inner .popup_title {
    margin-bottom: 20%;
    padding-top: 32%
  }

  #wf-popup .popup_inner .popup_title h3 {
    margin-bottom: 0;
    padding-left: 12%
  }

  #wf-popup .popup_inner .popup_title h3:before {
    width: 7.5vw;
    height: 7.5vw
  }

  #wf-popup .popup_inner .popup_content {
    padding-bottom: 25%
  }

  #wf-popup .popup_inner .popup_content ol li {
    margin-bottom: 25%
  }

  #wf-popup .popup_inner .popup_content ol li .popup_sub_title {
    margin-bottom: 10%
  }

  #wf-popup .popup_inner .popup_content ol li .popup_sub_title p {
    font-size: 4vw;
    margin-bottom: 6%
  }

  #wf-popup .popup_inner .popup_content ol li .popup_sub_title h4 {
    font-size: 5vw;
    line-height: 1.8;
    padding-bottom: 5%
  }

  #wf-popup .popup_inner .popup_content ol li .popup_text_box {
    display: block
  }

  #wf-popup .popup_inner .popup_content ol li .popup_text_box .popup_text {
    width: 100%;
    max-width: none;
    margin-right: 0;
    font-size: 4.6vw;
    margin-bottom: 8%
  }

  #wf-popup .popup_inner .popup_content ol li .popup_text_box .popup_text span {
    font-size: 3.4vw;
    margin-top: 4%
  }

  #wf-popup .popup_inner .popup_content ol li .popup_text_box .popup_img {
    width: 100%;
    max-width: none
  }

  #wf-popup .popup_inner .popup_content .popup_buy {
    padding-top: 25%;
    display: block
  }

  #wf-popup .popup_inner .popup_content .popup_buy .btn {
    width: 100%
  }

  #wf-popup .popup_inner .popup_content .popup_buy .btn:nth-child(1) {
    margin-right: 0;
    margin-bottom: 8%
  }

  #wf-popup .popup_inner .popup_content .popup_buy .btn:nth-child(2) {
    margin-left: 0
  }

  #wf-popup .popup_inner .popup_content .popup_buy .btn a {
    width: 90%;
    font-size: 4.2vw;
    padding: 9% 5%
  }

  #wf-popup .popup_inner .popup_content .popup_buy .btn a:after {
    width: 9vw;
    height: 2.2vw
  }

  #wf-popup .popup_inner.popup_about_inner {
    width: 100%;
    max-width: none
  }

  #wf-popup .popup_inner.popup_about_inner.d1 .popup_about_head h3 {
    width: 52vw;
    height: 19.2vw;
    background-image: url(../images/popup_about_sp_title1.png)
  }

  #wf-popup .popup_inner.popup_about_inner.d1 .popup_about_content .popup_about_content_title h4 {
    width: 22vw;
    height: 5.5vw
  }

  #wf-popup .popup_inner.popup_about_inner.d2 .popup_about_head h3 {
    width: 56vw;
    height: 19.2vw;
    background-image: url(../images/popup_about_sp_title2.png)
  }

  #wf-popup .popup_inner.popup_about_inner.d2 .popup_about_content .popup_about_content_title h4 {
    width: 85vw;
    height: 5.8vw
  }

  #wf-popup .popup_inner.popup_about_inner.d3 .popup_about_head h3 {
    width: 51.7vw;
    height: 20vw;
    background-image: url(../images/popup_about_sp_title3.png)
  }

  #wf-popup .popup_inner.popup_about_inner.d3 .popup_about_content .popup_about_content_title h4 {
    width: 70vw;
    height: 7vw
  }

  #wf-popup .popup_inner.popup_about_inner.d4 .popup_about_head h3 {
    width: 51.8vw;
    height: 19.8vw;
    background-image: url(../images/popup_about_sp_title4.png)
  }

  #wf-popup .popup_inner.popup_about_inner.d4 .popup_about_content .popup_about_content_title h4 {
    width: 19.5vw;
    height: 5vw
  }

  #wf-popup .popup_inner.popup_about_inner.d5 .d5_box {
    width: 100%;
    max-width: none
  }

  #wf-popup .popup_inner.popup_about_inner.d5 .popup_about_head h3 {
    width: 68.3vw;
    height: 18.4vw;
    background-image: url(../images/popup_about_sp_title5.png)
  }

  #wf-popup .popup_inner.popup_about_inner.d5 .popup_about_content .popup_about_content_title .about_artist1 {
    width: 59vw;
    height: 5vw
  }

  #wf-popup .popup_inner.popup_about_inner.d5 .popup_about_content .popup_about_content_title .about_artist2 {
    width: 44vw;
    height: 5.1vw
  }

  #wf-popup .popup_inner.popup_about_inner.d5 .popup_about_content .popup_about_content_title .about_artist3 {
    width: 25vw;
    height: 5.3vw
  }

  #wf-popup .popup_inner.popup_about_inner.d5 .popup_about_content .popup_about_content_title .about_artist4 {
    width: 52.2vw;
    height: 5.3vw
  }

  #wf-popup .popup_inner.popup_about_inner.d5 .popup_about_content .popup_about_content_title .about_artist5 {
    width: 54.4vw;
    height: 5.3vw
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_head {
    padding-top: 32%;
    width: 80%;
    margin: 0 auto 8%
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_img {
    margin-bottom: 0
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_img img {
    width: 90%
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_img2 {
    margin-top: 15%
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_youtube {
    width: 95%;
    margin: 0 auto
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_youtube .youtube_text a {
    width: 100%;
    height: 6.4vw;
    background-image: url(../images/youtube_text_sp.png)
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_content {
    width: 85%;
    margin: auto;
    position: relative;
    left: 2.5%
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_content:before {
    top: 4.5%;
    right: -2.5%;
    width: 30vw;
    height: 17.2vw
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_content .popup_about_content_title {
    margin: 10% auto;
    padding-bottom: 12%
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_content .popup_about_content_title:after {
    width: 12vw;
    height: 1px
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_content .popup_about_content_title p {
    font-size: 3.8vw
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_content .popup_about_content_inner {
    font-size: 3.4vw;
    letter-spacing: 0
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_buy,
  #wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky {
    margin-top: 6%;
    padding-bottom: 32%
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_buy p,
  #wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p {
    margin: 0 auto 5%;
    width: 88%;
    max-width: none
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_buy p a,
  #wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p a {
    font-size: 3.6vw;
    padding: 5%
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_buy p a:after,
  #wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p a:after {
    right: 12px;
    width: 12%;
    height: 2.6vw
  }

  #wf-popup .popup_inner.popup_about_inner.d5 .popup_about_buy {
    padding-bottom: 0
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky {
    width: 90%;
    margin: 6% auto 0;
    padding: 5%
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p {
    margin: 0 2%
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p a {
    background-color: #4a4b4b;
    padding: 10% 5%;
    font-size: 3.2vw
  }

  #wf-popup .popup_inner.popup_about_inner .popup_about_buy_sticky p a:after {
    right: 3px;
    height: 1.3vw
  }
}

#movie {
  height: auto;
  padding: 100px 0;
  color: #e5e4e4;
  background-color: #4a4b4b;
  font-family: a-otf-ryumin-pr6n, sans-serif
}

#movie section {
  width: 95%;
  max-width: 1440px;
  margin: auto
}

#movie #movie_title h1 {
  font-size: 24px;
  font-weight: bold;
  line-height: 1.6
}

#movie #movie_title p {
  font-size: 18px;
  margin-top: 5px
}

#movie #movie_content .text {
  font-size: 16px;
  line-height: 1.8;
  margin-top: 25px
}

#movie #movie_content .back {
  width: 100%;
  max-width: 276px;
  margin: 40px auto 0
}

#movie #movie_content .back a {
  text-decoration: none;
  color: #fff;
  border: 1px solid #353338;
  background-color: #353338;
  text-align: center;
  font-size: 13px;
  letter-spacing: 0.15em;
  padding: 22px;
  display: block;
  position: relative;
  -webkit-transition: all .3s;
  transition: all .3s
}

#movie #movie_content .back a:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 16px;
  -webkit-transform: translate(0%, -50%);
  transform: translate(0%, -50%);
  background-image: url(../images/icon_arrow.png);
  background-size: contain;
  width: 37px;
  height: 10px
}

#movie #movie_content .back a:hover {
  border: 1px solid #000;
  background-color: #000
}

@media screen and (max-width: 767px) {
  #movie {
    padding: 20% 0
  }

  #movie section {
    width: 80%;
    max-width: none
  }

  #movie #movie_title h1 {
    font-size: 6vw
  }

  #movie #movie_title p {
    font-size: 5vw
  }

  #movie #movie_content .text {
    font-size: 4.2vw;
    margin-top: 5%
  }

  #movie #movie_content .back {
    width: 100%;
    max-width: none;
    margin: 8% auto 0
  }

  #movie #movie_content .back a {
    font-size: 3.6vw;
    padding: 5%
  }

  #movie #movie_content .back a:after {
    right: 12px;
    width: 12%;
    height: 2.6vw
  }
}

@-webkit-keyframes hover_line {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: right;
    transform-origin: right
  }

  50% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: right;
    transform-origin: right
  }

  51% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left;
    transform-origin: left
  }

  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: left;
    transform-origin: left
  }
}

@keyframes hover_line {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: right;
    transform-origin: right
  }

  50% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: right;
    transform-origin: right
  }

  51% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left;
    transform-origin: left
  }

  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: left;
    transform-origin: left
  }
}

@keyframes sdl {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0
  }

  50% {
    transform: scale(1, 1);
    transform-origin: 0 0
  }

  50.1% {
    transform: scale(1, 1);
    transform-origin: 0 100%
  }

  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%
  }
}

@keyframes move_phone {
  0% {
    top: -230px
  }

  100% {
    top: -50px
  }
}

@keyframes move_phone_tab {
  0% {
    top: -130%
  }

  100% {
    top: -23.6%
  }
}

@keyframes move_phone_sp {
  0% {
    top: -96%
  }

  100% {
    top: -25%
  }
}

.animation {
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
  transform: translateY(100px) !important
}

.animation_active {
  opacity: 1;
  visibility: visible;
  transition: 0.5s;
  transform: translateY(0)
}

@media all and (-ms-high-contrast: none) {
  .animation {
    opacity: 0;
    -ms-transition: opacity 0.5s, transform 0.1s;
    transition: opacity 0.5s, transform 0.1s;
    transform: translateY(40px) !important
  }

  .animation_active {
    opacity: 1;
    -ms-transition: opacity 0.5s, transform 0.1s;
    transition: opacity 0.5s, transform 0.1s;
    transform: translateY(0)
  }

  .animation_active_off {
    -ms-transition: opacity 0.5s;
    transition: opacity 0.5s
  }
}

.mv_animation {
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
  transform: translateY(100px)
}

.mv_animation_active {
  opacity: 1;
  visibility: visible;
  transition: 0.5s;
  transform: translateY(0)
}

.image_change_off {
  opacity: 1;
  visibility: visible;
  transition: 0.5s
}

.image_change_off_active {
  opacity: 0;
  visibility: hidden;
  transition: 0.5s
}

.mt--0 {
  margin-top: 0px !important
}

.mt--5 {
  margin-top: 5px !important
}

.mt--10 {
  margin-top: 10px !important
}

.mt--20 {
  margin-top: 20px !important
}

.mt--30 {
  margin-top: 30px !important
}

.mt--40 {
  margin-top: 40px !important
}

.mt--50 {
  margin-top: 50px !important
}

.mt--60 {
  margin-top: 60px !important
}

.mt--70 {
  margin-top: 70px !important
}

.mt--80 {
  margin-top: 80px !important
}

.mt--90 {
  margin-top: 90px !important
}

.mt--100 {
  margin-top: 100px !important
}

.mb--0 {
  margin-bottom: 0px !important
}

.mb--5 {
  margin-bottom: 5px !important
}

.mb--10 {
  margin-bottom: 10px !important
}

.mb--20 {
  margin-bottom: 20px !important
}

.mb--30 {
  margin-bottom: 30px !important
}

.mb--40 {
  margin-bottom: 40px !important
}

.mb--50 {
  margin-bottom: 50px !important
}

.mb--60 {
  margin-bottom: 60px !important
}

.mb--70 {
  margin-bottom: 70px !important
}

.mb--80 {
  margin-bottom: 80px !important
}

.mb--90 {
  margin-bottom: 90px !important
}

.mb--100 {
  margin-bottom: 100px !important
}

.mr--0 {
  margin-right: 0px !important
}

.mr--5 {
  margin-right: 5px !important
}

.mr--10 {
  margin-right: 10px !important
}

.mr--20 {
  margin-right: 20px !important
}

.mr--30 {
  margin-right: 30px !important
}

.mr--40 {
  margin-right: 40px !important
}

.mr--50 {
  margin-right: 50px !important
}

.mr--60 {
  margin-right: 60px !important
}

.mr--70 {
  margin-right: 70px !important
}

.mr--80 {
  margin-right: 80px !important
}

.mr--90 {
  margin-right: 90px !important
}

.mr--100 {
  margin-right: 100px !important
}

.ml--0 {
  margin-left: 0px !important
}

.ml--5 {
  margin-left: 5px !important
}

.ml--10 {
  margin-left: 10px !important
}

.ml--20 {
  margin-left: 20px !important
}

.ml--30 {
  margin-left: 30px !important
}

.ml--40 {
  margin-left: 40px !important
}

.ml--50 {
  margin-left: 50px !important
}

.ml--60 {
  margin-left: 60px !important
}

.ml--70 {
  margin-left: 70px !important
}

.ml--80 {
  margin-left: 80px !important
}

.ml--90 {
  margin-left: 90px !important
}

.ml--100 {
  margin-left: 100px !important
}

.pt--0 {
  padding-top: 0px !important
}

.pt--5 {
  padding-top: 5px !important
}

.pt--10 {
  padding-top: 10px !important
}

.pt--15 {
  padding-top: 15px !important
}

.pt--20 {
  padding-top: 20px !important
}

.pt--30 {
  padding-top: 30px !important
}

.pt--40 {
  padding-top: 40px !important
}

.pt--50 {
  padding-top: 50px !important
}

.pt--60 {
  padding-top: 60px !important
}

.pt--70 {
  padding-top: 70px !important
}

.pt--80 {
  padding-top: 80px !important
}

.pt--90 {
  padding-top: 90px !important
}

.pt--100 {
  padding-top: 100px !important
}

.pb--0 {
  padding-bottom: 0px !important
}

.pb--5 {
  padding-bottom: 5px !important
}

.pb--10 {
  padding-bottom: 10px !important
}

.pb--20 {
  padding-bottom: 20px !important
}

.pb--30 {
  padding-bottom: 30px !important
}

.pb--40 {
  padding-bottom: 40px !important
}

.pb--50 {
  padding-bottom: 50px !important
}

.pb--60 {
  padding-bottom: 60px !important
}

.pb--70 {
  padding-bottom: 70px !important
}

.pb--80 {
  padding-bottom: 80px !important
}

.pb--90 {
  padding-bottom: 90px !important
}

.pb--100 {
  padding-bottom: 100px !important
}

.pr--0 {
  padding-right: 0px !important
}

.pr--5 {
  padding-right: 5px !important
}

.pr--10 {
  padding-right: 10px !important
}

.pr--20 {
  padding-right: 20px !important
}

.pr--30 {
  padding-right: 30px !important
}

.pr--40 {
  padding-right: 40px !important
}

.pr--50 {
  padding-right: 50px !important
}

.pr--60 {
  padding-right: 60px !important
}

.pr--70 {
  padding-right: 70px !important
}

.pr--80 {
  padding-right: 80px !important
}

.pr--90 {
  padding-right: 90px !important
}

.pr--100 {
  padding-right: 100px !important
}

.pl--0 {
  padding-left: 0px !important
}

.pl--5 {
  padding-left: 5px !important
}

.pl--10 {
  padding-left: 10px !important
}

.pl--20 {
  padding-left: 20px !important
}

.pl--30 {
  padding-left: 30px !important
}

.pl--40 {
  padding-left: 40px !important
}

.pl--50 {
  padding-left: 50px !important
}

.pl--60 {
  padding-left: 60px !important
}

.pl--70 {
  padding-left: 70px !important
}

.pl--80 {
  padding-left: 80px !important
}

.pl--90 {
  padding-left: 90px !important
}

.pl--100 {
  padding-left: 100px !important
}

.sp-only {
  display: none !important
}

.sp-only__inline {
  display: none !important
}

.sp-only__flex {
  display: none !important
}

@media screen and (max-width: 767px) {
  .pc-only {
    display: none !important
  }

  .sp-only {
    display: block !important
  }

  .sp-only__inline {
    display: inline-block !important
  }

  .sp-only__flex {
    display: flex !important
  }
}