@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;600;700&display=swap");
/*------------------------
html body基本設定
------------------------*/
* {
  box-sizing: border-box;
}

html {
  width: 100%;
  height: 100%;
  font-size: 62.5%;
  word-break: break-all;
  scroll-behavior: smooth;
}

body {
  position: relative;
  font-size: 1.6rem;
  line-height: 1.8;
  font-weight: 400;
  /*  letter-spacing: 0.02em;; //ベース文字間設定*/
  word-break: normal;
  min-height: 100vh;
  min-height: -webkit-fill-available;
  font-family: "Noto Sans JP", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
}

*:target {
  scroll-margin-top: 80px;
}

article,
aside,
details,
figcaption,
figure,
main,
footer,
header,
menu,
nav,
section {
  display: block;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  word-break: break-word;
  line-break: strict;
  overflow-wrap: break-word;
  word-wrap: break-word;
}

ul:not([class]),
ol:not([class]) {
  padding-left: 1.25em;
}

ul[class],
ol[class] {
  list-style: none;
}

ul,
li {
  list-style: none;
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}
a.linkColor {
  color: #009794;
  text-decoration: underline;
}

span {
  font-weight: inherit;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

sup {
  position: relative;
  top: 0.3em;
  vertical-align: text-top;
  font-size: 0.75em;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
  border: none;
}

ul.disc li {
  list-style: disc;
  list-style-position: outside;
  line-height: 1.5;
  margin-left: 1em;
}

.center {
  text-align: center;
}

.fsItali {
  font-style: italic;
}

.flexContainer,
.flexcontainer {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  justify-content: space-between;
}
.flexContainer.jcFlexStart,
.flexcontainer.jcFlexStart {
  justify-content: flex-start;
}

.mt0 {
  margin-top: 0px !important;
}

.mt1 {
  margin-top: 1em !important;
}

.mt10 {
  margin-top: 10px !important;
}

.mt15 {
  margin-top: 15px !important;
}

.mt20 {
  margin-top: 20px !important;
}

.mt30 {
  margin-top: 30px !important;
}

.mt40 {
  margin-top: 40px;
}

.mt50 {
  margin-top: 50px;
}

.mt60 {
  margin-top: 60px;
}

.mt70 {
  margin-top: 70px;
}

.mt80 {
  margin-top: 80px;
}

.mt90 {
  margin-top: 90px;
}

.mt100 {
  margin-top: 100px;
}

.mb0 {
  margin-bottom: 0px !important;
}

.mb1 {
  margin-bottom: 1em !important;
}

.mb10 {
  margin-bottom: 10px !important;
}

.mb15 {
  margin-bottom: 15px !important;
}

.mb20 {
  margin-bottom: 20px !important;
}

.mb30 {
  margin-bottom: 30px !important;
}

.mb40 {
  margin-bottom: 40px;
}

.mb50 {
  margin-bottom: 50px;
}

.mb60 {
  margin-bottom: 60px;
}

.mb70 {
  margin-bottom: 70px;
}

.mb80 {
  margin-bottom: 80px;
}

.mb90 {
  margin-bottom: 90px;
}

.mb100 {
  margin-bottom: 100px;
}

.mtb90 {
  margin: 90px 0;
}

.pt10 {
  padding-top: 10px;
}

.pt20 {
  padding-top: 20px;
}

.pt30 {
  padding-top: 30px;
}

.pt40 {
  padding-top: 40px;
}

.pt50 {
  padding-top: 50px;
}

.pt60 {
  padding-top: 60px;
}

.pb10 {
  padding-bottom: 10px;
}

.pb20 {
  padding-bottom: 20px;
}

.pb30 {
  padding-bottom: 30px;
}

.pb40 {
  padding-bottom: 40px;
}

.pb50 {
  padding-bottom: 50px;
}

.pb60 {
  padding-bottom: 60px;
}

.w15 {
  width: 15%;
}

.w20 {
  width: 20%;
}

.w24 {
  width: 24%;
}

.w25 {
  width: 25%;
}

.w30 {
  width: 30%;
}

.w32 {
  width: 32%;
}

.w33 {
  width: 33%;
}

.w35 {
  width: 35%;
}

.w40 {
  width: 40%;
}

.w45 {
  width: 45%;
}

.w47 {
  width: 47%;
}

.w48 {
  width: 48%;
}

.w49 {
  width: 49%;
}

.w50 {
  width: 50%;
}

.w55 {
  width: 55%;
}

.w60 {
  width: 60%;
}

.w65 {
  width: 65%;
}

.w70 {
  width: 70%;
}

.w80 {
  width: 80%;
}

.w90 {
  width: 90%;
}

.w100 {
  width: 100%;
}

.hidden {
  display: none;
}

.pcHidden {
  display: none;
}

.spHidden {
  display: block;
}

.container {
  width: min(94%, 1200px);
  margin: 0 auto;
}

.tCenter {
  text-align: center;
}

.caption {
  font-size: 80%;
}

.btn {
  border-radius: 50px !important;
}
.btn.blue {
  color: #fff;
  background: #61A8F2 !important;
}
.btn.b_blue {
  border: 1px solid #61A8F2;
}

.bRadius10 {
  border-radius: 10px;
}

.bRadius20 {
  border-radius: 20px;
}

.bRadius50 {
  border-radius: 50px;
}

@media only screen and (max-width: 979px) {
  .spHidden {
    display: none;
  }
  .pcHidden {
    display: block;
  }
  .container {
    width: 100%;
  }
}
/*------ app image lightbox-------------*/
.lum-open .lum-close-button {
  opacity: 1;
  top: 20px;
  right: 20px;
}
.lum-open .lum-close-button:hover {
  opacity: 0.5;
}

/*------------------------
HEADER
------------------------*/
header {
  position: sticky;
  top: 0;
  display: flex;
  width: 100%;
  height: 80px;
  background: #fff;
  z-index: 3;
}
header .container {
  margin: 0 auto;
  width: min(98%, 1200px);
  height: 100%;
  padding: 0;
}
@media screen and (max-width: 768px) {
  header .container {
    max-width: 100%;
    padding: 20px 20px 15px;
  }
}
header .container .flexcontainer {
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: space-between;
}
header .container .flexcontainer .leftItem {
  width: 170px;
}
header .container .flexcontainer .leftItem h1 {
  margin: 0;
  padding: 0;
  line-height: 0;
}
header .container .flexcontainer .leftItem img {
  width: 170px;
}
header .container .flexcontainer .rightItem {
  flex-grow: 1;
  width: 70%;
}
header .container .flexcontainer .rightItem #top_nav {
  margin-bottom: 0.6em;
}
header .container .flexcontainer .rightItem #top_nav ul#topl_nav_list {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
header .container .flexcontainer .rightItem #top_nav ul#topl_nav_list li {
  margin-left: 1.5em;
}
header .container .flexcontainer .rightItem #top_nav ul#topl_nav_list li img.arrow {
  width: 0.6em;
  margin-left: 0.4em;
  vertical-align: middle;
}
header .container .flexcontainer .rightItem #top_nav ul#topl_nav_list li:hover {
  text-decoration: underline;
}
@media screen and (max-width: 1198px) {
  header {
    height: 65px;
  }
  header .container {
    width: 92%;
  }
}
@media screen and (max-width: 768px) {
  header .container {
    padding: 0;
  }
  header .container .flexcontainer .leftItem {
    width: 150px;
  }
  header .container .flexcontainer .leftItem .logo {
    margin-top: 8px;
  }
}

/* NAV ------------------------*/
#global_nav {
  position: relative;
  background-color: transparent;
  z-index: 1;
}
#global_nav .content-menu {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: top;
  justify-content: flex-end;
  column-gap: 2em;
}
#global_nav .content-menu li {
  list-style-type: none;
  text-align: center;
}
#global_nav .content-menu li a {
  display: block;
  font-weight: 500;
}
#global_nav .content-menu li a:hover {
  color: #0D3E80;
}
#global_nav .content-menu li.is-current {
  border-bottom: 10px solid #61A8F2;
}

@media screen and (max-width: 1205px) {
  #top_nav {
    display: none;
  }
  #global_nav {
    display: none;
  }
  .openbtn {
    position: fixed;
    top: 0;
    right: 20px;
    width: 40px;
    height: 65px;
    z-index: 9999;
    cursor: pointer;
  }
  .openbtn span {
    display: inline-block;
    transition: all 0.4s;
    position: absolute;
    right: 0;
    width: 100%;
    height: 5px;
    background: #0D3E80;
  }
  .openbtn span:nth-of-type(1) {
    top: 17px;
  }
  .openbtn span:nth-of-type(2) {
    top: 30px;
  }
  .openbtn span:nth-of-type(3) {
    top: 44px;
  }
  .openbtn.active span:nth-of-type(1) {
    top: 25px;
    right: 0;
    transform: translateY(6px) rotate(-45deg);
    width: 90%;
    background: rgba(255, 255, 255, 0.8);
  }
  .openbtn.active span:nth-of-type(2) {
    opacity: 0;
  }
  .openbtn.active span:nth-of-type(3) {
    top: 37px;
    right: 0;
    transform: translateY(-6px) rotate(45deg);
    width: 90%;
    background: rgba(255, 255, 255, 0.8);
  }
  #drawer_nav {
    position: fixed;
    top: 0;
    left: -120%;
    /* 画面の右側に隠すためのコード */
    width: 80%;
    max-width: 400px;
    height: 100vh;
    z-index: 999;
    background: #0D3E80;
    transition: all 0.6s;
  }
  #drawer_nav ul {
    position: absolute;
    top: 50%;
    left: 50%;
    padding: 0;
    width: 90%;
    z-index: 999;
    transform: translate(-50%, -50%);
    text-align: center;
  }
  #drawer_nav ul li {
    border-bottom: 1px solid #fff;
  }
  #drawer_nav ul li:first-child {
    border-top: 1px solid #fff;
  }
  #drawer_nav ul li a {
    display: block;
    padding: 20px 10px;
    color: #fff;
    letter-spacing: 0.1em;
    font-weight: bold;
    font-size: 18px;
  }
  #drawer_nav.list_active #drawer_nav_list {
    position: fixed;
    z-index: 999;
    width: 80%;
    max-width: 400px;
    height: 100vh;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }
  #drawer_nav.list_active {
    left: 0;
  }
  .drawer_overlay {
    display: none;
    box-sizing: border-box;
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 900;
  }
  .drawer_overlay.open {
    display: block;
  }
}
@media screen and (min-width: 1204px) {
  #drawer_nav,
  .openbtn {
    display: none;
  }
}
/*------------------------
accordion
------------------------*/
.accordion_item {
  /* max-width: 500px;*/
}
.accordion_item:not([open]) {
  margin-bottom: 15px;
}
.accordion_item summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding: 2.5em 2em 2.5em 15%;
  font-weight: 600;
  border-radius: 15px;
  background-color: #e5e5e5;
  cursor: pointer;
}
.accordion_item summary::-webkit-details-marker {
  display: none;
}
.accordion_item summary::before {
  content: "";
  position: absolute;
  top: 18px;
  left: 3%;
  width: 65px;
  height: 65px;
  background: url("../images/common/iconQ.svg") no-repeat;
  background-size: contain;
}
.accordion_item summary::after {
  content: "";
  width: 18px;
  height: 10px;
  margin-left: 10px;
  background: #0D3E80;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  transform: translateY(-25%) rotate(0);
  transition: transform 0.3s;
}
@media screen and (min-width: 992px) {
  .accordion_item summary::after {
    position: relative;
    top: 5px;
  }
}
.accordion_item[open] summary::after {
  transform: rotate(180deg);
}
.accordion_item .answer {
  margin: 0;
  padding: 2.5em 1em;
  transform: translateY(-10px);
  transition: transform 0.5s, opacity 0.5s;
  opacity: 0;
}
.accordion_item[open] .answer {
  position: relative;
  padding-left: 11%;
  transform: none;
  opacity: 1;
}
.accordion_item[open] .answer::before {
  content: "";
  position: absolute;
  top: 25px;
  left: 3%;
  width: 65px;
  height: 65px;
  background: url("../images/common/iconA.svg") no-repeat;
  background-size: contain;
}
@media screen and (max-width: 979px) {
  .accordion_item:not([open]) {
    margin-bottom: 55px;
  }
  .accordion_item summary {
    justify-content: center;
    padding: 2em;
  }
  .accordion_item summary::before {
    top: -35px;
    right: 0;
    left: 0;
    margin: 0 auto;
    width: 60px;
    height: 60px;
  }
  .accordion_item summary::after {
    position: absolute;
    bottom: 10px;
    margin-left: 0;
  }
  .accordion_item[open] .answer {
    padding-top: 100px;
    padding-left: 0;
    padding-right: 0;
  }
  .accordion_item[open] .answer::before {
    top: 25px;
    right: 0;
    left: 0;
    margin: 0 auto;
    width: 60px;
    height: 60px;
  }
  .accordion_item[open] .answer p br {
    display: none;
  }
}

/*------------------------
modalwindow
------------------------*/
.modal__bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 200%;
  height: 200%;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  /* 初期状態で非表示 */
  visibility: hidden;
  /* 初期状態で非表示 */
  transition: opacity 0.6s ease, visibility 0.6s ease;
  z-index: 999;
}

.modal__bg.is-active {
  opacity: 1;
  /* 非表示を解除 */
  visibility: visible;
  /* 非表示を解除 */
}

.modal__inner {
  position: fixed;
  z-index: 10010;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
  padding: 0 10px;
  opacity: 0;
  /* 初期状態で非表示 */
  visibility: hidden;
  /* 初期状態で非表示 */
  transition: opacity 0.6s ease, visibility 0.6s ease;
}

.modal__inner.is-active {
  opacity: 1;
  /* 非表示を解除 */
  visibility: visible;
  /* 非表示を解除 */
}

.modal-card {
  padding: 15px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 24px;
  position: absolute;
  width: 300px;
  min-height: 180px;
  background: #fff;
  border-radius: 15px;
  filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.4));
  visibility: hidden;
  /* 初期状態で非表示 */
  transition: opacity 0.6s ease, visibility 0.6s ease, transform 0.3s ease-in-out;
  transform: translate3d(0, 48px, 0);
  opacity: 0;
  /* 初期状態で非表示 */
  z-index: 1;
}
.modal-card.app01 {
  border: 5px solid #009794;
}
.modal-card.app02 {
  border: 5px solid #5697CA;
}

.modal-card.is-active {
  position: relative;
  z-index: 2;
  opacity: 1;
  /* 非表示を解除 */
  visibility: visible;
  /* 非表示を解除 */
  transform: translate3d(0, 0, 0);
}

.app01 .modal-card__heading {
  color: #009794;
}

.app02 .modal-card__heading {
  color: #5697CA;
}

.modal-card__heading {
  margin: 0;
  font-size: 2rem;
  font-weight: bold;
  line-height: 1.6;
}

.modal-card__text {
  margin: 0;
  font-size: 1.8rem;
  line-height: 1.6;
}

.modal-card__close {
  position: absolute;
  top: -17px;
  right: -15px;
  padding: 20px;
  width: 40px;
  height: 40px;
  background: #E3E3E3;
  border-radius: 30px;
}

.modal-card__close::before,
.modal-card__close::after {
  content: "";
  position: absolute;
  display: inline-block;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 2px;
  background: #666;
  cursor: pointer;
}

.modal-card__close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.modal-card__close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

/*------------------------
FOOTER
------------------------*/
footer {
  display: flex;
  align-items: center;
  height: 100px;
  color: #fff;
  /*  line-height: 1.5;*/
  text-align: center;
  background: #0D3E80;
  /* NAV ------------------------*/
}
footer a:hover {
  text-decoration: underline;
}
footer #footer_nav {
  margin-bottom: 5px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}
footer #footer_nav ul {
  justify-content: center;
  column-gap: 40px;
}
footer #footer_nav ul li {
  position: relative;
  display: inline-block;
}
footer #footer_nav ul li::after {
  content: "";
  display: inline-block;
  position: absolute;
  top: -2px;
  top: 15%;
  right: -20px;
  width: 1px;
  height: 68%;
  background: #fff;
}
footer #footer_nav ul li:last-child::after {
  display: none;
}
@media screen and (max-width: 768px) {
  footer {
    padding: 10px;
    height: auto;
    font-size: 80%;
  }
  footer #footer_nav {
    margin-bottom: 0;
    padding-bottom: 0px;
    border-bottom: none;
  }
}

/*------------------------
CookieAgreement 241128
------------------------*/
#name-ga-cookie-accept-bar {
  width: 100%;
  margin: 0;
  padding: 10px 0 10px 0;
  color: #003B83;
  background-color: #fff;
  box-shadow: 0 0 8px #999;
}
#name-ga-cookie-accept-bar a.cookie-accept-link {
  display: inline-flex;
  padding: 0 0 0 0;
  color: #003B83;
}
#name-ga-cookie-accept-bar a.cookie-accept-link i.fa-angle-double-right {
  margin-right: 0.25em;
}
#name-ga-cookie-accept-bar div.cookie-accept-message {
  padding: 5px 20px;
  line-height: 1.6;
}
#name-ga-cookie-accept-bar .cookie-accept-message-body {
  display: inline-block;
  vertical-align: top;
  width: 60%;
  margin: 0 5% 0 5%;
  position: relative;
}
#name-ga-cookie-accept-bar .cookie-accept-message-body:before {
  font-family: "Material Symbols Outlined";
  content: "\e002";
  color: #f0e000;
  position: absolute;
  margin-left: -1.5em;
  top: 0.05em;
}
#name-ga-cookie-accept-bar .cookie-accept-message-link {
  display: inline-block;
  vertical-align: top;
  width: 30%;
  margin: 0 0 0 0;
}
#name-ga-cookie-accept-bar div.cookie-accept-buttons {
  padding: 5px 20px;
  line-height: 1.6;
  text-align: center;
}
#name-ga-cookie-accept-bar div.cookie-accept-buttons button {
  margin: 0 0.5em;
}
@media screen and (max-width: 979px) {
  #name-ga-cookie-accept-bar .cookie-accept-message {
    display: flex;
    flex-direction: column;
  }
  #name-ga-cookie-accept-bar .cookie-accept-message .cookie-accept-message-body,
  #name-ga-cookie-accept-bar .cookie-accept-message .cookie-accept-message-link {
    margin: 0 5%;
    width: 90%;
  }
}

.ga-cookie-accept-button {
  display: inline-flex;
  padding: 0.1em 0.75em;
  border-radius: 0.5em;
  box-shadow: 0px;
  border: 1px solid #003B83;
  background-color: white;
}
.ga-cookie-accept-button .fa-check {
  margin-right: 0.25em;
  color: green;
}
.ga-cookie-accept-button .fa-times {
  color: #dd4444;
  margin-right: 0.25em;
}
.ga-cookie-accept-button:hover {
  background-color: #003B83;
  color: white;
}

/*------------------------
main wrapper基本設定
------------------------*/
main {
  position: relative;
  /* tab SET ------------------------*/
}
main .btn {
  position: relative;
  display: block;
  margin: auto;
  width: 250px;
  height: 60px;
  line-height: 60px;
  font-size: 18px;
  transition: 0.5s;
}
main .btn::after {
  position: absolute;
  top: 45%;
  right: 25px;
  content: "";
  width: 10px;
  height: 10px;
  border: 0px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  -ms-transform: rotate(45deg) translateY(-50%);
  -webkit-transform: rotate(45deg) translateY(-50%);
  transform: rotate(45deg) translateY(-50%);
  transition: 0.5s;
}
main .btn:hover:after {
  right: 20px;
}
main .btn.blue {
  margin-top: 50px;
}
main .btn.blue:hover {
  background: #0D3E80;
}
main .btn a {
  display: block;
}
main .container {
  position: relative;
  padding: 40px 0;
  margin: 0 auto;
}
@media screen and (max-width: 979px) {
  main .container {
    max-width: 100%;
    padding-left: 40px;
    padding-right: 40px;
  }
}
@media screen and (max-width: 768px) {
  main .container {
    max-width: 100%;
    padding: 40px 3%;
  }
}
main .container.w100 {
  max-width: 100%;
  margin: 0 auto;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}
@media screen and (max-width: 979px) {
  main .container.w100 {
    max-width: 100%;
    padding-left: 40px;
    padding-right: 40px;
  }
}
@media screen and (max-width: 768px) {
  main .container.w100 {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }
}
main .container.w100 .innerContainer {
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;
  padding-left: 40px;
  padding-right: 40px;
}
@media screen and (max-width: 768px) {
  main .container.w100 .innerContainer {
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width: 768px) {
  main .container.spw100 {
    padding-left: 0;
    padding-right: 0;
    padding-top: 0;
  }
}
main .container .font30 {
  font-size: clamp(2.4rem, 2.182rem + 1.09vw, 3rem);
}
main .container .font24 {
  font-size: clamp(1.8rem, 1.582rem + 1.09vw, 2.4rem);
}
main .container .lead_text {
  margin-bottom: 40px;
  color: #0D3E80;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  line-height: 40px;
}
main .container80 {
  margin: auto;
  max-width: 1000px;
}
main .container .grid2,
main .container80 .grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
main .container .grid3,
main .container80 .grid3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}
main .main_title {
  position: relative;
  height: 200px;
  color: #fff;
  background: url("../images/maintitleBK-pc.png") no-repeat;
  background-position: center;
  background-size: cover;
  overflow: hidden;
}
main .main_title .textwrap {
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  margin: 0;
  padding: 0;
  width: 90%;
  text-align: center;
}
main .main_title .textwrap h2 {
  font-size: clamp(2.9rem, 1.648rem + 2.39vw, 4rem);
  line-height: 1.2;
}
main .main_title .textwrap p {
  margin-top: 10px;
  font-size: clamp(1.8rem, 1.533rem + 0.89vw, 2.2rem);
}
main section .point_icon {
  max-width: 160px;
}
main .ttlCol {
  margin-bottom: 45px;
}
main .ttlCol h3,
main .ttlCol h4 {
  margin-top: 20px;
  font-size: clamp(2.2rem, 1.8rem + 1.09vw, 3rem);
}
main .ttlCol h3 span,
main .ttlCol h4 span {
  display: block;
  font-weight: normal;
  font-size: 16px;
}
main .font_keyColor {
  color: #0D3E80;
}
@media screen and (max-width: 979px) {
  main .w45,
  main .w50 {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  main .main_title {
    height: 135px;
  }
  main .main_title .textwrap p {
    margin-top: 10px;
  }
  main .container .w30,
  main .container .w32,
  main .container .w35,
  main .container .w40,
  main .container .w47,
  main .container .w48,
  main .container .w55,
  main .container .w60,
  main .container80 .w30,
  main .container80 .w32,
  main .container80 .w35,
  main .container80 .w40,
  main .container80 .w47,
  main .container80 .w48,
  main .container80 .w55,
  main .container80 .w60 {
    width: 100%;
  }
  main .container .lead_text,
  main .container80 .lead_text {
    text-align: left;
  }
  main .ttlCol.tCenter p,
  main p.tCenter {
    text-align: left;
  }
  main p.mt50 {
    margin-top: 0;
  }
}
main .tabContainer {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: 50px;
}
main .tabContainer .btn {
  margin: inherit;
}
main .tabContainer .btn::after {
  right: 40px;
  width: 20px;
  height: 20px;
}
@media screen and (max-width: 768px) {
  main .tabContainer {
    column-gap: 25px;
  }
}
main .tabContainer label {
  order: -1;
  padding: 0 40px;
  min-width: 500px;
  height: 100px;
  line-height: 100px;
  font-weight: 600;
  font-size: clamp(1.8rem, 1.582rem + 1.09vw, 2.4rem);
  cursor: pointer;
}
main .tabContainer label:hover {
  opacity: 0.8;
}
main .tabContainer input {
  display: none;
}
main .tabContainer > div {
  display: none;
}
main .tabContainer label.app01 {
  margin-bottom: 25px;
  color: #009794;
  border: 1px solid #009794;
  border-radius: 15px;
}
main .tabContainer label.app01::after {
  border-top: solid 2px #009794;
  border-right: solid 2px #009794;
}
main .tabContainer label.app01:has(:checked) {
  color: #fff;
  background: #009794;
}
main .tabContainer label.app01:has(:checked)::after {
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}
main .tabContainer label.app02 {
  color: #0099CE;
  border: 1px solid #0099CE;
  border-radius: 15px;
}
main .tabContainer label.app02::after {
  border-top: solid 2px #0099CE;
  border-right: solid 2px #0099CE;
}
main .tabContainer label.app02:has(:checked) {
  color: #fff;
  background: #0099CE;
}
main .tabContainer label.app02:has(:checked)::after {
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
}
main .tabContainer label:has(:checked) + div {
  display: block;
}
@media screen and (max-width: 979px) {
  main .tabContainer label {
    min-width: 100%;
  }
}

@media only screen and (min-width: 980px) {
  #features main .container p br:not(.spHidden),
  #features main .inner p br {
    display: none;
  }
}
/* ---------------------    
TOP PAGE
---------------------- */
#home main .caption {
  font-size: 0.8em;
}
#home main .btn {
  margin-left: 0;
  padding-left: 25px;
  text-align: left;
}
#home main .mainVisual {
  width: 100%;
  height: clamp(800px, 80vh, 840px);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url("../images/mainvisualBK-pc.jpg");
  background-position: 50%;
  background-size: cover;
}
#home main .mainVisual .inner {
  position: relative;
  width: min(90%, 1280px);
  height: 90%;
}
#home main .mainVisual .inner .textwrap {
  width: 100%;
  text-align: center;
  z-index: 2;
}
#home main .mainVisual .inner .textwrap h2 {
  margin-bottom: 10px;
  font-size: clamp(2.4rem, 1.3333rem + 5.3333vw, 5.6rem);
  line-height: 1.4;
}
#home main .mainVisual .inner .textwrap h2 span {
  display: inline-block;
}
#home main .mainVisual .inner .textwrap .main_logo {
  width: min(55%, 500px);
}
#home main .mainVisual .inner .floatImg {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 44%;
}
@media screen and (max-width: 979px) {
  #home main .mainVisual .inner .textwrap {
    width: 100%;
    text-align: center;
    z-index: 2;
  }
  #home main .mainVisual .inner .textwrap h2 {
    margin-bottom: 10px;
    font-size: clamp(2.4rem, 1.3333rem + 5.3333vw, 5.6rem);
    line-height: 1.2;
  }
  #home main .mainVisual .inner .textwrap .main_logo {
    width: min(55%, 500px);
  }
  #home main .mainVisual .inner .floatImg {
    position: absolute;
    left: 50%;
    right: auto;
    bottom: 0;
    width: 70%;
    transform: translateX(-50%);
  }
}
@media screen and (max-width: 768px) {
  #home main .mainVisual {
    background-image: url("../images/mainvisualBK-sp.jpg");
    height: max(840px, 90vh);
  }
  #home main .mainVisual .inner {
    width: 96%;
    height: 86%;
  }
  #home main .mainVisual .inner .textwrap {
    width: 100%;
    text-align: center;
    z-index: 2;
  }
  #home main .mainVisual .inner .textwrap h2 {
    margin-bottom: 6px;
    font-size: 2.7rem;
    line-height: 1.4;
  }
  #home main .mainVisual .inner .textwrap .main_logo {
    width: 80%;
  }
  #home main .mainVisual .inner .floatImg {
    width: 90%;
  }
}
#home main .con01 h2,
#home main .con03 h2 {
  position: relative;
  margin-bottom: 30px;
  padding-left: 27px;
  font-size: 30px;
  line-height: 1.2;
}
#home main .con01 h2 span,
#home main .con03 h2 span {
  display: block;
  margin-bottom: 10px;
  color: #0D3E80;
  font-size: 67%;
}
#home main .con01 h2::before,
#home main .con03 h2::before {
  content: "";
  position: absolute;
  top: 5%;
  left: 0;
  width: 10px;
  height: 90%;
  background: #0D3E80;
}
#home main section:not(.con02) {
  padding: 80px 0;
}
#home main .con01 .inner span a {
  text-decoration: underline;
}
#home main .con01 .inner span a:hover {
  text-decoration: none;
}
#home main .con02 .w50:first-child {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  color: #fff;
  background: #333;
}
#home main .con02 .w50:first-child .inner {
  margin: 10%;
}
#home main .con02 .w50:first-child .inner h2 {
  position: relative;
  margin-bottom: 30px;
  padding-left: 27px;
  color: #14B4B4;
  line-height: 2;
}
#home main .con02 .w50:first-child .inner h2 span {
  display: block;
  color: #fff;
  font-size: 80%;
}
#home main .con02 .w50:first-child .inner h2::before {
  content: "";
  position: absolute;
  top: 12%;
  left: 0;
  width: 10px;
  height: 70%;
  background: #fff;
}
#home main .con02 .object-fit-cover {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#home main .con03 {
  background: #D7E9FC;
}
#home main .con04 {
  background: white;
  text-align: center;
}
#home main .con04 p.title {
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 1em;
}
#home main .con04 .ph {
  margin: 0 auto;
}
#home main .con04 .btn {
  margin: 2em auto 0;
}
@media screen and (max-width: 979px) {
  #home main .btn {
    margin-left: auto;
  }
  #home main .imagewrap {
    height: auto !important;
  }
  #home main section:not(.con02, .con04) {
    padding: 0;
  }
  #home main .con02 .w50:first-child {
    justify-content: flex-start;
  }
  #home main .con02 .w50:first-child .inner {
    margin: 40px 5%;
  }
  #home main .con03 .flexContainer {
    flex-direction: column-reverse;
  }
  #home main .con04 .flexcontainer {
    width: 90%;
    margin: 0 auto;
    gap: 2em;
    flex-direction: column;
  }
}
@media screen and (max-width: 768px) {
  #home main .con01 h2,
  #home main .con03 h2 {
    margin-bottom: 25px;
    padding-left: 0;
    font-size: 32px;
    text-align: center;
  }
  #home main .con01 h2 span,
  #home main .con03 h2 span {
    display: inherit;
    margin-bottom: 20px;
  }
  #home main .con01 h2 span::before,
  #home main .con03 h2 span::before {
    content: "";
    position: absolute;
    top: 25%;
    left: 0;
    right: 0;
    margin: auto;
    width: 60%;
    height: 5px;
    background: #0D3E80;
  }
  #home main .con01 h2::before,
  #home main .con03 h2::before {
    display: none;
  }
  #home main .con02 .w50:first-child .inner h2 {
    margin-bottom: 25px;
    padding-left: 0;
    font-size: 32px;
    text-align: center;
  }
  #home main .con02 .w50:first-child .inner h2 span {
    display: inherit;
    margin-bottom: 10px;
  }
  #home main .con02 .w50:first-child .inner h2 span::before {
    content: "";
    position: absolute;
    top: 40%;
    left: 0;
    right: 0;
    margin: auto;
    width: 60%;
    height: 5px;
    background: #fff;
  }
  #home main .con02 .w50:first-child .inner h2::before {
    display: none;
  }
  #home main .con02 .object-fit-cover {
    height: auto;
  }
  #home main .con03 .container {
    padding-bottom: 0;
  }
  #home main .con03 .container .full-width {
    margin-top: 40px;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    width: 106%;
  }
  #home main .con03 .container .full-width img {
    border-radius: inherit;
  }
}

/* ---------------------    
Features PAGE
---------------------- */
#features main .con01 .ttlCol .ph {
  max-width: 640px;
  margin: 30px auto;
}
#features main .con01 .flexContainer .w47 .blue_box {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  padding: 37px;
  background: #D7E9FC;
  border-radius: 10px;
}
#features main .con01 .flexContainer .w47 .blue_box h4 {
  color: #0D3E80;
}
#features main .con01 .flexContainer .w47 button {
  margin-top: 30px;
}
#features main .con01 .ph {
  margin: 50px 0;
}
#features main .con01 p.ph img {
  border: 1px solid #B2B2B2;
}
#features main .con02 {
  padding: 40px 0;
  background: #C4ECEC;
}
#features main .con02 .bgLblue {
  padding: 30px;
  background: #fff;
  border-radius: 15px;
}
#features main .con02 .bgLblue h4 {
  margin-bottom: 24px;
  text-align: center;
  font-size: 24px;
}
#features main .con02 .bgLblue.w60 h4 {
  color: #009794;
}
#features main .con02 .bgLblue.w35 h4 {
  color: #0099CE;
}
#features main .con02 .bgLblue .grid3,
#features main .con02 .bgLblue .grid2 {
  row-gap: 30px;
}
#features main .con02 .bgLblue .grid3 {
  grid-template-columns: 30% 39% 31%;
}
#features main .con02 .bgLblue li {
  display: flex;
  align-items: center;
  column-gap: 15px;
}
#features main .con02 .bgLblue li img {
  max-width: 50px;
}
#features main .con02 .bgLblue li p {
  color: #141414;
  flex: 1;
}
#features main .con03 .w32 {
  padding-right: 21px;
  border-right: 1px solid #4D4D4D;
}
#features main .con03 .w32:last-child {
  padding-right: 0;
  border-right: none;
}
#features main .con03 .w32 .inner {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
#features main .con03 .w32 .inner .firstLine h4 {
  margin-bottom: 20px;
  color: #0D3E80;
}
#features main .con03 .w32 .inner .secondLine {
  margin-top: 30px;
}
#features main .con03 .w32 .inner .secondLine img {
  border: 1px solid #B2B2B2;
}
#features main .con03 .w32 .inner a {
  text-decoration: underline;
}
#features main .con03 .w32 .inner a:hover {
  text-decoration: none;
}
@media screen and (max-width: 979px) {
  #features main .container80 {
    max-width: 100%;
    padding: 40px 3%;
  }
  #features main .container .flexContainer,
  #features main .container80 .flexContainer {
    row-gap: 30px;
  }
}
@media screen and (max-width: 768px) {
  #features main .ttlCol {
    margin-bottom: 25px;
  }
  #features main .con01 .ph {
    margin: 20px 0;
  }
  #features main .con01 .flexContainer .w47 .blue_box {
    padding: 20px;
  }
  #features main .con02 .bgLblue {
    padding: 15px;
  }
  #features main .con02 .bgLblue .grid3,
  #features main .con02 .bgLblue .grid2 {
    grid-template-columns: 1fr 1fr 1fr;
    row-gap: 15px;
  }
  #features main .con02 .bgLblue li {
    flex-direction: column;
  }
  #features main .con02 .bgLblue li img {
    max-width: 80px;
  }
  #features main .con02 .bgLblue li p {
    font-size: 90%;
  }
  #features main .con03 .w32 {
    padding-right: 0;
    padding-bottom: 35px;
    border-right: none;
    border-bottom: 1px solid #4D4D4D;
  }
  #features main .con03 .w32:last-child {
    padding-bottom: 0;
    border-bottom: none;
  }
  #features main .con03 .w32 .inner .firstLine h4 {
    text-align: center;
  }
}

/* ---------------------    
FLOW PAGE
---------------------- */
#flow main .con01 {
  background: #D7E9FC;
}
#flow main .con02 .flexContainer {
  row-gap: 30px;
}
#flow main .con02 .tabel_ttl {
  display: flex;
  justify-content: space-between;
}
#flow main .con02 table {
  width: 100%;
}
#flow main .con02 table,
#flow main .con02 td,
#flow main .con02 th {
  border: 1px solid #141414;
  border-collapse: collapse;
}
#flow main .con02 th {
  padding: 3px;
  color: #fff;
}
#flow main .con02 .app01 th {
  background: #009794;
}
#flow main .con02 .app02 th {
  background: #0099CE;
}
#flow main .con02 td {
  padding: 5px 10px;
}
#flow main .con02 p.caption {
  margin-top: 5px;
  font-size: 70%;
  line-height: 1.6;
}
@media screen and (max-width: 768px) {
  #flow main .con02 .tabel_ttl {
    display: block;
    text-align: center;
  }
  #flow main .con02 .vertically {
    -webkit-writing-mode: vertical-lr;
    -ms-writing-mode: tb-lr;
    writing-mode: vertical-lr;
    vertical-align: middle;
    white-space: pre;
  }
}

/* ---------------------    
Reason PAGE
---------------------- */
#reason main .con01 .font_keyColor {
  margin-bottom: 45px;
  font-weight: bold;
}
#reason main .con01 .ttlCol h3 {
  margin-bottom: 30px;
}
#reason main .con01 .service {
  /* ===== image hover tooltips PC START ==== */
  /* ===== image hover tooltips PC END ==== */
}
#reason main .con01 .service .tooltip_wrap {
  position: relative;
  width: 100%;
  margin: 0 auto;
}
#reason main .con01 .service .svgimg_box .tooltip_hover .tooltip_bg {
  fill: #f687c7;
}
#reason main .con01 .service .svgimg_box .tooltip_hover:hover {
  cursor: pointer;
}
#reason main .con01 .service .svgimg_box .tooltip_hover:hover .tooltip_bg {
  fill: #D4145A;
}
#reason main .con01 .service .svgimg_box .tooltip_hover:hover .tooltip_title {
  fill: #fff;
}
#reason main .con01 .service .svgimg_box img {
  width: 100%;
  margin: 0;
  -o-object-fit: contain;
  object-fit: contain;
}
#reason main .con01 .service .svgimg_box svg {
  position: absolute;
  top: 0;
  left: 0;
}
#reason main .con01 .service .svg_detail_box {
  position: absolute;
  top: 0;
  display: block;
  width: 100%;
}
#reason main .con01 .service .svg_detail_box .svg_detail_img {
  position: relative;
}
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_01,
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_02,
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_03,
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_04,
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_05 {
  display: none;
}
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_01.hover,
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_02.hover,
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_03.hover,
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_04.hover,
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_05.hover {
  position: absolute;
  width: 250px;
  height: auto;
}
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_01.hover {
  top: 30px;
  left: 8%;
}
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_02.hover {
  top: 20px;
  left: 23%;
}
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_03.hover {
  top: 20px;
  right: 27%;
}
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_04.hover {
  top: 180px;
  left: 33%;
}
#reason main .con01 .service .svg_detail_box .svg_detail_img #ph_05.hover {
  top: 180px;
  right: 14%;
}
#reason main .con01 .service .svg_detail_box .svg_detail_img .hover {
  display: block !important;
}
#reason main .con01 .service .svg_detail_box .svg_detail_img .hidden {
  display: none;
}
#reason main .con01 .service .tooltips .link:hover use {
  fill: #F60C5B;
}
#reason main .con01 .specialist {
  padding: 40px;
  background: #E5E5E5;
}
#reason main .con01 .specialist .w48 .inner {
  column-gap: 10px;
}
#reason main .con01 .specialist .w48 .inner .detail {
  flex: 1;
}
#reason main .con01 .specialist .w48 .inner .detail h4 {
  margin-bottom: 15px;
  font-size: 18px;
  line-height: 1.6;
}
#reason main .con02 {
  background: #C4ECEC;
}
#reason main .con02 .tabel_ttl {
  display: flex;
  justify-content: space-between;
}
#reason main .con02 table {
  width: 100%;
}
#reason main .con02 table,
#reason main .con02 td,
#reason main .con02 th {
  border: 1px solid #C4ECEC;
  border-collapse: collapse;
}
#reason main .con02 td,
#reason main .con02 th {
  padding: 20px;
}
#reason main .con02 th {
  color: #fff;
  background: #0D3E80;
}
#reason main .con02 tbody tr:nth-child(odd) {
  background: #fff;
}
#reason main .con02 tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.5);
}
#reason main .con02 tbody tr:last-child td {
  padding: 5px 20px;
}
#reason main .con02 ol {
  margin: 50px 0;
}
#reason main .con02 ol h4 {
  font-size: 1.7rem;
  margin-bottom: 20px;
}
#reason main .customer_voice {
  margin-top: 50px;
  padding: 45px 130px;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 15px;
}
#reason main .customer_voice h3 {
  margin-bottom: 24px;
  text-align: center;
  font-size: 24px;
}
#reason main .customer_voice ul {
  gap: 30px;
}
#reason main .customer_voice ul li {
  display: flex;
  align-items: center;
  column-gap: 15px;
}
#reason main .customer_voice ul li img {
  max-width: 50px;
}
#reason main .customer_voice ul li p {
  flex: 1;
}
@media screen and (max-width: 979px) {
  #reason main .con01 .specialist {
    padding: 20px;
  }
  #reason main .con01 .specialist .ttlCol h4 {
    font-size: clamp(1rem, 1.4rem + 1.09vw, 3rem);
  }
  #reason main .con01 .specialist .flexContainer .w100 {
    line-height: 1.4;
  }
  #reason main .con01 .specialist .flexContainer .w100 .flexContainer {
    justify-content: flex-start;
    column-gap: 15px;
  }
  #reason main .con01 .specialist .flexContainer .w100 .flexContainer .detail {
    font-size: 14px;
    flex: 1;
  }
  #reason main .con01 .specialist .flexContainer .w100 p {
    margin-top: 10px;
    font-size: 90%;
  }
  #reason main .con01 .specialist .flexContainer .w100:last-child {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #4D4D4D;
  }
  #reason main .con02 .table-scroll {
    overflow-x: scroll;
  }
  #reason main .con02 table {
    width: 990px;
  }
  #reason main .con02 .customer_voice {
    padding: 30px;
  }
}
@media screen and (max-width: 768px) {
  #reason main .con02 ol.flexContainer {
    row-gap: 30px;
  }
}

/* ---------------------    
APP PAGE
---------------------- */
#app .lum-lightbox.lum-open {
  z-index: 10;
}
#app main .tabItem .inner {
  padding-top: 40px;
}
#app main .tabItem .inner h3 {
  margin-bottom: 40px;
}
#app main .tabItem .inner h4 {
  margin-bottom: 15px;
}
#app main .tabItem .inner .flexContainer {
  row-gap: 50px;
}
#app main .tabItem .inner .flexContainer .w48 {
  padding: 35px 35px 40px;
  border-radius: 15px;
}
#app main .tabItem .inner .flexContainer .w48 figure {
  margin: 20px auto 0;
  text-align: center;
}
#app main .tabItem .inner .flexContainer .w48 figure figcaption {
  margin-bottom: 15px;
}
#app main .tabItem .inner .flexContainer .w48 figure a {
  position: relative;
  display: block;
}
#app main .tabItem .inner .flexContainer .w48 figure a::after {
  content: "+";
  position: absolute;
  top: -15px;
  right: -15px;
  color: #666;
  font-size: 28px;
  font-weight: bold;
  width: 40px;
  height: 40px;
  line-height: 40px;
  background: #E5E5E5;
  border-radius: 50px;
}
#app main .tabItem .inner .flexContainer .w48 figure a img {
  border: 1px solid #B2B2B2;
}
#app main #tab1 .w48 {
  border: 5px solid #009794;
}
#app main #tab2 .w48 {
  border: 5px solid #0099CE;
}
#app main .tabItem h4 {
  display: flex;
  align-items: center;
  column-gap: 15px;
}
#app main .tabItem h4 span {
  max-width: 50px;
}
#app main #page-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-size: 14px;
  line-height: 1;
  z-index: 9;
}
#app main #page-top a {
  display: block;
  padding: 22px 5px;
  width: 60px;
  color: #0D3E80;
  text-align: center;
  background: #fff;
  border: 1px solid #0D3E80;
  border-radius: 90px;
  opacity: 0.9;
  transition: all 0.3s ease;
}
#app main #page-top a:hover {
  opacity: 0.5;
}
@media screen and (max-width: 768px) {
  #app main #tab1 .inner {
    padding-top: 0;
  }
  #app main #tab2 .inner {
    padding-top: 25px;
  }
  #app main #tab1 h3,
  #app main #tab2 h3 {
    margin: 30px 0;
    padding-bottom: 10px;
    border-bottom: 1px solid #141414;
  }
  #app main #tab1 .flexContainer .w48,
  #app main #tab2 .flexContainer .w48 {
    padding: 0;
    border: none;
  }
}

/* ---------------------    
QUESTION PAGE
---------------------- */
#faq .accordion {
  margin-top: 50px;
}
#faq .answer p br {
  display: block;
}

/* ---------------------    
Movie PAGE
---------------------- */
#movie .con01 .container {
  width: min(90%, 1200px);
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 0;
}
#movie .con01 h2 {
  position: relative;
  margin-bottom: 30px;
  padding-left: 27px;
  font-size: 30px;
  line-height: 1.2;
}
#movie .con01 h2 span {
  display: block;
  margin-bottom: 10px;
  color: #0D3E80;
  font-size: 67%;
}
#movie .con01 h2::before {
  content: "";
  position: absolute;
  top: 5%;
  left: 0;
  width: 10px;
  height: 90%;
  background: #0D3E80;
}
#movie .con01 .flexContainer {
  margin-bottom: 3em;
  gap: 1em;
}
#movie ul.disc {
  margin: 0 0 1em 1em;
}
#movie .w50 {
  position: relative;
}
#movie .con02 .container {
  width: min(90%, 1200px);
  margin-left: auto;
  margin-right: auto;
  padding: 0 0 40px;
}
#movie .con02 .container .character {
  background-color: #FDE7EE;
  padding: 3em 5em;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
}
#movie .con02 .container .character h3 {
  font-size: clamp(1.2rem, 0.8rem + 2.1333vw, 2.4rem);
  margin-bottom: 1em;
}
#movie .con02 .container .character h4 {
  font-size: clamp(1.2rem, 1rem + 1.0667vw, 1.8rem);
  color: #0A5293;
}
#movie .con02 .container .character p {
  font-size: clamp(1rem, 0.8rem + 1.0667vw, 1.6rem);
  line-height: 1.8;
}
#movie .con02 .container .character .fl00 {
  align-items: flex-end;
  justify-content: center;
}
#movie .con02 .container .character .fl00 .item {
  width: 50%;
}
#movie .con02 .container .character .fl1 {
  position: relative;
}
#movie .con02 .container .character .fl1 .ph {
  width: 40%;
}
#movie .con02 .container .character .fl1 .txtBox {
  position: absolute;
  bottom: 0;
  left: 40%;
  width: 60%;
}
#movie .con02 .container .character .fl2 {
  position: relative;
  justify-content: flex-end;
}
#movie .con02 .container .character .fl2 .ph {
  width: 50%;
}
#movie .con02 .container .character .fl2 .txtBox {
  position: absolute;
  top: 0;
  left: 10%;
  width: 60%;
}
@media screen and (max-width: 1199px) {
  #movie .con02 .container .character {
    padding: 2em;
  }
  #movie .con02 .container .character .fl1 .ph {
    width: 40%;
  }
  #movie .con02 .container .character .fl1 .txtBox {
    position: absolute;
    bottom: 0;
    left: 40%;
    width: 60%;
  }
  #movie .con02 .container .character .fl2 .ph {
    width: 50%;
  }
  #movie .con02 .container .character .fl2 .txtBox {
    position: absolute;
    top: 0;
    left: 0%;
    width: 66%;
  }
}
@media screen and (max-width: 979px) {
  #movie .con02 .container .character {
    padding: 3em　4em;
  }
}
@media screen and (max-width: 768px) {
  #movie .con02 .container .character {
    padding: 2em;
  }
  #movie .con02 .container .character .fl00 {
    flex-direction: column;
  }
  #movie .con02 .container .character .fl00 .item {
    width: 100%;
  }
  #movie .con02 .container .character .fl1 {
    flex-direction: column;
  }
  #movie .con02 .container .character .fl1 .ph {
    width: 50%;
    margin: 0 auto;
  }
  #movie .con02 .container .character .fl1 .txtBox {
    position: relative;
    width: 80%;
    margin: 1em auto;
    left: auto;
  }
  #movie .con02 .container .character .fl2 {
    flex-direction: column-reverse;
  }
  #movie .con02 .container .character .fl2 .ph {
    width: 60%;
    margin: 0 auto;
  }
  #movie .con02 .container .character .fl2 .txtBox {
    position: relative;
    width: 80%;
    margin: 1em auto;
    left: auto;
  }
}

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