@charset 'UTF-8';
/*========================================*/
/* Foundation
/*========================================*/
/*--------------------------------------
  Reset Css
---------------------------------------*/
html , body , div , span , object , iframe , h1 , h2 , h3 , h4 , h5 , h6 , p , blockquote , pre , a , address , code , em , img , small , strong , dl , dt , dd , ol , ul , li , form , label , table , tbody , tfoot , thead , tr , th , td , article , aside , canvas , embed , figure , figcaption , footer , header , nav , section , summary , time , audio , video {
  font-size : 100%;
  margin : 0;
  padding : 0;
  vertical-align : baseline; 
  border : 0;
}

ol , ul {
  list-style : none;
}

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

blockquote , q {
  quotes : none;
}

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

/*--------------------------------------
  Common-Setting
---------------------------------------*/
html {
  font-size : 10px;
}

body , input , button , select , textarea {
  font-family : 'Roboto', 'Noto Sans JP', sans-serif;
}

body {
  font-size : 1.6rem;
  line-height : 1.7;
  overflow-x : hidden;
  text-align : left;
  color : #fff;
  background : #000;

  -webkit-text-size-adjust : 100%;
}

h1 , h2 , h3 , h4 , h5 , h6 {
  line-height : 1.4;
}

img {
  max-width : 100%;
  height : auto; 
  vertical-align : top;
}

input , button , textarea , select {
  margin : 0;
  padding : 0; 

  -webkit-appearance : none;
}

strong {
  font-weight : bold;
}

em {
  font-style : italic;
}

a {
  -webkit-transition : opacity .3s;
          transition : opacity .3s; 
  text-decoration : none;
  color : #ff4292;
}

@media print, screen and (min-width: 901px) {
  a:hover {
    opacity : .6;
  }
}

* {
  box-sizing : border-box;
}

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

/*========================================*/
/* Layout
/*========================================*/
.l-inner {
  padding-right : 15px;
  padding-left : 15px;
}

@media print, screen and (min-width: 768px) {
  .l-inner {
    padding-right : 30px;
    padding-left : 30px;
  }
}

@media print, screen and (min-width: 901px) {
  .l-inner {
    max-width : 1024px;
    margin : 0 auto;
    padding-right : 22px;
    padding-left : 22px;
  }
}

/* Header
---------------------------------------*/
.header {
  width : 100%;
  height : 40px;
  padding : 10px 15px; 
  background-color : rgba(0, 0, 0, .7);
}
.header-logo-txt {
  float : left;
}
.header-logo-txt img {
  width : 101px;
  height : auto;
}
.header-logo {
  float : right;
}
.header-logo img {
  width : 40px;
  height : auto;
}
.header nav {
  display : none;
}

@media print, screen and (min-width: 901px) {
  .header {
    position : fixed;
    z-index : 9999; 
    top : 0;
    height : 70px;
    padding : 10px 0;
  }
  .campaign .header {
    position : static;
  }
  .header-inner {
    width : 1024px;
    min-width : 1024px;
    margin : 0 auto; 
    padding : 0 22px;
  }
  .header-logo-txt {
    padding-top : 5px;
  }
  .header-logo-txt img {
    width : 150px;
  }
  .header-logo {
    display : none;
  }
  .header nav {
    display : block;
  }
}

.gnav {
  float : right;
  margin-right : -15px;
}
.gnav > li {
  float : left;
}
.gnav > li a , .gnav > li span {
  font-size : 1.6rem;
  line-height : 30px;
  display : block;
  padding : 10px 15px;
  color : #fff;
}
.gnav > li a::after , .gnav > li span::after {
  position : relative;
  right : 60%; 
  left : 60%;
  width : 0;
  -webkit-transition : all .2s;
          transition : all .2s;
}
.gnav > li a.is-current::after , .gnav > li span.is-current::after {
  right : -10%;
  left : -10%;
  display : block;
  width : 120%;
  height : 2px;
  content : '';
  background-color : #ff4292;
}
.gnav > li a.is-disabled , .gnav > li span.is-disabled {
  color : #757575;
}

/* Footer
---------------------------------------*/
.footer {
  width : 100%;
  padding : 20px 0;
}
.footer-inner {
  padding : 0 15px; 

  *zoom : 1;
}
.footer-inner:before , .footer-inner:after {
  display : table;
  content : ' ';
}
.footer-inner:after {
  clear : both;
}
.footer-inner .pagetop {
  float : right;
}
.footer-logo {
  display : none;
}
.footer-sns {
  float : left;
  margin-bottom : 20px;
}
.footer-sns li {
  display : inline-block;
  margin-left : 5px;
}
.footer-sns li .fb_iframe_widget > span {
  vertical-align : baseline !important;
}
.footer-copyright {
  font-size : 1rem;
  clear : both;
  text-align : center;
}

@media print, screen and (min-width: 901px) {
  .footer {
    position : fixed;
    z-index : 9999;
    bottom : 0;
    display : none;
    height : 60px;
    padding : 15px 0; 
    background-color : #000;
  }
  .footer-inner {
    width : 1024px;
    min-width : 1024px;
    margin : 0 auto;
    padding : 0 22px;
  }
  .footer-inner .pagetop {
    display : none;
  }
  .footer-logo {
    display : block;
    float : left;
  }
  .footer-logo img {
    width : 46px;
    height : auto;
  }
  .footer-sns {
    float : none;
    margin : 0; 
    padding : 5px 0;
    text-align : center;
  }
  .footer-copyright {
    line-height : 30px;
    position : relative;
    top : -40px; 
    float : right;
  }
}

/* twitter
---------------------------------------*/
.twitter {
  position : relative; 
  width : 60px;
  height : 20px;
  text-align : center;
  vertical-align : top;
}
.twitter a {
  font-size : 1.1rem;
  line-height : 18px; 
  display : block;
  width : 60px;
  height : 20px;
  color : #fff;
  border-radius : 3px;
  background : #1b95e0;
}

.icon-twitter:after {
  font-family : 'FontAwesome';
  font-size : 1.4rem;
  display : inline-block;
  margin-right : 5px; 
  content : '\f099';
  color : #fff;
}

/* Campaign footer
---------------------------------------*/
.campaign .footer_link {
  padding : 25px 0; 
  background : #2d2d2d;
}

.campaign .footer_ban {
  overflow : hidden; 
  margin : 0 -8px;
}
.campaign .footer_ban_item {
  float : left;
  width : 33.3%;
  padding : 0 8px;
  text-align : center;
}
.campaign .footer_ban_item > a {
  display : block;
  padding : 10px 5px;
  border : 1px solid #fff;
  background : url(../images/campaign/footer_ban_icon.png) 97% 92% no-repeat;
  background-size : 6px 6px;
}
.campaign .footer_ban_item img {
  width : auto;
  max-width : 100%;
}

.campaign .footer_bar {
  overflow : hidden; 
  padding : 20px 15px;
  text-align : center;
}

.campaign .footer_sns {
  margin-bottom : 10px;
}
.campaign .footer_sns li {
  position : relative; 
  display : inline-block;
  margin-right : 10px;
}
.campaign .footer_sns li.fb {
  top : -7px;
}

.campaign .footer_copyright {
  font-size : 1rem; 
  color : #ccc;
}

@media print, screen and (min-width: 768px) {
  .campaign .footer_link {
    padding : 40px 0;
  }
  .campaign .footer_ban {
    margin : 0 -20px;
  }
  .campaign .footer_ban_item {
    padding : 0 20px;
  }
  .campaign .footer_ban_item > a {
    background : url(../images/campaign/footer_ban_icon.png) 97% 92% no-repeat;
    background-size : 12px 12px;
  }
  .campaign .footer_bar {
    padding : 40px 22px;
    text-align : left;
  }
  .campaign .footer_sns {
    float : left; 
    margin-bottom : 0;
  }
  .campaign .footer_copyright {
    float : right;
  }
}

/*========================================*/
/*  Module
/*========================================*/
/* ---- grid ---- */
.grid-row {
  *zoom : 1;
}
.grid-row:before , .grid-row:after {
  display : table;
  content : ' ';
}
.grid-row:after {
  clear : both;
}

.grid-col {
  float : left;
}
.grid-col img {
  max-width : 100%;
}

.grid-row {
  margin-right : -10px;
  margin-left : -10px;
}

.grid-col {
  padding : 0 10px;
}
.grid--s-1 .grid-col {
  width : 100%;
}
.grid--s-2 .grid-col {
  width : 50%;
}
.grid--s-3 .grid-col {
  width : 33.3%;
}
.grid--s-4 .grid-col {
  width : 25%;
}

@media screen and (max-width: 767px) {
  .grid--s-1 .grid-col:nth-child(n+2) , .grid--s-2 .grid-col:nth-child(n+3) , .grid--s-3 .grid-col:nth-child(n+4) , .grid--s-4 .grid-col:nth-child(n+5) {
    margin-top : 20px;
  }
  .grid--s-1 .grid-col , .grid--s-2 .grid-col:nth-child(odd) , .grid--s-3 .grid-col:nth-child(3n+1) , .grid--s-4 .grid-col:nth-child(4n+1) {
    clear : both;
  }
}

@media print, screen and (min-width: 768px) {
  .grid-col {
    padding : 0 15px;
  }
  .grid--m-2 .grid-col {
    width : 50%;
  }
  .grid--m-2 .grid-col:nth-child(n+3) {
    margin-top : 30px;
  }
  .grid--m-2 .grid-col:nth-child(2n+1) {
    clear : both;
  }
}

@media print, screen and (min-width: 901px) {
  .grid-col {
    padding : 0 45px;
  }
  .campaign .grid-col {
    padding : 0 20px;
  }
  .grid--l-1 .grid-col {
    width : 100%;
  }
  .grid--l-2 .grid-col {
    width : 50%;
  }
  .grid--l-3 .grid-col {
    width : 33.3%;
  }
  .grid--l-4 .grid-col {
    width : 25%;
  }
  .grid--l-5 .grid-col {
    width : 20%;
  }
  .grid--l-1 .grid-col:nth-child(n+2) , .grid--l-2 .grid-col:nth-child(n+3) , .grid--l-3 .grid-col:nth-child(n+4) , .grid--l-4 .grid-col:nth-child(n+5) {
    margin-top : 30px;
  }
  .grid--l-1 .grid-col , .grid--l-2 .grid-col:nth-child(2n+1) , .grid--l-3 .grid-col:nth-child(3n+1) , .grid--l-4 .grid-col:nth-child(4n+1) , .grid--l-5 .grid-col:nth-child(5n+1) {
    clear : both;
  }
}

/*--------------------------------------
  Utility Styles
---------------------------------------*/
.clear {
  clear : both;
}

.cf:before , .cf:after {
  display : table; 
  content : ' ';
}

.cf:after {
  clear : both;
}

.cf {
  *zoom : 1;
}

.fl-l {
  float : left;
}

.fl-r {
  float : right;
}

.ta-left {
  text-align : left;
}

.ta-center {
  text-align : center;
}

.ta-right {
  text-align : right;
}

.fs-md {
  font-size: 90%;
}

.fw-n {
  font-weight: normal;
}

.img-shadow {
  box-shadow : 0 0 18px 3px rgba(255, 255, 255, .5);
}
.img-shadow-02 {
  box-shadow : 0 0 9px 2px rgba(255, 255, 255, .4);
}

.txt-black {
  color : #221815;
}

.bg-white {
  color : #000; 
  background-color : #fff;
}

@media print, screen and (min-width: 901px) {
  .txt-shadow {
    text-shadow : 2px 2px 1px rgba(0, 0, 0, .7);
  }
  .txt--p-l {
    float : left;
    max-width : 490px;
    margin-right : 30px;
  }
  .img--p-l {
    float : left;
    margin-right : 30px !important;
  }
  .img--p-r {
    float : right;
    margin-left : 30px;
  }
}

.mb--xs {
  margin-bottom : 5px;
}

.mb--sm {
  margin-bottom : 10px;
}

.mb--md {
  margin-bottom : 20px;
}

.mb--lg {
  margin-bottom : 30px;
}

.mb--xl {
  margin-bottom : 40px;
}

@media print, screen and (min-width: 901px) {
  .mb--xs {
    margin-bottom : 10px;
  }
  .mb--sm {
    margin-bottom : 20px;
  }
  .mb--md {
    margin-bottom : 40px;
  }
  .mb--lg {
    margin-bottom : 60px;
  }
  .mb--xl {
    margin-bottom : 80px;
  }
}

.hidden {
  display : none;
}

@media screen and (max-width: 767px) {
  .hidden-sp {
    display : none !important;
  }
}

@media screen and (max-width: 900px) {
  .mb30--s {
    margin-bottom : 30px;
  }
}

@media print, screen and (min-width: 768px) {
  .hidden-tab {
    display : none !important;
  }
}

@media print, screen and (min-width: 901px) {
  .hidden-pc {
    display : none !important;
  }
}

.inner {
  width : 100%;
  min-width : 100%;
  margin : 0 auto; 
  padding : 0 15px;
}
@media print, screen and (min-width: 901px) {
  .inner {
    width : 1024px;
    min-width : 1024px;
    padding : 0 42px;
  }
  .campaign .inner {
    padding : 0 22px;
  }
}

.page-link {
  margin-top : -40px;
  padding-top : 40px;
}

.txt-linethrough {
  text-decoration : line-through;
}

.ovf-h {
  overflow: hidden;
}

/*========================================*/
/*  library
/*========================================*/
/**
 * fullPage 2.6.6
 * https://github.com/alvarotrigo/fullPage.js
 * MIT licensed
 *
 * Copyright (C) 2013 alvarotrigo.com - A project by Alvaro Trigo
 * Contribution by Jhony0311
 */
html.fp-enabled , .fp-enabled body {
  overflow : hidden;
  margin : 0;
  padding : 0;
  /*Avoid flicker on slides transitions for mobile phones #336 */

  -webkit-tap-highlight-color : transparent;
}

#superContainer {
  position : relative;
  height : 100%;
  /* Touch detection for Windows 8 */

  -ms-touch-action : none;
  /* IE 11 on Windows Phone 8.1*/
      touch-action : none;
}

.fp-section {
  position : relative;
  /* Safari<=5 Android<=3 */
  /* <=28 */
  box-sizing : border-box;
}

.fp-slide {
  float : left;
}

.fp-slide , .fp-slidesContainer {
  display : block; 
  height : 100%;
}

.fp-slides {
  position : relative;
  z-index : 1;
  overflow : hidden;
  height : 100%;
  -webkit-transition : all .3s ease-out;
  /* Safari<=6 Android<=4.3 */
          transition : all .3s ease-out;
}

.fp-section.fp-table , .fp-slide.fp-table {
  display : table;
  width : 100%; 
  table-layout : fixed;
}

.fp-tableCell {
  display : table-cell;
  width : 100%;
  height : 100%; 
  vertical-align : middle;
}

.fp-slidesContainer {
  position : relative; 
  float : left;
}

.fp-controlArrow {
  position : absolute;
  z-index : 4;
  top : 50%;
  width : 0;
  height : 0;
  margin-top : -38px;
  cursor : pointer;
  -webkit-transform : translate3d(0, 0, 0);
      -ms-transform : translate3d(0, 0, 0);
          transform : translate3d(0, 0, 0); 
  border-style : solid;
}
.fp-controlArrow.fp-prev {
  left : 15px;
  width : 0;
  border-width : 38.5px 34px 38.5px 0;
  border-color : transparent #fff transparent transparent;
}
.fp-controlArrow.fp-next {
  right : 15px;
  border-width : 38.5px 0 38.5px 34px;
  border-color : transparent transparent transparent #fff;
}

.fp-scrollable {
  overflow : scroll;
}

.fp-notransition {
  -webkit-transition : none !important;
          transition : none !important;
}

.fp-slidesNav {
  position : absolute;
  z-index : 4;
  left : 50%;
  opacity : 1;
}

#fp-nav ul , .fp-slidesNav ul {
  margin : 0;
  padding : 0;
}
#fp-nav ul li , .fp-slidesNav ul li {
  position : relative; 
  display : block;
  width : 16px;
  height : 16px;
  margin : 20px 0;
}
#fp-nav ul li a , .fp-slidesNav ul li a {
  position : relative;
  z-index : 1;
  display : block;
  width : 100%;
  height : 100%;
  cursor : pointer;
  text-decoration : none;
}
#fp-nav ul li a.active span , .fp-slidesNav ul li a.active span {
  width : 16px;
  height : 16px;
  border-radius : 100%;
  background : #ff4292;
}
#fp-nav ul li:hover #fp-nav ul li a.active span , #fp-slidesNav ul li:hover #fp-nav ul li a.active span , #fp-nav ul li:hover
        .fp-slidesNav ul li a.active span , #fp-slidesNav ul li:hover
        .fp-slidesNav ul li a.active span {
  width : 16px;
  height : 16px;
  border-radius : 100%;
}
#fp-nav ul li a span , .fp-slidesNav ul li a span {
  position : absolute;
  z-index : 1;
  width : 16px;
  height : 16px;
  -webkit-transition : all .1s ease-in-out;
          transition : all .1s ease-in-out; 
  border : 0;
  border-radius : 50%;
  background : #959595;
}
#fp-nav ul li:hover a span , .fp-slidesNav ul li:hover a span {
  width : 16px;
  height : 16px;
}

#fp-nav {
  position : fixed;
  z-index : 100;
  top : 50%;
  margin-top : -32px;
  -webkit-transform : translate3d(0, 0, 0); 
  opacity : 1;
}
#fp-nav.right {
  right : 35px;
}
#fp-nav.fp-show-active a.active + .fp-tooltip {
  width : auto;
  -webkit-transition : opacity .2s ease-in;
          transition : opacity .2s ease-in;
  opacity : 1;
}

.fp-slidesNav ul li {
  display : inline-block;
}

/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox , #cboxOverlay , #cboxWrapper {
  position : absolute;
  z-index : 9999;
  top : 0;
  left : 0;
  overflow : hidden;
}

#cboxWrapper {
  max-width : none;
}

#cboxOverlay {
  position : fixed;
  width : 100%;
  height : 100%;
}

#cboxMiddleLeft , #cboxBottomLeft {
  clear : left;
}

#cboxContent {
  position : relative;
}

#cboxLoadedContent {
  overflow : auto;

  -webkit-overflow-scrolling : touch;
}

#cboxTitle {
  margin : 0;
}

#cboxLoadingOverlay , #cboxLoadingGraphic {
  position : absolute;
  top : 0;
  left : 0;
  width : 100%;
  height : 100%;
}

#cboxPrevious , #cboxNext , #cboxClose , #cboxSlideshow {
  cursor : pointer;
}

.cboxPhoto {
  display : block;
  float : left;
  max-width : none;
  margin : auto;
  -ms-interpolation-mode : bicubic; 
  border : 0;
}

.cboxIframe {
  display : block;
  width : 100%;
  height : 100%;
  margin : 0; 
  padding : 0;
  border : 0;
}

#colorbox , #cboxContent , #cboxLoadedContent {
  -webkit-box-sizing : content-box; 
     -moz-box-sizing : content-box;
          box-sizing : content-box;
}

/*
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay {
  opacity : .9;
  background : #000;

  filter : alpha(opacity=90);
}

#colorbox {
  outline : 0;
}

.cboxIframe {
  background : #fff;
}

#cboxError {
  padding : 50px;
  border : 1px solid #ccc;
}

#cboxLoadedContent {
  margin-bottom : 28px;
}

#cboxTitle {
  position : absolute;
  bottom : 4px;
  left : 0;
  width : 100%;
  text-align : center;
  color : #949494;
}

#cboxCurrent {
  position : absolute;
  bottom : 4px;
  left : 58px;
  color : #949494;
}

#cboxLoadingOverlay {
  background : url(../images/loading_background.png) no-repeat center center;
}

#cboxLoadingGraphic {
  background : url(../images/loading.gif) no-repeat center center;
}

/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious , #cboxNext , #cboxSlideshow , #cboxClose {
  overflow : visible;
  width : auto;
  margin : 0;
  padding : 0;
  border : 0;
  background : none;
}

/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active , #cboxNext:active , #cboxSlideshow:active , #cboxClose:active {
  outline : 0;
}

#cboxClose {
  position : absolute;
  top : 0;
  right : 0;
  display : block;
  width : 36px;
  height : 36px;
  text-indent : -9999px; 
  background : url(../images/close.png) no-repeat top center;
}

#cboxClose:hover {
  opacity : .7;
}

/*========================================*/
/*  Project
/*========================================*/
/* TopPage
---------------------------------------*/
@media print, screen and (max-width: 900px) {
  #scroll {
    display : none !important;
  }
}

@media print, screen and (min-width: 901px) {
  #scroll {
    position : fixed;
    z-index : 1000;
    bottom : 30px;
    left : 50%;
    margin-left : -25px;
    cursor : pointer;
  }
}

.top {
  background : url(../images/home/sec01-bg-sp.jpg) no-repeat center top;
}
@media print, screen and (min-width: 901px) {
  .top {
    background : url(../images/home/sec01-bg-pc.jpg) no-repeat center bottom;
  }
}

.impartial-xs {
  background : url(../images/home/sec02-bg.jpg) no-repeat center bottom;
}

.impartial-xb {
  background : url(../images/home/sec03-bg.jpg) no-repeat center bottom;
}

.closeup {
  background : url(../images/home/sec04-bg.jpg) no-repeat center bottom;
}

.hightension {
  background : url(../images/home/sec05-bg.jpg) no-repeat center bottom;
}

.chart {
  background : url(../images/home/sec06-bg.jpg) no-repeat center bottom;
}

.movie {
  background : url(../images/home/sec07-bg.jpg) no-repeat center bottom;
}

.top , .impartial-xs , .impartial-xb , .closeup , .hightension , .chart , .movie {
  background-size : cover;
}

.section {
  padding : 40px 0;
}
@media print, screen and (min-width: 901px) {
  .section {
    padding : 0;
  }
}

.sec-title01 {
  font-size : 1.9rem;
  line-height : 1.2;
  margin-bottom : 30px; 
  text-align : center;
}

.sec-title02 {
  font-size : 1.7rem;
  line-height : 1.2;
  margin-bottom : 30px; 
  text-align : center;
}
.hightension .sec-title02 , .movie .sec-title02 {
  margin-bottom : 20px;
}

.sec-title03 {
  text-align : center;
}

.sec-img01 , .sec-img02 {
  margin : 0 auto 30px; 
  text-align : center;
}
.impartial-xs .sec-img01 , .impartial-xb .sec-img01 , .impartial-xs .sec-img02 , .impartial-xb .sec-img02 {
  max-width : 240px;
}

.sec-img02 {
  margin-top : 30px;
  margin-bottom : 0;
}

.sec-img-c {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.sec-txt {
  font-size : 1.5rem;
  line-height : 1.8;
}

.sec-txt02 {
  font-size : 1.3rem;
  line-height : 1.75;
}

@media print, screen and (min-width: 768px) {
  .sec-title01 {
    font-size : 3.8rem;
  }
  .sec-title02 {
    font-size : 3rem;
  }
  .sec-txt {
    font-size : 1.8rem;
  }
  .sec-txt02 {
    font-size : 1.6rem;
  }
}

@media print, screen and (min-width: 901px) {
  .sec-title01 {
    margin-bottom : 35px;
  }
  .top .sec-title01 {
    margin-bottom : 20px;
  }
  .hightension .sec-title02 {
    margin-bottom : 20px; 
    text-align : left;
  }
  .movie .sec-title02 {
    margin-bottom : 20px;
  }
  .sec-img01 , .sec-img02 {
    margin : 0 0 20px;
  }
  .impartial-xs .sec-img01 , .impartial-xb .sec-img01 , .impartial-xs .sec-img02 , .impartial-xb .sec-img02 {
    max-width : 100%;
  }
  .sec-img01 img , .sec-img02 img {
    max-width : 100%;
  }
  .sec-img02 {
    margin-top : 0;
  }
}

.top-img {
  font-size : 0;
  margin : 0 -7px; 
  text-align : center;

  *zoom : 1;
}
.top-img:before , .top-img:after {
  display : table;
  content : ' ';
}
.top-img:after {
  clear : both;
}
.top-img li {
  position : relative;
  display : inline-block;
  width : 50%;
  padding : 0 10px; 
  text-align : center;
}
.top-img li a {
  display : block;
  color : #fff;
}
.top-img li a:after {
  font-family : 'FontAwesome';
  font-size : 2rem;
  position : relative;
  top : -5px;
  display : inline-block;
  content : '\f107';
  text-align : center;
  color : #fff;
}
.top-img-cap {
  font-size : 1.2rem;
  font-weight : bold;
  margin-top : 3px;
}

.top-campaign-title {
  font-size : 1.8rem;
  line-height : 1.3;
  margin-bottom : 15px; 
  text-align : center;
}

.top-campaign .campaign-bnr-wrap {
  width : 75%;
  margin : 0 auto; 
  text-align : center;
}
.top-campaign .campaign-bnr-wrap li {
  position : relative; 
  margin-top : 15px;
}
.top-campaign .campaign-bnr-wrap li.coming-soon:before , .top-campaign .campaign-bnr-wrap li.campaign-end:before {
  position : absolute;
  z-index : 10; 
  top : 0;
  left : 0;
  display : block;
  width : 100%;
  height : 100%;
  content : '';
  background : rgba(34, 24, 21, .8);
}
.top-campaign .campaign-bnr-wrap li.coming-soon:after , .top-campaign .campaign-bnr-wrap li.campaign-end:after {
  position : absolute;
  z-index : 100; 
  top : 50%;
  display : block;
  width : 100%;
  height : auto;
  margin-top : -1.5rem;
  content : 'Coming Soon';
  letter-spacing : 1px;
}
.top-campaign .campaign-bnr-wrap li.campaign-end:after {
  content : '応募終了しました';
}
.top-campaign .campaign-bnr-wrap a.campaign-bnr {
  font-size : 1.6rem;
  line-height : 1.5;
  position : relative; 
  display : block;
  padding : 12px 0;
  color : #fff;
  border : 1px solid #fff;
  background : #080908;
  background : -webkit-linear-gradient(top, #080908 0%, #1e1f1e 51%, #333 100%);
  background :         linear-gradient(to bottom, #080908 0%, #1e1f1e 51%, #333 100%);

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#080908', endColorstr='#333333',GradientType=0 );
}
.top-campaign .campaign-bnr-wrap a.campaign-bnr .icon:after {
  position : absolute;
  right : 8px;
  bottom : 8px; 
  display : inline-block;
  width : 11px;
  height : 7px;
  content : '';
  background : url(../images/common/arr-bnr.svg) no-repeat;
  background-size : 11px 7px;
}
.top-campaign .campaign-bnr-wrap a.campaign-bnr span {
  font-size : .6%;
}
@media print, screen and (max-width: 374px) {
  .top-campaign .campaign-bnr-wrap {
    width : 85%;
  }
  .top-campaign .campaign-bnr-wrap-item a {
    font-size : 1.4rem;
  }
}

@media print, screen and (min-width: 768px) {
  .top-img li a:after {
    font-size : 5rem;
    line-height : 35px;
  }
  .top-img-cap {
    font-size : 1.8rem;
    margin-top : 8px;
  }
  .top-campaign-title {
    font-size : 2.1rem;
    font-weight : bold;
  }
  .top-campaign .campaign-bnr-wrap a.campaign-bnr {
    font-size : 1.8rem;
  }
}

@media print, screen and (min-width: 901px) {
  .top-img {
    margin : 0;
  }
  .top-img li {
    font-size : 1.8rem;
    width : 345px;
    padding : 0 40px;
  }
  .top-img li a img {
    width : 240px;
  }
  .top-img li a:after {
    -webkit-transition : all .3s ease;
            transition : all .3s ease;
  }
  .top-img li a:hover {
    opacity : .7;
  }
  .top-img li a:hover:after {
    top : 5px;
  }
  .top-campaign .campaign-bnr-wrap {
    width : 100%;
    margin : 0 -12px; 

    *zoom : 1;
  }
  .top-campaign .campaign-bnr-wrap:before , .top-campaign .campaign-bnr-wrap:after {
    display : table;
    content : ' ';
  }
  .top-campaign .campaign-bnr-wrap:after {
    clear : both;
  }
  .top-campaign .campaign-bnr-wrap li {
    float : left;
    width : 33.3333%;
    margin-top : 0; 
    padding : 0 12px;
  }
  .top-campaign .campaign-bnr-wrap li.coming-soon:before , .top-campaign .campaign-bnr-wrap li.campaign-end:before {
    left : 12px; 
    width : 300px;
    width : calc(100% - 23px);
  }
  .top-campaign .campaign-bnr-wrap li.coming-soon:after , .top-campaign .campaign-bnr-wrap li.campaign-end:after {
    width : 300px;
    width : calc(100% - 24px);
  }
  .top-campaign .campaign-bnr-wrap a.campaign-bnr:hover {
    opacity : 1;
  }
  .top-campaign .campaign-bnr-wrap a.campaign-bnr.change-border:after , .top-campaign .campaign-bnr-wrap a.campaign-bnr.change-border:before , .top-campaign .campaign-bnr-wrap a.campaign-bnr .change-border-in:after , .top-campaign .campaign-bnr-wrap a.campaign-bnr .change-border-in:before {
    position : absolute;
    z-index : 10;
    display : block;
    content : '';
    -webkit-transition : all .3s ease;
            transition : all .3s ease; 
    background-color : #ff4292;
  }
  .top-campaign .campaign-bnr-wrap a.campaign-bnr.change-border:after {
    top : -1px;
    left : -1px;
    width : 0; 
    height : 1px;
  }
  .top-campaign .campaign-bnr-wrap a.campaign-bnr.change-border:before {
    right : -1px;
    bottom : -1px;
    width : 0; 
    height : 1px;
  }
  .top-campaign .campaign-bnr-wrap a.campaign-bnr .change-border-in:after {
    bottom : -1px;
    left : -1px;
    width : 1px; 
    height : 0;
  }
  .top-campaign .campaign-bnr-wrap a.campaign-bnr .change-border-in:before {
    top : -1px;
    right : -1px;
    width : 1px; 
    height : 0;
  }
  .top-campaign .campaign-bnr-wrap a.campaign-bnr.change-border:hover:after , .top-campaign .campaign-bnr-wrap a.campaign-bnr.change-border:hover:before {
    width : 100%;
    width : calc(100% + 1px);
  }
  .top-campaign .campaign-bnr-wrap a.campaign-bnr.change-border:hover .change-border-in:after , .top-campaign .campaign-bnr-wrap a.campaign-bnr.change-border:hover .change-border-in:before {
    height : 100%;
    height : calc(100% + 1px);
  }
  .top-campaign .campaign-bnr-wrap a.campaign-bnr .icon:after {
    right : 16px;
    -webkit-transition : all .3s ease;
            transition : all .3s ease;
  }
  .top-campaign .campaign-bnr-wrap a.campaign-bnr:hover .icon:after {
    right : 8px;
  }
}

.chart-title {
  font-size : 1.3rem;
  margin-bottom : 5px; 
  text-align : center;
}

.chart-img {
  display: none;
}

.chart-txt-list {
  margin-bottom : 10px; 
  border-top : 1px solid #fff;
  border-right : 1px solid #fff;

  *zoom : 1;
}
.chart-txt-list:before , .chart-txt-list:after {
  display : table;
  content : ' ';
}
.chart-txt-list:after {
  clear : both;
}
.chart-txt-list dl {
  line-height : 1.2;
  float : left;
  width : 50%;
  padding : 12px 10px; 
  border-bottom : 1px solid #fff;
  border-left : 1px solid #fff;
}
.chart-txt-list dl dt {
  font-size : 1.4rem;
  margin-bottom : 5px;
}
.chart-txt-list dl dd {
  font-size : 1.2rem;
}

.chart-txt-cap {
  font-size : 1.2rem; 
  text-align : center;
}
.chart-txt-cap br {
  display : none;
}
@media print, screen and (max-width: 374px) {
  .chart-txt-cap br {
    display : block;
  }
}

@media print, screen and (min-width: 768px) {
  .chart-title {
    font-size : 2.1rem;
    margin-bottom : 20px;
  }
  .chart-txt-list dl dt {
    font-size : 2rem;
  }
  .chart-txt-list dl dd {
    font-size : 1.5rem;
  }
}

@media print, screen and (min-width: 901px) {
  .chart-title {
    text-align : left;
  }
  .chart-img {
    display: block;
    float : left;
    width : 430px;
    height: 430px;
    background: url(../images/home/img-chart_pc.png) no-repeat;
    background-size: 430px 430px;
    box-shadow : 0 0 18px 3px rgba(255, 255, 255, .5);
    margin : 0 65px 0 0;
    text-align : left;
    position: relative;
  }
  .chart-img-icon01,
  .chart-img-icon02 {
    width: 73px;
    position: absolute;
  }
  .chart-img-icon03,
  .chart-img-icon04,
  .chart-img-icon05,
  .chart-img-icon06 {
    width: 49px;
    position: absolute;
  }

  .chart-img-icon01 { top: 24px; right: 26px;}
  .chart-img-icon02 { top: 43px; left: 182px;}
  .chart-img-icon03 { top: 76px; left: 97px;}
  .chart-img-icon04 { bottom: 136px; right: 77px;}
  .chart-img-icon05 { bottom: 56px; left: 191px;}
  .chart-img-icon06 { bottom: 139px; left: 38px;}

  .chart-txt {
    overflow : hidden;
  }
  .chart-txt-list {
    border : none;
  }
  .chart-txt-list dl {
    float : none;
    width : 100%;
    margin-bottom : 20px; 
    padding : 0 0 20px;
    border-bottom : 1px solid #5c6061;
    border-left : none;
  }
  .chart-txt-list dl dt {
    margin-bottom : 10px;
  }
  .chart-txt-cap {
    text-align : left;
  }
  .chart-txt-cap br {
    display : block;
  }
}

.chart-link-list {
  font-size: 0;
}

.chart-link-list > li {
  position: relative;
}

.chart-link-list > li a {
  display: block;
}

.chart-link-list_icon {
  display: inline-block;
  width: 28%;
  vertical-align: middle;
}

.chart-link-list_txt {
  display: inline-block;
  width: 70%;
  font-size: 1.4rem;
  line-height: 1.4;
  color: #fff;
  padding-left: 10px;
  vertical-align: middle;
}

.movie-contents {
  margin-bottom : 15px;
}

.youtube {
  position : relative;
  width : 100%;
  padding-top : 56.25%;
}
.youtube iframe {
  position : absolute;
  top : 0;
  right : 0;
  width : 100% !important;
  height : 100% !important;
}

@media print, screen and (min-width: 901px) {
  .movie-contents {
    width : 640px;
    margin : 0 auto;
  }
}

/* TOP btn */
.top-btn {
  font-size : 1.6rem;
  line-height : 1.5;
  position : relative;
  display : block;
  width: 75%;
  padding : 12px 0;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  color : #fff;
  border : 1px solid #fff;
  background : #080908;
  background : -webkit-linear-gradient(top, #080908 0%, #1e1f1e 51%, #333 100%);
  background :         linear-gradient(to bottom, #080908 0%, #1e1f1e 51%, #333 100%);

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#080908', endColorstr='#333333',GradientType=0 );
}

.top-btn .icon:after {
  position : absolute;
  right : 8px;
  bottom : 8px;
  display : inline-block;
  width : 11px;
  height : 7px;
  content : '';
  background : url(../images/common/arr-bnr.svg) no-repeat;
  background-size : 11px 7px;
}

@media print, screen and (min-width: 901px) {
  .top-btn:hover {
    opacity: 1;
  }

  .top-btn {
    display: inline-block;
    width: auto;
    padding : 15px 30px;
    margin-left: 0;
    margin-right: 0;
  }

  .top-btn:after,
  .top-btn:before,
  .top-btn-in:after,
  .top-btn-in:before {
    position : absolute;
    z-index : 10;
    display : block;
    content : '';
    -webkit-transition : all .3s ease;
            transition : all .3s ease;
    background-color : #ff4292;
  }

  .top-btn:after {
    top : -1px;
    left : -1px;
    width : 0; 
    height : 1px;
  }

  .top-btn:before {
    right : -1px;
    bottom : -1px;
    width : 0; 
    height : 1px;
  }

  .top-btn-in:after {
    bottom : -1px;
    left : -1px;
    width : 1px; 
    height : 0;
  }

  .top-btn-in:before {
    top : -1px;
    right : -1px;
    width : 1px; 
    height : 0;
  }

  .top-btn:hover:after,
  .top-btn:hover:before {
    width : 100%;
    width : calc(100% + 1px);
  }

  .top-btn:hover .top-btn-in:after,
  .top-btn:hover .top-btn-in:before {
    height : 100%;
    height : calc(100% + 1px);
  }

  .top-btn .icon:after {
    right : 16px;
    -webkit-transition : all .3s ease;
            transition : all .3s ease;
  }

  .top-btn:hover .icon:after {
    right : 8px;
  }
}


/* CampaignPage
---------------------------------------*/
.btn-list li {
  margin-bottom : 5px;
}
@media print, screen and (min-width: 768px) {
  .btn-list li {
    margin-bottom : 10px;
  }
}

.btn-wrap {
  width : 100%;
  margin : 0 auto; 
  text-align : center;
}
.btn-wrap a.btn-in {
  font-size : 1.6rem;
  line-height : 1.5;
  position : relative; 
  display : block;
  padding : 12px 0;
  color : #fff;
  border : 1px solid #fff;
  background : #080908;
  background : -webkit-linear-gradient(top, #080908 0%, #1e1f1e 51%, #333 100%);
  background :         linear-gradient(to bottom, #080908 0%, #1e1f1e 51%, #333 100%);

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#080908', endColorstr='#333333',GradientType=0 );
}
.btn-wrap a.btn-in .icon:after {
  position : absolute;
  right : 8px;
  bottom : 8px; 
  display : inline-block;
  width : 11px;
  height : 7px;
  content : '';
  background : url(../images/common/arr-bnr.svg) no-repeat;
  background-size : 11px 7px;
}
.btn-wrap.btn02 a.btn-in {
  font-weight : bold;
  color : #ff4292;
  border : 2px solid #ff4292; 
  background : #fff;
}

@media print, screen and (min-width: 768px) {
  .btn-wrap {
    max-width : 400px;
    margin-right : auto; 
    margin-left : auto;
  }
  .btn-wrap a.btn-in {
    padding : 20px 0;
  }
  .btn-wrap.btn02 {
    max-width : 640px;
  }
  .btn-wrap.btn02 a.btn-in {
    font-size : 2.1rem;
  }
}

@media print, screen and (min-width: 901px) {
  .btn-wrap a.btn-in .icon:after {
    right : 16px;
    -webkit-transition : all .3s ease;
            transition : all .3s ease;
  }
  .btn-wrap a.btn-in:hover .icon:after {
    right : 8px;
  }
  .btn-wrap.btn02 a.btn-in {
    font-size : 2.7rem;
  }
}

.campaign .btn-tw a {
  font-size : 1.4rem;
  display : table;
  width : 100%;
  padding : 12px 6px 10px; 
  text-align : center;
  color : #fff;
  background : #1b95e0;
}
.campaign .btn-tw a .sns__txt {
  line-height : 1.2;
}
.campaign .btn-tw a .sns-icon-tw {
  position : relative;
  display : inline-block;
  padding-left : 30px;
}
.campaign .btn-tw a .sns-icon-tw:before {
  position : absolute;
  top : 50%;
  left : 0;
  display : inline-block;
  width : 26px;
  height : 20px;
  margin-top : -10px; 
  content : '';
  background : url(../images/common/icon_twitter.svg) no-repeat;
  background-size : 26px auto;
}

.campaign .btn-tw.btn-tw-b a {
  position : relative; 
  padding : 18px 6px;
  border : 1px solid #fff;
}
.campaign .btn-tw.btn-tw-b a .sns-icon-tw {
  padding-left : 35px;
}
.campaign .btn-tw.btn-tw-b a .sns-icon-tw:before {
  width : 30px;
  height : 24px;
  background : url(../images/common/icon_twitter.svg) no-repeat;
  background-size : 30px auto;
}
.campaign .btn-tw.btn-tw-b a:after {
  position : absolute;
  right : 8px; 
  bottom : 8px;
  display : inline-block;
  width : 12px;
  height : 5px;
  content : '';
  background : url(../images/common/arr-btn-white.png) no-repeat;
  background-size : 12px 5px;
}

@media print, screen and (min-width: 768px) {
  .campaign .btn-tw {
    max-width : 400px;
    margin-right : auto; 
    margin-left : auto;
  }
  .campaign .btn-tw.btn-tw-b a {
    font-size : 1.6rem;
  }
}

@media print, screen and (min-width: 901px) {
  .campaign .btn-tw a {
    padding : 14px 10px;
  }
  .campaign .btn-tw.btn-tw-b a {
    padding : 20px 6px;
  }
  .campaign .btn-tw.btn-tw-b a .sns-icon-tw {
    padding-left : 70px;
  }
  .campaign .btn-tw.btn-tw-b a .sns-icon-tw:before {
    width : 39px;
    height : 32px;
    margin-top : -16px; 
    background : url(../images/common/icon_twitter.svg) no-repeat;
    background-size : 39px auto;
  }
  .campaign .btn-tw.btn-tw-b a:after {
    right : 16px;
    -webkit-transition : all .3s ease;
            transition : all .3s ease;
  }
  .campaign .btn-tw.btn-tw-b a:hover:after {
    right : 8px;
  }
}

.campaign .sns__tw__dummy {
  font-size : 1.3rem;
  position : relative; 
  padding : 3px 6px;
  text-align : center;
  border-radius : 4px;
  background : #1b95e0;
}
.campaign .sns__tw__dummy__icon {
  position : relative;
  top : 2px;
}
.campaign .sns__tw__dummy__icon img {
  width : 18px;
}

#tweet .heading {
  padding : 30px 0 20px; 
  text-align : center;
  background : url(../images/campaign/tweet/main_bg_sp.jpg) no-repeat center top #ff4291;
  background-size : 100% auto;
}
#tweet .heading-ttl {
  font-size : 2.6rem;
  font-size : 8vw;
  font-weight : bold;
  line-height : 1;
  margin-bottom : 10px;
}
#tweet .heading-ttl span {
  font-size : 90%;
}
#tweet .heading-date {
  font-size : 1.5rem;
  font-size : 4vw;
}
#tweet .heading-count {
  display : table;
  width : 115px;
  width : 30vw;
  height : 115px;
  height : 30vw;
  margin : 185px auto 0;
  margin : 48vw auto 0; 
  border-radius : 50%;
  background : #111;
  background : -webkit-linear-gradient(top, #111 0%, #5d5d5d 91%, #5d5d5d 100%);
  background :         linear-gradient(to bottom, #111 0%, #5d5d5d 91%, #5d5d5d 100%);

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#111111', endColorstr='#5d5d5d',GradientType=0 );
}
#tweet .heading-count-in {
  font-size : 4.2vw;
  font-weight : normal;
  line-height : 1;
  display : table-cell;
  vertical-align : middle;
}
#tweet .heading-count-in span {
  font-size : 230%; 
  font-weight : bold;
}
#tweet .heading-txt {
  font-size : 1.4rem;
  font-weight : bold;
  line-height : 1.5;
  margin-top : 10px; 
  text-align : left;
}
#tweet .heading-txt br {
  display : none;
}

@media print, screen and (min-width: 768px) {
  #tweet .heading {
    padding : 80px 0 20px;
  }
  #tweet .heading-count {
    width : 200px;
    width : 26vw;
    height : 200px;
    height : 26vw;
  }
  #tweet .heading-txt {
    font-size : 2rem;
    margin-top : 20px;
  }
}

@media print, screen and (min-width: 901px) {
  #tweet .heading {
    padding : 50px 0; 
    background : url(../images/campaign/tweet/main_bg_pc.jpg) no-repeat center top;
  }
  #tweet .heading-ttl {
    font-size : 5.8rem;
  }
  #tweet .heading-date {
    font-size : 2.3rem;
  }
  #tweet .heading-count {
    width : 150px;
    height : 150px;
    margin : 15px auto 0;
  }
  #tweet .heading-count-in {
    font-size : 2.1rem;
  }
  #tweet .heading-txt {
    text-align : center;
  }
  #tweet .heading-txt br {
    display : block;
  }
}

#tweet .step {
  padding : 25px 0; 
  background : url(../images/campaign/tweet/step_bg.png) repeat-x center bottom #000;
  background-size : 85px auto;
}
#tweet .step-list > li {
  font-size : 1.5rem;
  line-height : 1.7;
  position : relative; 
  margin-bottom : 48px;
  padding : 0 15px 48px;
  background : url(../images/campaign/tweet/step_arr.png) no-repeat center bottom;
  background-size : 14px 8px;
}
#tweet .step-list > li:last-child {
  margin-bottom : 0; 
  padding-bottom : 40px;
  background : none;
}
#tweet .step-list > li:last-child:before , #tweet .step-list > li:last-child:after {
  content : none;
}
#tweet .step-list > li:before {
  position : absolute;
  bottom : 8px; 
  left : 0;
  display : inline-block;
  width : 48.1%;
  width : calc(50% - 7px);
  height : 1px;
  content : '';
  border-bottom : 1px solid #bfbfbf;
}
#tweet .step-list > li:after {
  position : absolute;
  right : 0;
  bottom : 8px; 
  display : inline-block;
  width : 48.1%;
  width : calc(50% - 7px);
  height : 1px;
  content : '';
  border-bottom : 1px solid #bfbfbf;
}
#tweet .step-item-ttl {
  font-size : 2.1rem;
  margin-bottom : 15px; 
  text-align : center;
  letter-spacing : 1px;
}
#tweet .step-item-txt {
  margin-bottom : 20px;
}
#tweet .step-item-txt span {
  display : block;
}
#tweet .step-item-media {
  text-align : center;
}
#tweet .step-item-media-img {
  margin-bottom : 20px;
}
#tweet .step-item-media-body {
  overflow : hidden;
}

@media print, screen and (min-width: 768px) {
  #tweet .step {
    padding : 55px 15px; 
    text-align : center;
  }
  #tweet .step-list > li {
    margin-bottom : 60px; 
    padding : 0 0 81px;
    background-size : 28px 16px;
  }
  #tweet .step-list > li:before {
    bottom : 16px; 
    width : 48.6%;
    width : calc(50% - 14px);
  }
  #tweet .step-list > li:after {
    bottom : 16px; 
    width : 48.6%;
    width : calc(50% - 14px);
  }
  #tweet .step-item-ttl {
    font-size : 4.2rem;
  }
  #tweet .step-item-txt {
    font-size : 1.6rem;
    margin-bottom : 35px;
  }
  #tweet .step-item-media {
    text-align : left;
  }
  #tweet .step-item-media-img {
    float : left;
    max-width : 100px;
    margin-right : 15px;
  }
}

@media print, screen and (min-width: 901px) {
  #tweet .step {
    padding : 55px 0; 
    background : url(../images/campaign/tweet/step_bg.png) repeat-x center bottom #000;
  }
  #tweet .step-list {
    width : 1024px;
    min-width : 1024px;
    margin : 0 auto; 
    padding : 0 22px;
  }
  #tweet .step-list > li {
    padding : 0 80px 81px;
  }
}

#trial .heading {
  padding : 25px 0; 
  text-align : center;
  background : url(../images/campaign/trial/main_bg_sp.jpg) no-repeat center bottom #000;
  background-size : 100% auto;
}
#trial .heading-ttl {
  font-size : 2.6rem;
  font-size : 8vw;
  font-weight : bold;
  line-height : 1;
  margin-bottom : 10px;
}
#trial .heading-date {
  font-size : 1.5rem;
  font-size : 4vw;
  line-height : 1.4;
}
#trial .heading-count {
  font-size : 0;
  margin-top : 20px;
}
#trial .heading-count li {
  display : inline-block;
  width : 50%;
  padding : 0 8px;
}
#trial .heading-txt {
  font-size : 1.4rem;
  font-weight : bold;
  line-height : 1.5;
  margin-top : 20px;
}

@media print, screen and (min-width: 768px) {
  #trial .heading {
    padding : 60px 0;
  }
  #trial .heading-count li {
    width : 270px;
    padding : 0 15px;
  }
  #trial .heading-txt {
    font-size : 2rem;
    margin-top : 20px;
  }
}

@media print, screen and (min-width: 901px) {
  #trial .heading {
    padding : 40px 0; 
    background : url(../images/campaign/trial/main_bg_pc.jpg) no-repeat center bottom;
  }
  #trial .heading-ttl {
    font-size : 5.4rem;
  }
  #trial .heading-date {
    font-size : 2.3rem;
  }
  #trial .heading-count {
    margin-top : 30px;
  }
  #trial .heading-txt {
    margin-top : 30px;
  }
}

#trial .step {
  padding : 25px 0 30px; 
  text-align : center;
  background : url(../images/campaign/trial/step_bg.jpg) repeat-x center bottom #ff4391;
  background-size : 78px auto;
}
#trial .step-flow-item {
  position : relative;
  margin-bottom : 10px;
}
#trial .step-flow-item:after {
  display : inline-block;
  width : 20px;
  height : 10px;
  content : '';
  border-top : 10px solid #fff;
  border-right : 10px solid transparent;
  border-left : 10px solid transparent;
}
#trial .step-flow-item:last-child {
  margin-bottom : 40px;
}
#trial .step-flow-item:last-child:after {
  content : none;
}
#trial .step-flow-item-ttl {
  font-size : 2.1rem;
  font-weight : bold;
  margin-bottom : 10px; 
  letter-spacing : 1.5px;
}
#trial .step-flow-item-img {
  margin-bottom : 15px;
}
#trial .step-flow-item-txt {
  font-size : 1.4rem;
  line-height : 1.6;
  margin-bottom : 10px;
}

@media print, screen and (min-width: 768px) {
  #trial .step {
    padding : 45px 0 60px; 
    text-align : left;
    background-size : 79px auto;
  }
  #trial .step-flow {
    margin : 0 -10px 40px;
  }
  #trial .step-flow-item {
    float : left;
    width : 25%;
    padding : 0 10px;
  }
  #trial .step-flow-item:after {
    position : absolute;
    top : 70px;
    right : -4px; 
    width : 8px;
    height : 16px;
    border-top : 8px solid transparent;
    border-right : none;
    border-bottom : 8px solid transparent;
    border-left : 8px solid #fff;
  }
  #trial .step-flow-item:last-child {
    margin-bottom : 0;
  }
  #trial .step-flow-item-ttl {
    font-size : 1.4rem;
    margin-bottom : 3px;
  }
  #trial .step-flow-item-ttl span {
    font-size : 140%;
  }
  #trial .step-flow-item-txt {
    margin-bottom : 0;
  }
}

@media print, screen and (min-width: 901px) {
  #trial .step {
    padding : 60px 0 80px;
  }
  #trial .step-flow {
    margin : 0 -12px 65px;
  }
  #trial .step-flow-item {
    padding : 0 12px;
  }
  #trial .step-flow-item:after {
    top : 82px;
    right : -5px; 
    width : 10px;
    height : 20px;
    border-top : 10px solid transparent;
    border-right : none;
    border-bottom : 10px solid transparent;
    border-left : 10px solid #fff;
  }
}

#buy .heading {
  padding : 15px 0; 
  text-align : center;
  background : url(../images/campaign/buy/main_bg_sp.jpg) no-repeat center bottom #000;
  background-size : 100% auto;
}
#buy .heading-ttl {
  font-size : 2.6rem;
  font-size : 8vw;
  font-weight : bold;
  line-height : 1;
  margin-bottom : 10px;
}
#buy .heading-ttl span {
  font-size : 90%;
}
#buy .heading-date {
  font-size : 1.5rem;
  font-size : 4vw;
}
#buy .heading-count {
  display : table;
  width : 62px;
  width : 20vw;
  height : 62px;
  height : 20vw;
  margin-top : 10px; 
  border-radius : 50%;
  background : #5d5d5d;
  background : -webkit-linear-gradient(top, #5d5d5d 0%, #131313 100%);
  background :         linear-gradient(to bottom, #5d5d5d 0%, #131313 100%);

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5d5d5d', endColorstr='#131313',GradientType=0 );
}
#buy .heading-count-in {
  font-size : 10px;
  font-size : 3.2vw;
  font-weight : normal;
  line-height : 1;
  display : table-cell;
  vertical-align : middle;
}
#buy .heading-count-in span {
  font-size : 230%; 
  font-weight : bold;
}
#buy .heading-txt {
  font-size : 1.4rem;
  font-weight : bold;
  line-height : 1.5;
  margin-top : 83px;
  margin-top : 26vw; 
  text-align : left;
}
#buy .heading-txt br {
  display : none;
}

@media print, screen and (min-width: 768px) {
  #buy .heading {
    padding : 80px 0 40px;
  }
  #buy .heading-count {
    width : 125px;
    width : 16.5vw;
    height : 125px;
    height : 16.5vw;
  }
  #buy .heading-count-in {
    font-size : 2rem;
  }
  #buy .heading-txt {
    font-size : 2rem;
    margin-top : 260px;
    margin-top : 35vw;
  }
}

@media print, screen and (min-width: 901px) {
  #buy .heading {
    position : relative; 
    height : 510px;
    padding : 50px 0;
    background : url(../images/campaign/buy/main_bg_pc.jpg) no-repeat center top;
  }
  #buy .heading-ttl {
    font-size : 5.8rem;
  }
  #buy .heading-date {
    font-size : 2.3rem;
  }
  #buy .heading-count {
    position : absolute;
    top : 118px;
    left : 50%;
    width : 125px;
    height : 125px;
    margin-left : -365px;
  }
  #buy .heading-count-in {
    font-size : 2.1rem;
  }
  #buy .heading-txt {
    margin-top : 10px; 
    text-align : center;
  }
  #buy .heading-txt br {
    display : block;
  }
}

#buy .step {
  position : relative; 
  padding : 25px 0;
  background : url(../images/campaign/buy/step_bg.jpg) repeat-x center top #280a16;
  background-size : 111px auto;
}
#buy .step-list > li {
  font-size : 1.5rem;
  line-height : 1.7;
  position : relative; 
  margin-bottom : 48px;
  padding : 0 15px 48px;
  background : url(../images/campaign/buy/step_arr.png) no-repeat center bottom;
  background-size : 14px 8px;
}
#buy .step-list > li:last-child {
  margin-bottom : 0; 
  padding-bottom : 40px;
  background : none;
}
#buy .step-list > li:last-child:before , #buy .step-list > li:last-child:after {
  content : none;
}
#buy .step-list > li:before {
  position : absolute;
  bottom : 8px; 
  left : 0;
  display : inline-block;
  width : 48.1%;
  width : calc(50% - 7px);
  height : 1px;
  content : '';
  border-bottom : 1px solid #bfbfbf;
}
#buy .step-list > li:after {
  position : absolute;
  right : 0;
  bottom : 8px; 
  display : inline-block;
  width : 48.1%;
  width : calc(50% - 7px);
  height : 1px;
  content : '';
  border-bottom : 1px solid #bfbfbf;
}
#buy .step-item-ttl {
  font-size : 2.1rem;
  margin-bottom : 15px; 
  text-align : center;
  letter-spacing : 1px;
}
#buy .step-item-subttl {
  font-size : 1.6rem;
  margin-bottom : 15px; 
  padding : 4px;
  text-align : center;
  background : #373838;
}
#buy .step-item-txt {
  margin-bottom : 20px;
}
#buy .step-item-txt span {
  display : block;
}
#buy .step-item-frame {
  margin-top : 30px; 
  padding : 15px 10px;
  border : 1px solid #fff;
}
#buy .step .step02-catalog {
  margin-right : -12px; 
  margin-left : -12px;

  *zoom : 1;
}
#buy .step .step02-catalog:before , #buy .step .step02-catalog:after {
  display : table;
  content : ' ';
}
#buy .step .step02-catalog:after {
  clear : both;
}
#buy .step .step02-catalog-item {
  float : left;
  width : 50%;
  margin-bottom : 20px; 
  padding : 0 12px;
  text-align : center;
}
#buy .step .step02-catalog-item a {
  font-family : 'Roboto', 'Noto Sans Japanese', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', '游ゴシック体', YuGothic, 'メイリオ', Meiryo, sans-serif;
  font-size : 1.4rem;
  display : block;
  text-decoration : underline;
  color : #fff;
}
#buy .step .step02-catalog-item dl dt {
  margin-bottom : 5px;
}

@media print, screen and (min-width: 768px) {
  #buy .step {
    padding : 55px 15px; 
    text-align : center;
  }
  #buy .step-list > li {
    margin-bottom : 40px; 
    padding : 0 0 40px;
    background-size : 28px 16px;
  }
  #buy .step-list > li:before {
    bottom : 16px; 
    width : 48.6%;
    width : calc(50% - 14px);
  }
  #buy .step-list > li:after {
    bottom : 16px; 
    width : 48.6%;
    width : calc(50% - 14px);
  }
  #buy .step-item-ttl {
    font-size : 4.2rem;
  }
  #buy .step-item-subttl {
    margin-bottom : 30px;
  }
  #buy .step-item-txt {
    margin-bottom : 35px;
  }
  #buy .step-item-frame {
    font-size : 1.6rem;
    padding : 30px;
  }
  #buy .step .step01 .step-item-txt {
    margin-bottom : 10px;
  }
  #buy .step .step02 .step-item-txt {
    float : left;
    width : 40%;
    text-align : left;
  }
  #buy .step .step02-catalog {
    float : right; 
    width : 59%;
  }
}

@media print, screen and (min-width: 901px) {
  #buy .step {
    padding : 55px 0; 
    background-size : 223px auto;
  }
  #buy .step-list {
    width : 1024px;
    min-width : 1024px;
    margin : 0 auto; 
    padding : 0 22px;
  }
  #buy .step-list > li {
    padding : 0 160px 81px;
  }
  #buy .step-list > li:last-child {
    padding : 0 24px 81px;
  }
  #buy .step-item-frame {
    margin : 50px 160px 0;
  }
  #buy .step .step02 .step-item-txt {
    width : 33.333%;
  }
  #buy .step .step02-catalog {
    width : 66.6666%;
  }
  #buy .step .step02-catalog-item a {
    -webkit-transition : all opacity .3s;
            transition : all opacity .3s;
  }
  #buy .step .step02-catalog-item a:hover img {
    opacity : .6;
  }
}

.campaign .section {
  padding : 30px 0;
}
@media print, screen and (min-width: 901px) {
  .campaign .section {
    padding : 60px 0;
  }
}

.apply-box {
  font-size : 1.2rem;
  font-weight : normal;
  line-height : 1.7;
}
.apply-box-mainttl {
  font-size : 1.8rem;
  margin-bottom : 10px; 
  padding-bottom : 10px;
  border-bottom : 1px solid #000;
}
.apply-box-in {
  padding-left : 1.1em;
}
.apply-box-item {
  margin-bottom : 1em;
}
.apply-box-item-ttl {
  font-size : 130%;
}
.apply-box-item-ttl > i {
  font-style : normal;
  margin-left : -1em;
}
.apply-box-item-list li {
  padding-left : 1em;
}
.apply-box-item-list.list01 li:before {
  margin-left : -1em; 
  content : '＊';
}
.apply-box-item-list.list02 li:before {
  margin-left : -1em; 
  content : '・';
}

@media print, screen and (min-width: 768px) {
  .apply-box {
    font-size : 1.4rem;
  }
  .apply-box-mainttl {
    font-size : 2.6rem;
  }
}

.snsBtn {
  text-align : center;
}
.snsBtn_item {
  display : inline-block;
  margin : 0 4px;
  vertical-align : top !important;
}
.snsBtn-fb {
  line-height : 1;
}