@charset "UTF-8";
/***************************************************
information
	filename : app_article.css;
***************************************************/
html {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

/****************** 幅指定 ******************/
.articleBox {
  width: var(--app-main-width-con);
}

.mainVisual, .articleBox h2.style1, .articleBox h2.style2, .articleBox h2.style3, .articleBox h3.style1, .articleBox h3.style2, .articleBox h3.style3, .articleBox table, .DLBox, .articleBox ul, .articleBox ol, .videoMax, .policy {
  width: var(--app-main-width-con);
}

.articleBox p.widths,
.articleBox h4.style1,
.articleBox h4.style2,
.articleBox h4.style3,
.articleBox h5.style1 {
  width: var(--app-main-width-con-s);
}

.formThanks .articleBox p,
.formThanks .articleBox h2.style1,
.formThanks .articleBox h2.style2,
.formThanks .articleBox h2.style3,
.formThanks .articleBox h3.style1,
.formThanks .articleBox h3.style2,
.formThanks .articleBox h3.style3,
.formThanks .articleBox table,
.formThanks .DLBox,
.formThanks .articleBox ul,
.formThanks .articleBox ol,
.formThanks .videoMax,
.formThanks .policy {
  width: 100%;
}

.formThanks .articleBox p.widths,
.formThanks .articleBox h4.style1,
.formThanks .articleBox h4.style2,
.formThanks .articleBox h4.style3,
.formThanks .articleBox h5.style1 {
  width: 90%;
}

.sp_prev .mainVisual,
.sp_prev .articleBox,
.sp_prev .articleBox p,
.sp_prev .articleBox h2.style1,
.sp_prev .articleBox h2.style2,
.sp_prev .articleBox h2.style3,
.sp_prev .articleBox h3.style1,
.sp_prev .articleBox h3.style2,
.sp_prev .articleBox h3.style3,
.sp_prev .articleBox table,
.sp_prev .DLBox,
.sp_prev .articleBox ul,
.sp_prev .articleBox ol,
.sp_prev .videoMax,
.sp_prev .policy {
  width: 100%;
}

.sp_prev .articleBox p.widths,
.sp_prev .articleBox h4.style1,
.sp_prev .articleBox h4.style2,
.sp_prev .articleBox h4.style3,
.sp_prev .articleBox h5.style1 {
  width: 90%;
}

/****************** 記事エリア ******************/
/* メインビジュアル（システム登録反映箇所） */
.mainVisual {
  margin: 0 auto 30px auto;
  padding: 0;
  text-align: center;
}
.mainVisual img {
  max-width: 100%;
  max-height: var(--app-main-width-con);
  margin: 0px auto;
}
.spview .mainVisual img {
  max-height: 100vw;
}

/* 記事エリア */
.articleBox {
  margin: 0 auto;
  padding: 0;
}

.articleBox .pdlr0 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/**** pタグ要素基本 ****/
.articleBox p {
  margin: 0 auto;
  padding: 0px 10px 20px;
  font-size: 16px;
  line-height: 1.8em;
  max-width: 100%;
}

.articleBox p.style1 {
  margin: 30px auto;
  padding: 25px;
  border: 4px solid var(--app-main-brd-a);
  border-radius: 2px;
}

.articleBox p.style2 {
  margin: 30px auto;
  padding: 25px;
  background: var(--app-main-cr-a);
  border: 4px solid var(--app-main-brd);
  border-radius: 2px;
}

.articleBox p.style3 {
  margin: 30px auto;
  padding: 25px;
  background: var(--app-main-cr);
  border-radius: 2px;
  color: var(--app-main-txt);
}

.articleBox p.style4 {
  margin: 30px auto;
  padding: 25px;
  background: var(--app-main-cr-ar);
  border: 4px solid var(--app-main-brd-ar);
  border-radius: 2px;
}

.articleBox p.style5 {
  background-color: #e5e5e5;
  padding: 20px 30px;
  margin: 30px 0;
}

.articleBox p.style6 {
  position: relative;
  padding: 0.25em 1em;
}

.articleBox p.style6:before,
.articleBox p.style6:after {
  content: '';
  width: 20px;
  height: 30px;
  position: absolute;
  display: inline-block;
  border: solid #eac5aa;
}

.articleBox p.style6:before {
  border-width: 3px 0 0 3px;
  top: 0;
  left: 0;
}

.articleBox p.style6:after {
  border-width: 0 3px 3px 0;
  bottom: 0;
  right: 0;
}

/**** タイトル要素基本 ****/
.articleBox h2 {
  margin: 40px auto 20px auto;
  padding: 30px 15px;
  font-size: 35px;
  font-weight: normal;
  text-align: center;
  line-height: 1.4em;
}

.articleBox h2.style1 {
  border-top: 1px solid var(--app-main-brd-k);
  border-bottom: 1px solid var(--app-main-brd-k);
}

.articleBox h2.style2 {
  border-top: none;
  border-bottom: none;
  background: var(--app-main-cr);
  color: var(--app-main-txt-u);
}

.articleBox h2.style3 {
  border-left: 7px solid var(--app-main-cr);
  border-top: none;
  border-bottom: none;
  background: var(--app-main-cr-a);
  text-align: left;
}

.articleBox h2.style4 {
  border-left: 7px solid var(--app-main-cr);
  border-top: none;
  border-bottom: 1px solid var(--app-main-cr-a);
  text-align: left;
  padding: 0.2em 0 0.2em 0.5em;
  font-size: 26px;
  font-weight: 300;
}

.articleBox h2.style5, .articleBox .float .floatText h2.style5 {
  line-height: 60px;
  position: relative;
  width: auto;
  height: 60px;
  margin: 2em 50px 1em;
  padding: 0 2rem;
  text-align: center;
  background: #eecccc;
}

.articleBox h2.style5::before,
.articleBox h2.style5::after {
  position: absolute;
  top: 0;
  display: block;
  height: 48px;
  content: '';
  border: 30px solid #eecccc;
}

.articleBox h2.style5::before {
  left: -40px;
  border-left-width: 15px;
  border-left-color: transparent;
}

.articleBox h2.style5::after {
  right: -40px;
  border-right-width: 15px;
  border-right-color: transparent;
}

.articleBox h2.style6 {
  text-align: center;
  padding: 0.6em 0.25em;
  border-radius: 8px;
  background: -webkit-repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px, #e9f4ff 3px, #e9f4ff 7px);
  background: repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px, #e9f4ff 3px, #e9f4ff 7px);
}

.articleBox h2.style7 {
  position: relative;
  padding: 1rem 2rem calc(1rem + 10px);
  background: #AADDAA;
  max-width: calc(100vw - 14px);
}

.articleBox h2.style7:before {
  position: absolute;
  top: -7px;
  left: -7px;
  width: 100%;
  height: 100%;
  content: '';
  border: 4px solid;
}

.articleBox h3 {
  margin: 40px auto 20px auto;
  padding: 20px 15px;
  font-size: 30px;
  color: var(--app-basic-txt);
  font-weight: normal;
  text-align: center;
  line-height: 1.6em;
}

.articleBox h3.style1 {
  border-bottom: 1px solid var(--app-main-brd-k);
  text-align: left;
}

.articleBox h3.style2 {
  border: 1px solid var(--app-main-brd-k);
  text-align: center;
  border-radius: 2px;
}

.articleBox h3.style3 {
  background: var(--app-main-cr);
  color: var(--app-main-txt);
  text-align: center;
  border-radius: 3px;
}

.articleBox h3.style4 {
  border-bottom: 1px #cccccc solid;
  font-size: 18px;
  font-weight: bold;
  margin: 8px 0 12px;
  padding: 0 0 8px;
  text-align: left;
}

.articleBox h4 {
  margin: 40px auto 20px auto;
  padding: 20px;
  font-size: 25px;
  color: var(--app-basic-txt);
  font-weight: bold;
  text-align: center;
}

.articleBox h4.style1 {
  background: var(--app-main-cr-a);
  text-align: left;
  border-radius: 3px;
}

.articleBox h4.style2 {
  background: var(--app-main-cr);
  color: var(--app-main-txt);
  text-align: left;
  border-radius: 3px;
}

.articleBox h4.style3 {
  padding: 10px 20px 20px 20px;
  border-left: 7px solid var(--app-main-brd-k);
  border-bottom: 1px solid var(--app-main-brd-k);
  text-align: left;
}

.articleBox h5 {
  margin: 5px auto;
  padding: 10px;
  font-size: 22px;
  color: var(--app-basic-txt);
  font-weight: bold;
  text-align: center;
}

.articleBox h5.style1 {
  border-bottom: 1px solid var(--app-main-brd);
  text-align: left;
}

/**** span要素基本 ****/
.articleBox span.mck {
  background: linear-gradient(transparent 50%, rgba(255, 255, 0, 0.2) 50%);
}

.articleBox span.mck_bl {
  background: linear-gradient(transparent 50%, rgba(0, 125, 255, 0.2) 50%);
}

.articleBox span.mck_rd {
  background: linear-gradient(transparent 50%, rgba(255, 0, 0, 0.2) 50%);
}

.articleBox span.ubdr {
  color: var(--main-txt-ub);
  border-bottom: 2px solid var(--app-main-txt-ub);
}

/**** table要素基本 ****/
.articleBox table {
  margin: 20px auto;
  border: 1px solid var(--app-main-brd);
}

.articleBox th {
  padding: 15px;
  background: var(--app-main-cr-a);
  border: 1px solid var(--app-main-brd);
}

.articleBox td {
  padding: 15px;
  border: 1px solid var(--app-main-brd);
}

/* DLタグ */
.DLBox {
  margin: 30px auto;
  padding: 0;
  font-size: 16px;
  border-top: 1px solid var(--app-main-brd-a);
}

.DLBox dl {
  margin: 0 auto;
  padding: 0;
  border-bottom: 1px solid var(--app-main-brd-a);
}

.DLBox dt {
  float: left;
  width: 25%;
  margin: 0;
  padding: 15px 10px;
}

.DLBox dd {
  float: left;
  width: 60%;
  margin: 0;
  padding: 15px 10px;
}

.DLBox dl.bga {
  background: var(--app-main-cr-u);
}

.DLBox dl.bgb {
  background: var(--app-main-cr-u);
}

/* リスト */
.articleBox ul,
.articleBox ol {
  margin: 0 auto;
  padding: 0 10px 0 calc(1.6em + 5px);
  font-size: 16px;
  line-height: 1.4em;
  max-width: 100%;
}

.articleBox ul li {
  margin-top: 5px;
  margin-left: 5px;
  margin-bottom: 5px;
}

.articleBox ol li {
  margin-top: 5px;
  margin-left: 5px;
  margin-bottom: 5px;
}

.articleBox li.c-customMarker {
  position: relative;
  list-style: none;
}

.articleBox li.c-customMarker::before {
  position: absolute;
  top: 0;
  left: -1.4em;
  content: attr(data-marker);
}

/* 個別画像サイズ指定 */
.articleBox img {
  max-width: 100%;
  height: auto;
}

/**** テンプレート基本 ****/
.policy {
  margin: 0 auto;
}

.articleBox .policy h2 {
  padding: 10px 15px;
  font-size: 22px;
  font-weight: bold;
  text-align: left;
  border-bottom: 1px solid var(--app-main-brd);
}

.articleBox .policy h3 {
  margin: 20px auto;
  padding: 10px 15px;
  font-size: 18px;
  font-weight: bold;
  text-align: left;
}

.LiBox_style1 {
  margin: 30px auto;
  padding: 10px 15px;
  background: var(--app-main-cr-a);
  border: 2px solid var(--app-main-brd);
  border-radius: 3px;
}

/* *************************
テンプレート対応 
************************* */
/*  award  */
#main.award .mainClnD {
  position: relative;
}

#main.award .rank_date_c_area {
  position: absolute;
  top: 60px;
  right: 24px;
  z-index: 1;
}

#main.award .rank_date_c_area p {
  background-color: transparent;
  display: none;
}

#main.award .rank_date_c_area p.view {
  display: inline-block;
}

#main.award .con_ti,
#main.award h1.det_ti,
#main.award ul.DetcateName,
#main.award .mainVisual,
#main.award .siteShareBox:nth-of-type(1),
#main.award #SNSboxArea {
  display: none;
}

#award {
  background: url(../../../../edit_tamplate/images/award_header.png) center top/100% no-repeat, url(../../../../edit_tamplate/images/award_footer.png) center calc(100% + 18px)/100% no-repeat, #F4F0E6;
  position: relative;
  padding: 60px 60px 120px;
}

#award * {
  max-width: 100%;
}

#award h2 {
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 32px;
  line-height: 36px;
  margin: 2em auto 1em;
  padding: 1em 0 0;
}

#award .date {
  text-align: center;
  background: url(../../../../edit_tamplate/images/ribbon.svg) center center/auto 100% no-repeat;
  padding: 0em;
  color: #fff;
}

#award figure img {
  width: 280px;
  background: linear-gradient(-135deg, #BFA066, #E2D4B9);
  padding: 10px;
  margin: 16px auto;
}

#award figure {
  text-align: center;
  max-width: 80%;
  margin: auto;
}

#award figcaption {
  font-weight: bold;
  line-height: 1.4em;
  text-align: center;
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho","serif";
  font-size: 24px;
}

#award .sub {
  font-size: 14px;
}

.signature {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho","serif";
  font-size: 24px;
  margin-top: 32px;
}

.gallary_t {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 24px auto;
}

.gallary_t .img {
  max-width: 100%;
  margin: 0 auto 16px;
}

.gallary_t .text {
  max-width: 100%;
  background: var(--app-main-cr-a);
  padding: 10px 20px;
}

.gallary_l {
  display: flex;
  justify-content: flex-start;
  margin: 24px auto;
}

.gallary_l .img {
  width: 36%;
  flex-shrink: 0;
  margin-right: 16px;
}

.gallary_l .chara {
  display: flex;
  flex-direction: column;
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 8px;
}

.gallary_l .chara .title {
  font-size: 14px;
}

.gallary_t .text,
.gallary_l .text,
.gallary_r .text {
  width: 100%;
}

.gallary_t .text p:not([class]),
.introBox p {
  padding-left: 0;
  padding-right: 0;
}

.introBox {
  background: var(--app-main-cr-a);
  border: 4px solid var(--app-main-brd);
  padding: 8px 16px;
}

.gallary_r {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  margin: 24px auto;
}

.gallary_r .img {
  width: 36%;
  flex-shrink: 0;
  margin-left: 16px;
}

.gallary_flex {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
}

.gallary_flex figure {
  margin: 0 8px 8px 0;
  text-align: center;
}

.pcview .gallary_flex figure {
  margin: 0 8px 8px 0;
  text-align: center;
}

.pcview .gallary_flex.col2 figure:nth-child(2n),
.pcview .gallary_flex.col3 figure:nth-child(3n) {
  margin-right: 0px;
}

.gallary_flex.col2 figure {
  width: calc((100% - 8px) / 2);
}

.gallary_flex.col3 figure {
  width: calc((100% - 16px) / 3);
}

.spview .gallary_flex {
  justify-content: center;
}

.spview .gallary_flex figure {
  display: inline-block;
  margin: 0 10px 1em;
  text-align: center;
  width: auto;
}

.articleBox .float .LayoutR {
  margin: 0 0 16px 16px;
}

.articleBox .float .LayoutL {
  margin: 0 16px 16px 0;
}

.float p,
.float h2 {
  display: grid;
  width: auto;
}

.float .floatText {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.float .floatText p,
.float .floatText h2 {
  display: block;
  width: 100%;
}

.articleBox .float > .floatText:nth-child(2) > *:first-child {
  margin-top: 0;
}

.articleBox .float p:not([class]) {
  display: block;
  padding-left: 0;
  padding-right: 0;
}

.float figcaption {
  text-align: center;
}

.event .info dl {
  display: flex;
  flex-direction: column;
  border: solid var(--app-glnv-cr);
  border-width: 1px 1px 1px 4px;
}

.event .info dt {
  border-bottom: 1px solid var(--app-glnv-cr);
  background: var(--app-main-cr-a);
  font-size: 14px;
  padding: 0.5em 16px;
}

.event .info dd {
  padding: 0.5em 16px;
}

.event .map {
  width: 100%;
  height: 450px;
  text-align: center;
}

.event .map iframe {
  width: 100%;
  padding: 24px 0;
  height: 100%;
  max-height: 90vw;
}

/*テーブルテンプレート*/
.spview table.spVertical,
.spview .spVertical tbody,
.spview .spVertical tr,
.spview .spVertical th,
.spview .spVertical td {
  display: block;
  width: 90vw !important;
}

.spview .spVertical tr {
  border: 1px solid var(--app-main-brd);
}

.spview .spVertical td {
  border: 1px solid var(--app-main-brd-a);
}

.articleBox .tableSroll {
  width: 100%;
  overflow-x: auto;
  margin: auto;
}

.articleBox .tableSroll table {
  width: var(--app-main-width-con);
}

.spview .articleBox .tableSroll {
  width: 95%;
}

.spview .articleBox .tableSroll table {
  width: 800px;
}

.articleBox .tableInfo {
  font-size: 80%;
  padding-left: 0;
}

.pcview .tableInfo {
  display: none;
}

/*対話テンプレート*/
.articleBox .dialogue {
  list-style: none;
  padding: 0 10px;
}

.articleBox .dialogue li {
  display: flex;
  margin: 0 0 2em;
}

.dialogue .img {
  flex-shrink: 0;
  max-width: 25%;
}

.articleBox .dialogue .text {
  width: 100%;
  margin: 0;
  align-self: center;
  padding: 20px;
  border-radius: 10px;
}

.articleBox .d_left .text {
  margin-left: 1em;
}

.articleBox .d_right .text {
  margin-right: 1em;
}

.dialogue .d_right {
  flex-direction: row-reverse;
}

.d_left .text {
  border: 2px solid #e7e7e7;
}

.d_right .text {
  background: #e2f6ff;
}

.fukidashi .text {
  position: relative;
}

.fukidashi .text::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
}

.fukidashi .d_left .text::before {
  left: -0.8em;
  border-width: 0.5em 0.8em 0.5em 0;
  border-color: transparent #e7e7e7 transparent transparent;
}

.fukidashi .d_right .text::before {
  right: -0.8em;
  border-width: 0.5em 0 0.5em 0.8em;
  border-color: transparent transparent transparent #e2f6ff;
}

/*特別テンプレート*/
.spTemplate .mainClnD {
  margin: auto;
  float: none;
}

.spTemplate .sideClnD {
  display: none;
}

/* 見出し付きBOX */
.articleBox .midashi1 {
  border: 4px solid #7ebfff;
  border-radius: 10px;
  position: relative;
  max-width: 95vw;
  margin: 1em auto;
}

.articleBox .midashi1 .midashiTtl {
  position: absolute;
  top: 0;
  left: 0.5em;
  transform: translateY(-50%);
  padding: 0 0.5em;
  max-width: 90%;
  line-height: 1;
  font-size: 120%;
  font-weight: 600;
  color: #7ebfff;
  background: var(--app-bg-cr);
}

.articleBox .midashiTxt {
  width: 100%;
  padding: 1em;
}

.articleBox .midashiTxt {
  padding-top: 20px;
}

.articleBox .midashiTxt > :last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}

.articleBox .midashi2 {
  background: #bcdeff;
  max-width: 95vw;
  margin: 1em auto;
}

.articleBox .midashi2 .midashiTtl {
  padding: 0.7em 1em;
  text-align: center;
  font-size: 120%;
  font-weight: 600;
  line-height: 1;
  color: #fff;
  background: #7ebfff;
}

/*** ビデオ埋め込み共通 ***/
.videoMax {
  margin: 0 auto;
  max-width: 100%;
  padding: 10px;
}

.videoMax * {
  max-width: 100%;
}

.articleBox .videoMax p {
  padding: 0 0 0.5em;
}

.articleBox .videoMax .innvideo {
  position: relative;
  width: 100%;
  padding: 56.25% 0 0 0;
}

.videoMax .innvideo iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
}

.spview .videoMax .innvideo iframe {
  max-width: 100%;
  max-height: 100%;
}

/********* ログイン規約要素 *********/
.login_rules.login_det_Box {
  width: 900px;
  margin: 10px auto 20px auto;
  padding: 5px 15px;
}

.login_rules .login_area {
  width: 100%;
  margin: 5px auto 20px auto;
}

.login_rules_area {
  width: 100%;
  height: 200px;
  margin: 20px auto 30px auto;
  padding: 5px 15px;
  overflow-y: scroll;
  border: 1px solid var(--app-main-brd);
  font-size: 14px;
}

.login_rules_area p {
  margin: 20px auto;
}

.login_rules_area ul,
.login_rules_area ol {
  margin: 0 auto;
  padding: 0 20px;
  font-size: 16px;
  line-height: 1.4em;
  font-size: 14px;
}

.login_rules_area ul li {
  margin-top: 5px;
  margin-left: 5px;
  margin-bottom: 5px;
}

.login_rules_area ol li {
  margin-top: 5px;
  margin-left: 5px;
  margin-bottom: 5px;
}

.login_rules_area a {
  color: #005cd9;
}

.login_rules_detail.login_area {
  width: 900px;
  margin: 10px auto 20px auto;
}

.login_rules_detail_inn {
  width: 100%;
  margin: 0px auto;
  padding: 15px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  background: var(--app-main-cr-u);
  border: 1px solid var(--app-main-brd);
}

.login_rules .login_rules_field {
  width: 400px;
  margin: 0 auto 10px auto;
}

.login_rules .login_rules_field dl {
  padding: 5px 0;
}

.login_rules .login_rules_field dt {
  width: 100px;
  float: left;
}

.login_rules .login_rules_field dd {
  width: 300px;
  float: left;
}

.login_rules .regLinkArea {
  width: 500px;
  margin: 0 auto 10px auto;
  padding: 5px 0;
}

/********* 言語切替要素 *********/
#header .snavi {
  padding-top: 0px;
}

#header .langadd {
  float: left;
  margin-top: 20px;
}

.LangSelect {
  width: 250px;
  margin: 0 auto 5px auto;
  padding: 0px;
}

@media screen and (min-width: 481px) {
  .LangSelect.lang3 {
    width: 375px;
  }
}
.LangSelect li {
  display: inline-block;
  padding: 0px 2px;
}

.LangSelect a {
  width: 120px;
  margin: 0px;
  padding: 5px;
  display: block;
  text-align: center;
  font-size: 13px;
  font-weight: bold;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  background: var(--app-main-cr-u);
  border: 1px solid var(--app-main-brd);
  color: var(--app-basic-txt);
}

.LangSelect a.crt,
.LangSelect a:hover {
  background: var(--app-main-cr);
  color: var(--app-main-txt);
  text-decoration: none;
}

/* ===================================================================================
for Ipad max-width: 1024px
=================================================================================== */
@media screen and (min-width: 768px) and (max-width: 1024px) {
  /****************** 幅指定 ******************/
  .articleBox {
    width: var(--app-main-width-con-ipad);
  }

  .mainVisual, .articleBox h2.style1, .articleBox h2.style2, .articleBox h2.style3, .articleBox h3.style1, .articleBox h3.style2, .articleBox h3.style3, .articleBox table, .DLBox, .articleBox ul, .articleBox ol, .videoMax, .policy {
    width: var(--app-main-width-con-ipad);
  }

  .articleBox p.widths,
  .articleBox h4.style1,
  .articleBox h4.style2,
  .articleBox h4.style3,
  .articleBox h5.style1 {
    width: var(--app-main-width-con-s-ipad);
  }

  .popup .mainVisual {
    width: 100%;
  }

  .popup .articleBox,
  .popup .articleBox h2.style1,
  .popup .articleBox h2.style2,
  .popup .articleBox h2.style3,
  .popup .articleBox h3.style1,
  .popup .articleBox h3.style2,
  .popup .articleBox h3.style3,
  .popup .articleBox table,
  .popup .DLBox,
  .popup .articleBox ul,
  .popup .articleBox ol,
  .popup .videoMax,
  .popup .policy,
  .popup .articleBox p.widths,
  .popup .articleBox h4.style1,
  .popup .articleBox h4.style2,
  .popup .articleBox h4.style3,
  .popup .articleBox h5.style1 {
    width: 90%;
  }
}
/* ===================================================================================
for SP max-width: 480px
=================================================================================== */
@media screen and (max-width: 480px) {
  /* メインビジュアル（システム登録反映箇所） */
  .mainVisual {
    width: 100%;
  }

  /**** pタグ要素基本 ****/
  .articleBox {
    width: 100%;
  }

  .articleBox p {
    width: 90%;
    font-size: 4.2vw;
    line-height: 1.8em;
  }

  .articleBox p.style1,
  .articleBox p.style2,
  .articleBox p.style3,
  .articleBox p.style4,
  .articleBox p.style5 {
    margin: 20px auto;
  }

  .articleBox p.widths {
    width: 85%;
  }

  /**** タイトル要素基本 ****/
  .articleBox h2 {
    padding: 20px 10px;
    font-size: 5.0vw;
    font-weight: bold;
  }

  .articleBox h2.style1 {
    width: 100%;
  }

  .articleBox h2.style2,
  .articleBox h2.style3 {
    width: 90%;
  }

  .articleBox h2.style4 {
    font-size: 4vw;
    padding: 0.5em 0 0.5em 0.5em;
    font-weight: 600;
  }

  .articleBox h3 {
    padding: 10px 5px;
    font-size: 5.0vw;
    font-weight: bold;
  }

  .articleBox h3.style1,
  .articleBox h3.style2,
  .articleBox h3.style3 {
    width: 90%;
  }

  .articleBox h4 {
    margin: 20px auto 10px auto;
    padding: 10px;
    font-size: 5.0vw;
  }

  .articleBox h4.style1,
  .articleBox h4.style2 {
    width: 90%;
  }

  .articleBox h4.style3 {
    width: 90%;
    padding: 10px 10px 15px 10px;
  }

  .articleBox h5 {
    margin: 5px auto;
    padding: 10px;
    font-size: 5.0vw;
  }

  .articleBox h5.style1 {
    width: 85%;
  }

  /**** table要素基本 ****/
  .articleBox table {
    width: 90%;
  }

  .articleBox th {
    padding: 10px;
  }

  .articleBox td {
    padding: 10px;
  }

  /* DLタグ */
  .DLBox {
    width: 90%;
    margin: 30px auto;
    padding: 0;
    font-size: 4.2vw;
  }

  .DLBox dt {
    float: left;
    width: 30%;
    margin: 0;
    padding: 15px 5px;
  }

  .DLBox dd {
    float: left;
    width: 65%;
    margin: 0;
    padding: 15px 5px;
  }

  /* リスト */
  .articleBox ul,
  .articleBox ol {
    width: 90%;
    margin: 0 auto;
    /* padding: 0 10px 0 calc(1.5em + 5px); */
    font-size: 4.2vw;
    line-height: 1.6em;
  }

  /* 個別画像サイズ指定 */
  /**** テンプレート基本 ****/
  .policy {
    width: 90%;
  }

  .articleBox .policy h2 {
    padding: 10px 5px;
    font-size: 5.0vw;
  }

  .articleBox .policy h3 {
    padding: 10px 15px;
    font-size: 4.2vw;
  }

  .articleBox .float p,
  .gallary_t .text p,
  .introBox p {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  /********* ログイン規約要素 *********/
  .login_rules.login_det_Box {
    width: 100%;
    padding: 10px 10px;
  }

  .login_rules_detail.login_area {
    width: 95%;
    margin: 20px auto;
  }

  .login_rules_detail_inn {
    width: 100%;
    margin: 0px auto;
    padding: 5px;
  }

  .login_rules_area {
    height: 150px;
  }

  .login_rules a.btWtW,
  .login_rules button.btWtW {
    width: 100%;
    padding: 15px 0px;
    font-size: 4.0vw;
  }

  .login_rules a.btWtM {
    width: 90%;
    padding: 10px 0px;
    font-size: 4.0vw;
  }

  .login_rules .login_rules_field {
    width: 100%;
    margin: 0 auto 10px auto;
  }

  .login_rules .login_rules_field dl {
    padding: 5px 0;
  }

  .login_rules .login_rules_field dt {
    width: 100%;
    float: none;
  }

  .login_rules .login_rules_field dd {
    width: 100%;
    float: none;
  }

  .login_rules .regLinkArea {
    width: 100%;
    margin: 0 auto 10px auto;
    padding: 5px 0;
  }

  /********* 言語切替要素 *********/
  .LangSelect {
    width: 90%;
    margin: 0 auto 5px auto;
    padding: 0px;
  }

  .LangSelect li {
    display: inline-block;
    padding: 0px;
    width: 49%;
  }

  .LangSelect a {
    width: 100%;
    margin: 0px;
    padding: 10px;
  }
}
/* *************************
テンプレート対応 
************************* */
/*  award  */
.spview #award {
  background: url(../../../../edit_tamplate/images/award_header_sp.png) center top/100% no-repeat, url(../../../../edit_tamplate/images/award_footer_sp.png) center bottom/100% no-repeat, #F4F0E6;
  padding: 20vw 4%;
}

.spview #award h2 {
  margin: 1em auto;
}

.spview .gallary_l {
  flex-direction: column;
}

.spview .gallary_r {
  flex-direction: column-reverse;
}

.spview .gallary_l .img,
.spview .gallary_r .img {
  width: 90%;
  margin: auto;
  text-align: center;
}

.spview .gallary_l .text,
.spview .gallary_r .text {
  padding: 10px 0;
}

.spview .gallary_t,
.spview .gallary_l,
.spview .gallary_r,
.spview .float,
.spview .event,
.spview .floatText h2 {
  margin: 16px;
}

.spview .float .floatText h2 {
  margin: 0;
}

.spview .borderBox {
  width: 95%;
}

.spview .borderBox p,
.spview .midashiTxt p {
  width: 100%;
  padding: 0 0 20px;
}

.spview .borderBox ul,
.spview .borderBox ol,
.spview .midashiTxt ul,
.spview .midashiTxt ol {
  width: 100%;
  padding: 0 0 20px 1.5em;
}

.spview ul.dialogue {
  padding: 10px;
  margin: 0;
  width: 100%;
}

.spview .dialogue .text {
  margin-top: 0;
  padding: 1em;
}

@media screen and (max-width: 640px) {
  .articleBox .float .LayoutL,
  .articleBox .float .LayoutR {
    text-align: center;
    margin: 0 auto 16px;
  }
}
/*---------------------------------------
  2021 newface 2021.05.21
---------------------------------------*/
#wrapNewFace {
  width: 800px;
  max-width: 100%;
  margin: 0 auto 40px auto;
}

#wrapNewFace ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

#wrapNewFace div.tabNavi ul {
  margin: 80px 0 0 0;
  display: flex;
  border: 2px solid #b5b4b2;
  border-radius: 40px;
  justify-content: space-around;
  box-shadow: 5px 5px #b5b4b2;
  background: #fff;
}

#wrapNewFace div.tabNavi ul li {
  border-right: 2px solid #b5b4b2;
  width: 100%;
  padding: 5px;
}

#wrapNewFace div.tabNavi ul li:nth-last-child(1) {
  border-right: none;
}

#wrapNewFace div.tabNavi ul li a {
  display: flex;
  font-size: 16px;
  height: 100%;
  min-height: 65px;
  justify-content: center;
  align-items: center;
  text-align: center;
  text-decoration: none;
  line-height: 1.4em;
}

#wrapNewFace div.tabNavi ul li:nth-child(1) a {
  border-top-left-radius: 30px;
  border-bottom-left-radius: 30px;
}

#wrapNewFace div.tabNavi ul li:last-child a {
  border-top-right-radius: 30px;
  border-bottom-right-radius: 30px;
}

#wrapNewFace div.tabNavi ul li:nth-child(1) a {
  color: #3b9584;
}

#wrapNewFace div.tabNavi ul li:nth-child(2) a {
  color: #3084b1;
}

#wrapNewFace div.tabNavi ul li:nth-child(3) a {
  color: #8fa845;
}

#wrapNewFace div.tabNavi ul li:nth-child(4) a {
  color: #c07c47;
}

#wrapNewFace div.tabNavi ul li:nth-child(5) a {
  color: #bd6986;
}

#wrapNewFace div.tabNavi ul li:nth-child(6) a {
  color: #716696;
}

#wrapNewFace div#tab1.tabNavi ul li:nth-child(1) a {
  color: #fff;
  background: #3b9584;
}

#wrapNewFace div#tab2.tabNavi ul li:nth-child(2) a {
  color: #fff;
  background: #3084b1;
}

#wrapNewFace div#tab3.tabNavi ul li:nth-child(3) a {
  color: #fff;
  background: #8fa845;
}

#wrapNewFace div#tab4.tabNavi ul li:nth-child(4) a {
  color: #fff;
  background: #c07c47;
}

#wrapNewFace div#tab5.tabNavi ul li:nth-child(5) a {
  color: #fff;
  background: #bd6986;
}

#wrapNewFace div#tab6.tabNavi ul li:nth-child(6) a {
  color: #fff;
  background: #716696;
}

/*hover*/
#wrapNewFace div.tabNavi ul li:hover a {
  color: #fff;
}

#wrapNewFace div.tabNavi ul li:hover:nth-child(1) a {
  background: #3b9584;
}

#wrapNewFace div.tabNavi ul li:hover:nth-child(2) a {
  background: #3084b1;
}

#wrapNewFace div.tabNavi ul li:hover:nth-child(3) a {
  background: #8fa845;
}

#wrapNewFace div.tabNavi ul li:hover:nth-child(4) a {
  background: #c07c47;
}

#wrapNewFace div.tabNavi ul li:hover:nth-child(5) a {
  background: #bd6986;
}

#wrapNewFace div.tabNavi ul li:hover:nth-child(6) a {
  background: #716696;
}

#wrapNewFace .persons {
  margin: 40px 0 0 0;
  border-radius: 15px;
  display: flex;
  padding: 20px;
  background: #fff;
}

#wrapNewFace .persons .pImg {
  width: 270px;
  padding: 0px 10px 20px;
}

#wrapNewFace .persons .pTxt {
  width: 477px;
}

#wrapNewFace .backBtn {
  width: 210px;
  margin: 30px auto 0 auto;
}

#wrapNewFace .backBtn a {
  display: block;
  width: 100%;
  font-size: 16px;
  line-height: 40px;
  text-align: center;
  border-radius: 30px;
  text-decoration: none;
}

#wrapNewFace .tag {
  width: 133px;
  text-align: center;
  color: #fff;
  font-size: 16px;
  line-height: 40px;
  border-radius: 10px;
}

#wrapNewFace dl.name dt {
  padding: 25px 0 0 0;
  font-size: 20px;
  line-height: 35px;
}

#wrapNewFace dl.name dd {
  font-size: 32px;
  line-height: 62px;
}

#wrapNewFace dl.name dd small {
  font-size: 16px;
  padding-left: 1em;
}

#wrapNewFace dl.qa {
  font-size: 14px;
  line-height: 26px;
}

#wrapNewFace dl.qa dt {
  margin: 30px 0 10px 0;
}

#wrapNewFace dl.qa dt span.qHead {
  padding-right: 10px;
  margin-right: 10px;
  font-size: 22px;
}

#wrapNewFace #block1 .persons {
  border: 2px solid #3b9584;
  box-shadow: 5px 5px #92beb2;
}

#wrapNewFace #block2 .persons {
  border: 2px solid #3084b1;
  box-shadow: 5px 5px #8cb1d0;
}

#wrapNewFace #block3 .persons {
  border: 2px solid #8fa845;
  box-shadow: 5px 5px #bbca8e;
}

#wrapNewFace #block4 .persons {
  border: 2px solid #c07c47;
  box-shadow: 5px 5px #daaf8a;
}

#wrapNewFace #block5 .persons {
  border: 2px solid #bd6986;
  box-shadow: 5px 5px #d8a6b5;
}

#wrapNewFace #block6 .persons {
  border: 2px solid #716696;
  box-shadow: 5px 5px #a59ebf;
}

#wrapNewFace #block1 .tag {
  background: #3b9584;
}

#wrapNewFace #block2 .tag {
  background: #3084b1;
}

#wrapNewFace #block3 .tag {
  background: #8fa845;
}

#wrapNewFace #block4 .tag {
  background: #c07c47;
}

#wrapNewFace #block5 .tag {
  background: #bd6986;
}

#wrapNewFace #block6 .tag {
  background: #716696;
}

#wrapNewFace #block1 dl.qa dt {
  color: #3b9584;
}

#wrapNewFace #block1 dl.qa dt span.qHead {
  border-right: 2px dotted #3b9584;
}

#wrapNewFace #block2 dl.qa dt {
  color: #3084b1;
}

#wrapNewFace #block2 dl.qa dt span.qHead {
  border-right: 2px dotted #3084b1;
}

#wrapNewFace #block3 dl.qa dt {
  color: #8fa845;
}

#wrapNewFace #block3 dl.qa dt span.qHead {
  border-right: 2px dotted #8fa845;
}

#wrapNewFace #block4 dl.qa dt {
  color: #c07c47;
}

#wrapNewFace #block4 dl.qa dt span.qHead {
  border-right: 2px dotted #c07c47;
}

#wrapNewFace #block5 dl.qa dt {
  color: #bd6986;
}

#wrapNewFace #block5 dl.qa dt span.qHead {
  border-right: 2px dotted #bd6986;
}

#wrapNewFace #block6 dl.qa dt {
  color: #716696;
}

#wrapNewFace #block6 dl.qa dt span.qHead {
  border-right: 2px dotted #716696;
}

#wrapNewFace #block1 .backBtn a {
  border: 2px solid #3b9584;
  color: #3b9584;
}

#wrapNewFace #block1 .backBtn a:hover {
  background: #3b9584;
  color: #fff;
}

#wrapNewFace #block2 .backBtn a {
  border: 2px solid #3084b1;
  color: #3084b1;
}

#wrapNewFace #block2 .backBtn a:hover {
  background: #3084b1;
  color: #fff;
}

#wrapNewFace #block3 .backBtn a {
  border: 2px solid #8fa845;
  color: #8fa845;
}

#wrapNewFace #block3 .backBtn a:hover {
  background: #8fa845;
  color: #fff;
}

#wrapNewFace #block4 .backBtn a {
  border: 2px solid #c07c47;
  color: #c07c47;
}

#wrapNewFace #block4 .backBtn a:hover {
  background: #c07c47;
  color: #fff;
}

#wrapNewFace #block5 .backBtn a {
  border: 2px solid #bd6986;
  color: #bd6986;
}

#wrapNewFace #block5 .backBtn a:hover {
  background: #bd6986;
  color: #fff;
}

#wrapNewFace #block6 .backBtn a {
  border: 2px solid #716696;
  color: #716696;
}

#wrapNewFace #block6 .backBtn a:hover {
  background: #716696;
  color: #fff;
}

#wrapNewFace .balloon {
  position: relative;
  display: block;
  width: 100%;
  background: #ecd3db;
  margin: 15px auto 0;
}

#wrapNewFace div.tabNavi ul li.hasSub {
  position: relative;
}

#wrapNewFace div.tabNavi ul li.hasSub::before {
  content: "";
  position: absolute;
  bottom: -25px;
  left: 0;
  right: 0;
  width: 0;
  margin: auto;
  border: 15px solid transparent;
  border-bottom: 15px solid #ecd3db;
}

#wrapNewFace #tabSub {
  display: flex;
  width: 100%;
  justify-content: space-around;
  background: #ecd3db;
  padding: 15px 0;
}

#wrapNewFace .balloon.tab1,
#wrapNewFace #tabSub.tab1 {
  background: #cfece7;
}

#wrapNewFace div.tabNavi ul li.hasSub:nth-child(1)::before {
  border-bottom-color: #cfece7;
}

#wrapNewFace .balloon.tab2,
#wrapNewFace #tabSub.tab2 {
  background: #c9e2f0;
}

#wrapNewFace div.tabNavi ul li.hasSub:nth-child(2)::before {
  border-bottom-color: #c9e2f0;
}

#wrapNewFace .balloon.tab3,
#wrapNewFace #tabSub.tab3 {
  background: #e1e9c9;
}

#wrapNewFace div.tabNavi ul li.hasSub:nth-child(3)::before {
  border-bottom-color: #e1e9c9;
}

#wrapNewFace .balloon.tab4,
#wrapNewFace #tabSub.tab4 {
  background: #eddacb;
}

#wrapNewFace div.tabNavi ul li.hasSub:nth-child(4)::before {
  border-bottom-color: #eddacb;
}

#wrapNewFace .balloon.tab5,
#wrapNewFace #tabSub.tab5 {
  background: #edd6de;
}

#wrapNewFace div.tabNavi ul li.hasSub:nth-child(5)::before {
  border-bottom-color: #edd6de;
}

#wrapNewFace .balloon.tab6,
#wrapNewFace #tabSub.tab6 {
  background: #dddae6;
}

#wrapNewFace div.tabNavi ul li.hasSub:nth-child(6)::before {
  border-bottom-color: #dddae6;
}

#wrapNewFace #tabSub li a {
  color: #4e4f4c;
  text-decoration: underline;
}

#wrapNewFace br.brsp {
  display: none;
}

.spview #wrapNewFace {
  width: 90%;
  margin: 0 auto;
}

.spview #wrapNewFace div.tabNavi ul {
  margin: 40px auto 0 auto;
  width: 100%;
}

.spview #wrapNewFace div.tabNavi ul li a {
  font-size: 11px;
  min-height: 45px;
  height: 100%;
}

.spview #wrapNewFace .persons {
  margin: 30px 0 0 0;
  border-radius: 10px;
  display: block;
  padding: 15px;
}

.spview #wrapNewFace .persons .pImg {
  width: 192px;
  margin: 0 auto;
}

.spview #wrapNewFace .persons .pImg img {
  width: 100%;
}

.spview #wrapNewFace .persons .pTxt {
  padding: 20px 0 0 0;
  width: 100%;
}

.spview #wrapNewFace .backBtn {
  width: 165px;
  margin: 20px auto 0 auto;
}

.spview #wrapNewFace .backBtn a {
  font-size: 12.5px;
  line-height: 32px;
}

.spview #wrapNewFace .tag {
  width: 105px;
  font-size: 12px;
  line-height: 30px;
  border-radius: 5px;
}

.spview #wrapNewFace dl.name dt {
  padding: 20px 0 0 0;
  font-size: 16px;
  line-height: 27px;
}

.spview #wrapNewFace dl.name dd {
  font-size: 25px;
  line-height: 49px;
}

.spview #wrapNewFace dl.name dd small {
  font-size: 12px;
  padding-left: 1em;
}

.spview #wrapNewFace dl.qa {
  font-size: 14px;
  line-height: 26px;
}

.spview #wrapNewFace dl.qa dt {
  margin: 20px 0 10px 0;
}

.spview #wrapNewFace dl.qa dt span.qHead {
  padding-right: 10px;
  margin-right: 10px;
  font-size: 17px;
}

.spview #wrapNewFace #tabSub {
  display: flex;
  flex-wrap: wrap;
  width: 95%;
  justify-content: flex-start;
  padding: 15px 0;
  margin: auto;
  font-size: 12px;
}

.spview #wrapNewFace #tabSub li {
  padding: 5px;
  width: 25%;
  margin: 5px 0;
}

.spview #wrapNewFace #tabSub li a {
  color: #4e4f4c;
  text-decoration: underline;
}

.spview br.brsp {
  display: block;
}

/*利用規約対応*/
.pagetop {
  bottom: 60px;
}

#footerSub .footer_privacy {
  text-align: right;
}

/*---------------------------------------
  2022 テンプレ改修
---------------------------------------*/
.articleBox {
  line-height: 1.6em;
  font-size: 16px;
}
.articleBox p, .articleBox ul, .articleBox ol {
  line-height: 1.6em;
  font-size: 1em;
}
.articleBox figure {
  margin: 0;
}
.articleBox figcaption {
  line-height: 1.3;
  font-size: 14px;
}
.articleBox p {
  padding: 0;
  margin: 0 0 1em;
}
.articleBox p:last-child {
  margin-bottom: 0;
}
.articleBox p[class*="type"] {
  padding: 0.5em 1em;
  margin: 0 auto 1em;
}
.spview .articleBox p[class*="type"] {
  padding: 0.3em 0.8em;
}
.articleBox p.type01 {
  border: 4px solid #e7e7e7;
  border-radius: 2px;
}
.articleBox p.type02 {
  background: #f6f6f6;
  border: 4px solid #cdcdcd;
  border-radius: 2px;
}
.articleBox p.type03 {
  background: #6f6f6f;
  color: #ffffff;
}
.articleBox p.type04 {
  background: #fff7df;
}
.articleBox p.type05 {
  background: #f6f6f6;
}
.articleBox p.type06 {
  position: relative;
}
.articleBox p.type06::before, .articleBox p.type06::after {
  content: "";
  position: absolute;
  width: 1.5em;
  height: 2em;
  border-style: solid;
  pointer-events: none;
}
.articleBox p.type06::before {
  top: 0;
  left: 0;
  border-width: 2px 0 0 2px;
}
.articleBox p.type06::after {
  bottom: 0;
  right: 0;
  border-width: 0 2px 2px 0;
}
.articleBox h2[class*="type"] {
  margin: 1.2em auto 1em auto;
  padding: 0.6em 0.4em;
  font-size: 1.5em;
  font-weight: bold;
  text-align: left;
  line-height: 1.2;
}
.articleBox h2.type01 {
  border-top: 1px solid;
  border-bottom: 1px solid;
}
.articleBox h2.type02 {
  background: #6f6f6f;
  color: #ffffff;
}
.articleBox h2.type03 {
  border-left: 7px solid #19335a;
  background: #f6f6f6;
}
.articleBox h2.type04 {
  border-left: 7px solid #19335a;
  border-bottom: 1px solid  #6f6f6f;
}
.articleBox h2.type05 {
  background: #eecccc;
  clip-path: polygon(0 0, 100% 0, calc(100% - 1em) 50%, 100% 100%, 0 100%, 1em 50%);
  height: auto;
  padding-left: 2em;
  padding-right: 2em;
}
.articleBox h2.type05::before, .articleBox h2.type05::after {
  display: none;
}
.articleBox h2.type06 {
  background: repeating-linear-gradient(-45deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5) 5px, transparent 5px, transparent 10px), #e9f4ff;
}
.articleBox h2.type07 {
  position: relative;
  background: inherit;
  z-index: 10;
  background: #AADDAA;
  padding: 0.3em 0.5em 0.7em;
  margin-left: 0.3em;
}
.articleBox h2.type07::before {
  content: '';
  position: absolute;
  width: calc(100% + 0.15em);
  height: calc(100% + 0.15em);
  top: -0.3em;
  left: -0.3em;
  border: 4px solid;
  background: transparent;
  z-index: -1;
}
.articleBox h3[class*="type"] {
  margin: 1.2em auto 1em auto;
  width: auto;
  padding: 0.6em 0.4em;
  font-size: 1.35em;
  font-weight: bold;
  text-align: left;
  line-height: 1.2em;
}
.articleBox h3.type01 {
  border-bottom: 1px solid;
  text-align: left;
}
.articleBox h3.type02 {
  border: 1px solid;
  text-align: left;
}
.articleBox h3.type03 {
  background: #6f6f6f;
  color: #ffffff;
  border-radius: 3px;
}
.articleBox h3.type04 {
  border-bottom: 1px solid #cccccc;
  text-align: left;
}
.articleBox h4[class*="type"] {
  font-size: 1.2em;
  width: 100%;
  text-align: left;
  margin: 1.2em auto 1em auto;
  padding: 0.6em 0.4em;
  font-weight: bold;
}
.articleBox h4.type01 {
  background: #f6f6f6;
  border-radius: 3px;
}
.articleBox h4.type02 {
  background: #6f6f6f;
  color: #ffffff;
  border-radius: 3px;
}
.articleBox h4.type03 {
  padding-bottom: 0.8em;
  border-style: solid;
  border-width: 0 0 1px 7px;
}
.articleBox h5[class*="type"] {
  font-size: 1em;
  width: 100%;
  text-align: left;
  font-weight: bold;
}
.articleBox h5.type01 {
  border-bottom: 1px solid #cdcdcd;
}
.articleBox ul, .articleBox ol {
  padding: 0 0 0 1.5em;
}
.articleBox ul li, .articleBox ol li {
  margin: 0;
}
.articleBox .list__mgb1em li {
  margin-bottom: 1em;
}
.spview .articleBox {
  padding: 0 1em;
}
.spview .articleBox > p, .spview .articleBox > ul, .spview .articleBox > ol {
  margin: 0 0 1em;
  width: auto;
}
.spview .articleBox > h2[class*="type"],
.spview .articleBox > h3[class*="type"],
.spview .articleBox > h4[class*="type"],
.spview .articleBox > h5[class*="type"] {
  margin-left: 0;
  margin-right: 0;
  width: auto;
}
@media screen and (max-width: 480px) {
  .articleBox p, .articleBox ul, .articleBox ol,
  .articleBox h2[class*="type"],
  .articleBox h3[class*="type"],
  .articleBox h4[class*="type"],
  .articleBox h5[class*="type"] {
    width: auto;
  }
}
.articleBox .listmarkCustom {
  padding-left: 0 !important;
  list-style-type: none;
}
.articleBox .listmarkCustom li {
  display: flex;
}
.articleBox .listmarkCustom li::before {
  display: inline-block;
  flex-shrink: 0;
  margin-right: 0.25em;
}
.articleBox ul.listmarkCustom > li::before {
  content: attr(data-marker);
}
.articleBox ol.listmarkCustom {
  counter-reset: customlistItem;
}
.articleBox ol.listmarkCustom > li::before {
  counter-increment: customlistItem;
  content: attr(data-marker) counter(customlistItem);
}
.articleBox .bg__color-red {
  background-color: #ffc8c8 !important;
}
.articleBox .bg__color-pink {
  background-color: #fdeff2 !important;
}
.articleBox .bg__color-blue {
  background-color: #E4F3F8 !important;
}
.articleBox .bg__color-orange {
  background-color: #FCF4E4 !important;
}
.articleBox .bg__color-green {
  background-color: #EDF9ED !important;
}
.articleBox .bg__color-gray {
  background-color: #f6f6f6 !important;
}
.articleBox .bg__color-bg {
  background-color: var(--app-bg-cr) !important;
  /*背景色：背景色*/
}
.articleBox .bg__color-main {
  background-color: var(--app-main-cr) !important;
  /*背景色：メインカラー*/
}
.articleBox .bg__color-main-cr {
  background-color: var(--app-main-cr-c) !important;
  /*背景色：メインカラー差色*/
}
.articleBox .bg__color-header {
  background-color: var(--app-header-cr) !important;
  /*背景色：ヘッダー*/
}
.articleBox .bg__color-footer {
  background-color: var(--app-footer-cr) !important;
  /*背景色：フッター*/
}
.articleBox .bg__color-gnavi {
  background-color: var(--app-glnv-cr) !important;
  /*背景色：グローバルナビ*/
}
.articleBox .bg__color-sbnv {
  background-color: var(--app-sbnv-cr) !important;
  /*背景色：サブ*/
}
.articleBox .bg__color-copy {
  background-color: var(--app-copy-cr) !important;
  /*背景色：コピーライト*/
}
.articleBox .bg__color-basic-txt {
  background-color: var(--app-basic-txt) !important;
  /*文字色：基本テキスト*/
}
.articleBox .bg__color-main-txt {
  background-color: var(--app-main-txt) !important;
  /*文字色：メインカラーテキスト*/
}
.articleBox .bg__color-main-c-txt {
  background-color: var(--app-main-c-txt) !important;
  /*文字色：メインカラー差色テキスト*/
}
.articleBox .bg__color-glnv-txt {
  background-color: var(--app-glnv-txt) !important;
  /*文字色：グローバルテキスト*/
}
.articleBox .bg__color-sbnv-txt {
  background-color: var(--app-sbnv-txt) !important;
  /*文字色：サブテキスト*/
}
.articleBox .bg__color-copy-txt {
  background-color: var(--app-copy-txt) !important;
  /*文字色：コピーライトテキスト*/
}
.articleBox .font__color-red {
  color: #c73434 !important;
}
.articleBox .font__color-blue {
  color: #0093d6 !important;
}
.articleBox .font__color-orange {
  color: #ff8400 !important;
}
.articleBox .font__color-green {
  color: #1da217 !important;
}
.articleBox .font__color-bg {
  color: var(--app-bg-cr) !important;
  /*背景色：背景色*/
}
.articleBox .font__color-main {
  color: var(--app-main-cr) !important;
  /*背景色：メインカラー*/
}
.articleBox .font__color-main-cr {
  color: var(--app-main-cr-c) !important;
  /*背景色：メインカラー差色*/
}
.articleBox .font__color-header {
  color: var(--app-header-cr) !important;
  /*背景色：ヘッダー*/
}
.articleBox .font__color-footer {
  color: var(--app-footer-cr) !important;
  /*背景色：フッター*/
}
.articleBox .font__color-gnavi {
  color: var(--app-glnv-cr) !important;
  /*背景色：グローバルナビ*/
}
.articleBox .font__color-sbnv {
  color: var(--app-sbnv-cr) !important;
  /*背景色：サブ*/
}
.articleBox .font__color-copy {
  color: var(--app-copy-cr) !important;
  /*背景色：コピーライト*/
}
.articleBox .font__color-basic-txt {
  color: var(--app-basic-txt) !important;
  /*文字色：基本テキスト*/
}
.articleBox .font__color-main-txt {
  color: var(--app-main-txt) !important;
  /*文字色：メインカラーテキスト*/
}
.articleBox .font__color-main-c-txt {
  color: var(--app-main-c-txt) !important;
  /*文字色：メインカラー差色テキスト*/
}
.articleBox .font__color-glnv-txt {
  color: var(--app-glnv-txt) !important;
  /*文字色：グローバルテキスト*/
}
.articleBox .font__color-sbnv-txt {
  color: var(--app-sbnv-txt) !important;
  /*文字色：サブテキスト*/
}
.articleBox .font__color-copy-txt {
  color: var(--app-copy-txt) !important;
  /*文字色：コピーライトテキスト*/
}
.articleBox .border__box {
  padding: 1em 1.5em;
  margin: 2em auto;
  width: auto;
}
.articleBox .border__box p {
  margin-left: 0;
  margin-right: 0;
}
.spview .articleBox .border__box {
  margin: 2em 0;
  padding: 0.3em 0.8em;
}
.articleBox .border__type {
  border: 4px solid;
}
.articleBox .border__type-top {
  border-top: 4px solid;
}
.articleBox .border__type-bottom {
  border-bottom: 4px solid;
}
.articleBox .border__type-left {
  border-left: 4px solid;
}
.articleBox .border__type-right {
  border-right: 4px solid;
}
.articleBox .border__type-s {
  border: 2px solid;
}
.articleBox .border__type-s_top {
  border-top: 2px solid;
}
.articleBox .border__type-s_bottom {
  border-bottom: 2px solid;
}
.articleBox .border__type-s_left {
  border-left: 2px solid;
}
.articleBox .border__type-s_right {
  border-right: 2px solid;
}
.articleBox .border__type-w {
  border: 8px double;
}
.articleBox .border__type-w_top {
  border-top: 8px double;
}
.articleBox .border__type-w_bottom {
  border-bottom: 8px double;
}
.articleBox .border__type-w_left {
  border-left: 8px double;
}
.articleBox .border__type-w_right {
  border-right: 8px double;
}
.articleBox .border__type-d {
  border: 2px dotted;
}
.articleBox .border__type-d_top {
  border-top: 2px dotted;
}
.articleBox .border__type-d_bottom {
  border-bottom: 2px dotted;
}
.articleBox .border__type-d_left {
  border-left: 2px dotted;
}
.articleBox .border__type-d_right {
  border-right: 2px dotted;
}
.articleBox .border__type-dash {
  border: 2px dashed;
}
.articleBox .border__type-dash_top {
  border-top: 2px dashed;
}
.articleBox .border__type-dash_bottom {
  border-bottom: 2px dashed;
}
.articleBox .border__type-dash_left {
  border-left: 2px dashed;
}
.articleBox .border__type-dash_right {
  border-right: 2px dashed;
}
.articleBox .border__color-red {
  border-color: #EE8686 !important;
}
.articleBox .border__color-blue {
  border-color: #91CEE3 !important;
}
.articleBox .border__color-orange {
  border-color: #FFC489 !important;
}
.articleBox .border__color-green {
  border-color: #A9D5A7 !important;
}
.articleBox .border__color-bg {
  border-color: var(--app-bg-cr) !important;
  /*背景色：背景色*/
}
.articleBox .border__color-main {
  border-color: var(--app-main-cr) !important;
  /*背景色：メインカラー*/
}
.articleBox .border__color-main-cr {
  border-color: var(--app-main-cr-c) !important;
  /*背景色：メインカラー差色*/
}
.articleBox .border__color-header {
  border-color: var(--app-header-cr) !important;
  /*背景色：ヘッダー*/
}
.articleBox .border__color-footer {
  border-color: var(--app-footer-cr) !important;
  /*背景色：フッター*/
}
.articleBox .border__color-gnavi {
  border-color: var(--app-glnv-cr) !important;
  /*背景色：グローバルナビ*/
}
.articleBox .border__color-sbnv {
  border-color: var(--app-sbnv-cr) !important;
  /*背景色：サブ*/
}
.articleBox .border__color-copy {
  border-color: var(--app-copy-cr) !important;
  /*背景色：コピーライト*/
}
.articleBox .border__color-basic-txt {
  border-color: var(--app-basic-txt) !important;
  /*文字色：基本テキスト*/
}
.articleBox .border__color-main-txt {
  border-color: var(--app-main-txt) !important;
  /*文字色：メインカラーテキスト*/
}
.articleBox .border__color-main-c-txt {
  border-color: var(--app-main-c-txt) !important;
  /*文字色：メインカラー差色テキスト*/
}
.articleBox .border__color-glnv-txt {
  border-color: var(--app-glnv-txt) !important;
  /*文字色：グローバルテキスト*/
}
.articleBox .border__color-sbnv-txt {
  border-color: var(--app-sbnv-txt) !important;
  /*文字色：サブテキスト*/
}
.articleBox .border__color-copy-txt {
  border-color: var(--app-copy-txt) !important;
  /*文字色：コピーライトテキスト*/
}
.articleBox .midashi__box1 {
  position: relative;
  width: auto;
}
.articleBox .midashi__box1 .title {
  position: absolute;
  top: 0em;
  left: 1.5em;
  padding: 0 0.5em;
  margin: 0;
  transform: translateY(-50%);
  font-weight: 600;
  letter-spacing: 0.01em;
  background: var(--app-bg-cr);
}
.articleBox .midashi__box1 .title p {
  font-size: 1.2em;
}
.spview .articleBox .midashi__box1 .border__box {
  padding-top: 0.8em;
}
.articleBox .midashi__box2 {
  margin: 2em auto;
  width: auto;
}
.articleBox .midashi__box2 .title {
  padding: 0.5em 1.5em;
  text-align: center;
  font-weight: 600;
  letter-spacing: 0.01em;
  background: #7ebfff;
  color: #fff;
}
.articleBox .midashi__box2 .title p {
  font-size: 1.2em;
}
.articleBox .midashi__box2 .text {
  background: #bcdeff;
  padding: 1em 1.5em;
}
.spview .articleBox .midashi__box2 .text {
  padding: 0.3em 0.8em;
}
.articleBox .midashi__box3 {
  margin: 2em auto;
  width: auto;
  border: solid var(--app-glnv-cr);
  border-width: 1px 1px 1px 4px;
}
.articleBox .midashi__box3 > div {
  padding: 0.5em 1em;
}
.articleBox .midashi__box3 .title {
  border-bottom: 1px solid var(--app-glnv-cr);
  background: var(--app-main-cr-a);
}
.articleBox .midashi__box3 .title p {
  font-size: 0.9em;
}
.spview .articleBox .midashi__box3 > div {
  padding: 0.3em 0.8em;
}
.articleBox .gallary__large {
  margin: 1em auto;
}
.articleBox .gallary__large .img {
  margin-bottom: 1em;
}
.articleBox .gallary__large .text {
  background: #f6f6f6;
  padding: 1em;
}
.articleBox .gallary__large .text > *:not(ul, ol) {
  margin-left: 0;
  margin-right: 0;
}
.articleBox .gallary__large .text > *:not(ul, ol):first-child {
  margin-top: 0;
}
.articleBox .gallary__large figure {
  text-align: center;
}
.articleBox .gallary__small {
  background: #ededed;
  margin: 1em auto;
}
.articleBox .gallary__small > div[class^="gallary__small-"] {
  display: flex;
  align-items: center;
}
.articleBox .gallary__small > div[class^="gallary__small-"] > div {
  width: 50%;
}
.articleBox .gallary__small > div[class^="gallary__small-"] .img img {
  width: 100%;
}
.articleBox .gallary__small > div[class^="gallary__small-"] .text {
  padding: 1em;
}
.articleBox .gallary__small > div[class^="gallary__small-"] .text > *:not(ul, ol) {
  margin-left: 0;
  margin-right: 0;
}
.articleBox .gallary__small > div[class^="gallary__small-"] .text > *:not(ul, ol):first-child {
  margin-top: 0;
}
.articleBox .gallary__small > div[class^="gallary__small-"] .text > *:not(ul, ol):not([class]) {
  width: 100%;
  padding: 0;
}
.articleBox .gallary__small-right {
  flex-direction: row-reverse;
}
.spview .articleBox .gallary__small > div[class^="gallary__small-"] {
  flex-direction: column;
}
.spview .articleBox .gallary__small > div[class^="gallary__small-"] > div {
  width: 100%;
}
.articleBox .gallary__grid {
  display: grid;
  background: #ededed;
  margin: 1em auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, auto);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
}
.articleBox .gallary__grid > div:nth-child(1) {
  grid-area: 1 / 1 / 2 / 2;
}
.articleBox .gallary__grid > div:nth-child(2) {
  grid-area: 2 / 1 / 4 / 2;
}
.articleBox .gallary__grid > div:nth-child(3) {
  grid-area: 3 / 2 / 4 / 3;
}
.articleBox .gallary__grid > div:nth-child(4) {
  grid-area: 1 / 2 / 3 / 3;
}
.articleBox .gallary__grid > div:nth-child(5) {
  grid-area: 1 / 3 / 2 / 4;
}
.articleBox .gallary__grid > div:nth-child(6) {
  grid-area: 2 / 3 / 4 / 4;
}
.articleBox .gallary__grid .img {
  display: flex;
  align-items: center;
  justify-content: center;
}
.articleBox .gallary__grid .cap {
  padding: 1em;
}
.articleBox .gallary__grid .cap > *:first-child {
  margin-top: 0;
}
.articleBox .gallary__grid .cap > *:not(ul, ol):not([class]) {
  width: 100%;
  padding: 0;
}
.spview .articleBox .gallary__grid {
  display: block;
}
.articleBox .gallary__flex {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
}
.articleBox .gallary__flex figure {
  margin: 0 1em 1em 0;
  text-align: center;
}
.articleBox .gallary__flex.col2 figure {
  width: calc((100% - 1em) / 2);
}
.articleBox .gallary__flex.col2 figure:nth-child(2n) {
  margin-right: 0;
}
.articleBox .gallary__flex.col3 figure {
  width: calc((100% - 2em) / 3);
}
.articleBox .gallary__flex.col3 figure:nth-child(3n) {
  margin-right: 0;
}
.spview .articleBox .gallary__flex figure {
  width: 100%;
  margin: 0 0 1em;
}
.articleBox .gallary__flex.col4 figure {
  width: calc((100% - 3em) / 4);
}
.articleBox .gallary__flex.col4 figure:nth-child(4n) {
  margin-right: 0;
}
.spview .articleBox .gallary__flex.col4 figure {
  width: calc((100% - 1em) / 2);
  margin: 0 1em 1em 0;
}
.spview .articleBox .gallary__flex.col4 figure:nth-child(2n) {
  margin-right: 0;
}
.articleBox .floatBlock .LayoutL {
  width: auto;
  margin: 0 2em 1.5em 0;
}
.articleBox .floatBlock .LayoutR {
  width: auto;
  margin: 0 0 1.5em 2em;
}
.articleBox .floatBlock figure {
  text-align: center;
}
.articleBox .floatBlock .floatText {
  width: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.articleBox .floatBlock .floatText > * {
  width: 100%;
}
.articleBox .floatBlock > .floatText:nth-child(2) > *:first-child {
  margin-top: 0;
}
.spview .articleBox .floatBlock > *:not(ul, ol) {
  margin-left: 0;
  margin-right: 0;
}
.spview .articleBox .floatBlock > *:not(ul, ol):first-child {
  margin-top: 0;
}
.spview .articleBox .floatBlock .LayoutL, .spview .articleBox .floatBlock .LayoutR {
  float: none;
  width: 100%;
  margin: 0 auto 2em;
  text-align: center;
}
.articleBox .persons {
  border: 3px solid;
  border-radius: 1em;
  padding: 1.5em;
  margin-bottom: 2em;
}
.articleBox .persons__tag {
  font-size: 1.2em;
  color: #fff;
}
.articleBox .persons__tag > span {
  display: inline-block;
  padding: 0.25em 1em;
  border-radius: 0.5em;
}
.spview .articleBox .persons__tag {
  font-size: 0.9em;
}
.articleBox .persons__name {
  margin: 1em 0;
  font-size: 2em;
}
.spview .articleBox .persons__name {
  font-size: 1.6em;
}
.articleBox .persons__name p {
  margin: 0;
  font-size: 1em;
}
.articleBox .persons__name-belong {
  font-size: 0.6em !important;
}
.articleBox .persons__name-kana {
  display: inline-block;
  font-size: 0.5em;
  margin: 0 0 0 1em;
}
.articleBox .persons__qa {
  padding-left: 0 !important;
  list-style-type: none;
  counter-reset: personsQaItem;
}
.articleBox .persons__qa > li {
  counter-increment: personsQaItem;
  font-size: 0.9em;
  margin-bottom: 2em !important;
}
.articleBox .persons__qa > li p {
  line-height: 1.5;
}
.articleBox .persons__qa > li .persons__qa-q {
  display: flex;
}
.articleBox .persons__qa > li .persons__qa-q::before {
  content: attr(data-marker) counter(personsQaItem);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2.5em;
  height: 100%;
  margin-right: 0.5em;
  padding-right: 0.25em;
  font-size: 1.5em;
  border-right: 2px dotted;
}
.articleBox .persons__btn {
  text-align: center;
}
.articleBox .persons__btn a {
  display: inline-block;
  border-radius: 2em;
  padding: 0.4em 2em;
  border: 2px solid;
}
.spview .articleBox .persons {
  border: 2px solid;
  border-radius: 1em;
  padding: 1.5em 1em;
}
.articleBox .intro .img {
  text-align: center;
}
.articleBox .intro__list {
  display: block;
  padding: 0 !important;
  margin: 0;
  list-style: none;
}
.articleBox .intro__list > li {
  display: block;
}
.articleBox .intro__list > li:nth-child(9n-8) > h2,
.articleBox .intro__list > li:nth-child(9n-8) .persons,
.articleBox .intro__list > li:nth-child(9n-8) .persons__btn a {
  border-color: #3b9584;
}
.articleBox .intro__list > li:nth-child(9n-8) .persons {
  box-shadow: 0.3em 0.3em #3b958480;
}
.articleBox .intro__list > li:nth-child(9n-8) .persons__tag > span {
  background: #3b9584;
}
.articleBox .intro__list > li:nth-child(9n-8) .persons__qa-q, .articleBox .intro__list > li:nth-child(9n-8) .persons__btn a {
  color: #3b9584;
}
.articleBox .intro__list > li:nth-child(9n-7) > h2,
.articleBox .intro__list > li:nth-child(9n-7) .persons,
.articleBox .intro__list > li:nth-child(9n-7) .persons__btn a {
  border-color: #3084b1;
}
.articleBox .intro__list > li:nth-child(9n-7) .persons {
  box-shadow: 0.3em 0.3em #3084b180;
}
.articleBox .intro__list > li:nth-child(9n-7) .persons__tag > span {
  background: #3084b1;
}
.articleBox .intro__list > li:nth-child(9n-7) .persons__qa-q, .articleBox .intro__list > li:nth-child(9n-7) .persons__btn a {
  color: #3084b1;
}
.articleBox .intro__list > li:nth-child(9n-6) > h2,
.articleBox .intro__list > li:nth-child(9n-6) .persons,
.articleBox .intro__list > li:nth-child(9n-6) .persons__btn a {
  border-color: #8fa845;
}
.articleBox .intro__list > li:nth-child(9n-6) .persons {
  box-shadow: 0.3em 0.3em #8fa84580;
}
.articleBox .intro__list > li:nth-child(9n-6) .persons__tag > span {
  background: #8fa845;
}
.articleBox .intro__list > li:nth-child(9n-6) .persons__qa-q, .articleBox .intro__list > li:nth-child(9n-6) .persons__btn a {
  color: #8fa845;
}
.articleBox .intro__list > li:nth-child(9n-5) > h2,
.articleBox .intro__list > li:nth-child(9n-5) .persons,
.articleBox .intro__list > li:nth-child(9n-5) .persons__btn a {
  border-color: #c07c47;
}
.articleBox .intro__list > li:nth-child(9n-5) .persons {
  box-shadow: 0.3em 0.3em #c07c4780;
}
.articleBox .intro__list > li:nth-child(9n-5) .persons__tag > span {
  background: #c07c47;
}
.articleBox .intro__list > li:nth-child(9n-5) .persons__qa-q, .articleBox .intro__list > li:nth-child(9n-5) .persons__btn a {
  color: #c07c47;
}
.articleBox .intro__list > li:nth-child(9n-4) > h2,
.articleBox .intro__list > li:nth-child(9n-4) .persons,
.articleBox .intro__list > li:nth-child(9n-4) .persons__btn a {
  border-color: #bd6986;
}
.articleBox .intro__list > li:nth-child(9n-4) .persons {
  box-shadow: 0.3em 0.3em #bd698680;
}
.articleBox .intro__list > li:nth-child(9n-4) .persons__tag > span {
  background: #bd6986;
}
.articleBox .intro__list > li:nth-child(9n-4) .persons__qa-q, .articleBox .intro__list > li:nth-child(9n-4) .persons__btn a {
  color: #bd6986;
}
.articleBox .intro__list > li:nth-child(9n-3) > h2,
.articleBox .intro__list > li:nth-child(9n-3) .persons,
.articleBox .intro__list > li:nth-child(9n-3) .persons__btn a {
  border-color: #716696;
}
.articleBox .intro__list > li:nth-child(9n-3) .persons {
  box-shadow: 0.3em 0.3em #71669680;
}
.articleBox .intro__list > li:nth-child(9n-3) .persons__tag > span {
  background: #716696;
}
.articleBox .intro__list > li:nth-child(9n-3) .persons__qa-q, .articleBox .intro__list > li:nth-child(9n-3) .persons__btn a {
  color: #716696;
}
.articleBox .intro__list > li:nth-child(9n-2) > h2,
.articleBox .intro__list > li:nth-child(9n-2) .persons,
.articleBox .intro__list > li:nth-child(9n-2) .persons__btn a {
  border-color: #759dd3;
}
.articleBox .intro__list > li:nth-child(9n-2) .persons {
  box-shadow: 0.3em 0.3em #759dd380;
}
.articleBox .intro__list > li:nth-child(9n-2) .persons__tag > span {
  background: #759dd3;
}
.articleBox .intro__list > li:nth-child(9n-2) .persons__qa-q, .articleBox .intro__list > li:nth-child(9n-2) .persons__btn a {
  color: #759dd3;
}
.articleBox .intro__list > li:nth-child(9n-1) > h2,
.articleBox .intro__list > li:nth-child(9n-1) .persons,
.articleBox .intro__list > li:nth-child(9n-1) .persons__btn a {
  border-color: #9cc256;
}
.articleBox .intro__list > li:nth-child(9n-1) .persons {
  box-shadow: 0.3em 0.3em #9cc25680;
}
.articleBox .intro__list > li:nth-child(9n-1) .persons__tag > span {
  background: #9cc256;
}
.articleBox .intro__list > li:nth-child(9n-1) .persons__qa-q, .articleBox .intro__list > li:nth-child(9n-1) .persons__btn a {
  color: #9cc256;
}
.articleBox .intro__list > li:nth-child(9n) > h2,
.articleBox .intro__list > li:nth-child(9n) .persons,
.articleBox .intro__list > li:nth-child(9n) .persons__btn a {
  border-color: #d5bc19;
}
.articleBox .intro__list > li:nth-child(9n) .persons {
  box-shadow: 0.3em 0.3em #d5bc1980;
}
.articleBox .intro__list > li:nth-child(9n) .persons__tag > span {
  background: #d5bc19;
}
.articleBox .intro__list > li:nth-child(9n) .persons__qa-q, .articleBox .intro__list > li:nth-child(9n) .persons__btn a {
  color: #d5bc19;
}
.articleBox .intro__left {
  display: flex;
  justify-content: flex-start;
  margin: 1em auto;
}
.articleBox .intro__left .img {
  width: 38%;
  padding-right: 2em;
  text-align: center;
}
.articleBox .intro__left .text {
  width: 62%;
}
.articleBox .intro__left .chara {
  display: flex;
  flex-direction: column;
  margin: 0 0 8px;
}
.articleBox .intro__left .chara p {
  font-weight: 600;
  margin: 0;
  line-height: 1.2;
}
.articleBox .intro__left .chara__belong {
  font-size: 0.9em;
}
.spview .articleBox .intro__left {
  flex-direction: column;
}
.spview .articleBox .intro__left .img {
  width: 100%;
  text-align: center;
  margin-bottom: 1.5em;
  padding-right: 0;
}
.spview .articleBox .intro__left .text {
  width: 100%;
}
.articleBox .intro__box {
  background: #fdfdfd;
  border: 4px solid #dedede;
  padding: 1em;
}
.articleBox .intro__box > * {
  margin-left: 0;
  margin-right: 0;
}
.articleBox .intro__box > *:first-child {
  margin-top: 0;
}
.articleBox .intro__box > *:last-child {
  margin-bottom: 0;
}
.articleBox .intro__navi {
  padding: 1.5em;
  border: 2px solid;
  border-radius: 1em;
}
.articleBox .intro__navi ul {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
}
.articleBox .intro__navi li {
  width: calc((100% - 2em) / 3);
  margin: 0 1em 0.5em 0;
  display: flex;
}
.articleBox .intro__navi li a {
  display: block;
  width: 100%;
  color: #474747;
  font-weight: 700;
}
.articleBox .intro__navi li:nth-child(3n) {
  margin-right: 0;
}
.articleBox .intro__navi li::before {
  content: "";
  border: 0.5em solid transparent;
  display: inline-block;
  width: 0;
  height: 0;
  flex-shrink: 0;
  margin: 0.2em 0;
}
.articleBox .intro__navi li:nth-child(9n-8)::before {
  border-left-color: #3b9584;
}
.articleBox .intro__navi li:nth-child(9n-8) a:hover {
  color: #3b9584;
  text-decoration: underline;
}
.articleBox .intro__navi li:nth-child(9n-7)::before {
  border-left-color: #3084b1;
}
.articleBox .intro__navi li:nth-child(9n-7) a:hover {
  color: #3084b1;
  text-decoration: underline;
}
.articleBox .intro__navi li:nth-child(9n-6)::before {
  border-left-color: #8fa845;
}
.articleBox .intro__navi li:nth-child(9n-6) a:hover {
  color: #8fa845;
  text-decoration: underline;
}
.articleBox .intro__navi li:nth-child(9n-5)::before {
  border-left-color: #c07c47;
}
.articleBox .intro__navi li:nth-child(9n-5) a:hover {
  color: #c07c47;
  text-decoration: underline;
}
.articleBox .intro__navi li:nth-child(9n-4)::before {
  border-left-color: #bd6986;
}
.articleBox .intro__navi li:nth-child(9n-4) a:hover {
  color: #bd6986;
  text-decoration: underline;
}
.articleBox .intro__navi li:nth-child(9n-3)::before {
  border-left-color: #716696;
}
.articleBox .intro__navi li:nth-child(9n-3) a:hover {
  color: #716696;
  text-decoration: underline;
}
.articleBox .intro__navi li:nth-child(9n-2)::before {
  border-left-color: #759dd3;
}
.articleBox .intro__navi li:nth-child(9n-2) a:hover {
  color: #759dd3;
  text-decoration: underline;
}
.articleBox .intro__navi li:nth-child(9n-1)::before {
  border-left-color: #9cc256;
}
.articleBox .intro__navi li:nth-child(9n-1) a:hover {
  color: #9cc256;
  text-decoration: underline;
}
.articleBox .intro__navi li:nth-child(9n)::before {
  border-left-color: #d5bc19;
}
.articleBox .intro__navi li:nth-child(9n) a:hover {
  color: #d5bc19;
  text-decoration: underline;
}
.spview .articleBox .intro__navi li {
  width: 100%;
  margin-right: 0;
}
.articleBox .c-iframe__wrap {
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 56.25%;
}
.articleBox .c-iframe__wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.articleBox .c-iframe__wrap.type01 {
  padding-top: 100%;
}
.articleBox .c-iframe__wrap.type02 {
  padding-top: 177.78%;
}
.articleBox .taiwa > ul {
  display: block;
  list-style: none;
  padding: 0;
  margin: 0;
}
.articleBox .taiwa li {
  display: flex;
  margin: 0 0 2em;
}
.articleBox .taiwa .img {
  flex-shrink: 0;
  max-width: 25%;
}
.articleBox .taiwa .awardFrame .img {
  align-items: flex-start;
}
.articleBox .taiwa .text {
  position: relative;
  width: 100%;
  margin: 0;
  align-self: center;
  border-radius: 10px;
  padding: 1em;
}
.articleBox .taiwa .text > *:first-child {
  margin-top: 0;
}
.articleBox .taiwa .text > *:last-child {
  margin-bottom: 0;
}
.articleBox .taiwa__left > .text {
  border: 2px solid #e7e7e7;
  margin-left: 1.5em;
}
.articleBox .taiwa__right {
  flex-direction: row-reverse;
}
.articleBox .taiwa__right > .text {
  background: #e2f6ff;
  margin-right: 1.5em;
}
.articleBox .taiwa .fukidashi .text::before {
  content: "";
  position: absolute;
  top: 50px;
  bottom: auto;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-style: solid;
}
@media screen and (max-width: 480px) {
  .articleBox .taiwa .fukidashi .text::before {
    top: 10vw;
  }
}
.articleBox .taiwa .fukidashi .taiwa__left .text::before {
  left: -0.8em;
  border-width: 0.5em 0.8em 0.5em 0;
  border-color: transparent #e7e7e7 transparent transparent;
}
.articleBox .taiwa .fukidashi .taiwa__right .text::before {
  right: -0.8em;
  border-width: 0.5em 0 0.5em 0.8em;
  border-color: transparent transparent transparent #e2f6ff;
}
.articleBox .taiwa .zadankai .img {
  width: 100px;
  max-width: 15vw;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  height: 100px;
  max-height: 15vw;
  overflow: hidden;
}
.articleBox .taiwa .zadankai .img img {
  display: block;
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.articleBox .taiwa .zadankai .text {
  border: none;
  background: inherit;
  padding: 0;
}
.articleBox .awardFrame {
  background: url(../../../../edit_tamplate/images/award_header.png) center top/100% no-repeat, url(../../../../edit_tamplate/images/award_footer.png) center calc(100% + 18px)/100% no-repeat, #F4F0E6;
  position: relative;
  padding: 60px 60px 120px;
}
.articleBox .awardFrame * {
  max-width: 100%;
}
.articleBox .awardFrame h2 {
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-size: 32px;
  line-height: 36px;
  margin: 2em auto 1em;
  padding: 1em 0 0;
  text-align: center;
}
.articleBox .awardFrame .date {
  text-align: center;
  background: url(../../../../edit_tamplate/images/ribbon.svg) center center/auto 100% no-repeat;
  padding: 0em;
  color: #fff;
}
.articleBox .awardFrame > .img {
  display: flex;
  justify-content: center;
}
.articleBox .awardFrame figure {
  text-align: center;
  max-width: 80%;
  margin: auto auto 0;
  padding: 0 0.5em;
}
.articleBox .awardFrame figure img {
  width: auto;
  background: linear-gradient(-135deg, #BFA066, #E2D4B9);
  padding: 10px;
  margin: 16px auto;
}
.articleBox .awardFrame figcaption {
  font-weight: bold;
  line-height: 1.4em;
  text-align: center;
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho","serif";
  font-size: 24px;
}
.articleBox .awardFrame .sub {
  font-size: 14px;
}
.articleBox .awardFrame .signature {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho","serif";
  font-size: 24px;
  margin-top: 32px;
}
.spview .articleBox .awardFrame {
  background: url(../../../../edit_tamplate/images/award_header_sp.png) center top/100% no-repeat, url(../../../../edit_tamplate/images/award_footer_sp.png) center bottom/100% no-repeat, #F4F0E6;
  padding: 20vw 4%;
}
.spview .articleBox .awardFrame h2 {
  margin: 1em auto;
}
.spview .articleBox .awardFrame .img {
  flex-direction: column;
  align-items: center;
}
.articleBox .eventBlock .map {
  width: 100%;
  height: auto;
  text-align: center;
  margin: 1.5em 0;
  position: relative;
}
.articleBox .eventBlock .map iframe {
  width: 100%;
  height: 450px;
  max-height: 90vw;
  padding: 0;
}
.spview .articleBox .table__vertical table, .spview .articleBox .table__vertical tbody, .spview .articleBox .table__vertical tr, .spview .articleBox .table__vertical th, .spview .articleBox .table__vertical td {
  display: block;
  width: 100% !important;
}
.spview .articleBox .table__vertical tr {
  border-width: 1px 1px 0;
  border-style: solid;
  border-color: var(--app-main-brd);
}
.spview .articleBox .table__vertical tr::last-child {
  border-bottom-width: 1px;
}
.spview .articleBox .table__vertical th, .spview .articleBox .table__vertical td {
  border-width: 0 0 1px;
}
.spview .articleBox .table__vertical th :last-child, .spview .articleBox .table__vertical td :last-child {
  border-bottom-width: 0;
}
.articleBox .table__scroll {
  width: 100%;
  overflow-x: auto;
  margin: auto;
}
.articleBox .table__scroll .tableInfo {
  position: sticky;
  left: 0;
}
.pcview .articleBox .table__scroll .tableInfo {
  display: none;
}
.articleBox .imagePhoto figure {
  padding: 1.5em 0.5em 0;
}
.articleBox .imagePhoto figure figcaption {
  display: block;
  padding: 0.5em 0;
}
.articleBox .imagePhoto__inn {
  display: inline-block;
  position: relative;
  transform-origin: center center;
  text-align: center;
  border: 1px solid var(--app-main-brd);
  background: #fff;
}
.articleBox .imagePhoto__inn-tape {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-2deg);
  display: inline-block;
  min-width: 8em;
  max-width: 90%;
  padding: 0.25em 1em;
  z-index: 1;
}
.articleBox .imagePhoto__inn-tape .label {
  position: relative;
  margin: 0;
}
.articleBox .imagePhoto__inn-tape .bg {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.8;
}