@charset "UTF-8";

/* ================================
 * wordpressブロックエディタ スタイル
 * ================================ */

.wp-block-media-text {
  box-sizing: border-box;
  direction: ltr;
  display: grid;
  grid-template-columns: 50% 1fr;
  grid-template-rows: auto
}
.wp-block-media-text.has-media-on-the-right {
  grid-template-columns: 1fr 50%
}
.wp-block-media-text.is-vertically-aligned-top>.wp-block-media-text__content, .wp-block-media-text.is-vertically-aligned-top>.wp-block-media-text__media {
  align-self: start
}
.wp-block-media-text.is-vertically-aligned-center>.wp-block-media-text__content, .wp-block-media-text.is-vertically-aligned-center>.wp-block-media-text__media, .wp-block-media-text>.wp-block-media-text__content, .wp-block-media-text>.wp-block-media-text__media {
  align-self: center
}
.wp-block-media-text.is-vertically-aligned-bottom>.wp-block-media-text__content, .wp-block-media-text.is-vertically-aligned-bottom>.wp-block-media-text__media {
  align-self: end
}
.wp-block-media-text>.wp-block-media-text__media {
  grid-column: 1;
  grid-row: 1;
  margin: 0
}
.wp-block-media-text>.wp-block-media-text__content {
  direction: ltr;
  grid-column: 2;
  grid-row: 1;
  padding: 0 8%;
  word-break: break-word
}
.wp-block-media-text.has-media-on-the-right>.wp-block-media-text__media {
  grid-column: 2;
  grid-row: 1
}
.wp-block-media-text.has-media-on-the-right>.wp-block-media-text__content {
  grid-column: 1;
  grid-row: 1
}
.wp-block-media-text__media a {
  display: block
}
.wp-block-media-text__media img, .wp-block-media-text__media video {
  height: auto;
  max-width: unset;
  vertical-align: middle;
  width: 100%
}
.wp-block-media-text.is-image-fill>.wp-block-media-text__media {
  background-size: cover;
  height: 100%;
  min-height: 250px
}
.wp-block-media-text.is-image-fill>.wp-block-media-text__media>a {
  display: block;
  height: 100%
}
.wp-block-media-text.is-image-fill>.wp-block-media-text__media img {
  clip: rect(0, 0, 0, 0);
  border: 0;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px
}
.wp-block-media-text.is-image-fill-element>.wp-block-media-text__media {
  height: 100%;
  min-height: 250px;
  position: relative
}
.wp-block-media-text.is-image-fill-element>.wp-block-media-text__media>a {
  display: block;
  height: 100%
}
.wp-block-media-text.is-image-fill-element>.wp-block-media-text__media img {
  height: 100%;
  object-fit: cover;
  position: absolute;
  width: 100%
}
@media (max-width:600px) {
  .wp-block-media-text.is-stacked-on-mobile {
    grid-template-columns: 100%!important
  }
  .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__media {
    grid-column: 1;
    grid-row: 1
  }
  .wp-block-media-text.is-stacked-on-mobile>.wp-block-media-text__content {
    grid-column: 1;
    grid-row: 2;
    padding: 0;
  }
}


.system_article sup {
  font-size: .8rem;
}

/* ================================
 *
 * システム吐き出し用CSS
 *
 * システムから出力されるテキスト全体を囲む<div>等に
 * class="system_article"を付与すること。
 *
 * ================================ */
/* 文字色・文字サイズなどのデフォルト設定 */
.system_article p,
.system_article ul,
.system_article ol {
  font-size: 1.8rem;
  font-weight: normal;
  line-height: 1.8;

  margin-bottom: .6em;
}

@media screen and (max-width: 760px) {
  .system_article p,
  .system_article ul,
  .system_article ol {
    font-size: 1.5rem;
  }
}

/* リンクテキスト */
.system_article a {
  text-decoration: underline;
}

.system_article a:active {
  text-decoration: underline;
}

/* 左揃え・中央揃え・右揃え */
.system_article p {
  min-height: 1.4em;

  *zoom: 1;
}

.system_article p::after {
  font-size: 0;

  display: block;
  visibility: hidden;
  clear: both;

  height: 0;

  content: " ";
}

.alignleft {
  float: left;
  clear: both;

  margin-right: 20px;
  margin-bottom: 20px;
}

.alignright {
  float: right;
  clear: both;

  margin-bottom: 20px;
  margin-left: 20px;
}

.system_article .aligncenter,
.system_article img.aligncenter {
  display: block !important;
  clear: both !important;

  margin: 0 auto !important;
}

/* 写真のキャプションの揃え */
.wp-caption-text {
  text-align: center;
}

/* 箇条書きリスト */
.system_article ul,
.system_article ol {
  padding-left: 1.5em !important;
}

.system_article ul {
  list-style: disc !important;
}

.system_article ol {
  list-style: decimal !important;
}

/* 太字 */
.system_article strong {
  font-weight: boldl !important;
}

/* 斜体 */
.system_article em {
  font-family: "ＭＳ ゴシック", "MS Gothic", "Osaka－等幅", Osaka-mono, monospace;
  font-weight: normal;
  font-style: italic !important;
}

/* 見出しの基本設定 */
.system_article h1,
.system_article h2,
.system_article h3 {
  font-weight: bold;
  line-height: 1.4;

  clear: both;
}

.system_article h1:first-child,
.system_article h2:first-child,
.system_article h3:first-child {
  margin-top: 0;
}

.system_article h1 {
  font-size: 1.25em;

  margin: 2.4em 0 1.2em;
}

.system_article h2 {
  font-size: 1.25em;

  margin: 2em 0 1em;
}

.system_article h3 {
  font-size: 1.2em;

  margin: 1.6em 0 .8em;
}

/* 表組み */
.system_article table {
  max-width: 100%;
  margin: 1em 0 1.4em;

  border-collapse: collapse;

  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
}

.system_article th,
.system_article td {
  padding: .4em;

  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.system_article th {
  text-align: center;

  background-color: #eee;
}

.system_article img,
.system_article video {
  max-width: 100%;
}

figure {
  display: block;

  -webkit-margin-before: 1em;
  -webkit-margin-after: 1em;
  -webkit-margin-start: 0px;
  -webkit-margin-end: 0px;
}


.system_article h1 {
  font-size: 3.0rem;
  color: #FFF;
  background: #F15D53;
  font-weight: 700;
  padding: 8px 20px 10px;
  line-height: 1.4;
  margin-bottom: 20px;
  margin-top: 40px;
  border-radius: 4px;
}

.system_article h2 {
  font-size: 2.8rem;
  color: #F17052;
  font-weight: 700;
  border-bottom: 2px solid #F17052;
  line-height: 1.6;
  padding: 0 12px 10px;
  margin-bottom: 20px;
  margin-top: 40px;
  position: relative;
}

.system_article h3 {
  font-size: 2.4rem;
  background: linear-gradient(90deg, rgba(240,189,75,.2), rgba(218,70,89,.2));
  font-weight: 700;
  line-height: 1.6;
  margin-bottom: 20px;
  margin-top: 30px;
  padding: 8px 18px 12px;
  border-radius: 4px;
}

.system_article h4 {
  font-size: 2.0rem;
  font-weight: 700;
  color: #EF8E52;
  border-bottom: 1px solid #EF8E52;
  line-height: 1.6;
  margin-bottom: 20px;
  margin-top: 20px;
  padding: 0 8px 6px;
}

.system_article h5 {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.6;
  margin-bottom: 10px;
  margin-top: 20px;
  padding-left: 25px;
  position: relative;
}

.system_article h5::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 0;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #EF8E52;
}

.system_article .table_box dl {
  border-bottom: 1px solid rgba(0,0,0,.1);
  padding: 30px 10px;
}

.system_article .table_box dt {
  width: 20%;
  display: inline-block;
  vertical-align: top;
  font-weight: 700;
  color: #1B254D;
}

.system_article .table_box dd {
  width: 78%;
  display: inline-block;
  vertical-align: top;
  font-weight: 400;
}

.system_article ul {
  margin: 30px 15px;
}

.system_article ol {
  counter-reset: li_count;
  margin: 30px 15px;
}

.system_article ul li:not(:last-child),
.system_article ol li:not(:last-child) {
  margin-bottom: 10px;
}

.system_article ul li::marker,
.system_article ol li::marker {
  color: #F17052;
  margin-right: 7px;
  font-weight: bold;
  font-size: 16px;
}

.system_article a {
  text-decoration: underline;
  color: #F17052;
  font-weight: bold;
}

.system_article strong,
.system_article b {
  font-weight: bold;
  color: #F15D53;
}

.system_article .wp-block-table {
  border: 3px solid #F17052;
  border-radius: 16px;
  margin-top: 10px;
}

.system_article table {
  margin: 0;
  max-width: 100%;
}

.system_article table th,
.system_article table td {
  border-bottom: 1px solid rgba(0,0,0,.1);
  padding: 10px 20px;
}

.system_article table th {
  border-bottom: 1px solid #F17052;
  padding: 10px 20px;
  font-weight: bold;
}

.system_article table th.man {
  background: #3891D5;
  color: #FFF;
}

.system_article table th.woman {
  background: #F15D53;
  color: #FFF;
}

@media screen and (max-width: 760px) {
  .wp-block-table {
    position: relative;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .wp-block-table table {
    min-width: 420px;
    border-collapse: collapse;
  }
}

.system_article blockquote {
  background: rgb(243 243 243 / 75%);
  margin: 50px 0;
  padding: 25px 30px;
  position: relative;
  border-radius: 10px;
}

.system_article blockquote::before {
  display: inline-block;
    position: absolute;
    top: -16px;
    left: 18px;
    width: 35px;
    height: 35px;
    content: "";
    background: url(../images/cmn/icon_quote.svg) top center no-repeat;
    background-size: contain;
    line-height: 1;
    font-weight: 900;
}

.system_article blockquote cite {
  opacity: .6;
  font-size: 12px;
  font-style: normal;
}

.system_article .wp-block-image {
  margin: 20px 0;
}

.system_article img {
  width: auto;
  border-radius: 10px;
}

.system_article .wp-block-buttons {
  margin: 30px 0;
}

.system_article .wp-block-button a {
  color: #FFF;
  background: linear-gradient(90deg, #EF9152, #F25053);
  text-decoration: none;
  position: relative;
  padding: 10px 80px;
  border-radius: 50px;
  transition: .3s;
  box-shadow: 0 3px 0 0 #E24434;
  text-align: center;
}

.system_article .wp-block-button a:hover {
  transform: translateY(4px);
  box-shadow: 0 0 0 0 #E24434;
}

.system_article .wp-block-button a::after {
  content: "";
  position: absolute;
  width: 18px;
  height: 18px;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  background: url(../images/cmn/arrow_cv_w.svg) top center no-repeat;
  background-size: 100% auto;
}

.system_article .wp-block-button.is-style-outline a {
  background: #FFF;
  border: 1px solid rgba(177, 169, 147, .6);
  color: #787069;
  padding: 6px 60px;
  font-size: .8em;
  box-shadow: 0 3px 0 0 rgba(177, 169, 147, .8);
}

.system_article .wp-block-button.is-style-outline a::after {
  width: 16px;
  height: 16px;
  right: 18px;
  background-image: url(../images/cmn/arrow_sub.svg);
}

.system_article .wp-block-button.is-style-outline a:hover {
  box-shadow: 0 0 0 0 rgba(177, 169, 147, .8);
}

@media screen and (max-width: 760px) {
  .system_article .wp-block-buttons {
    margin: 5% 0;
  }

  .system_article .wp-block-button:not(.is-style-outline) {
    width: 100%;
  }

  .system_article .wp-block-button a {
    font-size: 1.6rem;
    padding: 2% 5%;
  }

  .system_article .wp-block-button a::after {
    width: 14px;
    height: 14px;
    right: 18px;
  }

  .system_article .wp-block-button.is-style-outline a {
    font-size: .9em;
  }

  .system_article .wp-block-button.is-style-outline a::after {
    width: 14px;
    height: 14px;
    right: 14px;
  }
}


.system_article .wp-block-accordion-heading {
  margin-bottom: 10px;
  background: #F8F6F2;
}

.system_article .wp-block-accordion-heading__toggle {
  font-size: 1.8rem;
}

.system_article .wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
  text-decoration: none;
}

.wp-block-accordion-panel {
  padding: 0 20px 10px;
}

@media screen and (max-width: 760px) {
  .system_article .wp-block-accordion-heading__toggle {
    font-size: 1.5rem;
  }

  .wp-block-accordion-panel {
    padding: 0 2% 4%;
  }
}

.wp-block-columns {
  margin: 30px 0;
}

@media screen and (max-width: 760px) {
.wp-block-columns {
  row-gap: 2vw;
  margin: 4% 0;
}
}

.faq_list_block .wp-block-columns {
  margin-top: 0;
  margin-bottom: 40px;
}

.faq_list_block .wp-block-list {
  margin-top: 0;
  margin-bottom: 0;
}

@media screen and (max-width: 760px) {
.faq_list_block .wp-block-columns {
  margin-bottom: 10%;
}
}


/*整形済みテキスト*/
.content pre{
	font-size:1.4rem;
	margin-top:20px;
	padding:20px;
	background-color: #F8F6F2;
	border-left: solid 5px #EF8E52;
	color:#7F7F7F;
	overflow:auto;
  border-radius: 4px;
}

/*ライン*/
.content hr{
	margin-top:40px;
	border-top: 1px solid rgba(177, 169, 147, .3);
}

/*テーブル*/
.content table {
    width: 100%;
    border: none;
  line-height: 1.4;
}
.content table th{
	padding: 10px 12px;
	background: rgba(241, 112, 82, 0.08);
  border: none;
	border-right: 1px solid #F17052;
	border-bottom: 1px solid #F17052;
}

.content table tr:last-child th,
.content table tr:last-child td {
	border-bottom: none;
}
.content table td{
	padding: 10px 12px;
  border: none;
	border-right: 1px solid #F17052;
	border-bottom: 1px solid #F17052;
}

.content table th:last-child,
.content table td:last-child{
	border-right: none;
}

/*枠線ボックス*/
.content .borderBox{
	border: 1px solid rgba(177, 169, 147, .6);
	padding:20px;
	margin-top:20px;
  border-radius: 10px;
}

/*二重線ボックス*/
.content .border2Box{
	border:4px double rgba(177, 169, 147, .3);
	padding:20px;
	margin-top:20px;
  border-radius: 10px;
}

/*背景ボックス*/
.content .bgBox{
	background:#F8F6F2;
	padding:20px;
	margin-top:20px;
  border-radius: 10px;
}

/*ペーパーボックス*/
.content .paperBox {
	position: relative;
	padding:20px;
	margin-top:20px;
	background-color: #F8F6F2;

}
.content .paperBox::after {
    content: "";
	position: absolute;
	bottom: 0;
    right: 0;
    border-color: #ece9e4 #ffffff #ffffff #ece9e4;
    border-style: solid;
    border-width: 0 0 20px 20px;
}

/*太文字ボックス*/
.content .boldBox{
	border:2px solid #EF8E52;
	padding:20px;
	margin-top:20px;
	font-weight:700;
  border-radius: 10px;
}

/*括弧ボックス*/
.content .bracketsBox{
	position:relative;
	padding:20px;
	margin-top:20px;
}
.content .bracketsBox:before,
.content .bracketsBox:after {
    display: inline-block;
    position: absolute;
    width: 30px;
    height: 30px;
    content: "";
}
.content .bracketsBox:before {
    top: 0;
    left: 0;
    border-top: solid 1px #191919;
    border-left: solid 1px #191919;
}
.content .bracketsBox:after {
    right: 0;
    bottom: 0;
    border-right: solid 1px #191919;
    border-bottom: solid 1px #191919;
}

/*はてなボックス*/
/*ビックリボックス*/
.content .questionBox,
.content .exclamationBox{
	position:relative;
	margin-top:20px;
	padding:20px 20px 20px 70px;
  border-radius: 10px;
}
.content .questionBox{background-color: rgba(241, 112, 82, 0.1);}
.content .exclamationBox{background-color: rgba(218, 54, 49, 0.1);}
.content .questionBox::before,
.content .exclamationBox::before{
	position:absolute;
	top:20px;
	left:20px;
	font-size:2rem;
	font-weight:700;
	color: #ffffff;
    text-align: center;
    vertical-align: middle;
    width: 30px;
    height: 30px;
	line-height: 26px;
    border-radius: 50%;
}
.content .questionBox::before{content: "?";background: #F17052;}
.content .exclamationBox::before{content: "!";background: #F15D53;}

/*ポイントボックス*/
.content .pointBox {
	position: relative;
    border: 2px solid #F15D53;
    border-radius: 10px;
    padding:20px;
	margin-top:20px;
}
.content .pointBox::before {
	content: "POINT";
  font-family: "Quicksand", sans-serif;
  font-weight: 700;
	position: absolute;
	top: -15px;
	left: 15px;
	font-size: 1.6rem;
	font-weight: 700;
    background-color: #ffffff;
    color: #F15D53;
    padding: 0 10px;
}


@media screen and (max-width: 760px) {
  .content pre{
		font-size:1.2rem;
		padding:10px 15px;
	}
	.content table{font-size:1.2rem;}
	.content blockquote{padding: 15px 15px 15px 55px;}
	.content blockquote::before{
		top: 5px;
		left: 15px;
		font-size: 2.5rem;
	}
	.content .questionBox,
	.content .exclamationBox{padding: 15px 15px 15px 55px;}
	.content .questionBox::before,
	.content .exclamationBox::before{
		top: 15px;
		left: 15px;
		font-size: 1.6rem;
		width: 25px;
		height: 25px;
		line-height: 25px;
	}

  .system_article h1 {
    font-size: 1.8rem;
    padding: 2% 4%;
    margin-bottom: 5%;
    margin-top: 10%;
    line-height: 1.4;
  }

  .system_article h2 {
    font-size: 1.8rem;
    padding: 0 2% 2%;
    margin-bottom: 5%;
    margin-top: 8%;
    line-height: 1.4;
  }

  .system_article h3 {
    font-size: 1.7rem;
    margin-bottom: 5%;
    margin-top: 5%;
    line-height: 1.4;
    padding: 3% 4%;
  }

  .system_article h4 {
    font-size: 1.6rem;
    margin-bottom: 5%;
    margin-top: 5%;
    line-height: 1.4;
    padding: 0 2% 2%;
  }

  .system_article h5 {
    font-size: 1.5rem;
    padding-left: 18px;
  }

  .system_article h5::before {
    width: 12px;
    height: 12px;
    top: 8px;
    left: 0;
  }

  .system_article .table_box dl {
    padding: 30px 10px;
  }

  .system_article .table_box dt {
    font-size: 1.3rem;
  }

  .system_article .table_box dd {
    font-size: 1.3rem;
  }

  .system_article ul {
    margin: 5% 3%;
    font-size: 1.3rem;
  }

  .system_article ol {
    margin: 5% 3%;
    font-size: 1.3rem;
  }

  .system_article ul li::before {
    width: 8px;
    height: 8px;
    margin-right: 7px;
  }

  .system_article ol li::marker {
    margin-right: 7px;
    font-size: 1.4rem;
  }

  .system_article .wp-block-table {
    border-width: 2px;
  }

  .system_article table {
    margin: 0;
    max-width: 100%;
  }

  .system_article table th,
  .system_article table td {
    padding: 2vw 2vw;
  }

  .system_article table th {
    padding: 2vw 2vw;
  }

  .system_article blockquote {
    margin: 6% 0;
    padding: 3% 5%;
  }

  .system_article blockquote::before {
      top: -10px;
      left: 10px;
      width: 25px;
      height: 25px;
  }

  .system_article blockquote cite {
    font-size: 1.0rem;
  }

  .system_article .wp-block-image {
    margin: 5% 0;
  }

}