body {
  font-family: "Meiryo UI", "メイリオ", Meiryo, Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

a {
  color: #083e8e;
}

.relative {
  position: relative;
}

#main {
  width: 100%;
  display: block;
  overflow: hidden;
  position: static;
  margin-top: 0;
}

.charm_tax_outer {
  padding-bottom: 100px;
  font-family: "Noto Sans JP", "メイリオ", Meiryo, Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  background-image: url(../images/charm/interview_bg_02.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.charm_header {
  background-color: #EDEDED;
  position: relative;
  background-image: url(../images/charm/interview_top.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.charm_tax_outer .charm_header_inner {
  margin: 34px 0 80px;
  padding: 25px 0;
}

.charm_tax_outer .charm_header_inner::before {
  content: '';
  display: block;
  height: 20px;
  position: absolute;
  top: 80px;
  right: 0;
  left: 60vw;
  background-color: #CC0133;
}

.charm_tax_outer .charm_header_inner::after {
  content: '';
  display: block;
  height: 20px;
  position: absolute;
  bottom: 70px;
  left: 0;
  right: 60vw;
  background-color: #CC0133;
}

.charm_single_outer .charm_header_inner {
  margin: 0 0 55px;
  padding: 15px 0;
}

.charm_single_outer {
  font-family: "Noto Sans JP", "メイリオ", Meiryo, Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.charm_single_outer .charm_header_inner::before {
  content: '';
  display: block;
  height: 20px;
  position: absolute;
  top: 45px;
  right: 0;
  left: 60vw;
  background-color: #CC0133;
}

.charm_single_outer .charm_header_inner::after {
  content: '';
  display: block;
  height: 20px;
  position: absolute;
  bottom: 45px;
  left: 0;
  right: 60vw;
  background-color: #CC0133;
}

.charm_header_inner {
  background-color: #fff;
}

.charm_header_inner h1 {
  font-weight: bold;
  font-size: 40px;
  color: #CC0133;
  line-height: 1;
  padding: 12.5px 0 0;
  margin-bottom: 0;
  text-align: center;
  font-family: "Noto Sans", sans-serif;
  font-style: italic;
}

.charm_header_inner p {
  font-size: 15px;
  margin-bottom: 0;
  color: #CC0133;
}

.key_words_outer {
  margin-bottom: 50px;
}

.key_words_outer h2 {
  color: #CC0133;
  padding: 50px 100px 25px;
}

.key_words_outer .btn.btn-terms {
  padding: 10px 40px;
  font-size: 14px;
  margin: 0 10px 10px 0;
  line-height: 1;
  display: inline-block;
  background-color: #fff;
  border: 1px solid #000;
}

.charm_single_outer h2 {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 5px;
}

.spacer {
  padding: 50px 0;
}

.spacer_s {
  padding: 25px 0;
}

.card_outer {
  margin-bottom: 50px;
}

.card {
  border-radius: 0%;
  -webkit-box-shadow: 0 2px 5px 0 rgb(0 0 0 / 8%), 0 2px 10px 0 rgb(0 0 0 / 6%);
  box-shadow: 0 2px 5px 0 rgb(0 0 0 / 8%), 0 2px 10px 0 rgb(0 0 0 / 6%);
  height: 100%;
  border: none;
  border-bottom: 5px solid #CC0133;
}

.card a {
  text-decoration: none;
}

.card img {
  width: auto;
  margin: auto auto;
}

.card p {
  line-height: 1.5;
}

.card .card-footer {
  background-color: #fff;
  border-top: none;
}

p.pager_text {
  font-size: 18px;
  color: #666;
  margin-bottom: 10px;
}

.pager_wrapper .navigation.pagination {
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  background-color: #fff;
}

#common_page nav>ul.pagination {
  height: auto;
  -webkit-box-shadow: 0 2px 5px 0 rgb(0 0 0 / 8%), 0 2px 10px 0 rgb(0 0 0 / 6%);
  box-shadow: 0 2px 5px 0 rgb(0 0 0 / 8%), 0 2px 10px 0 rgb(0 0 0 / 6%);
}

.active>.page-link,
.page-link.active {
  background-color: #014099;
}

#common_page nav>ul.pagination li.page-item {
  display: flex;
  vertical-align: middle;
}

#common_page nav>ul.pagination li.page-item a {
  font-size: 20px;
  font-weight: bold;
}

#common_page nav>ul.pagination li span {
  font-size: 20px;
}

.pager_counter {
  font-size: 20px;
  margin-bottom: 25px;
}

.page-link {
  color: #014099;
  height: 100%;
}

.page-item.no_link {
  pointer-events: none;
}

.page-item.no_link a {
  color: #999;
}

.page-item:first-child .page-link {
  border-top-left-radius: 9999px;
  border-bottom-left-radius: 9999px;
}

.page-item:last-child .page-link {
  border-top-right-radius: 9999px;
  border-bottom-right-radius: 9999px;
}

.single_content_outer {
  background-color: #fff;
  -webkit-box-shadow: 0 2px 5px 0 rgb(0 0 0 / 8%), 0 2px 10px 0 rgb(0 0 0 / 6%);
  box-shadow: 0 2px 5px 0 rgb(0 0 0 / 8%), 0 2px 10px 0 rgb(0 0 0 / 6%);
}

.single_content_outer .single_content_header h1 {
  font-size: 40px;
  font-weight: bold;
}

.single_content_outer .single_content {
  padding: 50px;
}

.single_content_outer .single_content_footer {
  margin: 25px 0;
  padding: 25px 100px;
}

.single_content_outer .single_content_footer .share_block {
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  padding: 25px;
}

.single_content_outer .single_content_footer .share_block .btn.btn-secondary {
  border: none;
  background-color: #eee;
  color: #000;
}

.single_content_outer .single_content_footer .share_block .success-msg {
  display: none;
  position: fixed;
  width: 300px;
  height: 40px;
  line-height: 40px;
  background-color: #000;
  color: #fff;
  top: 100px;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
  border-radius: 5px;
}

.single_content_outer .single_content_footer .share_block p {
  margin-bottom: 0;
  font-size: 20px;
  font-weight: bold;
}

.single_content_outer .single_content_footer .share_block button {
  font-size: 20px;
}

.single_content_outer .single_content_footer .share_block .col {
  padding: 20px;
}

.single_content_outer .single_content_footer .share_block button.btn.btn-link {
  padding: 0;
}

.button_wrapper .btn-readmore {
  background-color: #000;
  font-size: 20px;
  color: #fff;
  font-weight: bold;
  padding: 10px 120px;
  position: relative;
}

.charm_outer .button_wrapper .btn-readmore span {
  position: absolute;
  right: 20px;
}

.charm_single_outer .button_wrapper .btn-readmore span {
  position: absolute;
  left: 20px;
}

.button_wrapper {
  margin: 50px 0;
}

.btn.btn-terms {
  border: 1px solid #000;
  padding: 5px 20px;
  font-size: 13px;
  margin: 0 10px 10px 0;
  line-height: 1;
}

.card a.card_img {
  background-color: #fff;
  display: flex;
}

.writer_field {
  background-color: #eee;
  padding: 25px;
}

.writer_field img {
  border-radius: 50%;
  margin: auto;
}

.charm_single_outer .single_content .writer_field h2 {
  font-size: 20px;
  margin-top: 0;
  margin-bottom: 25px;
  padding-top: 0;
}

a.btn.btn-terms:hover {
  background-color: #000;
  color: #fff;
  transition: all 0.3s;
}

.card .card-body a h3 {
  color: #000;
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
}

.card .card-body .text-crimzon {
  color: #CC0133;
  list-height: 1.5;
}

.card .card-body .text-crimzon p {
  font-weight: bold;
}

.card .card-footer .time_info p {
  font-size: 12px;
  margin-bottom: 5px;
}

.profile_image_container {
  position: relative;
  padding: 20px;
  border-top: none;
}

.profile_image_inner {
  background-color: #CC0133;
  /* #CC0133 から変更 */
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  bottom: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}

.profile_image_container img {
  z-index: 2;
  position: relative;
}

.section_charm_profile,
.section_charm_content_02 {
  position: relative;
}

.highlight-bg {
  position: absolute;
  top: 30px;
  left: 35vw;
  right: 0;
  background: linear-gradient(30deg, #CD0433, #CD0433, #CD0433, #EB8F1C);
  z-index: 0;
}

.single_content_right {
  position: relative;
  z-index: 1;
}

.single_content_right h2 {
  font-size: 30px;
  font-weight: bold;
  color: #333;
}

.single_content_right_header {
  height: auto;
  padding: 25px 0;
}

.single_content_right_header p {
  font-size: 25px;
  font-weight: bold;
  color: #fff;
  line-height: 1.5;
}

.section_charm_content_01 h2,
.section_charm_content_02 h2,
.section_charm_content_03 h2 {
  padding-left: 40px;
  position: relative;
}

.section_charm_content_01 h2::after,
.section_charm_content_02 h2::after,
.section_charm_content_03 .section_charm_content_odd h2::after,
.section_charm_content_03 .section_charm_content_even h2::after {
  content: "";
  position: absolute;
  top: 10px;
  left: 0;
  width: 30px;
  height: 4px;
  background: linear-gradient(90deg, #9e0022, #ff6600);
  z-index: 1;
}

.related_posts_block h2 {
  margin-bottom: 30px;
  font-size: 25px;
}

.single_content_outer_2 {
  background-image: url(../images/charm/interview_bg_01.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.section_charm_content_02_inner,
.section_charm_content_03_inner {
  padding: 50px 0
}

.section_charm_content_odd,
.section_charm_content_even {
  position: relative;
}

.section_charm_content_even .highlight-red-box {
  position: absolute;
  left: -20px;
  bottom: -35px;
  background: #CC0133;
  height: 70px;
  width: 70px;
  z-index: -1;
}

.section_charm_content_odd .highlight-white-bg {
  position: absolute;
  top: 0;
  right: 30vw;
  background: #fff;
  z-index: 0;
}

.section_charm_content_odd .highlight-red-bg {
  position: absolute;
  bottom: 35px;
  right: 0;
  left: 50vw;
  background: #CC0133;
  height: 30px;
}

.section_charm_content_odd .highlight-red-bg-small {
  position: absolute;
  bottom: 70px;
  right: 0;
  left: 55vw;
  background: #CC0133;
  height: 15px;
}

.section_charm_content_even .highlight-white-bg {
  position: absolute;
  top: 0;
  right: 0;
  left: 30vw;
  background: #fff;
  z-index: 0;
}

.single_content_outer_3 {
  background-image: url(../images/charm/interview_bg_02.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.section_charm_content_03_inner.section_charm_content_last .bg-white {
  position: relative;
  padding: 25px;
}

.section_charm_content_03_inner.section_charm_content_last .bg-white::after {
  content: "";
  position: absolute;
  bottom: -15px;
  /* 要素の下に配置 */
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-top: 15px solid #fff;
  /* 三角形の色 */
  z-index: 1;
}

.section_charm_content_03 .section_charm_content_last h2 {
  text-align: center;
  position: relative;
  padding-bottom: 15px;
  margin-bottom: 15px;
}

.section_charm_content_03 .section_charm_content_last h2::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 30px;
  height: 4px;
  background: linear-gradient(90deg, #9e0022, #ff6600);
  z-index: 1;
}

.charm_carousel {
  background-image: url(../images/charm/interview_bg_01.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}

.charm_carousel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, .3);
  z-index: 0;
}

.charm_carousel_outer {
  position: relative;
}

#charmCarousel {
  position: relative;
}

.carousel-inner {
  width: 80%;
}

#charmCarousel .carousel-control-prev,
#charmCarousel .carousel-control-next {
  background-color: transparent;
  opacity: 1;
  width: 40px;
  height: 100%;
  top: 50%;
  transform: translateY(-50%);
}

#charmCarousel .carousel-control-prev {
  left: 0;
}

#charmCarousel .carousel-control-next {
  right: 0;
}

#charmCarousel .carousel-control-prev:hover,
#charmCarousel .carousel-control-next:hover {
  background-color: transparent;
  opacity: 1;
}

#charmCarousel .carousel-control-prev i,
#charmCarousel .carousel-control-next i {
  color: #fff;
  font-size: 24px;
  line-height: 1;
}

.carousel-button-inner {
  background-color: #CC0133;
  color: #fff;
  width: 40px;
  padding-top: 10px;
  padding-bottom: 10px;
}

.no-btn.btn-terms {
  border: 1px solid #000;
  padding: 5px 20px;
  font-size: 13px;
  margin: 0 10px 10px 0;
  line-height: 1;
  display: inline-block;
  pointer-events: none;
  cursor: default;
}

.btn.btn-terms.charm_span_active {
  background-color: #CC0133;
  border: 1px solid #CC0133;
  color: #fff;
}

.background_image_wh {
  background-color: #fff;
  z-index: 2;
  position: relative;
}

@media screen and (min-width: 1600px) {

  .charm_outer,
  .charm_tax_outer.charm_bg_charm {
    background-size: 100vw;
  }
}

@media screen and (min-width: 1124px) {

  #main .container {
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (min-width: 768px) {
  ul.bc_nav {
    font-size: 12px;
    padding-left: 0;
    padding-top: 20px;
  }

  ul.bc_nav li,
  ul.bc_nav>span {
    padding: 0 6px;
    font-family: "Meiryo", sans-serif;
    font-size: 13px;
  }

  .charm_outer h1 {
    margin-bottom: 50px;
  }

  .charm_outer h2 {
    margin: 50px 0 25px;
  }

  .charm_outer h2 img {
    height: 52px;
    margin-right: 10px;
  }

  .charm_outer h2 span {
    font-size: 35px;
    font-weight: bold;
  }
}

@media screen and (max-width: 767px) {

  a:hover,
  a:active {
    text-decoration: none;
  }

  #main {
    position: relative;
  }

  .spacer {
    padding: 25px 0;
  }

  .charm_outer {
    background-size: auto 200px;
  }

  .charm_tax_outer.charm_bg_charm {
    background-size: auto 200px;
  }

  .charm_tax_outer.charm_bg_charm {
    background-size: auto 200px;
  }

  .profile_image_inner {
    width: 85%;
    height: 85%;
  }

  .profile_image_container img {
    width: 92%;
  }

  .menu-trigger {
    top: -14px;
  }

  ul {
    padding-left: 0 !important;
  }

  ul.bc_nav {
    margin-left: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  ul.bc_nav li {
    font-size: 12px;
    padding-right: 2px;
    padding-left: 2px;
  }

  ul.bc_nav span {
    font-size: 12px;
    padding-right: 2px;
    padding-left: 2px;
  }

  ul.bc_nav span a {
    font-size: 12px;
  }

  .charm_outer .charm_slider {
    padding-bottom: 50px;
  }

  .charm_slider {
    padding-bottom: 50px;
    margin-bottom: 50px;
  }

  .charm_slider .carousel-inner>.carousel-item>a>img {
    width: auto;
    margin: 0 auto;
  }

  .charm_outer .carousel-caption {
    position: absolute;
    bottom: -10px;
    left: 10px;
  }

  .charm_outer .carousel-caption h2 {
    text-align: left;
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 0;
  }

  .carousel-indicators {
    bottom: -50px;
  }

  .carousel-indicators [data-bs-target] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #000;
  }

  .charm_tax_outer .charm_header_inner,
  .charm_single_outer .charm_header_inner {
    padding: 20px;
    margin: 0 auto 56px;
  }

  .charm_tax_outer .charm_header_inner::before {
    top: 45px;
  }

  .charm_tax_outer .charm_header_inner::after {
    bottom: 45px;
  }

  .charm_single_outer .charm_header_inner::before {
    top: 45px;
  }

  .charm_single_outer .charm_header_inner::after {
    bottom: 45px;
  }

  .charm_header_inner h1 {
    font-size: 25px;
    font-style: normal;
  }

  .charm_header_inner p {
    font-size: 11px;
  }

  .charm_outer h2 {
    margin-top: 25px;
    margin-bottom: 25px;
  }

  .charm_outer h2 img {
    width: 50px;
    margin-right: 10px;
  }

  .charm_outer h2 span {
    font-size: 20px;
    font-weight: bold;
  }

  .charm_tax_outer h2 {
    margin-top: 0px;
    margin-bottom: 20px;
    padding: 30px 30px 10px;
    font-size: 20px;
  }

  .card_wrapper {
    padding-left: 3px;
    padding-right: 3px;
  }

  .card_outer {
    margin-bottom: 20px;
  }

  .card .card-body h3 {
    font-size: 20px;
    font-weight: bold;
    color: #000;
  }

  .button_wrapper .btn-readmore {
    font-size: 15px;
    color: #fff;
    padding: 10px 50px;
  }

  .charm_outer .button_wrapper .btn-readmore span {
    position: absolute;
    right: 10px;
  }

  .charm_single_outer .button_wrapper .btn-readmore span {
    position: absolute;
    left: 10px;
  }

  .button_wrapper {
    margin: 25px 0;
  }

  .key_words_outer .btn.btn-terms {
    padding: 3px 10px;
    font-size: 14px;
    margin: 0 5px 5px 0;
  }

  #common_page nav>ul.pagination li.page-item {
    display: block;
  }

  #common_page nav>ul.pagination li.page-item a {
    font-size: 15px;
    padding: 0;
  }

  #common_page nav>ul.pagination li span {
    font-size: 15px;
  }

  .pager_counter {
    font-size: 15px;
    margin-bottom: 15px;
  }

  .single_content_outer .single_content_header,
  .single_content_outer .single_content {
    padding: 0;
  }

  .single_content_outer .single_content_header h1 {
    font-size: 25px;
  }

  .single_content_outer .single_content_footer {
    padding: 20px;
  }

  .single_content_outer .single_content_footer .share_block {
    padding: 10px 0;
  }

  .single_content_outer .single_content_footer .share_block .share_block_list {
    padding: 5px 0;
  }

  .single_content_outer .single_content_footer .share_block .share_block_list p {
    padding: 0 10px;
  }

  .single_content_outer .single_content_footer .share_block .col {
    padding: 10px 25px;
  }

  .charm_single_outer h2 {
    font-size: 20px;
  }

  .card img {
    margin: 0 auto;
  }

  .highlight-bg {
    display: none;
  }

  .single_content_right_header {
    background: linear-gradient(30deg, #CD0433, #CD0433, #CD0433, #EB8F1C);
    padding: 20px;
  }

  .single_content_right_header p {
    font-size: 20px;
    margin-bottom: 0;
  }

  .charm_carousel_outer h2 {
    font-size: 20px;
  }

  .carousel-inner {
    width: 70%;
  }

  #charmCarousel .carousel-control-prev,
  #charmCarousel .carousel-control-next {
    width: 25px;
  }

  .carousel-button-inner {
    width: 25px;
  }

  #charmCarousel .carousel-control-prev i,
  #charmCarousel .carousel-control-next i {
    font-size: 15px;
  }

  .single_content_right {
    width: 80%;
    margin-left: auto;
    top: -40px;
  }

  .section_charm_content_odd .highlight-white-bg {
    right: 10vw;
  }

  .section_charm_content_odd .col-md-6:nth-child(1) {
    width: 90vw;
    margin-left: 0;
  }

  .section_charm_content_odd .col-md-6:nth-child(2) {
    width: 90vw;
    margin-left: auto;
    margin-right: 0;
  }

  .section_charm_content_even .highlight-white-bg {
    left: 10vw;
  }

  .section_charm_content_even .col-md-6:nth-child(1) {
    width: 90vw;
    margin-left: auto;
    margin-right: 0;
  }

  .section_charm_content_even .col-md-6:nth-child(2) {
    width: 90vw;
    margin-right: auto;
    margin-left: 0;
  }

  .profile_image_container {
    z-index: 0;
  }

  .section_charm_content_even .highlight-red-box {
    right: -18px;
    left: auto;

  }

  .section_charm_content_02_inner,
  .section_charm_content_03_inner {
    margin-bottom: 50px;
  }
}