@charset "UTF-8";
/*

このファイルには、全ページに共通して使用するCSSを書き込みます

*/
* {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.pc {
  display: block; }

.sp {
  display: none; }

.tab {
  display: block; }

.sp_only {
  display: none; }

.pcclear {
  clear: both;
  display: block; }

.spclear {
  display: none; }

/****************** header ************************/
header {
  font-family: Futura, "Century Gothic", "Helvetica Neue", "FOT-筑紫ゴシック Pro R", "TsukuGoPro-R", sans-serif;
  position: relative; }

#gnavi_wrap {
  position: relative;
  display: block;
  height: 100px;
  width: 100%; }

#gnavi {
  position: fixed;
  display: block;
  top: 0;
  width: 100%;
  text-align: center;
  background-color: rgba(230, 230, 230, 0.9);
  z-index: 150;
  -webkit-transform: 0.4s ease;
  -ms-transform: 0.4s ease;
  transition: 0.4s ease; }
  #gnavi:hover {
    background-color: #e6e6e6;
    -webkit-transform: 0.4s ease;
    -ms-transform: 0.4s ease;
    transition: 0.4s ease; }

#closeKey {
  display: none; }

#gnavi_upper {
  position: relative;
  display: block;
  max-width: 960px;
  margin: 0 auto;
  padding: 1em 0; }
  #gnavi_upper:after {
    content: " ";
    display: table;
    clear: both; }

#gnavi_sp, #gnavi_navi_sp {
  display: none; }

#gnavi_logo {
  position: relative;
  display: block;
  width: 144px;
  margin: 0;
  padding: 0; }
  #gnavi_logo img {
    width: 144px; }

#gnavi_member {
  position: absolute;
  top: 12px;
  right: 0;
  display: block;
  margin: 0;
  padding: 0;
  width: 294px;
  text-align: right; }
  #gnavi_member a {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    padding-bottom: 10px;
    -webkit-transform: .8s linear;
    -ms-transform: .8s linear;
    transition: .8s linear;
    color: #333;
    text-decoration: none; }
    #gnavi_member a::after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 3px;
      -webkit-transform: scaleX(0);
      -ms-transform: scaleX(0);
      transform: scaleX(0);
      background-color: #333;
      -webkit-transition: all .3s ease;
      transition: all .3s ease; }
    #gnavi_member a:hover::after {
      -webkit-transform: scaleX(1);
      -ms-transform: scaleX(1);
      transform: scaleX(1); }
    #gnavi_member a:last-child {
      margin-left: 24px; }
  #gnavi_member span img, #gnavi_member a img {
    position: relative;
    margin-right: 10px;
    width: 16px; }
  #gnavi_member ul {
    position: absolute;
    top: 40px;
    right: 0px;
    display: none;
    margin-left: 0;
    padding: 10px 20px;
    background-color: #333;
    z-index: 1700;
    list-style: none; }
    #gnavi_member ul:before {
      content: "";
      position: absolute;
      top: -17px;
      left: 90px;
      border: 8px solid transparent;
      border-bottom: 15px solid #333; }
    #gnavi_member ul li {
      display: block;
      text-align: center;
      width: 110px;
      text-indent: -1em; }
      #gnavi_member ul li a {
        position: relative;
        color: rgba(230, 230, 230, 0.7); }
        #gnavi_member ul li a:hover {
          color: #e6e6e6; }
        #gnavi_member ul li a img {
          position: relative;
          top: 3px; }
        #gnavi_member ul li a .logout-img {
          filter: invert(100%); }

#gnavi_navi ul {
  position: relative;
  max-width: 960px;
  margin: 10px auto;
  padding: 0;
  text-align: center; }
#gnavi_navi .font-bold {
  font-weight: bold; }
#gnavi_navi li {
  display: inline-block;
  letter-spacing: 2px; }
  #gnavi_navi li.home {
    display: none; }
  #gnavi_navi li.gnavi_dot span {
    display: inline-block;
    padding: 0 13px; }
  #gnavi_navi li a {
    position: relative;
    display: inline-block;
    padding-bottom: 10px;
    text-decoration: none;
    color: #333; }
    #gnavi_navi li a::after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 3px;
      -webkit-transform: scaleX(0);
      -ms-transform: scaleX(0);
      transform: scaleX(0);
      background-color: #333;
      -webkit-transition: all .3s ease;
      -ms-transition: all .3s ease;
      transition: all .3s ease; }
    #gnavi_navi li a:hover::after {
      -webkit-transform: scaleX(1);
      -ms-transform: scaleX(1);
      transform: scaleX(1); }
  #gnavi_navi li.active a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    transform: scaleX(1);
    background-color: #333; }
  #gnavi_navi li span {
    position: relative;
    opacity: 0.9;
    cursor: pointer;
    padding-bottom: 10px; }
  #gnavi_navi li.active span::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    -webkit-transform: scaleX(1);
    -ms-transform: scaleX(1);
    transform: scaleX(1);
    background-color: #333; }
  #gnavi_navi li dl {
    position: absolute;
    top: 31px;
    display: none;
    padding: 10px 20px;
    background-color: #333;
    z-index: 170; }
    #gnavi_navi li dl.naviService {
      left: 150px; }
      @media screen and (max-width: 767px) {
        #gnavi_navi li dl.naviService {
          left: 0px; } }
    #gnavi_navi li dl:before {
      content: "";
      position: absolute;
      top: -20px;
      left: 40px;
      margin-left: -15px;
      border: 8px solid transparent;
      border-bottom: 15px solid #333; }
    #gnavi_navi li dl#gnavi_suporter {
      right: 130px; }
      @media screen and (max-width: 767px) {
        #gnavi_navi li dl#gnavi_suporter {
          right: 0px; } }
      #gnavi_navi li dl#gnavi_suporter:before {
        right: 60px;
        margin-left: 80px; }
    #gnavi_navi li dl dt {
      display: block;
      padding: 15px 5px 0;
      border-bottom: 1px dotted #e5e5e5; }
      #gnavi_navi li dl dt:last-child {
        border: none; }
      #gnavi_navi li dl dt a {
        color: #e6e6e6;
        cursor: pointer;
        font-weight: normal; }
        #gnavi_navi li dl dt a:hover {
          color: rgba(230, 230, 230, 0.5); }
        #gnavi_navi li dl dt a svg {
          width: 0.8em;
          height: 0.8em;
          color: #e6e6e6; }

/**************************

 contact_us

**************************/
#contact_us {
  position: absolute;
  top: 65px;
  right: 0;
  display: block;
  width: 220px;
  color: #333;
  padding-top: 20px;
  font-family: Futura, "Century Gothic", "Helvetica Neue", "FOT-筑紫ゴシック Pro R", "TsukuGoPro-R", sans-serif; }

#contact_us_upper {
  font-family: Futura, "Century Gothic", "Helvetica Neue", "FOT-筑紫ゴシック Pro R", "TsukuGoPro-R", sans-serif;
  position: fixed;
  top: 65px;
  right: 65px;
  display: block;
  height: 220px;
  width: 25px;
  -webkit-transform: all .5s linear;
  -ms-transform: all .5s linear;
  transition: all .5s linear;
  -webkit-transition-delay: .6s;
  -ms-transition-delay: .6s;
  transition-delay: .6s;
  opacity: 1;
  z-index: 160;
  cursor: pointer; }
  #contact_us_upper.up_on {
    opacity: 0;
    height: 0px;
    -webkit-transform: all .5s linear;
    -ms-transform: all .5s linear;
    transition: all .5s linear; }
  #contact_us_upper .vertical_line {
    position: relative;
    left: 12px;
    display: block;
    margin-bottom: 10px;
    width: 1px;
    height: 80px;
    -webkit-transform: 0.2s linear;
    -ms-transform: 0.2s linear;
    transition: 0.2s linear;
    border-right: 1px solid #333;
    box-shadow: 1px 0 0 0 #e5e5e5;
    z-index: 160; }
  #contact_us_upper:hover .vertical_line {
    height: 40px;
    -webkit-transform: 0.2s linear;
    -ms-transform: 0.2s linear;
    transition: 0.2s linear; }
  #contact_us_upper .keyword {
    position: relative;
    display: block;
    margin-left: -3px;
    height: 110px;
    padding-bottom: 20px;
    -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    text-shadow: 1px 1px 0 #e5e5e5;
    z-index: 160; }
    #contact_us_upper .keyword span {
      position: relative;
      display: inline-block;
      width: 30px;
      background-color: olive; }
  #contact_us_upper .contact_keyword_img1 {
    position: absolute;
    top: 1px;
    width: 25px;
    margin-top: 10px;
    margin-left: 5px;
    z-index: 161; }
  #contact_us_upper .contact_keyword_img2 {
    position: absolute;
    top: 0;
    left: 5px;
    filter: invert(100%);
    width: 26px;
    margin-top: 10px;
    z-index: 159; }

#contact_us_lower {
  position: fixed;
  top: 65px;
  right: -300px;
  display: block;
  width: 220px;
  background-color: #e5e5e5;
  -webkit-transform: .5s linear;
  -ms-transform: .5s linear;
  transition: .5s linear;
  z-index: 160; }
  #contact_us_lower.lo_on {
    right: 0px;
    -webkit-transform: .5s linear;
    -ms-transform: .5s linear;
    transition: .5s linear;
    -webkit-transition-delay: .6s;
    -ms-transition-delay: .6s;
    transition-delay: .6s;
    opacity: 1; }
  #contact_us_lower .close_btn {
    text-align: center;
    padding: 30px;
    cursor: pointer; }
    #contact_us_lower .close_btn img {
      width: 25px; }
  #contact_us_lower .linkto {
    text-align: center; }
    #contact_us_lower .linkto a {
      color: #333; }
    #contact_us_lower .linkto .freedial {
      line-height: 1.8em; }
      #contact_us_lower .linkto .freedial img {
        top: 5px;
        width: 25px;
        margin-right: 5px; }
    #contact_us_lower .linkto .email img {
      top: 5px;
      width: 20px;
      margin-right: 5px; }
  #contact_us_lower .contact_us_word {
    padding: 30px; }
  #contact_us_lower .section_link {
    display: block;
    text-align: center;
    padding-bottom: 50px; }
    #contact_us_lower .section_link a {
      position: relative;
      margin: 0 27px;
      padding: 10px 20px;
      color: #333;
      background-color: #fff;
      border: 1px solid #333;
      border-radius: 24px;
      box-shadow: 0px 7px 0px #000;
      font-size: 10px; }
      #contact_us_lower .section_link a img {
        position: relative;
        top: 5px;
        margin-left: 5px;
        width: 10px; }

#contact_us_upper:hover .keyword img {
  -webkit-animation: 0.5s infinite buzz_phone;
  animation: 0.5s infinite buzz_phone; }

@keyframes buzz_phone {
  0% {
    transform: rotate(0deg) scale(1, 1); }
  20% {
    transform: rotate(5deg) scale(1.2, 1.2); }
  40% {
    transform: rotate(-5deg) scale(0.9, 0.9); }
  60% {
    transform: rotate(5deg) scale(1, 1); }
  80% {
    transform: rotate(-5deg) scale(1.3, 1.3); }
  100% {
    transform: rotate(0deg) scale(1, 1); } }
/**************************

 footer

**************************/
.guidanceArea {
  font-family: Futura, "Century Gothic", "Helvetica Neue", "FOT-筑紫ゴシック Pro R", "TsukuGoPro-R", sans-serif;
  position: relative;
  display: block;
  color: #333333;
  text-align: center;
  background: #e5e5e5;
  box-sizing: border-box;
  padding: 110px 0; }
  .guidanceArea .guidanceArea_link {
    display: block;
    width: 655px;
    height: 650px;
    border: 1px solid #333333;
    border-radius: 40px;
    margin: 0 auto;
    padding: 80px 100px;
    color: #333333;
    text-decoration: none;
    opacity: 0.8; }
  .guidanceArea .guide-photos {
    display: flex;
    padding: 20px 0;
    width: 100%;
    justify-content: space-between;
    margin: 0 auto; }
    @media screen and (max-width: 767px) {
      .guidanceArea .guide-photos {
        width: 90%; } }
    .guidanceArea .guide-photos li {
      width: 48%; }
      .guidanceArea .guide-photos li img {
        max-width: 100%;
        height: auto; }
  .guidanceArea .guidanceArea_title {
    display: block;
    font-family: "FOT-筑紫Aオールド明朝 Pr6 L", "TsukuAOldMinPr6-L", serif;
    font-size: 32px;
    margin-bottom: 45px; }
  .guidanceArea .guidanceArea_subtitle {
    font-family: "FOT-筑紫ゴシック Pro R", "TsukuGoPro-R", sans-serif;
    font-size: 14px;
    margin: 0 auto 45px;
    padding: 0 0 5px;
    border-bottom: 1px solid #333333;
    width: 9em; }
  .guidanceArea .guidanceArea_message {
    font-family: "FOT-筑紫ゴシック Pro R", "TsukuGoPro-R", sans-serif;
    width: auto;
    text-align: left;
    font-size: 16px;
    line-height: 2em;
    letter-spacing: .02em; }
  .guidanceArea .guidanceArea_dial_mail {
    position: relative;
    top: -150px;
    opacity: 0.8; }
    .guidanceArea .guidanceArea_dial_mail div {
      position: relative;
      margin-bottom: 10px;
      vertical-align: baseline; }
  .guidanceArea .freedial a {
    font-size: 20px;
    letter-spacing: 1px;
    color: #333333;
    text-decoration: none; }
  .guidanceArea .freedial img {
    position: relative;
    top: -5px;
    width: 33px;
    margin-right: 10px; }
  .guidanceArea .email a {
    font-size: 16px;
    letter-spacing: 1px;
    color: #333333;
    text-decoration: none; }
  .guidanceArea .email img {
    width: 26px;
    margin-right: 13px; }

footer {
  font-family: Futura, "Century Gothic", "Helvetica Neue", "FOT-筑紫ゴシック Pro R", "TsukuGoPro-R", sans-serif;
  display: block;
  padding-top: 50px;
  padding-bottom: 150px;
  color: #e5e5e5;
  background-color: #3F3F33; }

#footer_navi {
  display: block;
  width: 1000px;
  margin: 0 auto 100px; }
  #footer_navi:after {
    content: " ";
    display: block;
    clear: both; }

#footer_logo {
  float: left;
  display: block;
  margin-right: 80px; }
  #footer_logo img {
    width: 72px; }

#footer_navi .footer_navi_block {
  float: left;
  display: block;
  margin: 70px 30px 0;
  text-align: left; }
#footer_navi #footer_navi_about {
  width: 365px; }
#footer_navi .footer_navi_title {
  margin-bottom: 10px;
  padding-bottom: 5px;
  border-bottom: 1px solid #e5e5e5; }
#footer_navi #footer_navi_about ul {
  list-style: none; }
  #footer_navi #footer_navi_about ul li {
    float: left;
    position: relative; }
    #footer_navi #footer_navi_about ul li:nth-child(odd) {
      width: 200px; }
    #footer_navi #footer_navi_about ul li:before {
      content: "";
      display: inline-block;
      border-bottom: 1px solid #e5e5e5;
      width: 0;
      margin-bottom: 5px;
      margin-right: 0;
      -webkit-transform: 0.2s linear;
      -ms-transform: 0.2s linear;
      transition: 0.2s linear; }
    #footer_navi #footer_navi_about ul li:hover:before {
      margin-right: 6px;
      width: 16px;
      -webkit-transform: 0.2s linear;
      -ms-transform: 0.2s linear;
      transition: 0.2s linear; }
    #footer_navi #footer_navi_about ul li a {
      color: #e5e5e5; }
#footer_navi #footer_navi_contact {
  width: 185px; }

#footer_navi_contact .freedial img {
  position: relative;
  top: 5px;
  width: 23px;
  margin-right: 10px; }
#footer_navi_contact .email img {
  position: relative;
  top: 5px;
  width: 20px;
  margin-right: 13px; }

#footer_navi a {
  font-size: 14px;
  line-height: 2em;
  color: #e5e5e5;
  font-weight: normal;
  text-decoration: none; }

#copyright {
  display: block;
  text-align: center; }

.freedial:hover img {
  animation: 0.5s infinite go_freedial; }

@keyframes go_freedial {
  0% {
    transform: rotate(0deg); }
  20% {
    transform: rotate(5deg); }
  40% {
    transform: rotate(0deg); }
  60% {
    transform: rotate(-5deg); }
  80% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(0deg); } }
.email:hover img {
  animation: 0.5s infinite fly_mail; }

@keyframes fly_mail {
  0% {
    transform: rotate(0deg); }
  20% {
    transform: rotate(10deg); }
  80% {
    transform: rotate(-10deg); }
  100% {
    transform: rotate(0deg); } }
#pagetop {
  display: block;
  position: fixed;
  bottom: -100px;
  right: 50px;
  z-index: 180;
  -webkit-transform: 0.4s ease;
  -ms-transform: 0.4s ease;
  transition: 0.4s ease; }
  #pagetop.onBrowz {
    bottom: 50px;
    -webkit-transform: 0.4s ease;
    -ms-transform: 0.4s ease;
    transition: 0.4s ease; }
  #pagetop img {
    width: 66px;
    background-color: rgba(229, 229, 229, 0.5); }
  #pagetop:hover img {
    width: 66px;
    background-color: #e5e5e5;
    -webkit-transform: 0.4s ease;
    -ms-transform: 0.4s ease;
    transition: 0.4s ease; }

/****************** フォーム横幅 ************************/
input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="number"] {
  background: #FFF;
  border: #DDD solid 2px;
  border-radius: 3px;
  padding: 3px 5px;
  font-size: 14px;
  font-family: "メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

textarea {
  background: #FFF;
  border: #DDD solid 2px;
  border-radius: 3px;
  padding: 3px 5px;
  font-size: 14px;
  font-family: "メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

input[type="checkbox"] {
  vertical-align: middle;
  margin-right: 5px; }
input[type="tel"] {
  width: 5em; }
input[type="number"] {
  width: 6em; }
input[type="text"], input[type="email"], input[type="password"] {
  width: 40em; }

tr.name_tr input[type="text"] {
  width: 24em; }
tr.short_tr input[type="text"] {
  width: 15em; }

textarea {
  width: 40em;
  height: 15em; }

select {
  background: #FFF;
  border: #DDD solid 2px;
  border-radius: 3px;
  padding: 3px 5px;
  font-size: 14px;
  font-family: "メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
  min-width: 10em; }

@media (max-width: 1280px) {
  #telArea ul li.logout div {
    left: auto;
    right: 5px;
    margin-left: 0; }

  /****************** header.fix時 ************************/
  #fixWrap.fixed #logo {
    margin-right: 10px; } }
/****************** load animations ************************/
@media (min-width: 787px) {
  .fade-in-up {
    animation: 3s forwards fade-in-up; }

  @keyframes fade-in-up {
    0% {
      transform: translate(0, 200px);
      opacity: 0; }
    100% {
      transform: translate(0, 0);
      opacity: 1; } }
  .fade-in-left {
    animation: 3s forwards fade-in-left; }

  @keyframes fade-in-left {
    0% {
      transform: translate(-200px, 0);
      opacity: 0; }
    100% {
      transform: translate(0, 0);
      opacity: 1; } }
  .fade-in-right {
    animation: 3s forwards fade-in-right; }

  @keyframes fade-in-right {
    0% {
      transform: translate(200px, 0);
      opacity: 0; }
    100% {
      transform: translate(0, 0);
      opacity: 1; } } }
/*狭いブラウザ・タブレット*/
@media (max-width: 1060px) {
  /****************** header ************************/
  /**************************
  
   footer
  
  **************************/
  #footer_navi {
    display: block;
    width: 980px;
    max-width: 100%;
    margin: 0 auto 100px; }

  /****************** フォーム横幅 ************************/
  input[type="tel"], input[type="number"] {
    width: 5em; }
  input[type="text"], input[type="email"], input[type="password"] {
    width: 100%; }

  textarea {
    width: 100%; }

  input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="number"] {
    font-size: 16px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; }

  textarea, select {
    font-size: 16px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; } }
@media (max-width: 767px) {
  .tab {
    display: none; }

  .sp_only {
    display: block; }

  #chamo-window {
    display: none !important; }

  #loginBox {
    display: none; } }
/*-画像モーダル-*/
/*
 * Boxer v3.3.0 - 2015-04-04
 * A jQuery plugin for displaying images, videos or content in a modal overlay. Part of the Formstone Library.
 * http://classic.formstone.it/boxer/
 *
 * Copyright 2015 Ben Plum; MIT Licensed
 */
.boxer-lock {
  overflow: hidden !important; }

#boxer-overlay {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 180;
  background: #000000;
  opacity: 0;
  -webkit-transition: opacity 0.25s linear;
  transition: opacity 0.25s linear; }

.boxer-open #boxer-overlay {
  opacity: 0.75; }

#boxer {
  width: 200px;
  height: 200px;
  position: absolute;
  right: 0;
  left: 0;
  z-index: 190;
  background: #ffffff;
  border-radius: 1px;
  box-shadow: 0 0 25px #000000;
  opacity: 0;
  margin: 0 auto;
  padding: 0px;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
  box-sizing: border-box; }
  #boxer * {
    -webkit-transition: none;
    transition: none;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
    box-sizing: border-box; }
    #boxer *:before, #boxer *:after {
      box-sizing: border-box; }
  #boxer.fixed {
    position: fixed;
    top: 0;
    bottom: 0;
    margin: auto; }
  #boxer.inline {
    padding: 30px; }
  #boxer.animating {
    -webkit-transition: height 0.25s ease, width 0.25s ease, opacity 0.25s linear, top 0.25s ease;
    transition: height 0.25s ease, width 0.25s ease, opacity 0.25s linear, top 0.25s ease; }
    #boxer.animating .boxer-container {
      -webkit-transition: opacity 0.25s linear 0.25s;
      transition: opacity 0.25s linear 0.25s; }

.boxer-open #boxer {
  opacity: 1; }

#boxer.loading .boxer-container {
  opacity: 0;
  -webkit-transition: opacity 0.25s linear;
  transition: opacity 0.25s linear; }
#boxer .boxer-close {
  width: 30px;
  height: 30px;
  position: absolute;
  top: -7.5px;
  right: -7.5px;
  z-index: 185;
  background: #ffffff;
  border-radius: 100%;
  cursor: pointer;
  display: block;
  overflow: hidden;
  padding: 0;
  text-indent: 200%;
  white-space: nowrap; }
  #boxer .boxer-close:before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    color: #333333;
    content: "\00d7";
    display: block;
    font-size: 22px;
    font-weight: 700;
    line-height: 30px;
    margin: auto;
    text-align: center;
    text-indent: 0;
    -webkit-transition: color 0.15s linear;
    transition: color 0.15s linear; }

.no-opacity #boxer .boxer-close {
  text-indent: -999px; }

#boxer .boxer-loading {
  width: 50px;
  height: 50px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 185;
  display: block;
  margin: auto;
  opacity: 0;
  -webkit-transition: opacity 0.25s linear;
  transition: opacity 0.25s linear; }
  #boxer .boxer-loading:before, #boxer .boxer-loading:after {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 110%;
    content: '';
    display: block; }
  #boxer .boxer-loading:before {
    border: 5px solid rgba(51, 51, 51, 0.25); }
  #boxer .boxer-loading:after {
    -webkit-animation: boxer-loading-spin 0.75s linear infinite;
    animation: boxer-loading-spin 0.75s linear infinite;
    border: 5px solid transparent;
    border-top-color: #333333; }
#boxer.loading .boxer-loading {
  opacity: 1; }
#boxer .boxer-container {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 184;
  background: #ffffff;
  overflow: hidden; }
#boxer .boxer-content {
  width: 100%;
  background: #ffffff;
  opacity: 1;
  overflow: hidden;
  padding: 0; }
#boxer.inline .boxer-content, #boxer.iframe .boxer-content {
  width: auto; }
#boxer .boxer-image {
  float: left; }
#boxer .boxer-video {
  width: 100%;
  height: 100%; }
#boxer .boxer-iframe {
  width: 100%;
  height: 100%;
  border: none;
  float: left;
  overflow: auto; }
#boxer .boxer-meta {
  clear: both; }
#boxer .boxer-control {
  width: 25px;
  height: 41px;
  position: absolute;
  top: 0;
  cursor: pointer;
  display: block;
  margin-right: auto;
  margin-left: auto;
  opacity: 1;
  overflow: hidden;
  text-indent: 200%;
  -webkit-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear;
  white-space: nowrap;
  filter: alpha(opacity=70);
  -moz-opacity: 0.7;
  opacity: 0.7; }
  #boxer .boxer-control:hover {
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5; }
  #boxer .boxer-control:before {
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: '';
    margin: auto; }
  #boxer .boxer-control.previous {
    left: 20px;
    background: url(../images/arrow08.png) no-repeat left top;
    background-size: 25px 41px; }
  #boxer .boxer-control.next {
    right: 20px;
    background: url(../images/arrow07.png) no-repeat left top;
    background-size: 25px 41px; }
  #boxer .boxer-control.disabled {
    opacity: 0; }

@-webkit-keyframes boxer-loading-spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }
@keyframes boxer-loading-spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }
.no-opacity #boxer .boxer-control {
  text-indent: -999px; }

.no-touch #boxer .boxer-control {
  opacity: 0; }
.no-touch #boxer:hover .boxer-control {
  opacity: 1; }
  .no-touch #boxer:hover .boxer-control.disabled {
    opacity: 0;
    cursor: default !important; }

#boxer .boxer-meta {
  padding: 10px 0; }
#boxer .boxer-position {
  color: #999999;
  font-size: 12px;
  margin: 0;
  padding: 15px 15px 0 15px; }
#boxer .boxer-caption p {
  color: #666666;
  font-size: 14px;
  margin: 0;
  padding: 15px; }
#boxer .boxer-caption.gallery p {
  padding-top: 0; }
#boxer .boxer-error {
  width: 250px; }
  #boxer .boxer-error p {
    color: #990000;
    font-size: 14px;
    margin: 0;
    padding: 25px;
    text-align: center;
    text-transform: uppercase; }
#boxer.mobile {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #111111;
  border-radius: 0;
  padding: 40px 0 0;
  z-index: 180; }
  #boxer.mobile .boxer-close {
    height: 40px;
    width: 40px;
    top: 0;
    right: 0;
    background: #111111;
    border-radius: 0; }
    #boxer.mobile .boxer-close:hover {
      height: 40px;
      width: 40px;
      top: 0;
      right: 0;
      background: #111111;
      border-radius: 0; }
    #boxer.mobile .boxer-close:before, #boxer.mobile .boxer-close:hover:before {
      color: #cccccc;
      font-size: 28px;
      font-weight: 700;
      line-height: 40px; }
  #boxer.mobile .boxer-loading:before {
    border-color: rgba(153, 153, 153, 0.25); }
  #boxer.mobile .boxer-loading:after {
    border-top-color: #999999; }
  #boxer.mobile .boxer-container {
    background: #111111; }
  #boxer.mobile .boxer-content {
    background-color: #111111; }
  #boxer.mobile .boxer-control {
    width: 50px;
    height: 100%;
    background: #111111;
    border-radius: 0;
    box-shadow: none;
    opacity: 1; }
    #boxer.mobile .boxer-control.previous {
      left: 0; }
      #boxer.mobile .boxer-control.previous:before {
        border-right-color: #eeeeee;
        margin-left: 19px; }
    #boxer.mobile .boxer-control.next {
      right: 0; }
      #boxer.mobile .boxer-control.next:before {
        border-left-color: #eeeeee;
        margin-right: 19px; }

.no-touch #boxer.mobile .boxer-control, .no-touch #boxer.mobile:hover .boxer-control {
  opacity: 1; }
.no-touch #boxer.mobile .boxer-control.disabled, .no-touch #boxer.mobile:hover .boxer-control.disabled {
  opacity: 0;
  cursor: default !important; }

#boxer.mobile .boxer-meta {
  width: 100%;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #111111;
  padding: 15px 65px; }
#boxer.mobile .boxer-position {
  color: #999999;
  font-size: 12px;
  margin: 0;
  padding: 0 15px 0 0; }
#boxer.mobile .boxer-caption p {
  color: #eeeeee;
  font-size: 14px;
  margin: 0;
  padding: 0; }
#boxer.mobile .boxer-image {
  -webkit-transition: none !important;
  transition: none !important;
  -webkit-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  transform: translate(0, 0); }
#boxer.mobile.animated .boxer-image {
  -webkit-transition: -webkit-transform 0.25s ease-out !important;
  transition: transform 0.25s ease-out !important; }
#boxer.mobile.inline .boxer-content, #boxer.mobile.iframe .boxer-content {
  overflow-x: hidden;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch; }

@media (max-width: 767px) {
  header * {
    box-sizing: border-box; }

  #gnavi_wrap {
    height: 60px; }

  #gnavi {
    font-family: Futura, "Century Gothic", "Helvetica Neue", "FOT-筑紫ゴシック Pro R", "TsukuGoPro-R", sans-serif;
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    background-color: #3f3f33;
    z-index: 160;
    font-size: 14px; }
    #gnavi:hover {
      background-color: #3f3f33; }
    #gnavi a, #gnavi span {
      color: #e5e5e5; }

  #gnavi_upper {
    position: relative;
    display: block;
    max-width: 100vw;
    margin: 0 auto;
    padding: 10px 0; }
    #gnavi_upper:after {
      content: " ";
      display: table;
      clear: both; }

  #gnavi_member {
    position: relative;
    top: auto;
    right: auto;
    margin: 0 auto;
    text-align: center; }
    #gnavi_member a::after {
      background-color: #e5e5e5; }
    #gnavi_member a img {
      filter: invert(100%); }
    #gnavi_member span img {
      filter: invert(100%); }
    #gnavi_member ul {
      position: relative;
      top: auto;
      right: auto;
      display: none;
      text-align: center;
      margin: 5px auto 0;
      padding: 0;
      background-color: #3f3f33; }
      #gnavi_member ul:before {
        content: "";
        content: none; }
      #gnavi_member ul li {
        display: inline-block;
        text-align: center;
        width: 110px;
        padding: 0;
        text-indent: -1em; }
        #gnavi_member ul li a {
          position: relative;
          color: #e5e5e5;
          padding: 0; }
          #gnavi_member ul li a img {
            position: relative;
            top: 1px; }
          #gnavi_member ul li a .favorite {
            filter: initial; }
          #gnavi_member ul li a .logout-img {
            filter: invert(100%); }

  #gnavi_navi {
    width: 90vw;
    height: calc(100vh - 180px);
    margin: 0 auto;
    overflow-y: scroll; }
    #gnavi_navi li {
      display: block;
      padding: 0;
      border-bottom: 2px solid #999; }
      #gnavi_navi li.home {
        display: block; }
        #gnavi_navi li.home a {
          color: #999; }
      #gnavi_navi li.gnavi_dot {
        display: none; }
      #gnavi_navi li a, #gnavi_navi li span {
        font-family: Futura, "Century Gothic", "FOT-筑紫ゴシック Pro R", "TsukuGoPro-R", sans-serif;
        display: block;
        color: #e5e5e5;
        width: auto;
        padding: 1em; }
      #gnavi_navi li.rollNavi span:before {
        content: '＋';
        display: inline-block;
        width: 2em;
        color: #e5e5e5; }
      #gnavi_navi li.rollNaviOpen span:before {
        content: '−';
        display: inline-block;
        width: 2em;
        color: #e5e5e5; }
      #gnavi_navi li a::after, #gnavi_navi li span::after {
        content: none; }
      #gnavi_navi li.active a::after, #gnavi_navi li.active span::after {
        content: none; }
      #gnavi_navi li dl {
        position: relative;
        top: 0;
        display: none;
        padding: 0;
        background-color: #3f3f33;
        border: none; }
        #gnavi_navi li dl:before {
          content: "";
          content: none; }
        #gnavi_navi li dl dt {
          display: block;
          padding: 0;
          margin: 0;
          line-height: 1em;
          border: none; }
          #gnavi_navi li dl dt a {
            cursor: pointer;
            color: #e6e6e6;
            padding-top: 0; }

  #gnavi_logo {
    display: none; }

  #closeKey {
    display: block;
    width: 100%;
    text-align: right;
    padding: 10px 5px;
    cursor: pointer; }
    #closeKey img {
      margin-right: 20px;
      width: 24px;
      filter: invert(100%); }

  #gnavi_sp {
    position: fixed;
    display: table;
    width: 100%;
    top: 0;
    left: 0;
    background-color: #e5e5e5;
    z-index: 150; }
    #gnavi_sp:after {
      content: " ";
      display: block;
      clear: both; }

  #gnavi_sp_btn {
    display: table-cell;
    text-align: left;
    vertical-align: middle;
    cursor: pointer;
    padding-right: calc(100vw * 0.03);
    width: calc(100vw * 0.084);
    margin-right: 10px; }
    #gnavi_sp_btn svg {
      display: block;
      width: calc(100vw * 0.05);
      margin: calc(100vw * 0.02); }
    #gnavi_sp_btn span {
      -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
      writing-mode: vertical-rl; }

  #gnavi_sp_logo {
    position: relative;
    display: table-cell;
    width: auto;
    height: 100%;
    min-width: 150px;
    text-align: center;
    vertical-align: middle; }
    #gnavi_sp_logo a {
      position: relative; }
    #gnavi_sp_logo img {
      display: block;
      width: calc(100vw * 0.28);
      margin-left: auto;
      margin-right: auto; }

  #gnavi_sp_contact_btn {
    display: table-cell;
    width: calc(100vw * 0.084);
    margin-right: 10px;
    text-align: right;
    vertical-align: middle;
    cursor: pointer; }
    #gnavi_sp_contact_btn img {
      width: calc(100vw * 0.086);
      margin: calc(100vw * 0.02); }

  #member_name {
    display: block;
    width: 100%;
    padding: 10px 0;
    text-align: center; }
    #member_name img {
      position: relative;
      margin-right: 10px;
      width: 14px; }

  #pageTitle {
    margin-top: 60px; }

  #contact_us {
    display: none;
    width: 100%; }

  #contact_us_upper {
    display: none; }

  #contact_us_lower {
    position: fixed;
    display: none;
    top: 60px;
    right: 0px;
    width: 100%; }
    #contact_us_lower a {
      text-decoration: none; }

  #contact_us .linkto .freedial img, #contact_us .linkto .email img {
    margin-right: 5px; }

  #pagetop {
    bottom: -100px;
    right: 20px; }
    #pagetop.onBrowz {
      bottom: 20px; }
    #pagetop img {
      width: 33px;
      background: none;
      -webkit-transform: 0.4s ease;
      -ms-transform: 0.4s ease;
      transition: 0.4s ease; }
    #pagetop:hover img {
      width: 33px;
      background-color: rgba(229, 229, 229, 0.7);
      -webkit-transform: 0.4s ease;
      -ms-transform: 0.4s ease;
      transition: 0.4s ease; }

  .guidanceArea .guidanceArea_link {
    width: 90%;
    max-width: 655px;
    height: auto;
    min-height: 650px;
    padding: 80px 0px; }
  .guidanceArea .guidanceArea_title {
    font-size: 22px;
    margin-bottom: 45px; }
  .guidanceArea .guidanceArea_message {
    width: 90%;
    max-width: 445px;
    margin-left: auto;
    margin-right: auto;
    line-height: 2em;
    letter-spacing: .02em; }
  .guidanceArea .guidanceArea_dial_mail {
    top: -120px; } }
@media (max-width: 767px) and (max-width: 400px) {
  .guidanceArea .guidanceArea_dial_mail {
    top: -100px; } }
@media (max-width: 767px) {
  footer {
    padding-top: calc(100vw * 0.066);
    padding-bottom: 50px; }

  #footer_navi {
    width: 90%;
    margin: 0 auto; }

  #footer_logo {
    display: none; }

  #footer_navi #footer_navi_about, #footer_navi #footer_navi_contact {
    width: 100%;
    text-align: center; }
  #footer_navi .footer_navi_block {
    margin: 0;
    margin-bottom: 50px; }
  #footer_navi .footer_navi_title {
    text-align: center;
    width: 100%;
    font-size: calc(100vw * 0.044);
    letter-spacing: calc(100vw * 0.005);
    border-bottom: 1px solid rgba(229, 229, 229, 0.5);
    padding-bottom: calc(100vw * 0.02); }
  #footer_navi #footer_navi_about ul {
    list-style: none;
    width: 100%;
    text-align: center;
    margin: 0;
    padding: 0; }
    #footer_navi #footer_navi_about ul li {
      float: none;
      width: 100%; }
      #footer_navi #footer_navi_about ul li:nth-child(odd) {
        width: 100%; }

  #copyright {
    font-size: calc(100vw * 0.024);
    letter-spacing: calc(100vw * 0.002); } }
.font-bold{
  font-weight: bold;
}
.ttl1 {
  font-family: "FOT-筑紫Aオールド明朝 Pr6 L", "TsukuAOldMinPr6-L", serif;
  font-size: 41px;
  color: #212121; }
  @media screen and (max-width: 767px) {
      .title_area .keyword img{
          padding-bottom: 10vw !important;
      }
    .ttl1 {
      font-size: 5.8vw; } }