@charset "utf-8";

/* ==========================================================================
   Foundation
   ========================================================================== */

/* Reset ----------------------------------------------------------------- */
html {
	min-width: 100%;
	overflow-y: scroll;
}
body, header, footer, nav, main, section, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, input, textarea, p, span, table, tr, th, td, a, :after, :before {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-style: normal;
	font: inherit;
	vertical-align: baseline;
}
object, embed {
	vertical-align: top;
}
img, abbr, acronym, fieldset {
	border: 0;
}
a img {
	outline: none;
	border: none;
}
img {
	height: auto;
  max-width: 100%;
	vertical-align: top;
	border: none;
	outline: none;
}
ul, ol {
	list-style-type: none;
}
button, input, optgroup, select, textarea {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	background: transparent;
	color: inherit;
	vertical-align: middle;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font: inherit;
}
select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 0;
  font: inherit;
}
button, input {
	overflow: visible;
}
button, select {
	text-transform: none;
}
button[disabled], [type='button'][disabled], [type='reset'][disabled], [type='submit'][disabled] {
	cursor: default;
}
[type='checkbox'], [type='radio'] {
	box-sizing: border-box;
	padding: 0;
}
[type='number']::-webkit-inner-spin-button, [type='number']::-webkit-outer-spin-button {
  -webkit-appearance: none; 
  appearance: none;
	height: auto;
}
[type='search'] {
	-webkit-appearance: textfield;
	appearance: textfield;
	outline-offset: -2px;
}
[type='search']::-webkit-search-decoration {
	-webkit-appearance: none;
}
::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}
::-webkit-input-placeholder {
	font: inherit;
}
:-ms-input-placeholder {
	font: inherit;
}
::-ms-input-placeholder {
	font: inherit;
}
:-ms-input-placeholder {
	font: inherit;
}
::placeholder {
	font: inherit;
}
a:focus, *:focus {
	outline:none;
}
label[for] {
	cursor: pointer;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
*, :after, :before {
	box-sizing: border-box;
}


/* Base ----------------------------------------------------------------- */
html {
	font-size: 62.5%;
}
body {
	position: relative;
	background-color: #FFF;
  color: #333;
	font-family: "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	font-size: 1.6rem;
  font-weight: normal;
	line-height: 1.625;
  word-break: break-word;
  word-wrap: break-word;
}

img, .is-img {
	max-width: 100%;
	height: auto;
}

a {
  background-color: transparent;
  color: inherit;
  text-decoration: none;
}


/* Color ----------------------------------------------------------------- */
:root {
	--c-red: #E60000;
  --c-black: #333333;
  --c-white: #FFFFFF;
  --c-gray: #ACACAC;
  --c-l_gray: #DDDDDD;
  --c-d_gray: #5A5A5A;
  --c-gray-text: #888888;
  --c-blue: #2980B9;
  --c-green: #27AE60;
  --c-pink: #FCE8E7;
  --c-orange: #F39C12;
  --c-btn--border_red: #F27E7E;
}


/* Ohter ----------------------------------------------------------------- */



/* ==========================================================================
   Layout
   ========================================================================== */

/* Wrapper  ----------------------------------------------------------------- */
.l-wrapper {
  min-width: 320px;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}


/* Header  ----------------------------------------------------------------- */
.l-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 16.53333vw;
  background-color: #fff;
  border-bottom: 4px solid var(--c-red);
  z-index: 1001;
}
.l-header__inner {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  background-color: #FFF;
}
.l-header__logo {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}
.l-header__logo-mufg {
  width: 32vw;
  height: 8.53333vw;
}
.l-header__logo-mufg a {
  display: block;
  width: 100%;
  height: 100%;
  background-image: url(../img/logo.svg);
  background-size: 100% auto;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}
.l-header__logo-ja {
  display: block;
  width: 28vw;
  height: 5.33333vw;
  background-image: url(../img/logo_ja.svg);
  background-size: 100% auto;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}
.l-header__home {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 5rem;
  height: 100%;
}
.l-header__home-btn {
  display: block;
  padding-top: 2.2rem;
  width: 3.5rem;
  background-image: url(../img/header_home.svg);
  background-size: 1.6rem;
  background-position: center top;
  background-repeat: no-repeat;
  font-size: .9rem;
  line-height: 1;
}
.l-header__menu {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 16vw;
  height: 100%;
}
.l-header__menu-btn {
  position: relative;
  width: 3.5rem;
  font-size: .9rem;
  line-height: 1;
}
.l-header__menu-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: 3.5rem;
  height: 1px;
  background-color: var(--c-red);
  transform: translateX(-50%);
}
.l-header__menu-btn::after {
  content: "";
  position: absolute;
  top: .6rem;
  left: 50%;
  display: block;
  width: 3.5rem;
  height: 1px;
  background-color: var(--c-red);
  transform: translateX(-50%);
}
.l-header__menu-btn span {
  display: block;
  padding-top: 2.2rem;
  text-align: center;
  font-size: .9rem;
  white-space: nowrap;
  letter-spacing: -.1em;
  line-height: 1;
}
.l-header__menu-btn span::before {
  content: "";
  position: absolute;
  display: block;
  top: 1.2rem;
  left: 50%;
  width: 3.5rem;
  height: 1px;
  background-color: var(--c-red);
  transform: translateX(-50%);
}
.l-header__menu-btn span::after {
  content: "メニュー";
}

.l-header__menu.is-open {
  background-color: var(--c-red);
}
.l-header__menu.is-open .l-header__menu-btn::before {
  top: .6rem;
  width: 2rem;
  height: 2px;
  background-color: var(--c-white);
  transform: translateX(-50%) rotate(45deg);
}
.l-header__menu.is-open .l-header__menu-btn::after {
  top: .6rem;
  width: 2rem;
  height: 2px;
  background-color: var(--c-white);
  transform: translateX(-50%) rotate(-45deg);
}
.l-header__menu.is-open .l-header__menu-btn span::before {
  content: none;
}
.l-header__menu.is-open .l-header__menu-btn span::after {
  content: "閉じる";
  color: var(--c-white);
}
@media screen and (min-width: 48.0625em){
  .l-header {
    height: 7.83333vw;
  }
  .l-header__inner {
    margin: 0 auto;
    max-width: 1000px;
    width: 100%;
  }
  .l-header__logo {
    flex: 1;
    gap: 1.5rem;
  }
  .l-header__logo-mufg {
    width: 15rem;
    height: 3.5rem;
  }
  .l-header__logo-ja {
    width: 13rem;
    height: 1.82rem;
  }
  .l-header__home {
    width: 10rem;
  }
  .l-header__home-btn {
    padding-top: 3rem;
    background-size: 2.5rem;
    font-size: 1rem;
    cursor: pointer;
  }
  .l-header__menu {
    display: none;
  }
}
@media screen and (min-width: 65.001em) {
  .l-header {
    height: 95px;
  }
}



/* Footer  ----------------------------------------------------------------- */
.l-footer {
  margin-top: auto;
}
.l-footer__inner {
  padding: 7.5rem 3.2rem 1.6rem;
  width: 100%;
}
.l-footer__contact {
  font-size: 1.6rem;
  text-align: center;
}
.l-footer__tel {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  font-size: 2rem;
  font-weight: bold;
}
.l-footer__tel:before {
  content: "";
  display: inline-block;
  margin-right: .8rem;
  width: 2rem;
  height: 2.4rem;
  background-image: url(../img/icon_tel.svg);
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
}
.l-footer__tel small {
  display: block;
  width: 100%;
  font-size: 1.4rem;
}
.l-footer__lead {
  margin-top: 2rem;
  font-size: 1.1rem;
}
.l-footer__link {
  border-top: 1px solid var(--c-l_gray);
  font-size: 1.2rem;
  margin: 0 1.6rem;
  padding: 2rem .8rem;
  display: flex;
  align-items: center;
}
.l-footer__link:before {
  content: "";
  display: inline-block;
  width: .6rem;
  height: 1rem;
  margin-right: .8rem;
  background-image: url(../img/arrow_right_gray.svg);
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
}
.l-footer__copyright {
  padding: 1.5rem;
  border-top: 3px solid var(--c-red);
  font-size: 1rem;
  text-align: center;
}
@media screen and (min-width: 62.5em){
  .l-footer__contact {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .l-footer__tel {
    margin-left: 2rem;
  }
}
@media screen and (min-width: 48.0625em){
  .l-footer__contact {
    font-size: 1.8rem;
  }
  .l-footer__tel {
    font-size: 2.4rem;
  }
  .l-footer__tel:before {
      margin-right: .4rem;
      width: 2rem;
      height: 6rem;
  }
  .l-footer__tel small {
    display: inline-block;
    padding-left: 1rem;
    width: auto;
  }
  .l-footer__lead {
    margin-top: 2rem;
    font-size: 1.4rem;
    text-align: center;
  }
  .l-footer__link {
    justify-content: center;
    margin: 0 auto;
    padding: 3.2rem 0;
    width: calc(100% - 4rem);
    max-width: 1200px;
    font-size: 1.4rem;
  }
  .l-footer__copyright {
    padding: 3.2rem 0;
    font-size: 1.2rem;
  }
}



/* Main  ----------------------------------------------------------------- */
.l-main {
  position: relative;
  width: 100%;
  margin-top: 16.53333vw;
  padding: 2rem 15px 0;
}
@media screen and (min-width: 48.0625em){
  .l-main {
    margin: 7.83333vw auto 0;
    padding: 2rem 20px 0;
    max-width: 1040px;
  }
}
@media screen and (min-width: 65.001em) {
  .l-main {
    margin: 95px auto 0;
  }
}




/* ==========================================================================
	Component
	========================================================================== */

/* page ----------------------------------------------------------------- */
/*-- page header --*/
.c-page-header {
  margin-bottom: 2rem;
}

/*-- page title --*/
.c-page-title {
  font-size: 2rem;
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 48.0625em) {
  .c-page-title {
    font-size: 2.4rem;
  }
}

/*-- page footer --*/
.c-page-footer {
  margin-top: 6rem;
}
.c-page-footer__button-wrapper {
  display: flex;
  justify-content: center;
  gap: 2rem;
}
.c-page-footer__button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(50% - 1rem);
  height: 7rem;
  border-radius: .8rem;
  font-size: 1.8rem;
  text-align: center;
  line-height: 1.2;
  cursor: pointer;
}
.c-page-footer__button--next {
  background-color: var(--c-red);
  font-weight: 700;
  color: var(--c-white);
}
.c-page-footer__button--next:disabled {
  border: none;
  background-color: var(--c-gray);
  color: var(--c-white);
}
.c-page-footer__button--w100 {
  width: 100%;
}
@media screen and (min-width: 48.0625em){
  .c-page-footer__button-wrapper {
    margin: 0 auto;
    width: 50%;
  }
}


/* progressbar ----------------------------------------------------------------- */
.c-progressbar {
  margin-top: 2rem;
}
.c-progressbar__list {
  display: flex;
  justify-content: center;
  gap: 0;
}
.c-progressbar__item {
  position: relative;
  display: block;
  width: 10rem;
  color: var(--c-l_gray);
  font-size: 1.3rem;
  text-align: center;
}
.c-progressbar__item::before {
  content: "";
  display: block;
  margin: 0 auto .3rem;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 100%;
  background-image: url(../img/icon_circle_gray.svg);
  background-size: 2rem;
  background-position: center;
  background-repeat: no-repeat;
}
.c-progressbar__item.is-previous {
  color: var(--c-red);
}
.c-progressbar__item.is-previous::before {
  background-image: url(../img/icon_check_red.svg);
}
.c-progressbar__item.is-current {
  color: var(--c-red);
}
.c-progressbar__item.is-current::before {
  border: 1px solid var(--c-red);
  background-image: url(../img/icon_circle_red.svg);
  background-color: #FFF;
}
.c-progressbar__item.is-completion {
  color: var(--c-red);
}
.c-progressbar__item.is-completion::before {
  border: 1px solid var(--c-red);
  background-image: url(../img/icon_check_red.svg);
  background-color: #FFF;
}
.c-progressbar__item:not(:first-child):after {
  content: "";
  position: absolute;
  top: 1.2rem;
  right: 50%;
  width: 10rem;
  height: 1px;
  background-color: var(--c-l_gray);
  z-index: -1;
}
.c-progressbar__item.is-previous:after,
.c-progressbar__item.is-current:after,
.c-progressbar__item.is-completion:after {
  background-color: var(--c-red);
}
.c-progressbar__text {
  display: inline-flex;
  height: 3.6rem;
  align-items: center;
  justify-content: center;
  color: var(--c-black);
  line-height: 1.2;
}
@media screen and (min-width: 48.0625em) {
  .c-progressbar__item {
    width: 14rem;
    font-size: 1.8rem;
  }
  .c-progressbar__item::before {
    margin: 0 auto .5rem;
    width: 4rem;
    height: 4rem;
    background-size: 3rem;
  }
  .c-progressbar__item.is-current::before {
    border: 2px solid var(--c-red);
  }
  .c-progressbar__item:not(:first-child):after {
    top: 1.9rem;
    width: 14rem;
    height: 2px;
  }
  .c-progressbar__text {
    height: 5rem;
  }
}


/* section ----------------------------------------------------------------- */
/*-- section --*/
.c-section {
  position: relative;
}
.c-section:not(:nth-of-type(1)) {
  margin-top: 4rem;
}

/*-- section title --*/
.c-section__title {
  padding-left: 1rem;
  border-left: 4px solid var(--c-red);
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.4;
}


/* content ----------------------------------------------------------------- */
/*-- content --*/
.c-content {
  margin-top: 4rem;
}
.c-content:nth-of-type(1) {
  margin-top: 2rem;
}

/*-- content item --*/
.c-content__item {
  position: relative;
}
.c-content__item:not(:first-child) {
  margin-top: 2rem;
}
@media screen and (min-width: 48.0625em) {
  .c-content--input-center .c-input-item,
  .c-content--input-center .c-content__item {
    margin-left: auto;
    margin-right: auto;
    max-width: 50rem;
  }
}


/* Button ----------------------------------------------------------------- */
/*-- Button --*/
.c-button-wrapper {
  display: flex;
  justify-content: center;
  gap: 1.5rem;
}

/*button01*/
.c-button {
  position: relative;
  display: block;
  padding: 2rem;
  width: 100%;
  max-width: 50rem;
  border-radius: .8rem;
  background-color: var(--c-red);
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--c-white);
  text-decoration: none;
  text-align: center;
  cursor: pointer;
}
.c-button:disabled {
  background-color: var(--c-gray);
  cursor: default;
}
.c-button--arrow-left {
  padding: 2rem 4rem;
  font-size: 1.8rem;
}
.c-button--arrow-left::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 2rem;
  transform: translateY(-50%);
  width: 1.2rem;
  height: 1.2rem;
  background-image: url(../img/arrow_right_white.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

/*input-button_check*/
.c-input-button_check {
  position: relative;
  width: 100%;
  max-width: 50rem;
}
.c-input-button_check label {
  position: relative;
  display: flex;
  align-items: center;
  padding: 1rem 2rem 1rem 4.2rem;
  width: 100%;
  min-height: 7rem;
  border: 4px solid var(--c-red);
  border-radius: .8rem;
  background-color: var(--c-red);
  box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
  font-size: 1.6rem;
  color: var(--c-white);
  text-align: left;
  line-height: 1.2;
  cursor: pointer;
}
.c-input-button_check label::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 1.2rem;
  transform: translateY(-50%);
  width: 2rem;
  height: 2rem;
  background-image: url(../img/icon_check_white_g.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.c-input-button_check input {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}
.c-input-button_check input:checked + label {
  border: 4px solid var(--c-btn--border_red);
  background-color: var(--c-white);
  color: var(--c-black);
}
.c-input-button_check input:checked + label::before {
  background-image: url(../img/icon_check_red.svg);
}
.c-input-button_check input:disabled + label {
  border: 4px solid var(--c-gray);
  background-color: var(--c-gray);
  box-shadow: none;
  color: var(--c-white);
  cursor: default;
}
.c-input-button_check input:disabled + label::before {
  background-image: url(../img/icon_check_white_g.svg);
}

/*input-button_radio*/
.c-input-button_radio {
  position: relative;
  width: 100%;
  max-width: 50rem;
}
.c-input-button_radio label {
  position: relative;
  display: flex;
  align-items: center;
  padding: 1.2rem 4.2rem 1.2rem 2rem;
  width: 100%;
  border: 4px solid var(--c-white);
  border-radius: 100vh;
  background-color: var(--c-white);
  box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
  font-size: 1.6rem;
  color: var(--c-black);
  text-align: center;
  line-height: 1;
  cursor: pointer;
}
.c-input-button_radio label::before {
  content: "";
  position: absolute;
  top: -4px;
  left: -4px;
  width: calc(100% + 8px);
  height: calc(100% + 8px);
  border-radius: 100vh;
  border: 1px solid var(--c-l_gray);
}
.c-input-button_radio label::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1.2rem;
  transform: translateY(-50%);
  width: 2rem;
  height: 2rem;
  background-image: url(../img/icon_check_gray.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.c-input-button_radio label span {
  width: 100%;
  text-align: center;
}
.c-input-button_radio input {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}
.c-input-button_radio input:checked + label {
  border: 4px solid var(--c-btn--border_red);
  background-color: var(--c-white);
  color: var(--c-black);
}
.c-input-button_radio input:checked + label::before {
  content: none;
}
.c-input-button_radio input:checked + label::after {
  background-image: url(../img/icon_check_red.svg);
}
.c-input-button_radio input:disabled + label {
  border: 4px solid var(--c-gray);
  background-color: var(--c-gray);
  box-shadow: none;
  color: var(--c-white);
  cursor: default;
}
.c-input-button_radio input:disabled + label::before {
  content: none;
}
.c-input-button_radio input:disabled + label::after {
  background-image: none;
}

/*input-button_link */
.c-input-button_link {
  position: relative;
  width: 100%;
  max-width: 50rem;
}
.c-input-button_link label {
  position: relative;
  display: flex;
  align-items: center;
  padding: 1rem 4.2rem;
  width: 100%;
  min-height: 7rem;
  border: 4px solid #EC4040;
  border-radius: 100vh;
  background-color: #EC4040;
  box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
  font-size: 1.6rem;
  color: var(--c-white);
  text-align: left;
  line-height: 1.2;
  cursor: pointer;
}
.c-input-button_link label::before,
.c-input-button_link label::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2rem;
  height: 2rem;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.c-input-button_link label::before {
  left: 1.2rem;
  background-image: url(../img/icon_check_white_g.svg);
}
.c-input-button_link label::after {
  right: 1.2rem;
  background-image: url(../img/icon_blank_white.svg);
}
.c-input-button_link input {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}
.c-input-button_link input:checked + label {
  border: 4px solid var(--c-btn--border_red);
  background-color: var(--c-white);
  color: var(--c-black);
}
.c-input-button_link input:checked + label::before {
  background-image: url(../img/icon_check_red.svg);
}
.c-input-button_link input:checked + label::after {
  background-image: url(../img/icon_blank_red.svg);
}


/* Input ----------------------------------------------------------------- */
/*input-item */
.c-input-item {
  width: 100%;
}
.c-input-item:not(:first-child) {
  margin-top: 2rem;
}
.c-input-item__title {
  display: block;
  margin-bottom: 1rem;
  font-size: 1.4rem;
}
.c-input-item__title span {
  padding-left: .5rem;
  color: var(--c-gray-text);
  font-size: 1.2rem;
}
.c-input-item__list-item {
  width: 100%;
}
.c-input-item__list-item:not(:nth-of-type(1)) {
  margin-top: 2rem;
}
@media screen and (min-width: 48.0625em) {
  .c-input-item__list {
    display: flex;
    align-items: flex-end;
    gap: 2rem;
    width: 100%;
  }
  .c-input-item__list--center {
    justify-content: center;
  }
  .c-input-item__list-item {
    max-width: 38rem;
  }
  .c-input-item__list-item--large {
    max-width: 50rem;
  }
  .c-input-item__list-item:not(:nth-of-type(1)) {
    margin-top: 0;
  }
}

/*input-text */
.c-input-text {
  padding: 1.5rem;
  width: 100%;
  border: 2px solid var(--c-l_gray);
  border-radius: .8rem;
  font-size: 1.6rem;
}
.c-input-text:focus {
  border: 2px solid var(--c-red);
  outline: 1px solid var(--c-red);
}
.c-input-text::placeholder {
  color: var(--c-gray);
}
.c-input-text:disabled {
  background-color: var(--c-l_gray);
}
@media screen and (min-width: 48.0625em) {
  .c-input-text {
    max-width: 38rem;
  }
  .c-input-text--large {
    max-width: 50rem;
  }
}

/*password*/
.c-password {
  position: relative;
  padding-right: 4.5rem;
  z-index: 1
}


/* Error ----------------------------------------------------------------- */
.c-error {
  margin-top: 2rem;
  padding: 2rem;
  border-radius: .8rem;
  background-color: #E8E8E8;
  font-size: 1.4rem;
}
.c-error__text {
  color: var(--c-red);
}
.c-content__item .c-error {
  margin-top: 1rem;
}
@media screen and (min-width: 48.0625em) {
  .c-error {
    text-align: center;
  }
}


/* Info ----------------------------------------------------------------- */
.c-info {
  margin-top: 2rem;
  padding: 1rem;
  border: 1px solid var(--c-red);
  border-radius: .8rem;
  font-size: 1.4rem;
}
.c-info__text {
  color: var(--c-red);
}
.c-content__item .c-info {
  margin-top: 1rem;
}
@media screen and (min-width: 48.0625em) {
  .c-info {
    text-align: center;
  }
}


/* Complete ----------------------------------------------------------------- */
.c-complete {
  text-align: center;
}
.c-complete__title {
  font-size: 1.8rem;
  font-weight: 700;
}
.c-complete__date {
  margin-top: .5rem;
}
.c-complete__date span {
  margin-right: 1rem;
}
.c-complete__note {
  margin-top: 2rem;
  text-align: left;
}
@media screen and (min-width: 48.0625em) {
  .c-complete__note {
    text-align: center;
  }
}


/* Text ----------------------------------------------------------------- */
/*-- link --*/
.c-textlink {
  display: inline;
  color: #003399;
  text-align: left;
  text-decoration: underline;
  cursor: pointer;
}
.c-textlink:hover {
  color: var(--c-red);
}
.c-textlink--arrow-wrapper {
  position: relative;
  padding: 0 1.5rem;
}
.c-textlink--arrow-left::before {
  content: "";
  position: absolute;
  left: 0;
  top: .8rem;
  display: block;
  width: .6rem;
  height: 1rem;
  background-image: url(../img/arrow_right_gray.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.c-textlink--arrow-left:hover:before {
  background-image: url(../img/arrow_right_red.svg);
}
.c-textlink--target_blank::after {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  transform: translateY(.1em);
  background-image: url(../img/icon_blank_red.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}




/* ==========================================================================
	Project
	========================================================================== */

.alert {
  display: none;
  margin-top: .5rem;
  width: 100%;
}
.alert p {
  color: var(--c-red);
  font-size: 1.4rem;
}
.errorField {
  background-color: var(--c-pink);
}

/* u100 ----------------------------------------------------------------- */
.p-u100-02__list {
  border: 1px solid var(--c-l_gray);
  border-radius: .8rem;
  counter-reset: u100-counter;
}
.p-u100-02__item {
  position: relative;
  padding: 2rem;
}
.p-u100-02__item:not(:first-of-type) {
  border-top: 1px solid var(--c-l_gray);
}
.p-u100-02__item:not(:first-of-type)::before {
  content: "";
  position: absolute;
  top: -1.5rem;
  left: 50%;
  width: 2rem;
  height: 2rem;
  background-color: #FFF;
  border-top: 5px solid var(--c-red);
  border-right: 5px solid var(--c-red);
  transform: translateX(-50%) rotate(135deg);
}
.p-u100-02__item dt {
  position: relative;
  padding-left: 3.5rem;
  font-weight: 700;
}
.p-u100-02__item dt::before {
  content: counter(u100-counter);
  counter-increment: u100-counter;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2.5rem;
  height: 2.5rem;
  background-color: var(--c-red);
  color: #FFF;
  font-size: 1.4rem;
  line-height: 1;
}
.p-u100-02__item dd {
  margin-top: 1rem;
}
@media screen and (min-width: 48.0625em) {
  .p-u100-02__list {
    display: flex;
  }
  .p-u100-02__item {
    flex: 1;
  }
  .p-u100-02__item:not(:first-of-type) {
    border-top: none;
    border-left: 1px solid var(--c-l_gray);
  }
  .p-u100-02__item:not(:first-of-type)::before {
    top: 50%;
    left: -1.4rem;
    transform: translateY(-50%) rotate(45deg);
  }
}

.p-u100-03 input {
  ime-mode: disabled;
}
.p-u100-03__input {
  display: flex;
  flex-wrap: wrap;
  gap: 0 2rem;
}
.p-u100-03__input-item {
  position: relative;
  flex: 1;
}
.p-u100-03__input-item.p-u100-03__input-01 {
  flex: none;
  width: 5rem;
}
.p-u100-03__input-item.p-u100-03__input-01 input {
  text-align: center;
}
.p-u100-03__input-item:not(:first-of-type)::before {
  content: "";
  position: absolute;
  top: 50%;
  left: -1.5rem;
  width: 1rem;
  height: 1px;
  background-color: var(--c-gray-text);
}


/* u200 ----------------------------------------------------------------- */
.p-u200-error {
  margin-bottom: 4rem;
}
.p-u200__title {
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.4;
}
.p-u200__title span {
  padding-left: 1rem;
  font-size: 1.4rem;
  font-weight: normal;
}

.p-u200-01__text {
  color: var(--c-red);
  font-size: 1.4rem;
}
.p-u200-01__video {
  display: block;
  margin: 0 auto;
  width: 100%;
  max-width: 720px;
}

.p-u200-02__box {
  margin-top: 3rem;
}
.p-u200-02__title {
  padding-left: 2.5rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--c-red);
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.4;
  text-indent: -2.4rem;
}
.p-u200-02__list {
  margin-top: 1rem;
}
.p-u200-02__list > *:first-child {
  margin-top: 0;
}
.p-u200-02__list dt {
  position: relative;
  margin-top: 1rem;
  font-weight: 700;
}
.p-u200-02__list dd {
  position: relative;
  padding-left: 2rem;
  margin-top: .5rem;
}
.p-u200-02__list dd::before {
  content: "■";
  position: absolute;
  top: 0;
  left: 0;
}
.p-u200-02__list dd.lead {
  text-indent: 0;
  padding-left: 0;
}
.p-u200-02__list dd.lead::before {
  content: none;
}
.p-u200-02__list dd span {
  position: relative;
  display: block;
  padding-left: 2rem;
}
.p-u200-02__list dd span::before {
  content: "・";
  position: absolute;
  top: 0;
  left: 0;
}
.p-u200-02__box .c-content__item {
  margin: 2rem auto 0;
}

.p-u200-03 .p-u200-03__box {
  margin-top: 2rem;
}
.p-u200-03__box .c-content__item {
    margin: 2rem auto 0;
}
.p-u200-03__illust {
  display: block;
  margin: 0 auto;
  width: 100%;
  max-width: 720px;
}
.p-u200-03__list {
  margin-top: 2rem;
}
.p-u200-03__list-item {
  position: relative;
  padding-left: 2rem;
}
.p-u200-03__list-item::before {
  content: "■";
  position: absolute;
  top: 0;
  left: 0;
}
.p-u200-03__attention {
  margin-top: 1rem;
}
.p-u200-03__attention-item {
  position: relative;
  padding-left: 2rem;
  font-size: 1.4rem;
}
.p-u200-03__attention-item::before {
  content: "※";
  position: absolute;
  top: 0;
  left: 0;
}
.p-u200-03 .c-button-wrapper {
  margin-bottom: 1rem;
}

.p-u200-04__01 {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
}
@media screen and (min-width: 48.0625em) {
  .p-u200-01__text {
    text-align: center;
  }
  .p-u200-04__01 .c-input-button_link {
    margin-top: 0;
    width: calc(50% - 1rem);
    max-width: none;
  }
}



/* ==========================================================================
	Utility
	========================================================================== */

/*-- Font --*/
.u-font-bold {
  font-weight: 700;
}
.u-font-size14 {
  font-size: 1.4rem;
}
.u-font-size18 {
  font-size: 1.8rem;
}
.u-text-al {
	text-align: left;
}
.u-text-ac {
	text-align: center;
}
.u-text-ar {
	text-align: right;
}
.u-text-underline {
	text-decoration: underline;
}
@media screen and (min-width: 48.0625em) {
  .u-text-al--pc-ac {
    text-align: center;
  }
  .u-text-ac--pc-al {
    text-align: left;
  }
}

.u-color-red {
	color: var(--c-red);
}
.u-color-glay {
	color: var(--c-gray-text);
}

/*-- Margin --*/
.u-mb0 {
  margin-bottom: 0 !important;
}
.u-mb10 {
  margin-bottom: 1rem !important;
}
.u-mb15 {
  margin-bottom: 1.5rem !important;
}
.u-mb20 {
  margin-bottom: 2rem !important;
}
.u-mb40 {
  margin-bottom: 4rem !important;
}
.u-mt0 {
  margin-top: 0 !important;
}
.u-mt05 {
  margin-top: .5rem !important;
}
.u-mt10 {
  margin-top: 1rem !important;
}
.u-mt15 {
  margin-top: 1.5rem !important;
}
.u-mt20 {
  margin-top: 2rem !important;
}
.u-mt40 {
  margin-top: 4rem !important;
}

/*-- Display none --*/
@media screen and (min-width: 48.0625em) {
  .--nopc {
    display: none;
  }
}
@media screen and (max-width: 48.0625em) {
  .--nosp {
    display: none;
  }
}


/*-- print --*/
@media print {
  .l-header {
   position: relative !important;
  }
  .l-main {
    margin-top: 0 !important;
  }
}