@charset "UTF-8";
/* SCSS Document */
/* Scss Document */
/**
 * html5doctor.com Reset Stylesheet v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/)
 * Richard Clark (http://richclarkdesign.com)
 * http://cssreset.com
 */
/* CSS Document */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

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

a {
  text-decoration: none;
  color: #000; }

a:hover {
  opacity: 0.6;
  text-decoration: none;
  color: #000; }

a:hover img {
  opacity: 1; }

body {
  line-height: 1;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

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

ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

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

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none; }

/* change colors to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help; }

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

/* change border color to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0; }

input, select {
  vertical-align: middle; }

strong, em {
  font-weight: normal;
  font-style: normal; }

sup {
  font-size: 10px; }

sub {
  font-size: 10px;
  vertical-align: baseline; }

/*===========================================

 clearfix

===========================================*/
/* For modern browsers */
.clearfix:after {
  content: "";
  clear: both;
  display: block; }

/*===========================================

#topcontrol

===========================================*/
#topcontrol {
  opacity: 0;
  transition: 1s;
  position: fixed;
  bottom: 10px;
  right: 10px;
  z-index: 1000;
  pointer-events: none; }

#topcontrol a {
  font-size: 30px;
  display: block;
  background-color: #aaa;
  border-radius: 5px;
  display: inline-block;
  padding: 0 5px 5px;
  pointer-events: auto;
  opacity: 1; }

#topcontrol a::before,
#topcontrol a::after {
  display: block;
  text-align: center;
  line-height: 1;
  color: #fff;
  font-size: 16px; }

#topcontrol a::before {
  font-family: "FontAwesome";
  content: "\f102";
  font-size: 20px; }

#topcontrol a::after {
  content: "TOP"; }

/*===========================================

.inner

===========================================*/
.inner {
  width: 92%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto; }

/*===========================================

.img

===========================================*/
.img {
  position: relative; }

.img small {
  font-size: 10px;
  line-height: 1;
  position: absolute;
  bottom: 0;
  right: 5px; }

.img small::before {
  content: "";
  display: inline-block;
  background-size: 100% 100%;
  line-height: 1; }

@media print, screen and (min-width: 768px) {
  .img small {
    font-size: 12px;
    bottom: 0;
    right: 5px; } }

/*===========================================

.caption

===========================================*/
.caption {
  margin-top: 20px; }

.caption small {
  display: block;
  font-family: "游ゴシック Bold","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  padding-left: 1em;
  text-indent: -1em;
  font-size: 10px; }

.caption small::before {
  content: "※"; }

@media print, screen and (min-width: 768px) {
  .caption small {
    font-size: 12px; } }

/*===========================================



===========================================*/
/*===========================================

ナビゲーションパターン

===========================================*/
a.open_btn {
  display: block;
  width: 50px;
  height: 50px;
  text-align: center;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999; }

@media screen and (max-width: 768px) {
  .ccm-toolbar-visible a.open_btn {
    top: 48px; } }

a.open_btn:hover {
  opacity: 1; }

a.open_btn span {
  display: inline-block;
  width: 70%;
  border-top: solid 3px #000;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }

a.open_btn span::before,
a.open_btn span::after {
  content: "";
  display: inline-block;
  width: 100%;
  border-top: solid 3px #000;
  position: absolute;
  left: 0;
  transition: 0.3s; }

a.open_btn span::before {
  top: -14px; }

a.open_btn span::after {
  top: 8px; }

a.open_btn.active {
  position: fixed; }

a.open_btn.active span {
  border-top: solid 3px transparent; }

a.open_btn.active span::before,
a.open_btn.active span::after {
  top: -3px;
  border-color: #fff; }

a.open_btn.active span::before {
  transform: rotate(-135deg); }

a.open_btn.active span::after {
  transform: rotate(135deg); }

/*============================
nav_lay01
============================*/
body {
  overflow-x: hidden; }

nav.nav_lay01 {
  position: fixed;
  top: 0;
  right: 0;
  width: 75%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 999;
  transform: translateX(100%);
  transition: 0.3s; }

nav.nav_lay01 ul {
  width: 80%;
  margin-top: 50px;
  margin-left: auto;
  margin-right: auto; }

nav.nav_lay01 ul li {
  border-bottom: solid 1px #fff; }

nav.nav_lay01 ul li:first-of-type {
  border-top: solid 1px #fff; }

nav.nav_lay01 ul li a {
  display: block;
  color: #fff;
  padding: 10px; }

nav.nav_lay01.active {
  transform: translateX(0); }

/*============================
nav_lay02
============================*/
nav.nav_lay02 {
  display: none;
  margin-left: -15px;
  margin-right: -15px; }

nav.nav_lay02 ul {
  display: flex;
  flex-wrap: wrap;
  border: solid #000;
  border-width: 1px 0 0 1px; }

nav.nav_lay02 ul li {
  flex-basis: 50%;
  border: solid #000;
  border-width: 0 1px 1px 0; }

nav.nav_lay02 ul li a {
  display: block;
  padding: 10px; }

@media print, screen and (min-width: 768px) {
  a.open_btn {
    display: none; }
  nav[class*="nav_lay"] {
    display: block; }
  nav[class*="nav_lay"] ul {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center; }
  nav[class*="nav_lay"] ul li {
    flex: 1; }
  nav[class*="nav_lay"] ul li a {
    text-align: center; }
  /*============================
nav_lay01
============================*/
  body {
    overflow: auto; }
  nav.nav_lay01 {
    position: static;
    transform: none;
    width: 100%;
    height: auto;
    background-color: transparent; }
  nav.nav_lay01 ul {
    width: 100%;
    margin: 0; }
  nav.nav_lay01 ul li {
    border-bottom: none; }
  nav.nav_lay01 ul li:first-of-type {
    border-top: none; }
  nav.nav_lay01 ul li a {
    color: #000; }
  /*============================
nav_lay02
============================*/
  nav.nav_lay02 ul {
    border: none; }
  nav.nav_lay02 ul li {
    border: none; } }

/*a[href="#"]{
	pointer-events: none;
	opacity: 0.5;
}*/
/*============================
サイト全体のfont指定
============================*/
body {
  font-size: 14px;
  line-height: 1.5;
  font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-feature-settings: "palt" 1; }

/*============================
レスポンシブ
============================*/
@media screen and (min-width: 768px) {
  .sp_only {
    display: none !important; } }

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

.pc_only {
  display: none; }
  @media screen and (min-width: 768px) {
    .pc_only {
      display: block !important; } }

.pc_only_inline {
  display: none; }
  @media screen and (min-width: 768px) {
    .pc_only_inline {
      display: inline-block; } }

/*============================
header
============================*/
header div.inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  height: 50px;
  align-items: center; }
  @media print, screen and (min-width: 768px) {
    header div.inner {
      height: 100px; } }
  header div.inner #title img {
    padding: 0 5px;
    max-width: 256px;
    width: 100%; }
  header div.inner div.h_nav div ul {
    text-align: right; }
    header div.inner div.h_nav div ul li {
      display: inline-block; }
  header div.inner div.h_nav div.top ul li {
    margin-left: 10px; }
    header div.inner div.h_nav div.top ul li:first-of-type {
      margin-left: 0; }
    header div.inner div.h_nav div.top ul li::before {
      content: "-";
      margin-right: 5px; }
    header div.inner div.h_nav div.top ul li a {
      font-size: 11px; }
  header div.inner div.h_nav div.bottom {
    margin-top: 15px; }
    header div.inner div.h_nav div.bottom ul li {
      margin-left: 30px; }
      header div.inner div.h_nav div.bottom ul li:first-of-type {
        margin-left: 0; }
      header div.inner div.h_nav div.bottom ul li::before {
        content: "";
        display: inline-block;
        width: 21px;
        height: 23px;
        margin-right: 5px;
        vertical-align: middle;
        background-repeat: no-repeat;
        background-position: center;
        background-size: 21px 23px; }
      header div.inner div.h_nav div.bottom ul li:nth-of-type(2)::before {
        background-image: url("../image/cmn/icon_request.svg"); }
      header div.inner div.h_nav div.bottom ul li:nth-of-type(1)::before {
        background-image: url("../image/cmn/icon_member.svg"); }
      header div.inner div.h_nav div.bottom ul li a {
        font-size: 13px;
        font-weight: bold; }

header nav.nav_lay01 {
  overflow-y: scroll; }
  header nav.nav_lay01 ul:last-of-type {
    padding-bottom: 60px; }
    header nav.nav_lay01 ul:last-of-type li {
      margin-top: 10px; }
      header nav.nav_lay01 ul:last-of-type li:first-of-type {
        margin-top: 0; }
      header nav.nav_lay01 ul:last-of-type li:nth-of-type(2) a::before {
        background-image: url("../image/cmn/icon_request.svg"); }
      header nav.nav_lay01 ul:last-of-type li:nth-of-type(1) a::before {
        background-image: url("../image/cmn/icon_member.svg"); }
      header nav.nav_lay01 ul:last-of-type li:nth-of-type(3) a::before {
        background-image: url("../image/cmn/icon_contact.svg"); }
      header nav.nav_lay01 ul:last-of-type li a {
        color: #000;
        background-color: #fff; }
        header nav.nav_lay01 ul:last-of-type li a::before {
          content: "";
          display: inline-block;
          width: 24px;
          height: 26.5px;
          margin-right: 15px;
          vertical-align: middle;
          border: none;
          background-repeat: no-repeat;
          background-size: 100%; }
  @media print, screen and (min-width: 768px) {
    header nav.nav_lay01 {
      flex-basis: 100%;
      background-color: #0E8ACA;
      padding: 10px 0;
      overflow-y: hidden; }
      header nav.nav_lay01 ul {
        width: 92%;
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto; }
        header nav.nav_lay01 ul li {
          border-left: solid 1px rgba(255, 255, 255, 0.5);
          transform: skew(-20deg); }
          header nav.nav_lay01 ul li:first-of-type {
            border-left: none; }
          header nav.nav_lay01 ul li a {
            color: #fff;
            padding: 0 5px;
            height: 30px;
            display: flex;
            justify-content: center;
            align-items: center;
            transform: skew(20deg); } }

/*============================
.bnr_area
============================*/
div.bnr_area ul {
  width: 92%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  padding-top: 15px;
  border-top: solid 1px #eee; }
  @media print, screen and (min-width: 768px) {
    div.bnr_area ul {
      padding-top: 50px; } }
  div.bnr_area ul li {
    display: inline-block;
    margin-bottom: 15px; }
    @media print, screen and (min-width: 768px) {
      div.bnr_area ul li {
        margin-bottom: 45px;
        margin-left: 50px; }
        div.bnr_area ul li:first-of-type {
          margin-left: 0; } }
    div.bnr_area ul li a {
      display: block; }
      div.bnr_area ul li a img {
        width: 100%; }
    div.bnr_area ul li:nth-of-type(1) a img {
      max-width: 260px; }
    div.bnr_area ul li:nth-of-type(2) a img {
      max-width: 190px; }
    div.bnr_area ul li:nth-of-type(3) a img {
      max-width: 343px; }

/*============================
footer
============================*/
footer {
  padding-bottom: 60px;
  width: 92%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  border-top: solid 1px #0E8ACA;
  padding-top: 25px; }
  footer div.f_nav {
    padding: 0 0 40px; }
    footer div.f_nav ul {
      display: inline-block;
      margin: 5px 0; }
      footer div.f_nav ul li {
        display: inline-block;
        margin-left: 10px; }
        footer div.f_nav ul li:first-of-type {
          margin-left: 0; }
        footer div.f_nav ul li a {
          font-size: 10px; }
          footer div.f_nav ul li a::before {
            content: "";
            display: inline-block;
            border-style: solid;
            border-width: 2px 3.5px;
            border-color: transparent;
            border-left-color: #0E8ACA;
            vertical-align: middle; }
      footer div.f_nav ul:nth-of-type(2) {
        margin-left: 20px; }
        footer div.f_nav ul:nth-of-type(2) li a::before {
          content: "";
          display: inline-block;
          width: 14px;
          height: 15.5px;
          margin-right: 2px;
          vertical-align: middle;
          border: none;
          background-repeat: no-repeat;
          background-size: 100%; }
        footer div.f_nav ul:nth-of-type(2) li:nth-of-type(1) a::before {
          background-image: url("../image/cmn/icon_request.svg"); }
        footer div.f_nav ul:nth-of-type(2) li:nth-of-type(2) a::before {
          background-image: url("../image/cmn/icon_member.svg"); }
        footer div.f_nav ul:nth-of-type(2) li:nth-of-type(3) a::before {
          background-image: url("../image/cmn/icon_contact.svg"); }
  footer p.copyright {
    font-size: 10px; }

/*============================
.breadcrumb
============================*/
div.breadCrumb {
  margin: 10px 0 15px 0; }
  @media print, screen and (min-width: 768px) {
    div.breadCrumb {
      margin: 15px 0; } }
  div.breadCrumb ul {
    width: 92%;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-wrap: nowrap; }
    div.breadCrumb ul li {
      border-left: solid 1px #B2B2B2;
      transform: skew(-20deg); }
      div.breadCrumb ul li:first-of-type {
        border-left: none; }
      div.breadCrumb ul li a, div.breadCrumb ul li span {
        padding: 0 10px;
        height: 11px;
        display: flex;
        justify-content: center;
        align-items: center;
        transform: skew(20deg);
        font-size: 11px; }
      div.breadCrumb ul li a {
        color: #0E89C9; }
      div.breadCrumb ul li:first-of-type a {
        padding-left: 0; }

/*============================
.main_ttl
============================*/
div.main_ttl {
  background-color: #F6F1CC;
  background-image: url("../image/cmn/ttl_bg.png");
  background-repeat: no-repeat;
  background-position: right -10px bottom -15px;
  background-size: auto 120%;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 130px; }
  @media print, screen and (min-width: 768px) {
    div.main_ttl {
      height: 180px;
      background-position: right 10% bottom -15px; } }
  div.main_ttl h1 {
    font-size: 30px;
    text-align: center;
    font-weight: bold;
    color: #0E89C9;
    letter-spacing: 3px; }
    div.main_ttl h1 small {
      display: block;
      font-size: 14px;
      font-weight: bold;
      text-align: center;
      color: #666666;
      margin-top: .5em;
      text-transform: uppercase; }

/*============================
.page_link
============================*/
div.page_link {
  margin: 45px 0; }
  div.page_link ul {
    width: 92%;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    max-width: 577px;
    display: flex;
    justify-content: space-between; }
    div.page_link ul li {
      flex-basis: 49%; }
      div.page_link ul li a {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 63px;
        font-size: 18px;
        font-weight: bold;
        color: #0E8ACA;
        background-color: rgba(14, 138, 202, 0.13);
        position: relative; }
        div.page_link ul li a::after {
          content: "";
          display: block;
          border-style: solid;
          border-width: 7px;
          border-color: transparent;
          border-bottom-color: #0E8ACA;
          border-right-color: #0E8ACA;
          position: absolute;
          bottom: 5px;
          right: 5px; }
      div.page_link ul li.active a {
        color: #fff;
        background-color: #0e8aca;
        pointer-events: none; }
        div.page_link ul li.active a::after {
          border-bottom-color: #fff;
          border-right-color: #fff; }

/*============================
.btn_area
============================*/
div.btn_area {
  width: 92%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  max-width: 670px;
  margin-top: 60px;
  margin-bottom: 30px; }
  @media print, screen and (min-width: 768px) {
    div.btn_area {
      margin-top: 120px; } }
  div.btn_area ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    @media print, screen and (min-width: 768px) {
      div.btn_area ul {
        flex-wrap: nowrap; } }
    div.btn_area ul li {
      flex-basis: 100%; }
      @media print, screen and (min-width: 768px) {
        div.btn_area ul li {
          flex-basis: 48%; } }
      div.btn_area ul li:first-of-type {
        flex-basis: 100%;
        margin-bottom: 10px; }
        @media print, screen and (min-width: 768px) {
          div.btn_area ul li:first-of-type {
            flex-basis: 48%;
            margin-bottom: 0; } }
        div.btn_area ul li:first-of-type a span::after {
          content: "ログイン";
          display: block;
          font-size: 10px;
          font-weight: normal;
          color: #fff;
          text-align: center;
          background-color: #0E8ACA;
          border-radius: 10px; }
      div.btn_area ul li a {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 75px;
        background-color: rgba(14, 138, 202, 0.13);
        position: relative; }
        div.btn_area ul li a::before {
          content: "";
          display: inline-block;
          width: 25px;
          height: 25px;
          margin-right: 5px;
          vertical-align: middle;
          background-repeat: no-repeat;
          background-position: center;
          background-size: contain; }
        div.btn_area ul li a::after {
          content: "";
          display: block;
          border-style: solid;
          border-width: 7px;
          border-color: transparent;
          border-bottom-color: #0E8ACA;
          border-right-color: #0E8ACA;
          position: absolute;
          bottom: 5px;
          right: 5px; }
        div.btn_area ul li a span {
          font-size: 18px;
          font-weight: bold;
          color: #0E8ACA; }
      div.btn_area ul li:nth-of-type(2) a::before {
        background-image: url("../image/cmn/icon_request.svg"); }
      div.btn_area ul li:nth-of-type(1) a::before {
        background-image: url("../image/cmn/icon_member.svg");
        width: 40px;
        height: 45px; }
      div.btn_area ul li:nth-of-type(3) a::before {
        background-image: url("../image/cmn/icon_contact.svg"); }

.file_link {
  margin-top: .5em; }
  .file_link a, .file_link a:link, .file_link a:visited, .file_link a:hover, .file_link a:active {
    color: #0f89cb;
    text-decoration: underline; }
  .file_link a:hover, .file_link a:active {
    opacity: .6; }
  .file_link::after {
    font-family: 'Material Icons';
    content: '\e89e';
    vertical-align: middle;
    margin-left: .5em; }

body:not(.ccm-toolbar-visible) #ccm-account-menu-container #ccm-account-menu {
  position: fixed; }
  body:not(.ccm-toolbar-visible) #ccm-account-menu-container #ccm-account-menu i.fa.fa-user {
    display: none; }
  body:not(.ccm-toolbar-visible) #ccm-account-menu-container #ccm-account-menu > a {
    padding: 4px 10px;
    pointer-events: none;
    font-size: 0;
    color: #fff;
    background-color: #04557D;
    border: none; }
    body:not(.ccm-toolbar-visible) #ccm-account-menu-container #ccm-account-menu > a::before {
      font-size: 14px;
      content: 'ログイン中'; }
  body:not(.ccm-toolbar-visible) #ccm-account-menu-container #ccm-account-menu > button.dropdown-toggle {
    padding: 4px 10px;
    border: none;
    background-color: #eee;
    font-size: 14px; }
    body:not(.ccm-toolbar-visible) #ccm-account-menu-container #ccm-account-menu > button.dropdown-toggle span {
      font-size: 14px; }
  body:not(.ccm-toolbar-visible) #ccm-account-menu-container #ccm-account-menu > ul.dropdown-menu li:not(:nth-child(8)) {
    display: none; }

/*# sourceMappingURL=../css/common.map */