@charset "UTF-8";
/* ============================================================================
INFORMATION
	release		:2018/01/22
	update		:

STYLE INDEX
	01		:foundation
		01-1	:variable
		01-2	:mixin
		01-3	:reset
		01-4	:base
		01-5	:vender
	02		:layout
	03		:object
		03-1	:component
		03-2	:project
		03-3	:utility
	04		:js
	05		:is
	06		:overwrite
============================================================================ */
/* ============================================================================
	01		:foundation
============================================================================ */
/*	01-1	:variable
---------------------------------------------------------------------------- */
/*	01-2	:mixin
---------------------------------------------------------------------------- */
/*	01-3	:reset
---------------------------------------------------------------------------- */
/*	01-4	:base
---------------------------------------------------------------------------- */
html {
  box-sizing: border-box;
  font-size: 62.5%;
}

body {
  position: relative;
  margin: 0;
  font-size: 16px;
  font-size: 1.6rem;
  font-family: Arial, Verdana, "Lucida Grande", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "ヒラギノ角ゴ Pro W3", sans-serif;
}

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

a {
  color: #09c;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
a:link, a:visited, a:hover, a:active {
  color: #09c;
}

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

.clearfix {
  *zoom: 1;
}

.clearfix:after {
  display: table;
  clear: both;
  content: '';
}

ul {
  margin: 0;
}

h1, h2, h3, h4, h5 {
  padding: 0;
  margin: 0;
}

/*	01-5	:vender
---------------------------------------------------------------------------- */
/* ============================================================================
	02		:layout
============================================================================ */
/* ============================================================================
	03		:object
============================================================================ */
/*	03-1	:component
---------------------------------------------------------------------------- */
.c-wrapper {
  max-width: 992px;
  margin: 0 auto;
  padding-bottom: 30px;
  box-shadow: 0 0 10px rgba(156, 156, 156, 0.5);
}

@media (min-width: 768px) {
  .c-inner {
    margin: 0 30px 50px;
  }
}
@media (max-width: 767px) {
  .c-inner {
    margin: 0 20px 50px;
  }
}

.c-anchor {
  margin-top: -50px !important;
  padding-top: 50px !important;
}

.c-module__title {
  color: #31928d;
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 18px;
  border-bottom: 1px dotted #31928d;
  padding-bottom: 0.5em;
  margin-bottom: 2em;
}
.c-module__title:before {
  position: relative;
  top: 3px;
  display: inline-block;
  content: "";
  width: 5px;
  height: 18px;
  margin-right: 0.5em;
  background: #31928d;
}
.c-module__list {
  margin-bottom: 1em;
}
.c-module__list li {
  margin-bottom: 1em;
}
.c-module__list--num {
  list-style-type: decimal;
  padding-left: 1.5em;
}
.c-module__list--dot {
  list-style-type: disc;
  padding-left: 1.5em;
}
.c-module__list--kome li:before {
  content: "※";
  margin-right: 0.25em;
}
.c-module__image {
  text-align: center;
  margin-bottom: 2em;
}
.c-module p {
  margin-bottom: 2em;
}

/*	03-2	:project
---------------------------------------------------------------------------- */
.p-keyvisual {
  margin: 10px 0 3em;
  margin-bottom: 5em;
}

.p-howto__list {
  -js-display: flex;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  .p-howto__list__item {
    width: 23%;
    margin: 0 1% 2em;
  }
}
@media (max-width: 767px) {
  .p-howto__list__item {
    width: 48%;
    margin: 0 1% 2em;
  }
}
.p-howto__list__image {
  margin-bottom: 1em;
}
.p-howto__list__image img {
  width: 100%;
}
.p-howto__list__text {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.25;
}

/*	03-3	:utility
---------------------------------------------------------------------------- */
.u-cf {
  *zoom: 1;
}

.u-cf:after {
  display: table;
  clear: both;
  content: '';
}

.u-fz--xs {
  font-size: 0.75em;
}

.u-fz--sm {
  font-size: 0.875em;
}

.u-fz--md {
  font-size: 1.0em;
}

.u-fz--lg {
  font-size: 1.25em;
}

.u-fz--xl {
  font-size: 1.5em;
}

.u-fz--10 {
  font-size: 10px;
}

.u-fz--11 {
  font-size: 11px;
}

.u-fz--12 {
  font-size: 12px;
}

.u-fz--13 {
  font-size: 13px;
}

.u-fz--14 {
  font-size: 14px;
}

.u-fz--15 {
  font-size: 15px;
}

.u-fz--16 {
  font-size: 16px;
}

.u-fz--17 {
  font-size: 17px;
}

.u-fz--18 {
  font-size: 18px;
}

.u-fz--19 {
  font-size: 19px;
}

.u-fz--20 {
  font-size: 20px;
}

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

.u-fw--b {
  font-weight: bold;
}

.u-fw--100 {
  font-weight: 100;
}

.u-fw--200 {
  font-weight: 200;
}

.u-fw--300 {
  font-weight: 300;
}

.u-fw--400 {
  font-weight: 400;
}

.u-fw--500 {
  font-weight: 500;
}

.u-fw--600 {
  font-weight: 600;
}

.u-fw--700 {
  font-weight: 700;
}

.u-fw--800 {
  font-weight: 800;
}

.u-fw--900 {
  font-weight: 900;
}

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

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

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

.u-td--n {
  text-decoration: none;
}

.u-td--u {
  text-decoration: underline;
}

.u-td--o {
  text-decoration: overline;
}

.u-ti--0 {
  text-indent: 0;
}

.u-ti--9999 {
  text-indent: -9999px;
}

.u-fl--n {
  float: none;
}

.u-fl--r {
  float: right;
}

.u-fl--l {
  float: left;
}

.u-cl--n {
  clear: none;
}

.u-cl--r {
  clear: right;
}

.u-cl--l {
  clear: left;
}

.u-cl--b {
  clear: both;
}

.u-pos--s {
  position: static;
}

.u-pos--r {
  position: relative;
}

.u-pos--a {
  position: absolute;
}

.u-pos--f {
  position: fixed;
}

.u-t--a {
  top: auto;
}

.u-t--0 {
  top: 0;
}

.u-r--a {
  right: auto;
}

.u-r--0 {
  right: 0;
}

.u-b--a {
  bottom: auto;
}

.u-b--0 {
  bottom: 0;
}

.u-l--a {
  left: auto;
}

.u-l--0 {
  left: 0;
}

.u-z--a {
  z-index: auto;
}

.u-z--0 {
  z-index: 0;
}

.u-z--1 {
  z-index: 1;
}

.u-z--2 {
  z-index: 2;
}

.u-z--3 {
  z-index: 3;
}

.u-z--4 {
  z-index: 4;
}

.u-z--5 {
  z-index: 5;
}

.u-z--6 {
  z-index: 6;
}

.u-z--999 {
  z-index: 999;
}

.u-va--t {
  vertical-align: top;
}

.u-va--m {
  vertical-align: middle;
}

.u-va--b {
  vertical-align: bottom;
}

.u-d--tb {
  display: table;
}

.u-d--tbc {
  display: table-cell;
}

.u-d--b {
  display: block;
}

.u-d--ib {
  display: inline-block;
}

.u-d--n {
  display: none;
}

.u-mt--0 {
  margin-top: 0;
}

.u-mt--auto {
  margin-top: auto;
}

.u-mt--sm {
  margin-top: 0.5rem;
}

.u-mt--md {
  margin-top: 1.0rem;
}

.u-mt--lg {
  margin-top: 1.5rem;
}

.u-mt--xl {
  margin-top: 3.0rem;
}

.u-mr--0 {
  margin-right: 0;
}

.u-mr--auto {
  margin-right: auto;
}

.u-mr--sm {
  margin-right: 0.5rem;
}

.u-mr--md {
  margin-right: 1.0rem;
}

.u-mr--lg {
  margin-right: 1.5rem;
}

.u-mr--xl {
  margin-right: 3.0rem;
}

.u-mb--0 {
  margin-bottom: 0;
}

.u-mb--auto {
  margin-bottom: auto;
}

.u-mb--sm {
  margin-bottom: 0.5rem;
}

.u-mb--md {
  margin-bottom: 1.0rem;
}

.u-mb--lg {
  margin-bottom: 1.5rem;
}

.u-mb--xl {
  margin-bottom: 3.0rem;
}

.u-ml--0 {
  margin-left: 0;
}

.u-ml--auto {
  margin-left: auto;
}

.u-ml--sm {
  margin-left: 0.5rem;
}

.u-ml--md {
  margin-left: 1.0rem;
}

.u-ml--lg {
  margin-left: 1.5rem;
}

.u-ml--xl {
  margin-left: 3.0rem;
}

.u-pt--0 {
  padding-top: 0;
}

.u-pt--auto {
  padding-top: auto;
}

.u-pt--sm {
  padding-top: 0.5rem;
}

.u-pt--md {
  padding-top: 1.0rem;
}

.u-pt--lg {
  padding-top: 1.5rem;
}

.u-pt--xl {
  padding-top: 3.0rem;
}

.u-pr--0 {
  padding-right: 0;
}

.u-pr--auto {
  padding-right: auto;
}

.u-pr--sm {
  padding-right: 0.5rem;
}

.u-pr--md {
  padding-right: 1.0rem;
}

.u-pr--lg {
  padding-right: 1.5rem;
}

.u-pr--xl {
  padding-right: 3.0rem;
}

.u-pb--0 {
  padding-bottom: 0;
}

.u-pb--auto {
  padding-bottom: auto;
}

.u-pb--sm {
  padding-bottom: 0.5rem;
}

.u-pb--md {
  padding-bottom: 1.0rem;
}

.u-pb--lg {
  padding-bottom: 1.5rem;
}

.u-pb--xl {
  padding-bottom: 3.0rem;
}

.u-pl--0 {
  padding-left: 0;
}

.u-pl--auto {
  padding-left: auto;
}

.u-pl--sm {
  padding-left: 0.5rem;
}

.u-pl--md {
  padding-left: 1.0rem;
}

.u-pl--lg {
  padding-left: 1.5rem;
}

.u-pl--xl {
  padding-left: 3.0rem;
}

.u-op--0 {
  opacity: 0;
}

.u-op--10 {
  opacity: 0.1;
}

.u-op--20 {
  opacity: 0.2;
}

.u-op--30 {
  opacity: 0.3;
}

.u-op--40 {
  opacity: 0.4;
}

.u-op--50 {
  opacity: 0.5;
}

.u-op--60 {
  opacity: 0.6;
}

.u-op--70 {
  opacity: 0.7;
}

.u-op--80 {
  opacity: 0.8;
}

.u-op--90 {
  opacity: 0.9;
}

.u-op--100 {
  opacity: 1.0;
}

/* ============================================================================
	04		:js
============================================================================ */
/* ============================================================================
	05		:is
============================================================================ */
@media (min-width: 1300px) {
  .is-hidden--xl {
    display: none !important;
  }
}
@media (min-width: 992px) {
  .is-hidden--l {
    display: none !important;
  }
}
@media (min-width: 768px) {
  .is-hidden--ml {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .is-hidden--m {
    display: none !important;
  }
}
@media (max-width: 991px) {
  .is-hidden--sm {
    display: none !important;
  }
}
@media (max-width: 767px) {
  .is-hidden--s {
    display: none !important;
  }
}
@media (max-width: 568px) {
  .is-hidden--xs {
    display: none !important;
  }
}

@media (min-width: 1300px) {
  .is-visible--xl {
    display: block !important;
  }
}
@media (min-width: 992px) {
  .is-visible--l {
    display: block !important;
  }
}
@media (min-width: 768px) {
  .is-visible--ml {
    display: block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .is-visible--m {
    display: block !important;
  }
}
@media (max-width: 991px) {
  .is-visible--sm {
    display: block !important;
  }
}
@media (max-width: 767px) {
  .is-visible--s {
    display: block !important;
  }
}
@media (max-width: 568px) {
  .is-visible--xs {
    display: block !important;
  }
}

/* ============================================================================
	06		:overwrite
============================================================================ */
.head.pcContents {
  height: auto;
  margin-bottom: 30px;
  padding: 10px 0;
  border-bottom: 1px solid #ccc;
}

.move-page-top {
  color: #fff !important;
}

.mainContainer a {
  text-decoration: underline;
}
