@charset "UTF-8";
/*----------------------------------------------
	Base
---------------------------------------------*/
/*
normalize.cssの読み込みと、
htmlやbody、a要素など、タグに直接設定するものを記述します。
Things that will be set directly 
and tags such as HTML, body and a element will be written. 

このカテゴリーのみ、接頭辞から始まりません。
Only this category will not begin with the prefix.

フォントサイズはremで指定します。
Font size will be set as "rem".
*/
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  text-size-adjust: 100%; }

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
  margin: 0; }

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */ }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent; }

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */ }

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder; }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%; }

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
  border-style: none; }

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */ }

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible; }

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none; }

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em; }

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */ }

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline; }

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto; }

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */ }

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */ }

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block; }

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item; }

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
  display: none; }

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none; }

/*----------------------------------------------
	html
---------------------------------------------*/
html {
  font-size: 62.5%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

/*----------------------------------------------
	Global
---------------------------------------------*/
*,
*:before,
*:after {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit; }

/*----------------------------------------------
	body
---------------------------------------------*/
body {
  font-size: 16px;
  font-size: 1.6rem;
  /*↑ remをサポートしていないブラウザ向けにpxでも指定　Set as "px" for browsers that don't support "rem"*/
  font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  color: #333;
  min-width: 960px; }

@media only screen and (max-width: 720px) {
  body {
    font-size: 14px;
    font-size: 1.4rem;
    min-width: 320px; } }
/*----------------------------------------------
	a
---------------------------------------------*/
a {
  color: #F79DA5; }

a:visited {
  color: #FDF8F9; }

a:hover,
a:active,
a:focus {
  text-decoration: none; }

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

/*----------------------------------------------
	main
---------------------------------------------*/
main {
  display: block; }

/*----------------------------------------------
	p
---------------------------------------------*/
p {
  line-height: 2; }

@media only screen and (max-width: 720px) {
  p {
    line-height: 1.7;
    text-align: justify; } }
/*----------------------------------------------
	img
---------------------------------------------*/
img {
  vertical-align: top; }

/*----------------------------------------------
	strong
---------------------------------------------*/
strong {
  color: #F990A8;
  font-weight: normal; }

/*----------------------------------------------
	Layout
---------------------------------------------*/
/*
Ver 2.0 (2018/05/11)
サイト上の構成の大枠としてページ内に1度しか出てこないものと、
グリッドレイアウトについてを記述します。
We will write about thing the only comes out once on the page 
as a frame and grid(column) layout.

接頭辞はLayoutの頭文字を取って【l_】とします。
Prefix will take the "Layout" first letter and use it as "l_". 

ここで指定するのは以下の様なものと予想されます。
You might use the following.
.l_wrap/.l_header/.l_nav/
.l_container/.l_main/.l_article/.l_section/
.l_aside/.l_footer

モディファイヤを使用する場合は接頭辞【has_】をつけ、各レイアウトの下に記述します。
When using modifier put the prefix "has_" 
and write it under each layout.

フォントサイズはremで指定します。
"rem" will be used for font-size.
*/
/*----------------------------------------------
	.l_wrap
---------------------------------------------*/
.l_wrap {
  width: 100%;
  max-width: 960px;
  margin: 0 auto; }

.l_wrap.has_fluid {
  max-width: 100%; }

/*----------------------------------------------
	.l_jumbotron
---------------------------------------------*/
.l_jumbotron {
  position: relative; }
  .l_jumbotron .jumbotron-content {
    width: 100%; }
  .l_jumbotron .jumbotron-content img {
    width: inherit; }

@media only screen and (max-width: 720px) {
  .l_jumbotron .jumbotron-content {
    padding: 60px 0 0; }
  .l_jumbotron .jumbotron-content img {
    height: 180px;
    object-fit: cover; } }
/*----------------------------------------------
	.l_header
---------------------------------------------*/
.l_header {
  position: relative;
  width: 100%;
  min-width: 960px;
  background-color: #FDF8F9;
  z-index: 9; }

.l_header.has_top {
  position: absolute;
  top: 0;
  background-color: transparent; }

@media only screen and (max-width: 720px) {
  .l_header {
    min-width: 320px; } }
/*----------------------------------------------
	.l_nav
---------------------------------------------*/
.l_nav {
  background-color: #F79DA5; }

@media only screen and (max-width: 720px) {
  .l_nav {
    position: absolute;
    top: 0;
    width: 100%;
    max-height: 0;
    overflow: hidden;
    transition: all 160ms ease-in-out; }

  .l_nav.show {
    max-height: 100vh;
    padding: 60px 0 0;
    z-index: 8; } }
/*----------------------------------------------
	.l_container
---------------------------------------------*/
.l_container {
  padding-bottom: 40px; }

.l_container.has_bg01 {
  background-color: #FDF8F9; }

#top .l_container {
  padding-bottom: 0; }

/*----------------------------------------------
	.l_main
---------------------------------------------*/
.l_main {
  display: block;
  box-sizing: border-box; }

@media only screen and (max-width: 720px) {
  .l_main {
    padding: 0 10px; } }
/*----------------------------------------------
	.l_article
---------------------------------------------*/
.l_article {
  margin: 80px 0 0; }
  .l_article.has_system01 {
    background-image: url("../images/bg_system-article01.jpg");
    background-repeat: no-repeat;
    background-position: right top; }
  .l_article.has_system02 {
    background-image: url("../images/bg_system-article02.jpg");
    background-repeat: no-repeat;
    background-position: right top; }

.l_article:first-child {
  margin-top: 0; }

@media only screen and (max-width: 720px) {
  .l_article {
    margin: 40px 0 0; }
    .l_article.has_system01, .l_article.has_system02 {
      background-image: none !important; } }
/*----------------------------------------------
	.l_section
---------------------------------------------*/
.l_section {
  margin-top: 32px; }

.l_section:first-child {
  margin-top: 0; }

/*----------------------------------------------
	.l_inner-main
---------------------------------------------*/
.l_inner-main {
  padding: 45px 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center; }
  .l_inner-main.has_outline {
    background-image: url(../images/bg_outline.jpg); }
  .l_inner-main.has_staff {
    background-image: url(../images/bg_staff.jpg); }
  .l_inner-main.has_work {
    background-image: url(../images/bg_work.jpg); }
  .l_inner-main.has_system {
    background-image: url(../images/bg_system.jpg); }
  .l_inner-main.has_recruit {
    background-image: url(../images/bg_recruit.jpg); }

@media only screen and (max-width: 720px) {
  .l_inner-main {
    padding: 10px; }
    .l_inner-main h1 {
      text-align: center;
      text-shadow: 2px 2px 4px rgba(255, 255, 255, 0.9); } }
/*----------------------------------------------
	.l_sub-nav
---------------------------------------------*/
.l_sub-nav {
  background-color: #FAE6E9; }

/*----------------------------------------------
	.l_footer
---------------------------------------------*/
.l_footer {
  position: relative; }
  .l_footer .l_footer-top {
    padding: 40px 0;
    background-color: #F9E5E8; }
  .l_footer .l_footer-middle {
    padding: 20px 0;
    background-color: #FFFFFB; }
  .l_footer .l_footer-bottom {
    padding: 15px 0;
    background-color: #F79DA5; }

@media only screen and (max-width: 720px) {
  .l_footer .l_footer-top {
    padding: 40px 10px; }
  .l_footer .l_footer-middle {
    padding: 20px 10px; } }
/*----------------------------------------------
	.l_layer-outside
---------------------------------------------*/
.l_layer-outside {
  padding: 80px 100px;
  background-color: #FFF;
  border-radius: 8px; }

@media only screen and (max-width: 720px) {
  .l_layer-outside {
    padding: 20px 10px; } }
/*----------------------------------------------
	.l_profile-layout
---------------------------------------------*/
.l_profile-layout {
  display: flex;
  padding: 0 0 40px; }
  .l_profile-layout .profile-entry {
    width: calc(100% - 250px);
    margin-right: 50px; }
  .l_profile-layout .image-entry {
    align-self: flex-end; }

@media only screen and (max-width: 720px) {
  .l_profile-layout {
    flex-wrap: wrap; }
    .l_profile-layout .profile-entry {
      width: 100%;
      margin-right: 0;
      margin-bottom: 20px; }
    .l_profile-layout .image-entry {
      align-self: flex-start;
      margin: auto; } }
/*----------------------------------------------
	.l_col-img-txt-layout
---------------------------------------------*/
.l_col-img-txt-layout {
  display: flex;
  margin: 0 -20px; }
  .l_col-img-txt-layout .image-entry {
    margin: 0 20px; }
  .l_col-img-txt-layout .text-entry {
    margin: 0 20px; }
  .l_col-img-txt-layout .image-entry img {
    max-width: 100%; }

@media only screen and (max-width: 720px) {
  .l_col-img-txt-layout {
    flex-wrap: wrap;
    margin: 0; }
    .l_col-img-txt-layout .image-entry {
      margin: auto; }
    .l_col-img-txt-layout .text-entry {
      padding: 10px;
      margin: 0; } }
/*----------------------------------------------
	.l_image-cluster
---------------------------------------------*/
.l_image-cluster {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 -20px; }
  .l_image-cluster > div {
    margin: 0 20px; }
  .l_image-cluster > div > img {
    margin: auto; }
  .l_image-cluster span {
    display: block;
    font-size: 1.4rem;
    text-align: right;
    margin: 10px 0 0; }
  .l_image-cluster img {
    display: block;
    max-width: 100%;
    margin: 0 20px;
    /* if only image */ }

@media only screen and (max-width: 720px) {
  .l_image-cluster > div {
    margin-bottom: 10px; } }
/*----------------------------------------------
	.l_tile-cluster
---------------------------------------------*/
.l_tile-cluster {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 -20px -80px; }
  .l_tile-cluster .tile-content {
    position: relative;
    width: calc(50% - 40px);
    margin: 0 20px 80px;
    padding-bottom: 80px; }
  .l_tile-cluster .image-entry {
    display: block;
    max-width: 100%; }
  .l_tile-cluster .text-entry {
    margin: 15px 0 0;
    text-align: justify; }

@media only screen and (max-width: 720px) {
  .l_tile-cluster .tile-content {
    width: 100%; } }
/*----------------------------------------------
	.l_grid
---------------------------------------------*/
/*
グリッドの使い方の説明
How to use grid

グリッドはサイト上の構成の大枠としては使用せず、コンテンツエリア内で使用してください。
Do not use the grid as the frame but, use it inside the contents area.

HTMLは以下の形が基本形です。
The following will be the base for HTML.
----------------------------------------------
<div class="l_grid">
  <div class="l_row">
    <div class="l_col has_pc00 has_sp00">
      コンテンツが入る
    </div>
  </div>
</div>
----------------------------------------------

00部分はコンテンツ幅を12分割した値が入ります。
In the "00" part will have the values 1 to 12.
The values are from dividing the content width into 12.

以下のclassをl_columnに追加する事で、コラムの分割数をPC/SPそれぞれに設定する事ができます。
By adding the following class into "l_column",
you can set the column's number of partitions on the PC and SP.

下記はPCの場合の例です。
Example for PC
has_pc01 : 12分割 12 partition
has_pc02 : 6分割
has_pc03 : 4分割
has_pc04 : 3分割
has_pc05 : 5/12分割
has_pc06 : 2分割
has_pc07 : 7/12分割
has_pc08 : 2/3分割
has_pc09 : 3/4分割
has_pc10 : 5/6分割
has_pc11 : 11/12分割
has_pc12 : 1分割
*/
/* .l_grid unit */
.l_grid {
  overflow: hidden; }

.l_row {
  display: flex;
  flex-wrap: wrap; }

.l_row.has_border-bottom {
  border-bottom: 1px solid #595757; }

.l_row.has_padding10 {
  margin: -10px -5px 0; }

.l_row.has_padding20 {
  margin: -20px -10px 0; }

.l_row.has_padding30 {
  margin: -30px -15px 0; }

.l_row.has_padding40 {
  margin: -40px -20px 0; }

.l_row.has_padding50 {
  margin: -50px -25px 0; }

.l_row.has_padding60 {
  margin: -60px -30px 0; }

.l_row.has_padding10 .l_col {
  padding: 10px 5px 0; }

.l_row.has_padding20 .l_col {
  padding: 20px 10px 0; }

.l_row.has_padding30 .l_col {
  padding: 30px 15px 0; }

.l_row.has_padding40 .l_col {
  padding: 40px 20px 0; }

.l_row.has_padding50 .l_col {
  padding: 50px 25px 0; }

.l_row.has_padding60 .l_col {
  padding: 60px 30px 0; }

.l_col {
  box-sizing: border-box;
  position: relative;
  width: 100%; }

/*.l_col img { width: 100%; }*/
.l_col.has_border-left {
  border-left: 1px solid #595757; }

.l_col.has_pc01 {
  width: 8.33%; }

.l_col.has_pc02 {
  width: 16.66%; }

.l_col.has_pc03 {
  width: 25%; }

.l_col.has_pc04 {
  width: 33.32%; }

.l_col.has_pc05 {
  width: 41.65%; }

.l_col.has_pc06 {
  width: 50%; }

.l_col.has_pc07 {
  width: 58.33%; }

.l_col.has_pc08 {
  width: 66.66%; }

.l_col.has_pc09 {
  width: 74.99%; }

.l_col.has_pc10 {
  width: 83.32%; }

.l_col.has_pc11 {
  width: 91.65%; }

.l_col.has_pc12 {
  width: 100%; }

@media screen and (max-width: 720px) {
  .l_col.has_sp01 {
    width: 8.33%; }

  .l_col.has_sp02 {
    width: 16.66%; }

  .l_col.has_sp03 {
    width: 25%; }

  .l_col.has_sp04 {
    width: 33.32%; }

  .l_col.has_sp05 {
    width: 41.65%; }

  .l_col.has_sp06 {
    width: 50%; }

  .l_col.has_sp07 {
    width: 58.33%; }

  .l_col.has_sp08 {
    width: 66.66%; }

  .l_col.has_sp09 {
    width: 74.99%; }

  .l_col.has_sp10 {
    width: 83.32%; }

  .l_col.has_sp11 {
    width: 91.65%; }

  .l_col.has_sp12 {
    width: 100%; } }
/*----------------------------------------------
	Component
---------------------------------------------*/
/*
再利用可能な全てのオブジェクトを記述します。
All objects that are reusable will be written.

接頭辞はComponentの頭文字を取って【c_】とします。
Prefix will take the "Component" first letter and use it as "c_". 

ここで指定するのは以下の様なものと予想されます。
You might use the following.
.c_btn/.c_breadclumb/.c_hero/.c_serch/.c_dropdown/
.c_card/.c_feature/.c_overlay/.c_form/.c_thumbnail/.c_box

モディファイヤを使用する場合は接頭辞【is_】をつけ、各コンポーネントの下に記述します。
When using modifier put the prefix "is_" 
and write it under each component.

フォントサイズはremで指定します。
"rem" will be used for font-size.

//sample
.c_btn {
	display: inline-block;
	padding: 15px 20px;
	border-radius: 5px;
	text-decoration: none;
}
.c_btn:hover { opacity: 0.8; }
.c_btn.is_btn_disable { cursor: inherit; }
.c_btn.is_btn_blue{
	color: rgb(255, 255, 255);
	background: rgb(1, 153, 224) none repeat scroll 0% 0%;
}
*/
/*----------------------------------------------
	.c_header
---------------------------------------------*/
.c_header {
  display: flex;
  align-items: center;
  padding: 10px 30px;
  height: 100px; }

.c_header-branding {
  display: flex;
  align-items: center;
  height: inherit;
  margin: 0;
  color: #F79DA5;
  font-size: 2rem;
  line-height: 1; }
  .c_header-branding a {
    display: block;
    height: calc(100% - 20px);
    color: inherit;
    font-size: inherit;
    line-height: inherit;
    text-decoration: none; }
  .c_header-branding img {
    display: inherit;
    max-width: 100%;
    max-height: 100%; }

.c_header-nav {
  display: flex;
  align-items: center;
  margin-left: auto;
  list-style-type: none;
  font-weight: bold; }

.c_header-nav-item {
  margin-left: 50px;
  color: #000 !important;
  text-decoration: none; }
  .c_header-nav-item:hover {
    opacity: 0.6; }

@media only screen and (max-width: 720px) {
  .c_header {
    height: 60px;
    padding: 5px 10px;
    background-color: #FFF; }

  .c_header-branding a {
    height: calc(100% - 10px); } }
/*----------------------------------------------
	.c_main-nav
---------------------------------------------*/
.c_main-nav {
  display: flex;
  margin: 0;
  padding: 0;
  list-style-type: none; }

.c_main-nav-item {
  width: 20%;
  border-left: 1px solid #FFE7EC;
  text-align: center; }

.c_main-nav-item:first-child {
  border-left: none; }

.c_main-nav-item a {
  display: block;
  padding: 20px;
  color: #FFF;
  font-weight: bold;
  text-decoration: none; }

.c_main-nav-item a:hover {
  background-color: #f5858f; }

.c_main-nav-icon {
  display: block;
  width: 40px;
  height: 40px;
  margin: 0 auto 5px;
  background-position: center center;
  background-repeat: no-repeat; }

.c_main-nav-icon.is_outline {
  background-image: url(../images/icon_outline.png); }

.c_main-nav-icon.is_staff {
  background-image: url(../images/icon_staff.png); }

.c_main-nav-icon.is_work {
  background-image: url(../images/icon_work.png); }

.c_main-nav-icon.is_system {
  background-image: url(../images/icon_system.png); }

.c_main-nav-icon.is_recruit {
  background-image: url(../images/icon_recruit.png); }

@media only screen and (max-width: 720px) {
  .c_main-nav {
    flex-wrap: wrap; }
    .c_main-nav .c_main-nav-item {
      width: 100%;
      border-bottom: 1px solid #FFE7EC; }
    .c_main-nav a {
      display: flex;
      align-items: center;
      justify-items: flex-start;
      padding: 10px; }

  .c_main-nav-icon {
    display: inline-block;
    margin: 0 20px 0 0; } }
/*----------------------------------------------
	.c_sub-nav
---------------------------------------------*/
.c_sub-nav {
  display: flex;
  justify-content: space-between;
  margin: 0;
  padding: 0;
  list-style-type: none; }
  .c_sub-nav .c_sub-nav-item {
    flex-grow: 1;
    width: 100%;
    border-left: 1px solid #FFF;
    text-align: center; }
  .c_sub-nav .c_sub-nav-item:first-child {
    border-left: none; }
  .c_sub-nav .c_sub-nav-item .fas {
    color: #F79DA5; }
  .c_sub-nav .c_sub-nav-item a {
    display: block;
    padding: 20px;
    text-decoration: none;
    color: #000; }
  .c_sub-nav .c_sub-nav-item a:hover {
    background-color: #fbccd0; }

@media only screen and (max-width: 720px) {
  .c_sub-nav {
    flex-wrap: wrap;
    text-align: left; }
    .c_sub-nav .c_sub-nav-item {
      width: 33.33%;
      border-bottom: 1px solid #FFF; }
    .c_sub-nav .c_sub-nav-item:last-child {
      border-bottom: none; }
    .c_sub-nav .c_sub-nav-item a {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100%;
      padding: 10px 5px;
      font-size: 1.2rem;
      text-align: left; }
    .c_sub-nav .c_sub-nav-item .fas {
      letter-spacing: 5px; } }
/*----------------------------------------------
	.c_footer
---------------------------------------------*/
.c_footer-top-content {
  color: #000;
  text-decoration: none; }
  .c_footer-top-content:hover {
    opacity: 0.8; }
  .c_footer-top-content img {
    display: block;
    max-width: 100%;
    margin: auto; }
  .c_footer-top-content p {
    margin: 20px 0 0;
    color: inherit;
    text-align: center; }

.c_footer-middle {
  display: flex;
  align-items: center; }

.c_footer-middle p {
  margin-left: 20px;
  font-size: 1.4rem;
  line-height: 1.7; }

.c_footer-bottom {
  font-size: 1.4rem;
  text-align: center;
  color: #FFF; }

@media only screen and (max-width: 720px) {
  .c_footer-top-content p {
    margin: 10px 0 0; }

  .c_footer-middle {
    flex-direction: column; }
    .c_footer-middle p {
      margin: 20px 0 0;
      text-align: center; }
    .c_footer-middle img {
      max-width: 120px; }

  .c_footer-bottom {
    font-size: 1.2rem; } }
/*----------------------------------------------
	.c_breadcrumb
---------------------------------------------*/
.c_breadcrumb {
  display: flex;
  margin: 0;
  padding: 20px 0;
  list-style-type: none;
  font-size: 1.4rem;
  color: #666; }
  .c_breadcrumb .c_breadcrumb-item {
    margin-right: 5px; }
    .c_breadcrumb .c_breadcrumb-item::before {
      margin-right: 5px;
      content: "\f054";
      font-size: 1rem;
      font-weight: 900;
      font-family: "Font Awesome 5 Free";
      line-height: 1.5;
      vertical-align: text-top; }
    .c_breadcrumb .c_breadcrumb-item:first-child::before {
      display: none; }
    .c_breadcrumb .c_breadcrumb-item a {
      color: #3FB397; }

@media only screen and (max-width: 720px) {
  .c_breadcrumb {
    padding: 10px;
    font-size: 1.2rem; } }
/*----------------------------------------------
	.c_text01
---------------------------------------------*/
.c_text01 {
  margin: 0 0 40px;
  text-align: justify; }

@media only screen and (max-width: 720px) {
  .c_text01 {
    margin: 0 0 20px; } }
/*----------------------------------------------
	.c_testimonial-bubble
---------------------------------------------*/
.c_testimonial-bubble {
  position: relative;
  width: calc(100% - 220px);
  padding: 40px;
  border: 2px solid #F79DA5;
  border-radius: 8px;
  z-index: 1; }
  .c_testimonial-bubble::before {
    position: absolute;
    top: 50%;
    right: 0;
    content: "";
    width: 35px;
    height: 35px;
    background-color: #FFF;
    border-color: #F79DA5;
    border-style: solid;
    transform: rotate(45deg) translateY(-75%); }
  .c_testimonial-bubble::after {
    position: absolute;
    top: 50%;
    right: -220px;
    content: url("../images/img_senpai1.png");
    border: none;
    transform: translateY(-50%); }
  .c_testimonial-bubble.senior::after {
    content: url("../images/img_senpai1.png"); }

@media only screen and (min-width: 721px) {
  .c_testimonial-bubble::before {
    border-top-width: 2px;
    border-right-width: 2px;
    border-left: none;
    border-bottom: none; } }
@media only screen and (max-width: 720px) {
  .c_testimonial-bubble {
    width: 100%;
    padding: 15px;
    margin-bottom: 200px !important; }
    .c_testimonial-bubble.u_gap-spacer {
      margin-bottom: 240px !important; }
    .c_testimonial-bubble::before {
      top: unset;
      right: 50%;
      bottom: 0;
      border-top: none;
      border-right-width: 2px;
      border-left: none;
      border-bottom-width: 2px;
      transform: rotate(45deg) translateX(75%); }
    .c_testimonial-bubble::after {
      top: unset;
      right: 50%;
      bottom: -200px;
      border: none;
      transform: translateX(50%); } }
/*----------------------------------------------
	.c_card
---------------------------------------------*/
.c_card {
  padding: 40px;
  background-color: #FDF8F9; }

@media only screen and (max-width: 720px) {
  .c_card {
    padding: 15px; } }
/*----------------------------------------------
	.c_box
---------------------------------------------*/
.c_box {
  padding: 50px;
  border: 3px solid #F79DA5;
  border-radius: 12px; }

@media only screen and (max-width: 720px) {
  .c_box {
    padding: 30px 15px; } }
/*----------------------------------------------
	.c_tile-button
---------------------------------------------*/
.c_tile-button {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center; }
  .c_tile-button.is_group {
    display: flex;
    justify-content: center; }

/*----------------------------------------------
	.c_entry-button
---------------------------------------------*/
.c_entry-button {
  border-top: 1px solid #DDD;
  margin-top: 40px;
  padding-top: 40px;
  text-align: center; }

/*----------------------------------------------
	.c_introduction
---------------------------------------------*/
.c_introduction {
  padding: 60px 0;
  text-align: center;
  background: url(../../images/bg_introduction.png) no-repeat center;
  background-size: 100%; }
  .c_introduction .c_introduction-content {
    text-align: center;
    line-height: 2; }

@media only screen and (max-width: 720px) {
  .c_introduction {
    padding: 30px 0;
    background: none; }
    .c_introduction .c_introduction-content {
      padding: 0 20px;
      line-height: 1.7; } }
/*----------------------------------------------
	.c_title01
---------------------------------------------*/
.c_title01 {
  font-size: 3rem;
  color: #F79DA5; }

@media only screen and (max-width: 720px) {
  .c_title01 {
    font-size: 2rem; } }
/*----------------------------------------------
	.c_title02
---------------------------------------------*/
.c_title02 {
  margin: 0 0 20px;
  padding: 25px 30px;
  border-radius: 8px;
  font-size: 2rem;
  background-color: #F79DA5;
  color: #FFF; }

@media only screen and (max-width: 720px) {
  .c_title02 {
    padding: 10px 20px;
    font-size: 1.8rem; } }
/*----------------------------------------------
	.c_title03
---------------------------------------------*/
.c_title03 {
  margin: 0 0 35px;
  font-size: 2.5rem;
  font-weight: normal; }

@media only screen and (max-width: 720px) {
  .c_title03 {
    margin: 0 0 20px;
    padding-left: 20px;
    font-size: 1.8rem;
    text-indent: -10px; } }
/*----------------------------------------------
	.c_title04
---------------------------------------------*/
.c_title04 {
  margin: 0 0 30px;
  color: #F79DA5;
  font-size: 2rem; }

@media only screen and (max-width: 720px) {
  .c_title04 {
    margin: 0 0 10px;
    font-size: 1.8rem; } }
/*----------------------------------------------
	.c_title05
---------------------------------------------*/
.c_title05 {
  margin: 0 0 30px;
  color: #333;
  font-size: 2rem; }

@media only screen and (max-width: 720px) {
  .c_title05 {
    margin: 0 0 10px;
    font-size: 1.8rem; } }
/*----------------------------------------------
	.c_title06
---------------------------------------------*/
.c_title06 {
  padding: 25px 0;
  margin: 0 0 40px;
  color: #F79DA5;
  font-size: 2.5rem;
  text-align: center;
  border-width: 1px 0 1px 0;
  border-style: solid;
  border-color: #F79DA5; }

@media only screen and (max-width: 720px) {
  .c_title06 {
    padding: 10px 0;
    margin: 0 0 10px;
    font-size: 1.8rem; } }
/*----------------------------------------------
	.c_title07
---------------------------------------------*/
.c_title07 {
  position: relative;
  margin: 0 0 40px;
  padding: 20px 30px;
  border-radius: 8px;
  color: #FFF;
  font-size: 2rem;
  background-color: #F79DA5; }

.c_title07::before {
  position: absolute;
  top: 0;
  left: 15px;
  bottom: 0;
  content: "";
  display: block;
  margin: auto;
  width: 6px;
  height: 28px;
  background-color: #F77E88;
  border-radius: 4px; }

@media only screen and (max-width: 720px) {
  .c_title07 {
    margin: 0 0 10px;
    padding: 10px 30px;
    font-size: 1.8rem; }
    .c_title07::before {
      height: 15px; } }
/*----------------------------------------------
	.c_title08
---------------------------------------------*/
.c_title08 {
  position: relative;
  margin: 40px 0 20px;
  padding: 0 30px;
  border-radius: 8px;
  color: #333;
  font-size: 2rem; }

.c_title08::before {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  content: "";
  display: block;
  margin: auto;
  width: 6px;
  height: 28px;
  background-color: #F77E88;
  border-radius: 4px; }

.c_title08:first-child {
  margin-top: 0; }

@media only screen and (max-width: 720px) {
  .c_title08 {
    margin: 30px 0 20px;
    padding: 0 15px;
    font-size: 1.5rem; }
    .c_title08::before {
      height: 15px; } }
/*----------------------------------------------
	.c_title08
---------------------------------------------*/
.c_title09 {
  margin: 0 0 20px;
  color: #F79DA5;
  font-size: 2rem; }

@media only screen and (max-width: 720px) {
  .c_title09 {
    font-size: 1.8rem; } }
/*----------------------------------------------
	.c_btn01
---------------------------------------------*/
.c_btn01 {
  display: block;
  padding: 20px 40px;
  background-color: #FFE760;
  border-radius: 8px; }

/*----------------------------------------------
	.c_btn02
---------------------------------------------*/
.c_btn02 {
  display: inline-block;
  width: 60%;
  margin-top: 40px;
  padding: 30px 40px;
  background-color: #F79DA5;
  border-radius: 8px;
  font-size: 2rem;
  font-weight: bold;
  color: #FFF;
  text-decoration: none;
  text-align: center; }

.c_btn02:hover {
  opacity: 0.6; }

.c_btn02.is_small {
  margin-top: 20px;
  padding: 20px 10px;
  font-size: 1.5rem; }

.c_btn02.is_accent-color {
  background-color: #3FB397; }

.c_btn02.is_narrow {
  width: 45%;
  margin: 0 auto; }

.c_btn02.is_disabled {
  background-color: #CCC; }

.c_btn02.is_disabled:hover {
  opacity: inherit; }

@media only screen and (max-width: 720px) {
  .c_btn02 {
    width: 100%;
    padding: 20px 30px;
    font-size: 1.5rem; } }
.c_menu-btn {
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  padding: 10px;
  color: #F79DA5 !important;
  font-size: 1rem;
  text-align: center;
  text-decoration: none;
  text-transform: lowercase; }
.c_menu-btn .menu-box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 20px; }
.c_menu-btn .menu-inner {
  position: relative;
  display: block;
  width: inherit;
  height: 4px;
  background-color: #F79DA5; }
.c_menu-btn .menu-inner::after, .c_menu-btn .menu-inner::before {
  position: absolute;
  content: "";
  display: block;
  width: 30px;
  height: 4px;
  background-color: #F79DA5;
  transition: all 60ms linear; }
.c_menu-btn .menu-inner::before {
  top: -8px; }
.c_menu-btn .menu-inner::after {
  bottom: -8px; }
.c_menu-btn .menu-text {
  margin: 4px 0 0; }
.active.c_menu-btn .menu-inner {
  background-color: rgba(0, 0, 0, 0); }
.active.c_menu-btn .menu-inner::before {
  top: 1px;
  transform: rotate(-40deg); }
.active.c_menu-btn .menu-inner::after {
  bottom: -1px;
  transform: rotate(40deg); }

/*----------------------------------------------
	.c_list01
---------------------------------------------*/
.c_list01 {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0 -15px; }

.c_list01 li {
  margin: 5px 15px; }

.c_list01 a {
  color: #333;
  text-decoration: none; }

.c_list01 a::before {
  content: "\f138";
  margin-right: 10px;
  color: #F79DA5;
  font-weight: 900;
  font-family: "Font Awesome 5 Free"; }

@media only screen and (max-width: 720px) {
  .c_list01 {
    flex-direction: column; } }
/*----------------------------------------------
	.c_list02
---------------------------------------------*/
.c_list02 {
  margin: 0;
  padding: 0;
  list-style: none;
  line-height: 1.5;
  border-top: 1px solid #CCC; }

.c_list02 > li {
  display: flex;
  padding: 15px 10px;
  border-bottom: 1px solid #CCC; }

.c_list02 span:first-child {
  width: 105px; }

.c_list02 span:last-child {
  width: calc(100% - 105px); }

@media only screen and (max-width: 720px) {
  .c_list02 > li {
    padding: 10px; } }
/*----------------------------------------------
	Utility
---------------------------------------------*/
/*
ページごとの設定や、位置調整、テキスト装飾などで使用する汎用的なものとを記述します。
Anything used for general purpose such as setting for every page, position adjustment, and text decoration will be written.

接頭辞はUtilityの頭文字を取って【u_】とします。
Prefix will take the "Utility" first letter and use it as "u_". 

clearfixのみ、例外的に接頭辞をつけてません。
This not apply to "clearfix".

フォントサイズはremで指定します。
"rem" will be used for font-size.
*/
.u_mat0 {
  margin-top: 0; }

.u_mat5 {
  margin-top: 5px; }

.u_mat10 {
  margin-top: 10px; }

.u_mat20 {
  margin-top: 20px; }

.u_mat30 {
  margin-top: 30px; }

.u_mat40 {
  margin-top: 40px; }

.u_mat50 {
  margin-top: 50px; }

.u_mab0 {
  margin-bottom: 0; }

.u_mab5 {
  margin-bottom: 5px; }

.u_mab10 {
  margin-bottom: 10px; }

.u_mab20 {
  margin-bottom: 20px; }

.u_mab30 {
  margin-bottom: 30px; }

.u_mab40 {
  margin-bottom: 40px; }

.u_mab50 {
  margin-bottom: 50px; }

.u_ALcenter {
  text-align: center; }

.u_ALright {
  text-align: right; }

/*----------------------------------------------
	color
---------------------------------------------*/
.u_primary {
  color: #F79DA5; }

/*----------------------------------------------
	u_gap-spacer
---------------------------------------------*/
.u_gap-spacer {
  margin-bottom: 40px !important; }

@media only screen and (max-width: 720px) {
  .u_gap-spacer {
    margin-bottom: 20px !important; } }
/*----------------------------------------------
	u_img-block-center
---------------------------------------------*/
.u_img-block-center {
  display: block;
  max-width: 100%;
  margin: auto; }
  .u_img-block-center.reduce-on-mobile50 {
    width: 50%; }

/*----------------------------------------------
	.clearfix
---------------------------------------------*/
.clearfix:after {
  content: "";
  display: block;
  clear: both; }

/*----------------------------------------------
	.mobile/desktop
---------------------------------------------*/
@media only screen and (min-width: 721px) {
  .mobile {
    display: none !important; } }
@media only screen and (max-width: 720px) {
  .desktop {
    display: none !important; } }

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