@charset "UTF-8";
/* CSS Document */

/* =====
 * LAYOUT :: ALL DEVICE
=================================================================== */
.block-index-01 figure {position: relative;}
.block-index-01 figure figcaption {color: #fff;position: absolute;right: 2em;bottom: 1.8em;}
.block-index-01 figure figcaption span {display: block;text-align: right;}
.block-index-01 figure figcaption span:nth-child(1) {font-size: 156.25%;font-weight: bold;}
.block-index-01 figure figcaption span:nth-child(2) {font-size: 87.5%;}
.block-index-02 {padding: 3em 0 0;position: relative;z-index: 3;}
.block-index-02 .container {display: flex;flex-wrap: wrap;justify-content: space-between;width: 90%;max-width: 1100px;margin: 3em auto 0;position: relative;z-index: 1;}
.block-index-02 .container > div {width: 90%;margin: -5em auto 0;}
.block-index-02 .container > div div:nth-child(1) {text-align: center;padding: 2em;background: #fff;border-top-left-radius: 0.4em;border-top-right-radius: 0.4em;}
.block-index-02 .container > div div:nth-child(1) h4 {color: var(--codate-color2);font-size: 156.25%;font-weight: bold;}
.block-index-02 .container > div div:nth-child(1) h4::after {display: block;content: '';width: 80%;height: 1px;background: var(--codate-color2);margin: 0.5em auto;}
.block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) {font-size: 125%;font-weight: bold;}
.block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) > span {display: inline-block;padding-left: 6em;position: relative;}
.block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) > span > span:nth-of-type(1) {display: inline-block;color: #fff;font-weight: bold;text-align: center;line-height: 1.1;padding: 0.1em 0.25em;background: var(--codate-grad5);border-radius: 0.1em;position: absolute;top: 50%;left: 0;transform: translateY(-50%);}
.block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) > span > span:nth-of-type(1)::after {display: block;content: '';border-top: 0.4em solid transparent;border-bottom: 0.4em solid transparent;border-left: 0.4em solid #f37346;position: absolute;top: 50%;left: 100%;transform: translateY(-50%);}
.block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) > span > span:nth-of-type(1) span {font-size: 130%;}
.block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) > span > span:nth-of-type(2) {display: inline-block;font-size: 156.25%;font-weight: bold;background: var(--codate-grad5);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;position: relative;}
.block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) > span > span:nth-of-type(2) span {font-size: 240%;line-height: 1.1;}
.block-index-02 .container > div div:nth-child(2) {border-bottom-left-radius: 0.4em;border-bottom-right-radius: 0.4em;}
.block-index-03 {padding: 8em 0 5em;margin-top: -5em;background: var(--codate-grad4);}
.block-index-03 .container {width: calc(100% - 2.8em);max-width: 1100px;margin: 0 auto;padding-top: 5em;}
.block-index-03 .container > div {padding: 2.5em;background: #fff;box-sizing: border-box;border-radius: 0.4em;}
.block-index-03 .container > div h5 {color: var(--codate-color2);font-size: 125%;font-weight: bold;position: relative;}
.block-index-03 .container > div h5::before {display: block;content: attr(data-num);font-size: 420%;line-height: 1.2;background: var(--codate-grad3);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;color: transparent;position: absolute;top: -1.2em;left: 0;}
.block-index-03 .container > div .note {font-size: 75%;text-align: left;margin-top: 0.5em;}
.block-index-03 .container > div .note small {display: block;margin-top: 0.5em;}
.block-index-03 .container > div .note a {color: var(--default);text-decoration: none;padding-bottom: 0.3em;border-bottom: 1px solid var(--default);}
.block-index-03 #program-01 .container > div div {display: flex;flex-wrap: wrap;justify-content: space-between;}
.block-index-03 #program-01 .container > div div p {font-size: 87.5%;margin-top: 2em;width: 48%;}
.block-index-03 #program-01 .container > div div figure {width: 48.8%;margin-top: -2em;}
.block-index-03 #program-02 .container > div > div {display: flex;flex-wrap: wrap;justify-content: space-between;margin-top: 1em;position: relative;}
.block-index-03 #program-02 .container > div > div::before {display: block;content: '';width: 3em;height: 3em;background: url("../img/icon_01.svg") no-repeat center/contain;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.block-index-03 #program-02 .container > div > div > div {width: 48.8%;border-radius: 0.4em;overflow: hidden;}
.block-index-03 #program-02 .container > div > div > div div {text-align: center;padding: 1em 1.5em;background: #e3eef4;}
.block-index-03 #program-02 .container > div > div > div div p:nth-of-type(1) {color: var(--codate-color2);font-size: 125%;font-weight: bold;letter-spacing: 0.1em;margin: 0;}
.block-index-03 #program-02 .container > div > div > div div p:nth-of-type(2) {color: var(--codate-color2);font-size: 93.75%;font-weight: bold;letter-spacing: 0.1em;margin-top: 0.2em;padding: 0.1em 0 0.05em;border-radius: 1.5em;background: #fff;}
.block-index-03 #program-03 .container > div > div {display: flex;flex-wrap: wrap;justify-content: space-between;}
.block-index-03 #program-03 .container > div > div > div {width: 48.8%;}
.block-index-03 #program-03 .container > div > div > div p:nth-child(1) {font-size: 87.5%;margin-top: 2em;}
.block-index-03 #program-03 .container > div > div > div p:nth-child(1) strong {color: var(--codate-color3);font-weight: bold;}
.block-index-03 #program-03 .container > div > div > figure {width: 48.8%;margin-top: -2em;}
.block-index-03 #program-04 .container > div table {width: 100%;margin-top: 1.5em;border-radius: 0.4em;overflow: hidden;}
.block-index-03 #program-04 .container > div table tr th,
.block-index-03 #program-04 .container > div table tr td {font-size: 87.5%;padding: 1.5em 3em;vertical-align: middle;}
.block-index-03 #program-04 .container > div table tr th {background: #e3eef4;border-bottom: 1px solid #fff;font-weight: bold;vertical-align: middle;}
.block-index-03 #program-04 .container > div table tr td {background: #f5f5f5;border-left: 1px solid #fff;border-bottom: 1px solid #fff;}
.block-index-03 #program-05 .container > div figure {margin-top: 0.5em;}
.block-index-03 #program-05 .container > div > div {text-align: center;padding: 2em 3em 3em;margin-top: 2em;background: var(--codate-grad2);border-radius: 0.4em;}
.block-index-03 #program-05 .container > div > div p {color: #fff;font-weight: bold;margin-bottom: 0;}
.block-index-03 #program-05 .container > div > div div {margin-top: 1em;}
.block-index-03 #program-06 .container > div {border-bottom-left-radius: 0;border-bottom-right-radius: 0;}
.block-index-03 #program-06 .container > div > div:nth-of-type(1) {display: flex;flex-wrap: wrap;justify-content: space-between;}
.block-index-03 #program-06 .container > div > div:nth-of-type(1) > div {width: 48.8%;}
.block-index-03 #program-06 .container > div > div:nth-of-type(1) > div p:nth-child(1) {font-size: 87.5%;margin-top: 2em;}
.block-index-03 #program-06 .container > div > div:nth-of-type(1) > figure {width: 48.8%;margin-top: -2em;}
.block-index-03 #program-06 .container > div > div:nth-of-type(2) {}
.block-index-03 #program-06 .container > p {color: #fff;font-weight: bold;text-align: center;padding: 2.5em 1em 2em;border-bottom-left-radius: 0.4em;border-bottom-right-radius: 0.4em;background: var(--codate-color2);position: relative;}
.block-index-03 #program-06 .container > p::before {  display: block;content: '';border-left: 1em solid transparent;border-right: 1em solid transparent;border-top: 1em solid #fff;position: absolute;top: 0;left: 50%;transform: translateX(-50%);}
/* =====
* LAYOUT :: PC
=================================================================== */
@media only screen and (max-width: 1300px) {
  .block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) {font-size: 112.5%;}
  .block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) > span > span:nth-of-type(2) {font-size: 137.5%;}
  .block-index-03 #program-04 .container > div table tr th,
  .block-index-03 #program-04 .container > div table tr td {padding: 1em 1.5em;}
}
@media only screen and (min-width: 1025px) {}
/* =====
* LAYOUT :: TAB
=================================================================== */
@media only screen and (max-width: 1024px) {}
/* =====
* LAYOUT :: SP
=================================================================== */
@media only screen and (max-width: 768px) {
  .block-common-mv {z-index: 4;}
  .block-index-01 figure {height: 16em;}
  .block-index-01 figure img {height: 100%;object-fit: cover;}  
  .block-index-01 figure figcaption {text-shadow: 0 0 4px rgba(0,0,0,0.4);right: 1em;bottom: 0.7em;}
  .block-index-01 figure figcaption span:nth-child(1) {font-size: 137.5%;}
  .block-index-02 {padding: 2em 0 4.5em;}
  .block-index-02 .container {margin-top: 2em;width: 100%;}
  .block-index-02 .container > div {padding-bottom: 4.5em;position: relative;}
  .block-index-02 .container > div div:nth-child(1) {padding: 1em 0;}
  .block-index-02 .container > div div:nth-child(1) h4 {font-size: 137.5%;}
  .block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) > span {padding-left: 5em;}
  .block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) > span > span:nth-of-type(1) {font-size: 87.5%;}
  .block-index-02 .container > div div:nth-child(1) p:nth-of-type(1) > span > span:nth-of-type(2) {font-size: 125%;white-space: nowrap;}
  .block-index-02 .container > div div:nth-child(2) {position: absolute;top: calc(100% - 4em);left: 0;}
  .block-index-03 {padding: 3em 0;margin-top: -7em;}
  .block-index-03 .container > div {padding: 5vw;}
  .block-index-03 .container > div h5 {font-size: 137.5%;}
  .block-index-03 .container > div h5::before {font-size: 350%;top: -1.1em;}
  .block-index-03 #program-01 .container > div div p {font-size: 100%;margin: 1em 0 0;width: 100%;}
  .block-index-03 #program-01 .container > div div figure {width: 100%;margin-top: 1.5em;}
  .block-index-03 #program-02 .container > div > div::before {top: calc(50% - 0.75em);}
  .block-index-03 #program-02 .container > div > div > div {width: 100%;}
  .block-index-03 #program-02 .container > div > div > div:nth-child(2) {margin-top: 1.5em;}
  .block-index-03 #program-02 .container > div > div > div div p:nth-of-type(2) {font-size: 100%;}
  .block-index-03 #program-03 .container > div > div > div {width: 100%;}
  .block-index-03 #program-03 .container > div > div > div p:nth-child(1) {font-size: 100%;margin: 1.5em 0 0;}
  .block-index-03 #program-03 .container > div > div > figure {width: 100%;margin-top: 1.5em;}
  .block-index-03 #program-04 .container > div table tr th,
  .block-index-03 #program-04 .container > div table tr td {padding: 1em 0.75em;}
  .block-index-03 #program-04 .container > div table tr th {width: 9.5em;}
  .block-index-03 #program-04 .container > div table tr td small {display: block;} 
  .block-index-03 #program-05 .container > div figure {margin-top: 1em;}
  .block-index-03 #program-05 .container > div > div {padding: 5vw;}
  .block-index-03 #program-05 .container > div > div p {font-size: 112.5%;}
  .block-index-03 #program-06 .container > div > div:nth-of-type(1) > div {width: 100%;}
  .block-index-03 #program-06 .container > div > div:nth-of-type(1) > div p:nth-child(1) {font-size: 100%;margin-top: 0.5em;}
  .block-index-03 #program-06 .container > div > div:nth-of-type(1) > figure {width: 100%;margin-top: 1.5em;}
  .block-index-03 #program-06 .container > p {padding: 2em 0 1.5em;}
}
@media only screen and (max-width: 768px) and (orientation: landscape) {}
@media only screen and (max-width: 640px) {}
@media only screen and (max-width: 480px) {}