@charset "UTF-8";
/*  ---------- */
.mt00 {
  margin-top: 0 !important;
}
.mt10 {
  margin-top: 10px !important;
}
.mt20 {
  margin-top: 20px !important;
}
.mt30 {
  margin-top: 30px !important;
}
.mt40 {
  margin-top: 40px !important;
}
.mt50 {
  margin-top: 50px !important;
}
.mt60 {
  margin-top: 60px !important;
}

.pt10 {
  padding-top: 10px !important;
}
.pt20 {
  padding-top: 20px !important;
}
.pt30 {
  padding-top: 30px !important;
}
.pt40 {
  padding-top: 40px !important;
}
.pt50 {
  padding-top: 50px !important;
}
.pt60 {
  padding-top: 60px !important;
}

.pb10 {
  padding-bottom: 10px !important;
}
.pb20 {
  padding-bottom: 20px !important;
}
.pb30 {
  padding-bottom: 30px !important;
}

.taR {
  text-align: right;
}
.taC {
  text-align: center;
}
.taL {
  text-align: left;
}
/* articleContents ------------------------------ */
#Contents[class^="articleContents"] {
  overflow: hidden;
  margin: 0 auto;
  position: relative;
}
/* subContent ------------------------------ */
#Contents[class^="articleContents"] .subContent {
}
#Contents[class^="articleContents"] .subContent img {
  display: block;
  width: 100%;
}

/* lazyload ------------------------------ */
.lazyload,
.lazyloading {
  opacity: 0;
}
.lazyloaded {
  opacity: 1;
  transition: opacity 700ms;
  -webkit-backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
a:hover img.lazyloaded {
  transition: none;
}
@media screen and (min-width: 641px) {
  #Contents[class^="articleContents"] {
    width: 1080px;
    padding-top: 50px;
    padding-bottom: 80px;
  }
  /* mainContent ------------------------------ */
  #Contents[class^="articleContents"] .mainContent {
    float: left;
    width: 730px;
  }
  /* subContent ------------------------------ */
  #Contents[class^="articleContents"] .subContent {
    float: right;
    width: 300px;
  }
  #Contents.articleContents-top {
    padding-top: 40px;
  }
}
@media screen and (max-width: 640px) {
  /* mainContent ------------------------------ */
  #Contents[class^="articleContents"] .mainContent {
    padding: 20px 16px;
  }
}

/* footer
    ------------------------------ */
#gnFooterInner {
  width: 100%;
  padding: 10px 7px;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

#gnFooterInner #gnFooterCopyRight {
  font-size: 12px;
  -moz-box-flex: 1;
}

#gnFooterInner #gnFooterCopyRight a {
  width: 56px;
  height: 16px;
  display: inline-block;
  margin-right: 5px;
  text-indent: -9999px;
  background: url(../../../../sp/img/common/logo_implay.png) no-repeat 0 0;
  -webkit-background-size: 56px 16px;
  -moz-background-size: 56px 16px;
  background-size: 56px 16px;
  vertical-align: middle;
}

#gnFooter02 {
  border-top: solid 1px #c7c7c7;
  padding: 0;
  clear: both;
  padding-bottom: 15px;
  margin-top: 20px;
}

/*Paging*/
ul.page_nav {
  margin: 20px auto 0 auto;
  padding: 10px 10px 5px;
  background: #fff;
  text-align: center;
}

ul.page_nav li {
  display: inline;
  margin: 0 1px;
  padding: 0;
  font-size: 12px;
}

ul.page_nav li span,
ul.page_nav li a {
  display: inline-block;
  margin-bottom: 5px;
  padding: 7px 13px;
  background: #b4b4b4;
  color: #fff;
  text-decoration: none;
  vertical-align: middle;
}

ul.page_nav li a:hover {
  color: #fff;
  background: #0097e0;
  border-color: #00f;
}

ul.page_nav li span {
  background: #000;
}
