@charset "utf-8";

body{
	overflow-x: hidden;
	margin: 0 !important;
}
.sc21-u-mt-ll.sc21-u-mt-ll.sc21-u-mt-ll {
	margin-top: 1.875rem
}
@media screen and (min-width: 768px) {
	.sc21-u-mt-ll.sc21-u-mt-ll.sc21-u-mt-ll {
		margin-top: 2.5rem
	}
}
@media print {
	.sc21-u-mt-ll.sc21-u-mt-ll.sc21-u-mt-ll {
		margin-top: 2.5rem
	}
}
.sc21-u-mt-m.sc21-u-mt-m.sc21-u-mt-m {
	margin-top: 1.25rem
}
@media screen and (min-width: 768px) {
	.sc21-u-mt-m.sc21-u-mt-m.sc21-u-mt-m {
		margin-top: 1.5rem
	}
}
@media print {
	.sc21-u-mt-m.sc21-u-mt-m.sc21-u-mt-m {
		margin-top: 1.5rem
	}
}
.sc21-u-mt-s.sc21-u-mt-s.sc21-u-mt-s {
	margin-top: .625rem
}
@media screen and (min-width: 768px) {
	.sc21-u-mt-s.sc21-u-mt-s.sc21-u-mt-s {
		margin-top: 1.25rem
	}
}
@media print {
	.sc21-u-mt-s.sc21-u-mt-s.sc21-u-mt-s {
		margin-top: 1.25rem
	}
}
#header .inner {
    overflow: hidden;
    max-width: 100%;
    padding: 10px 40px 10px 40px;
    margin: 0 auto;
    box-sizing: border-box;
}
@media screen and (min-width:1px) and (max-width:767px) {
	#header .inner {
	    padding-left: 20px;
	}
}
#header #hLogo {
    float: none;
    font-size: 0;
}
#header #hLogo .col:first-child {
    padding: 5px 0;
}
#wrap {
    padding-top: 0;
}
#container h2 {
    background: #174098;
    color: #fff;
}
#container h2 span {
    margin-right: auto;
    margin-left: auto;
    max-width: 56rem;
    display: block;
    font-size: 2rem;
}
#container h3 {
    margin-top: 2rem;
    font-size: 1.25rem;
    line-height: 1.8;
}
.sc21-LNK-txt, .sc21-LNK-list-col2 {
    font-size: 1rem;
    line-height: 1.8;
    padding-left: 0;
    list-style-type: none;
}
body .sc21-LNK-txt__link[href], body .sc21-LNK-list__link[href] {
    transition-property: color;
    transition-duration: .1s;
    transition-timing-function: linear;
    display: inline-flex;
    align-items: baseline;
    color: #222;
    text-decoration: none;
}
body .sc21-LNK-txt__link[href]:hover, body .sc21-LNK-list__link[href]:hover {
    color: #0070cf;
    text-decoration: underline;
}
svg {
    fill: currentColor;
}
.sc21-LNK-txt__arrow, .sc21-LNK-list__arrow {
    transition-property: color;
    transition-duration: .1s;
    transition-timing-function: linear;
    flex-grow: 0;
    flex-shrink: 0;
    margin-right: .5rem;
    width: .875rem;
    height: .875rem;
    color: #004098;
}
.sc21-LNK-txt__link:hover .sc21-LNK-txt__arrow, .sc21-LNK-list__link:hover .sc21-LNK-list__arrow {
    color: #0070cf;
}
.sc21-LNK-txt__item:nth-child(n+2) {
    margin-top: .625rem;
}
.cs_link {
    display: flex;
    align-items: center;
}
.cs_link ul {
    margin-left: 15px;
}
.sc21-BTN-small, .sc21-BTN-login, .sc21-BTN-login-large, .sc21-BTN-conversion, .sc21-BTN-disabled, .sc21-BTN-current, .sc21-BTN-normal, .sc21-BTN-normal-large {
    padding-top: 1.375rem;
    padding-bottom: 1.125rem;
    font-size: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 0;
    box-sizing: border-box;
    border-width: 0;
    border-radius: 4px;
    padding-right: 1.875rem;
    padding-left: 1.5rem;
    width: 100%;
    font-weight: 600;
    font-family: inherit;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    outline-offset: 2px;
}
.sc21-BTN-normal, .sc21-BTN-normal-large {
    background-color: #004098;
}
.sc21-BTN-small span, .sc21-BTN-login span, .sc21-BTN-login-large span, .sc21-BTN-conversion span, .sc21-BTN-disabled span, .sc21-BTN-current span, .sc21-BTN-normal span, .sc21-BTN-normal-large span {
    color: #fff;
}
.sc21-BTN-small svg:last-child, .sc21-BTN-login svg:last-child, .sc21-BTN-login-large svg:last-child, .sc21-BTN-conversion svg:last-child, .sc21-BTN-disabled svg:last-child, .sc21-BTN-current svg:last-child, .sc21-BTN-normal svg:last-child, .sc21-BTN-normal-large svg:last-child {
    margin-top: auto;
    margin-bottom: auto;
    position: absolute;
    top: 0;
    right: .875rem;
    bottom: 0;
    width: .3125rem;
    height: .5rem;
    color: #fff;
}
.sc21-BTN-small svg:last-child[width="14"], .sc21-BTN-login svg:last-child[width="14"], .sc21-BTN-login-large svg:last-child[width="14"], .sc21-BTN-conversion svg:last-child[width="14"], .sc21-BTN-disabled svg:last-child[width="14"], .sc21-BTN-current svg:last-child[width="14"], .sc21-BTN-normal svg:last-child[width="14"], .sc21-BTN-normal-large svg:last-child[width="14"] {
    right: .75rem;
    width: .6875rem;
    height: .5rem;
}
.sc21-BTN-small::after, .sc21-BTN-login::after, .sc21-BTN-login-large::after, .sc21-BTN-conversion::after, .sc21-BTN-disabled::after, .sc21-BTN-current::after, .sc21-BTN-normal::after, .sc21-BTN-normal-large::after {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    transition-property: opacity;
    transition-duration: .1s;
    transition-timing-function: linear;
    content: "";
    opacity: 0;
}
.sc21-BTN-normal::after, .sc21-BTN-normal-large::after {
    background-image: linear-gradient(88.83deg, #004098, #0070cf);
}
.sc21-BTN-small:not(:disabled):hover::after, .sc21-BTN-login:not(:disabled):hover::after, .sc21-BTN-login-large:not(:disabled):hover::after, .sc21-BTN-conversion:not(:disabled):hover::after, .sc21-BTN-disabled:not(:disabled):hover::after, .sc21-BTN-current:not(:disabled):hover::after, .sc21-BTN-normal:not(:disabled):hover::after, .sc21-BTN-normal-large:not(:disabled):hover::after {
    opacity: 1;
}
.sc21-BTN-normal::after, .sc21-BTN-normal-large::after {
    background-image: linear-gradient(88.83deg, #004098, #0070cf);
}
.sc21-LNK-btn-center, .sc21-LNK-btn {
    margin-top: 1.5rem;
}
.sc21-BTN-login, .sc21-BTN-login-large {
    background-color: #00823a;
}
.sc21-BTN-login::after, .sc21-BTN-login-large::after {
    background-image: linear-gradient(90deg, #004f1f 0%, rgba(0, 79, 31, 0) 100%);
}
.sc21-BTN-login-uc {
    background-color: #ff6e96;
}
.sc21-BTN-login-uc::after {
    background-image: linear-gradient(90deg, #d94870 0%, rgba(0, 79, 31, 0) 100%);
}
.sc21-BTN-uc {
    background-color: #0091e8;
}
.sc21-BTN-uc::after {
    background-image: linear-gradient(90deg, #117ab8 0%, rgba(0, 79, 31, 0) 100%);
}
.newCard {
    margin-top: 1.5rem;
    text-align: center;
}
.newCard img {
    width: 100%;
    max-width: 368px;
}


@media screen and (min-width: 768px) {
    #container .inner {
        margin-right: auto;
        margin-left: auto;
        max-width: 56rem;
        padding: 2rem 2rem 4rem;
    }
    .sc21-LNK-btn-center, .sc21-LNK-btn {
        max-width: 27rem;
    }
    .sc21-LNK-btn-horizon {
        margin-right: auto;
        margin-left: auto;
        display: flex;
        flex-wrap: wrap;
        max-width: 896px;
    }
    .sc21-LNK-btn-horizon > [class*=sc21-BTN-]:nth-child(2n+1) {
        margin-right: 3.5714285714%;
    }
    .sc21-LNK-btn-horizon > [class*=sc21-BTN-] {
        flex-grow: 0;
        flex-shrink: 0;
        width: 48.2142857143%;
    }
    .sc21-LNK-txt__item:nth-child(n+2) {
        margin-top: .5rem;
    }
    .newCard {
        text-align: left;
    }
}

@media screen and (min-width:1px) and (max-width:767px) {
    #header #hLogo .col:first-child a:first-child img, #header #hLogo .col:first-child span:first-child img {
        max-width: 42px;
    }
    #header #hLogo .col:first-child a:last-child img, #header #hLogo .col:first-child span:last-child img {
        max-width: 26px;
    }
    #wrap {
        padding-top: 0;
    }
    #container .inner {
        max-width: 94%;
        margin: 20px auto 40px;
    }
    #container h2 span {
        font-size: 1.625rem;
        max-width: 94%;
        padding: 5px 0 7px;
    }
    #container h3 {
        font-size: 1.125rem;
        line-height: 1.5;
    }
    .sc21-LNK-btn-horizon > [class*=sc21-BTN-]:nth-child(n+2) {
        margin-top: .625rem;
    }
}

/* =========================================================
Languageバー：ヘッダー右端配置 ＆ はみ出し表示制限解除
========================================================= */

/* --- ① 全体共通の配置と不要な余白・線のリセット --- */
#header {
  position: relative !important;
}

/* 親コンテナの設定（高さを自動にして、HTML側のheight:100%を打ち消す） */
#header #custom_trans_bar {
  position: absolute !important;
  top: 50% !important;
  right: 40px !important; /* PC時の右端余白 */
  transform: translateY(-50%) !important; /* 縦方向の中央揃え */
  display: inline-flex !important;
  align-items: center !important;
  height: auto !important;
  z-index: 1000 !important;
  margin: 0 !important;
}

/* トリガーボタン自体の余計な余白・マージンをリセット */
#header #custom_trans_bar .lang-trigger {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  background: none !important;
  border: none !important;
  color: #707070 !important;
  font-weight: bold !important;
  cursor: pointer !important;
  padding: 0 !important;
  margin: 0 !important;
  position: relative !important;
  height: auto !important;
}

/* 【重要】二重線を防ぎ、下線をLanguageテキストの真下に固定する */
#header #custom_trans_bar.is-open .lang-trigger::after {
  content: "" !important;
  position: absolute !important;
  bottom: -5px !important; /* テキストのすぐ下に配置 */
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background-color: #004098 !important;
}

/* ポップアップメニューを右寄せ基準（画面外へのはみ出しを防止）で展開 */
#header #custom_trans_bar .lang-dropdown {
  display: none;
  position: absolute !important;
  top: 28px !important; /* テキストの少し下から展開 */
  right: -12px !important;
  left: auto !important;
  transform: none !important; /* HTML側のtranslateX(-50%)を打ち消す */
  background-color: #ffffff !important;
  min-width: 100px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  border: 1px solid #eee !important;
  z-index: 999999 !important;
}

#header #custom_trans_bar.is-open .lang-dropdown {
  display: block !important;
}

/* ドロップダウンメニュー内リンクの設定 */
#header #custom_trans_bar .lang-dropdown a {
  display: block !important;
  color: #333333 !important;
  padding: 10px 14px !important;
  text-decoration: none !important;
  font-size: 13px !important;
  text-align: center !important;
  border-bottom: 1px solid #eee !important;
}
#header #custom_trans_bar .lang-dropdown a:last-child {
  border-bottom: none !important;
}
#header #custom_trans_bar .lang-dropdown a:hover {
  background-color: #e8f5ff !important;
}
#header #custom_trans_bar .lang-dropdown a.is-active {
  color: #174098 !important;
  font-weight: bold !important;
}

/* --- ② Languageメニュー展開時のみ、親要素のはみ出し制限を一時解除 --- */
#header:has(.is-open),
#header:has(.is-open) .inner {
  overflow: visible !important;
}

/* --- ③ レスポンシブ調整（ウィンドウ幅によるズレを防止） --- */
@media screen and (max-width: 1320px) {
  #header #custom_trans_bar {
    right: 20px !important; /* 1320px以下の場合は右端の余白を詰める */
  }
}

@media screen and (max-width: 767px) {
  #header #custom_trans_bar .lang-dropdown {
    top: 25px !important; /* スマホ時はドロップダウンの位置を少し上に微調整 */
  }
}