@charset "utf-8";
/* CSS Document */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  letter-spacing: .05em;
  font-style: normal;
  font-weight: normal;
}
small {
  font-size: .6em;
  letter-spacing: .05em
}
ul, ol {
  list-style: none;
}
.clearfix::after {
  content: "";
  display: block;
  clear: both;
}
.clear {
  clear: both;
}
a {
  text-decoration: none;
  color: #000;
}
main img, heater img {
  width: 100%;
  height: auto;
}
a:hover {
  text-decoration: none;
  opacity: .85;
}
html {
  scroll-behavior: smooth
}
img {
  vertical-align: bottom; /* または middle, top */
}
.sp_none {
  display: none
}
.pc_none {
  display: block
}
.sp_noneIB {
  display: none
}
.pc_noneIB {
  display: inline-block
}
body {
  position: relative;
  font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ヒラギノ丸ゴ ProN W4", "Hiragino Maru Gothic ProN", "ヒラギノ丸ゴ Pro W4", "Hiragino Maru Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
  font-weight: 300;
  font-size: 18px;
  color: #000;
  width: 100%;
  background: #f9fbf8;
  -webkit-text-size-adjust: 100%;
  -webkit-overflow-scrolling: touch;
  overflow-x: hidden;
}
a {
  text-decoration: none;
}
main {
  width: 100%;
}
.l-header {
  display: block;
  z-index: 999;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  height: 50px;
  background: #fff;
  overflow-x: hidden;
}
.c-hamburger {
  position: relative;
  width: inherit;
  height: inherit;
  margin: 0;
  border: transparent;
  background-color: transparent;
  cursor: pointer;
}
.c-hamburger span {
  display: block;
  position: relative;
  left: 50%;
  width: 24px;
  height: 2px;
  transform: translateX(-50%);
  background: #fff;
  transition: all 0.4s;
}
.c-hamburger span:nth-of-type(1) {
  top: -4px;
}
.c-hamburger span:nth-of-type(2) {
  top: 1px;
  transform: translateX(-0.45deg);
}
.c-hamburger span:nth-of-type(3) {
  top: 6px;
  transform: translateX(-0.45deg);
}
.c-hamburger.is-active span:nth-of-type(1) {
  top: 0;
  transform: translateX(-50%) rotate(225deg);
}
.c-hamburger.is-active span:nth-of-type(2) {
  opacity: 0;
}
.c-hamburger.is-active span:nth-of-type(3) {
  top: -4px;
  transform: translateX(-50%) rotate(-225deg);
}
.p-header_nav {
  display: flex;
  z-index: 10;
  position: absolute;
  top: 0;
  right: -100%;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100vh;
  background: transparent;
  opacity: 0;
  transition: top 0.6s, right 0.6s, opacity 0.6s;
}
.p-header_inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: inherit;
  padding: 0 .5em;
}
.p-header_hamburger {
  z-index: 100;
  position: fixed;
  top: 0;
  right: 0;
  width: 50px;
  height: 50px;
  background: #000;
}
.p-header_nav.is-active {
  position: fixed;
  top: 0;
  right: 0;
  opacity: 1;
  background-color: #ED771D;
}
.p-nav_inner {
  position: absolute;
  height: 75%;
  top: 1em;
}
.p-nav_inner h1 {
  color: #fff;
  margin-bottom: 2em;
}
.p-nav_list {
  display: block;
  padding-right: 20px;
  padding-left: 20px;
  text-align: center;
}
.p-nav_item {
  position: relative;
  font-size: 1em;
  font-size: 1em;
}
.p-nav_link {
  color: #fff;
  display: block;
  padding: 20px 10px;
  width: 100%;
}
.p-nav_list .eye-catch2 .p-nav_link {
  padding: 5px 10px;
}
header h1 {
  font-size: 1.2em;
  font-weight: bold;
  z-index: 1;
}
#contents1 {
  background: url(/img/keiei/con1_back.jpg) center / cover;
  padding: 20% 0 5%;
  margin-top: -30px;
}
@media screen and (max-width:768px) {
  #contents1 {
    background: url(/img/keiei/sp_con1_back.jpg) center / cover;
    padding: 50px 0 5%;
    margin-top: 50px;
  }
}
#contents1 .inner {
  max-width: 1200px;
  width: 80%;
  margin: 0 auto;
  padding: 0;
  display: flex;
  gap: 0px;
}
#contents1 .inner .fv_text {
  width: 40%;
  padding-top: 50px;
}
@media screen and (max-width:768px) {
  #contents1 .inner {
    width: 90%;
  }
  #contents1 .inner .fv_text {
    width: 100%;
    padding-top: 0px;
  }
}
#contents1 .inner .fv_photo {
  width: 60%;
}
#contents1 .inner .btn {
  display: block;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  position: relative;
  width: auto;
  margin: 50px auto 0;
  padding: 1rem 0px;
  font-weight: bold;
  border: none;
  cursor: pointer;
  overflow: hidden;
  z-index: 1;
  background-color: #fd013a;
}
#contents1 .inner .btn::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #d40032;
  transform: translateX(-100%);
  transition: all .3s;
  z-index: -1;
}
#contents1 .inner .btn:hover::before {
  transform: translateX(0);
}
#contents1 .inner .btn:hover {
  opacity: 1;
}
#contents1 .inner .btn img {
  max-width: 250px;
}
@media screen and (max-width:768px) {
  #contents1 .inner .btn {
    padding: 8px 0px 9px;
  }
  #contents1 .inner .btn img {
    max-width: 180px;
  }
}
.bottom_btn .btn {
  display: block;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  position: relative;
  width: auto;
  max-width: 500px;
  margin: 50px auto 0;
  padding: 1rem 0px;
  font-weight: bold;
  border: none;
  cursor: pointer;
  overflow: hidden;
  z-index: 1;
  background-color: #fd013a;
}
.bottom_btn .btn::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #d40032;
  transform: translateX(-100%);
  transition: all .3s;
  z-index: -1;
}
.bottom_btn .btn:hover::before {
  transform: translateX(0);
}
.bottom_btn .btn:hover {
  opacity: 1;
}
.bottom_btn .btn img {
  max-width: 250px;
}
@media screen and (max-width:768px) {
  .bottom_btn .btn {
    padding: 8px 0px 9px;
  }
  .bottom_btn .btn img {
    max-width: 180px;
  }
}
.p-header_nav .btn {
  display: block;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  position: relative;
  width: auto;
  max-width: 500px;
  margin: 50px auto 0;
  padding: 1rem 0px;
  font-weight: bold;
  border: none;
  cursor: pointer;
  overflow: hidden;
  z-index: 1;
  background-color: #fd013a;
}
.p-header_nav .btn img {
  max-width: 180px;
}
#contents1 .inner_second .eye-catch, #contents3 .eye-catch {
  display: inline-block;
  margin: 2em auto 1.2em;
  padding: .1em 2.5em;
  background: #ffd800;
  color: #019968;
  font-size: 1.4em;
  font-weight: bold;
  border-radius: 30px;
  vertical-align: -10%;
}
.inner_second .eye-catch a {
  color: #019968;
}
header .p-nav_list .eye-catch2 {
  font-size: 1.2em;
}
.inner_second .eye-catch span, .p-nav_list .eye-catch2 span, #contents3 .eye-catch span {
  font-size: .5em;
  font-weight: bold;
  color: #fff;
  display: inline-block;
  margin-right: 2em;
  position: relative;
  margin: .5em 20px .5em 0;
  padding: 0 5px;
  width: 50px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  background: #019968;
  border-radius: 50%;
  box-sizing: border-box;
  vertical-align: 10%;
}
.p-nav_list .eye-catch2 span {
  margin-left: -3em;
}
.inner_second .eye-catch span:before, .p-nav_list .eye-catch2 span:before, #contents3 .eye-catch span:before {
  content: "";
  position: absolute;
  top: 60%;
  right: -15px;
  margin-top: -15px;
  border: 10px solid transparent;
  border-left: 10px solid #019968;
  z-index: 0;
}
#news {
  background: #f2f2f2;
  margin-top: 0;
  padding-bottom: 2%;
}
#news h2 {
  text-align: center;
  font-weight: bold;
  color: #ff4500;
  padding: 1em 0;
}
#news .news_inner {
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  font-size: .8em;
}
#news .news_inner .btn {
  color: #fff;
  font-weight: bold;
  display: block;
  margin: .5em 0 1em auto;
  background: #ff4500;
  border-radius: 15px;
  width: 90px;
  height: 1.8em;
  text-align: center;
  padding-left: 1em;
}
#news .news_contents {
  border: solid 3px #ff4500;
  padding: 1.5em 0;
  background: #fff;
  height: 320px;
  overflow: auto;
}
.news_contents dl a {
  display: flex;
  flex-wrap: wrap;
  width: 90%;
  padding: .5em 5%;
  line-height: 2;
}
.news_contents dt {
  font-weight: bold;
}
.news_contents dd {
  font-weight: bold;
  border-bottom: solid 2px #ff4500;
  padding-bottom: .5em;
}
.news_inner span {
  display: inline-block;
  vertical-align: middle;
  color: #fff;
  line-height: 1;
  width: .7em;
  height: .7em;
  border: 0.1em solid currentColor;
  border-left: 0;
  border-bottom: 0;
  box-sizing: border-box;
  margin-left: 1em;
  transform: translateX(-25%) rotate(45deg);
}
#nav_area {
  margin: 5% 2.5%;
  width: 95%;
  max-width: 1100px;
}
#nav_area h2 {
  text-align: center;
  font-size: 1.3em;
  font-weight: bold;
  padding-top: 50px;
}
#nav_area ul {
  display: flex;
  flex-wrap: wrap;
  margin: 8% 0;
  justify-content: center
}
#nav_area ul li {
  width: calc(100% / 2 - 4.5%);
  background: #fff;
  border: solid 2px #48d870;
  border-radius: 15px;
  text-align: center;
  margin: 5% 1.5%;
}
#nav_area ul li .number {
  width: 30%;
  height: auto;
  margin-top: -2em;
  z-index: 5;
}
#nav_area ul li .catch, #nav_area ul li .description {
  font-weight: bold;
}
#nav_area ul li .catch {
  font-size: 1.2em;
}
#nav_area ul li .description {
  font-size: .7em;
}
#nav_area ul li div {
  display: inline-block;
  vertical-align: middle;
  margin: 1em auto;
  color: #48d870;
  line-height: 1;
  width: 1.2em;
  height: 1.2em;
  border: 0.15em solid currentColor;
  border-left: 0;
  border-bottom: 0;
  box-sizing: border-box;
  transform: translateY(-25%) rotate(135deg);
}
#first_conteiner, #second_conteiner, #third_conteiner {
  position: relative;
  background: #d7e5f2;
  border-radius: 20px;
  max-width: 1100px;
  margin: 10% auto;
  padding: 50px;
}
@media screen and (max-width:768px) {
  #first_conteiner, #second_conteiner, #third_conteiner {
    padding: 50px 25px;
    margin: 20% auto;
  }
}
#first_conteiner p, #second_conteiner p, #third_conteiner p, #user_registration p {
  font-size: 1.3em;
  line-height: 1.5;
}
#first_conteiner h2, #first_conteiner .catch, #first_conteiner h3, #second_conteiner h2, #third_conteiner h2, #contents3 h2, #user_registration h2 {
  font-weight: bold;
  font-size: 1.5em;
  margin-bottom: .5em;
  margin-top: 2.5%;
}
@media screen and (max-width:768px) {
  #first_conteiner p, #second_conteiner p, #third_conteiner p, #user_registration p {
    font-size: 1em;
    line-height: 1.5;
  }
  #first_conteiner h2, #first_conteiner .catch, #first_conteiner h3, #second_conteiner h2, #third_conteiner h2, #contents3 h2, #user_registration h2 {
    font-weight: bold;
    font-size: 1.2em;
    margin-bottom: .5em;
    margin-top: 2.5%;
  }
}
#first_conteiner img.number, #second_conteiner img.number, #third_conteiner img.number {
  width: 83.67px;
  height: auto;
  position: absolute;
  top: -2.0em;
  left: 2.5%;
}
ul.point_marker {
  list-style: none; /* デフォルトのマーカーを削除 */
  padding-left: 0.5em; /* 左の余白をリセット */
}
ul.point_marker li {
  position: relative; /* ::before の位置を調整するため */
  padding-left: 20px; /* テキストの左側に余白を作る */
  font-size: 1.3em;
  line-height: 1.5;
  margin-bottom: 0.8em;
}
ul.point_marker li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.8em;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0.4em 0 0.4em 0.6em; /* 正三角形のサイズを指定 */
  border-color: transparent transparent transparent #5e90cd; /* 右向きの三角形を青にする */
}
.table-wrap {
  overflow-x: scroll;
}
.table {
  width: 100%;
  font-size: .9em;
  border-collapse: collapse;
  white-space: nowrap;
  background: #fff;
}
.table th, .table td {
  border: 1px solid #000;
  padding: .3em;
}
#first_conteiner h3.second {
  margin-top: 2em;
}
.flex_inner {
  display: flex;
  gap: 30px;
}
@media screen and (max-width:768px) {
  .flex_inner {
    display: block;
  }
}
#second_conteiner {
  padding: 20px 50px 50px;
}
#second_conteiner h2 {
  text-align: center;
  margin-top: 0;
}
#second_conteiner .flex_inner {
  background: #fff;
  border-radius: 20px;
  padding: 50px;
  position: relative; /* 下向き三角形の位置調整に必要 */
}
#second_conteiner .flex_inner:not(:last-child) {
  margin-bottom: 50px; /* 三角形が重ならないように余白をつける（適宜調整してください） */
}
#second_conteiner .flex_inner:not(:last-child)::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -30px; /* 下向き三角形を枠の外に配置 */
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 14px 20px 0 20px; /* 正三角形のサイズ */
  border-color: #5e90cd transparent transparent transparent; /* 下向きの三角形を青にする */
}
#second_conteiner .flex_inner h3 {
  background: #5e90cd;
  font-size: 1.5em;
  font-weight: bold;
  color: #fff;
  padding: 0.5em;
  vertical-align: middle;
  width: 100%;
}
#second_conteiner .flex_inner h3 span {
  font-size: 80%;
  font-weight: bold;
  border-right: 1px solid #fff;
  margin-right: 0.6em;
  padding-right: 0.6em;
}
#second_conteiner .flex_inner div {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  width: 50%;
}
#second_conteiner .flex_inner > p {
  width: 50%;
}
#second_conteiner .flex_inner div p {
  align-self: baseline;
}
@media screen and (max-width:768px) {
  ul.point_marker li {
    font-size: 1em;
  }
  #second_conteiner {
    padding: 50px 25px 50px;
  }
  #second_conteiner .flex_inner {
    padding: 25px;
  }
  #second_conteiner .flex_inner h3 {
    font-size: 1.2em;
  }
  #second_conteiner .flex_inner h3 span {
    font-size: 80%;
  }
  #second_conteiner .flex_inner div {
    width: 100%;
    gap: 20px;
    margin-bottom: 20px;
  }
  #second_conteiner .flex_inner > p {
    width: 100%;
  }
}
#user_registration {
  background: #d7e5f2;
}
#user_registration .flex_inner {
  position: relative;
  max-width: 1100px;
  margin: 10% auto;
  padding: 50px;
  gap: 50px;
}
#user_registration .flex_inner div {
	display: flex;
	flex-wrap: wrap;
  width: 50%;
}

#user_registration .flex_inner div > p {
  width: 100%;
}

#user_registration .flex_inner > p {
  width: 50%;
	text-align: center;
}

#user_registration .flex_inner > p img {
  width: 90%;
}
#user_registration h2 {}
#user_registration .registration_btn {
  margin: 1em 0;
	align-self: flex-end;
}
.registration_btn .btn {
  font-size: 1em;
  display: block;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  width: auto;
  margin: auto;
  padding: 1rem 4rem;
  font-weight: bold;
  border-radius: 20px;
  box-shadow: 5px 5px #ffad2f;
  transition: 0.3s ease-in-out;
  background: #fee737;
  color: #000;
}
.registration_btn .btn:hover {
  box-shadow: none;
  transform: translate(5px, 5px);
}
@media screen and (max-width:768px) {
  #user_registration .registration_btn {
    margin: 2em 0;
	  width: 100%;
  }
  #user_registration .flex_inner {
    padding: 25px;
  }
  #user_registration .flex_inner div {
    width: 100%;
  }
  #user_registration .flex_inner > p {
    width: 100%;
  }
}
#first_conteiner .small, #second_conteiner .small {
  font-size: 1em;
}
#contents3 {
  width: auto;
  background: #f2f2f2;
  margin: 10% auto;
  padding: 10% 5%;
}
#contents3 h2 {
  text-align: center;
}
#contents3 .eye-catch {
  text-align: center;
  margin: 1em auto;
  display: block;
}
#contents3 .eye-catch a {
  display: block;
  width: 110%;
}
footer {
  width: 95%;
  max-width: 1100px;
  margin: 0 auto 50px;
}
footer h1 {
  font-weight: bold;
}
footer ul {
  display: flex;
  margin: 1em 0;
}
footer li {
  font-size: .7em;
  font-weight: bold;
}
footer li:nth-of-type(2), footer li:nth-of-type(3) {
  margin: 0 .6em;
}
/*--------------------- info ----------------------------------------------*/
#info_contents1 {
  background: #ED771D;
  padding: 80px 0 30px;
}
#info_contents1 h2 {
  font-size: 1.5em;
  color: #fff;
  font-weight: bold;
  text-align: center;
  margin: 30px 20px 10px;
}
.info_news {
  margin: 2em auto;
  padding: 2em;
  font-size: .8em;
  background: #fff;
}
.top_btn {
  background: #ED771D;
  text-align: center;
  padding: 1em 0;
  display: block;
  color: #fff;
  font-weight: bold;
  cursor: pointer;
  margin: 1em auto;
  position: relative;
  width: 80%;
}
.top_btn::after {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0.3em 0 0.3em 0.6em;
  border-color: transparent transparent transparent #fff;
  position: absolute;
  top: 50%;
  right: 25px;
  transform: translateY(-50%)
}
/*--------------------- info_01----------------------------------------------*/
.main_contents {
  margin: 2em auto;
  max-width: 1000px;
  padding: 2em;
  font-size: .8em;
  background: #fff;
}
.main_contents h1 {
  font-size: 1.5em;
  border-bottom: solid 1px #ED771D;
  font-weight: bold;
}
.main_contents .time {
  text-align: right;
}
.main_contents p, .main_q p {
  margin: 1em 0;
  overflow-wrap: break-word;
  line-height: 1.8;
}
.main_contents p a {
  text-decoration: underline;
  color: #1a0dab;
}
/*--------------------- Q&A----------------------------------------------*/
.main_q {
  margin: 2em auto;
  width: 78%;
  max-width: 1000px;
  padding: 2em;
  font-size: .8em;
  background: #d7e5f2;
}
.main_qa {
  margin: 2em auto;
  width: 86%;
  max-width: 1000px;
  padding: 7%;
  font-size: .8em;
  background: #fff;
}
.main_q p {
  border-bottom: dashed 2px #ED771D;
  padding: 1.8em 0;
}
.main_qa .q {
  color: #ED771D;
  font-weight: bold;
  font-size: 1.15em;
  padding-top: 52px;
  margin-left: 2.5em;
  position: relative;
}
.main_qa .a {
  font-size: 1.15em;
  margin-top: .8em;
  margin-left: 2.5em;
  position: relative;
}
.main_qa .q::before {
  content: "Q";
  color: #fff;
  background: #ED771D;
  padding: .2em .5em;
  margin-right: .5em;
  margin-left: -2em;
  position: absolute;
  left: -1em;
}
.main_qa .a::before {
  content: "A";
  color: #fff;
  background: #000;
  padding: .2em .5em;
  margin-left: -2em;
  position: absolute;
  left: -1em;
}
/*--------------------- sitepolicy----------------------------------------------*/
#sitepolicy {
  margin: 2em auto;
  max-width: 1000px;
  padding: 2em;
  font-size: .8em;
  background: #fff;
}
#sitepolicy h2 {
  border-bottom: solid 2px #D6D6D6;
  position: relative;
  font-size: 1.5em;
  font-weight: bold;
}
#sitepolicy h2::after {
  content: "";
  display: block;
  line-height: 0;
  overflow: hidden;
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 311px;
  border-bottom: 2px solid #ED771D
}
#sitepolicy p {
  line-height: 1.8;
  margin: 2em 0;
}
#sitepolicy h3 {
  font-size: 1.3em;
  font-weight: bold;
}
@media screen and (min-width:768px) {
  .pc_none {
    display: none
  }
  .sp_none {
    display: block
  }
  .pc_noneIB {
    display: none
  }
  .sp_noneIB {
    display: inline-block
  }
  header .btn-trigger {
    display: none;
  }
  body {
    min-width: 1100px;
  }
  .p-header_hamburger {
    display: none;
  }
  .p-nav_inner {
    margin-right: auto;
    margin-left: auto;
    max-width: initial;
    width: 100%;
    height: auto;
    position: relative;
    top: 0;
  }
  .p-header_nav {
    position: static;
    opacity: 1;
    height: inherit;
    width: initial;
  }
  .p-nav_list {
    padding-right: 0;
    padding-left: 0;
    display: flex;
    margin-right: 2.5%;
  }
  .p-nav_item:nth-child(2), .p-nav_item:nth-child(3) {
    border-left: solid 1px #ED771D;
    margin-left: 2em;
  }
  .l-header {
    background: #fff;
    height: 68px;
    position: fixed;
  }
  .p-header_inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: inherit;
    padding: 0 40px;
  }
  .p-nav_item {
    position: relative;
    font-size: .8em;
    color: #000;
    font-weight: bold;
    text-align: center;
    height: 20px;
  }
  .p-nav_link {
    color: #000;
    padding: 0 5px 0;
    margin-left: 10px;
  }
  .p-nav_link:nth-child(2), .p-nav_link:nth-child(3) {
    border-left: solid 1px #ED771D;
    margin-left: 2em;
  }
  .eye-catch .p-nav_link {
    background: url(/img/keiei/mail_icon.png) no-repeat left 15% center;
    background-size: 24px auto;
    background-color: #ff4500;
    color: #fff;
    height: 1.8em;
    border-radius: 100px;
    margin-left: 20px;
    padding: .3em .2em .3em 2.6em;
    margin-top: -.4em;
  }
  .p-nav_link span {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    line-height: 1;
    width: .8em;
    height: .8em;
    border: 0.1em solid currentColor;
    border-left: 0;
    border-bottom: 0;
    box-sizing: border-box;
    margin-left: .8em;
    transform: translateX(-25%) rotate(45deg);
  }
  header .p-nav_list .eye-catch2 {
    display: none;
  }
  #contents1 {
    padding: 68px 0 0;
    margin-top: 0;
  }
  #news .news_contents {
    height: 150px;
  }
  .news_contents dt, .news_contents dd {
    border-bottom: solid 2px #ff4500;
  }
  .news_contents dt {
    width: 20%;
  }
  .news_contents dd {
    width: 80%;
  }
  #nav_area {
    margin: 10px auto;
  }
  #nav_area h2 {
    font-size: 2.8em;
    padding-top: 70px;
  }
  #nav_area ul {
    margin: 5% 0;
  }
  #nav_area ul li {
    width: calc(100% / 3 - 3.75%);
    margin: 5% 1.25%;
  }
  #nav_area ul li .number {
    width: 100px;
    height: auto;
    margin-top: -2.8em;
  }
  #nav_area ul li .catch {
    font-size: 1.6em;
  }
  #nav_area ul li .description {
    font-size: 1.2em;
  }
  #nav_area ul li .illust {
    width: 260px;
  }
  #nav_area ul li div {
    width: 2em;
    height: 2em;
  }
  #first_conteiner, #third_conteiner {
    padding: 50px;
  }
  #first_conteiner img.number, #second_conteiner img.number, #third_conteiner img.number {
    width: 100px;
    height: auto;
    top: -2.2em;
  }
  .table-wrap {
    overflow: hidden;
  }
  .table {
    width: 100%;
    white-space: normal;
    border-collapse: collapse;
  }
  #first_conteiner h2, #third_conteiner h2, #contents3 h2, #user_registration h2 {
    font-size: 1.5em;
    margin-bottom: .5em;
    margin-top: 2.5%;
  }
  #first_conteiner .catch, #first_conteiner h3, #third_conteiner h3 {
    font-size: 1.5em
  }
  #second_conteiner .inner, #third_conteiner .inner {
    display: flex;
    flex-direction: row-reverse;
  }
  #third_conteiner .analysis {
    width: 60%;
    margin: -15% auto 0 15%;
  }
  #contents3 {
    margin: 5% auto;
    padding: 20px 0 50px;
  }
  #contents3 .eye-catch {
    width: 10em;
  }
  /*--------------------- info ----------------------------------------------*/
  #info_contents1 h2 {
    font-size: 1.8em;
    margin: 30px 20px 10px;
  }
  .info_news {
    width: 1000px;
    margin: 5% auto;
    font-size: .9em;
  }
  .top_btn {
    display: block;
    width: 380px;
    margin: 5% auto;
    border-radius: 25px;
  }
  .main_contents, .main_q {
    font-size: .9em;
  }
  .main_contents h1 {
    font-size: 1.8em;
    margin: 30px 20px 10px;
  }
  .main_q p {
    padding: 1.4em 0;
  }
  .main_qa {
    width: 960px;
    padding: 46px;
  }
  .main_qa .q, .main_qa .a {
    font-size: 1.2em;
  }
  .main_qa .q {
    padding-top: 70px;
  }
  /*--------------------- sitepolicy----------------------------------------------*/
  #sitepolicy h2 {
    font-size: 1.8em;
  }
  #sitepolicy h3 {
    font-size: 1.5em;
  }
}
@media screen and (max-width:768px) {
  footer .p-nav_link {
    color: #000;
    padding: 10px;
  }
}
/* ここから追加CSS */
/* aタグをボタンに変更時、ボタンのデフォルトCSSを無効化 */
dl.like_a {
  display: flex;
  flex-wrap: wrap;
  width: 90%;
  padding: .5em 5%;
  line-height: 2;
  box-sizing: initial !important;
}
button.like_a {
    all: unset; /* デフォルトスタイルをリセット */
    display: block; /* ブロック全体をクリック可能に */
    width: 100%; /* 横幅を100%に設定 */
    text-align: left; /* 必要に応じてテキストを左寄せ */
    cursor: pointer; /* ポインタを表示 */
    padding: 0; /* 不要な余白を削除 */
    margin: 0; /* 不要なマージンを削除 */
    background: none; /* 背景をリセット */
    border: none; /* 枠線をリセット */
    box-sizing: initial !important;
}

a.listBtn {
  color: #fff;
  font-weight: bold;
  display: block;
  margin: .5em 0 1em auto;
  background: #ff4500;
  border-radius: 15px;
  width: 90px;
  height: 1.8em;
  text-align: center;
  padding-left: 1em;
  box-sizing: initial !important;
}

.circle-image {
	margin-top:50px;
	margin-left:50px;
    position: relative;
    width: 200px; /* 画像の幅 */
   height: 400px; /* 画像の高さ */
   border-radius: 50%; /* 丸くする */
   overflow: hidden; /* 画像の外側を隠す */
}

.circle-image img {
    width: 100%; /* 画像をコンテナの大きさに合わせる */
   height: 100%; /* 画像をコンテナの大きさに合わせる */
   object-fit: cover; /* 画像をコンテナ内に適切に収める */
}

.circle-image::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 1) 100%);
    pointer-events: none; /* グラデーションがクリックに影響しないようにする */
}