@charset "utf-8";

/* ======================================================
 * special_layout_pc.css
 * ------------------------------------------------------
 * @media print, screen and (min-width: 768px)
 * - Common
 * - Boogieboard Layout
 * -  >>> Header
 * -  >>> Main
 * -  >>> Footer
 * -  >>> Other
 * - Hitotoki Layout
 * -  >>> Header
 * -  >>> Main
 * -  >>> Footer
 * -  >>> Other
 * - Clearfix
 * Media Queries
 * Print
====================================================== */

@media print, screen and (min-width: 768px) {
  /* ------------------------------------------------------
   * Common
  ------------------------------------------------------ */
  /* ----- font ----- */
  
  /* ----- a ----- */
  
  /* ----- opacity ----- */
  .bb-Pagetop a:hover,
  .hitotoki-header-ec > li a:hover img,
  .hitotoki-header-social > li a:hover img,
  .hitotoki-footer-social > li a:hover img {
    opacity: .7;
  }
  /* ----- transition ----- */
  .hitotoki-header-ec > li a img,
  .hitotoki-header-social > li a img,
  .hitotoki-footer-social > li a img {
    -webkit-transition: opacity .2s ease-out 0s;
    transition: opacity .2s ease-out 0s;
  }
  
  /* ----- sprite ----- */
  

  /* ------------------------------------------------------
   * Boogieboard Layout
  ------------------------------------------------------ */

  /* Header
  ------------------------------------------------------ */
  .bb-Header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    border-bottom: 1px solid #ddd;
    background-color: #fff;
    z-index: 1001;
  }
  .bb-HeaderBody {
    position: relative;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
  }
  .bb-HeaderBody > *:first-child {
    margin-top: 0 !important;
  }

   /* ----- bb-header-identity ----- */
  .bb-header-identity {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    float: none;
    height: 79px;
  }
  .bb-header-identity .identity_logo_1 img {
    width: 380px;
  }
  .bb-header-identity .identity_logo_2 img {
    width: 185px;
  }

  /* Main
  ------------------------------------------------------ */
  .bb-Main {
    overflow-x: hidden;
  }
  .bb-MainBody {
    margin-top: 80px;
    padding: 0 40px;
  }
  /* ----- bb-pageGuide ----- */
  .bb-pageGuide {
    position: relative;
    max-width: 1200px;
    height: 50px;
    margin: 0 auto;
  }
  .bb-pageGuide {
    padding-right: 290px;
  } 
  /* social-button */
  .bb-pageGuide .social-button {
    position: absolute;
    top: 15px;
    right: 0;
  }
  .bb-pageGuide .social-button > li {
    float: left;
    margin-left: 20px;
    line-height: 1;
  }
  /* ----- bb-container ----- */
  .bb-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 0 80px;
  }
  .bb-pageGuide + .bb-container {
    padding-top: 0;
  }
  /* ----- bb-contents ----- */
  .bb-contents > *:first-child,
  .bb-contents > section:first-child > [class*="heading-lv"] {
    margin-top: 0 !important;
  }
  /* ----- bb-contents-wrap ----- */
  .bb-contents-wrap > *:first-child,
  .bb-contents-wrap > section:first-child > [class*="heading-lv"] {
    margin-top: 0 !important;
  }

  /* Footer
  ------------------------------------------------------ */
  .bb-Footer {
    border-top: 1px solid #ddd;
  }
  /* ----- bb-footer-wrap ----- */
  .bb-footer-wrap {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: column wrap;
    flex-flow: column wrap;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    background-color: #fff;
    height: 77px;
    padding: 0 40px;
  }
  .bb-footer-wrap > *:first-child {
    margin-top: 0 !important;
  }
  /* ----- bb-footer-copyright ----- */
  .bb-footer-copyright {
    color: #777;
    font-size: 1.5rem;
    text-align: center;
  }
  /* ----- bb-Pagetop ----- */
  .bb-Pagetop {
    position: fixed;
    bottom: 77px;
    left: 50%;
    z-index: 900;
    margin-left: 640px;
  }
  .bb-Pagetop a {
    display: block;
    position: relative;
    width: 60px;
    height: 60px;
    background-color: #ccc;
    text-indent: -9999em;
    outline: none;
    overflow: hidden;
  }
  .bb-Pagetop a::after {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    margin: -4px 0 0 -8px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    content: "";
  }
  
  /* Other
  ------------------------------------------------------ */
  
  
  /* ------------------------------------------------------
   * Hitotoki Layout
  ------------------------------------------------------ */
  /* Header
  ------------------------------------------------------ */
  .hitotoki-Header {
    background-color: #fff;
  }
  .hitotoki-HeaderBody {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
    max-width: 1280px;
    margin: 0 auto;
    padding: 20px 40px;
  }
  .hitotoki-HeaderBody > *:first-child {
    margin-top: 0 !important;
  }
  /* ----- hitotoki-header-identity ----- */
  .hitotoki-header-identity .identity_logo img {
    width: 170px;
  }
  /* ----- hitotoki-header-utility ----- */
  .hitotoki-header-utility {
    display: flex;
    align-items: center;
  }
  /* ----- hitotoki-header-social ----- */
  .hitotoki-header-social {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
  }
  .hitotoki-header-social > li + li {
    margin-left: 40px;
  }
  .hitotoki-header-social > li.social_ig img {
    width: 32px;
  }
  /* ----- hitotoki-header-ec ----- */
  .hitotoki-header-ec {
    display: flex;
    flex-wrap: wrap;
  }
  .hitotoki-header-ec + .hitotoki-header-social {
    margin-left: 22px;
  }
  .hitotoki-header-ec > li img {
    width: 32px;
  }
  
  /* Main
  ------------------------------------------------------ */
  .hitotoki-Main {
    overflow-x: hidden;
  }
  .hitotoki-MainBody {
    padding: 0 40px;
  }  
  /* ----- hitotoki-container ----- */
  .hitotoki-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 15px 0 60px;
  }
  /* ----- hitotoki-contents ----- */
  .hitotoki-contents > *:first-child,
  .hitotoki-contents > section:first-child > [class*="heading-lv"] {
    margin-top: 0 !important;
  }
  /* ----- hitotoki-contents-wrap ----- */
  .hitotoki-contents-wrap > *:first-child,
  .hitotoki-contents-wrap > section:first-child > [class*="heading-lv"] {
    margin-top: 0 !important;
  }
  
  /* Footer
  ------------------------------------------------------ */
  .hitotoki-Footer {
    background-color: #fff;
  }
  /* ----- hitotoki-FooterBody ----- */
  .hitotoki-FooterBody {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 40px;
  }
  /* ----- hitotoki-footer-wrap ----- */
  .hitotoki-footer-wrap {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 20px 0;
  }
  .hitotoki-footer-wrap > *:first-child {
    margin-top: 0 !important;
  }
  /* v2 */
  .hitotoki-footer-wrap-v2 {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    height: 60px;
  }
  .hitotoki-footer-wrap-v2 > *:first-child {
    margin-top: 0 !important;
  }
  /* ----- hitotoki-footer-identity ----- */
  .hitotoki-footer-identity {
    margin-right: 60px;
  }
  .hitotoki-footer-identity .identity_logo img {
    width: 170px;
  }
  /* ----- hitotoki-footer-social ----- */
  .hitotoki-footer-social {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-align-items: center;
    align-items: center;
  }
  .hitotoki-footer-social > li + li {
    margin-left: 40px;
  }
  .hitotoki-footer-social > li img {
    width: 32px;
  }
  /* ----- hitotoki-footer-copyright ----- */
  .hitotoki-footer-copyright {
    font-size: 1.5rem;
    text-align: center;
  }
  
  /* Other
  ------------------------------------------------------ */
    
  
  /* ------------------------------------------------------
   * Clearfix
  ------------------------------------------------------ */
  .social-button::after {
    display: block;
    clear: both;
    content: "";
  }
}


/* ======================================================
 * Media Queries
====================================================== */
@media screen and (min-width: 768px) and (max-width: 1400px) {
  .bb-Pagetop {
    left: auto;
    right: 0;
    margin-left: 0;
  }
}

/* ======================================================
 * Print
====================================================== */
@media print {
  body {
    width: 1280px !important;
    margin: 0 auto !important;
  }
  body[data-browser="chrome"] {
    zoom: .85;
  }
  .pc-hidden,
  .Pagetop {
    display: none !important;
  }
  .bb-Header {
    position: absolute !important;
  }
}