@charset "utf-8";
/* reset */
ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}
ul li,
ul ol {
  margin: 0;
  padding: 0;
}
/*=======================================================================*/
/* normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/*=======================================================================*/
/*
 1. すべてのブラウザで行の高さを修正
 2. iOSで向きを変更した後のフォントサイズの調整を防止
*/
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}
/* すべてのブラウザで余白を削除 */
body {
  margin: 0;
}
/* IEで`main`要素をレンダリング */
main {
  display: block;
}
/*`h1`要素のフォントサイズとマージンを修正*/
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
/*--------------------------------*/
/* コンテンツのグループ化         */
/*--------------------------------*/
/*
 1. Firefoxで正しいボックスサイズを追加
 2. EdgeとIEでオーバーフローを表示
*/
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}
/*
 1. すべてのブラウザでフォントサイズの継承とスケーリングを修正
 2. すべてのブラウザで奇数の「em」フォントサイズを修正
*/
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}
/*--------------------------------*/
/* テキストレベルのセマンティクス */
/*--------------------------------*/
/* IE10のアクティブなリンクの灰色の背景を削除 */
a {
  background-color: transparent;
}
/*
 1. Chrome57の下の境界線を削除
 2. Chrome、Edge、IE、Opera、Safariで正しいテキスト装飾を追加
*/
abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted; /* 2 */
}
/* Chrome、Edge、Safariで正しいフォントの太さを追加 */
b,
strong {
  font-weight: bolder;
}
/*
 1. すべてのブラウザでフォントサイズの継承とスケーリングを修正
 2. すべてのブラウザで奇数の「em」フォントサイズを修正
*/
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}
/* すべてのブラウザで正しいフォントサイズを追加 */
small {
  font-size: 80%;
}
/* `sub`要素と`sup`要素がの行の高さに影響を与えないようにする */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
/*--------------------------------*/
/* 埋め込みコンテンツ             */
/*--------------------------------*/
/* IE10のリンク内の画像の境界線を削除 */
img {
  border-style: none;
}
/*--------------------------------*/
/* フォーム                       */
/*--------------------------------*/
/*
 1. すべてのブラウザでフォントスタイルを変更
 2. FirefoxとSafariで余白を削除
*/
button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}
/*
 IEでオーバーフローを表示
 1. Edgeでオーバーフローを表示
*/
button,
input {
/* 1 */
  overflow: visible;
}
/*
 Edge、Firefox、およびIEでのテキスト変換の継承を削除
 1. Firefoxでテキスト変換の継承を削除
*/
button,
select {
/* 1 */
  text-transform: none;
}
/* iOSおよびSafariでクリック可能なタイプのスタイルを設定できない問題を修正 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}
/* Firefoxの内側の境界線とパディングを削除 */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
/* 前のルールで設定されていないフォーカススタイルを復元 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}
/* Firefoxのパディングを修正 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}
/*
 1. EdgeとIEでのテキストの折り返しを修正
 2. IEの`fieldset`要素からの色の継承を修正
 3. パディングを削除して開発者がゼロになったときに巻き込まれないようにする
 すべてのブラウザの`fieldset`要素
*/
legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}
/* Chrome、Firefox、Operaで正しい垂直方向の配置を追加 */
progress {
  vertical-align: baseline;
}
/* IE10以降のデフォルトの垂直スクロールバーを削除 */
textarea {
  overflow: auto;
}
/*
 1. IE10で正しいボックスサイズを追加
 2. IE10のパディングを削除
*/
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}
/* Chromeのインクリメントボタンとデクリメントボタンのカーソルスタイルを修正 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
/*
 1. ChromeとSafariの奇妙な外観を修正
 2. Safariのアウトラインスタイルを修正
*/
[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}
/* macOSのChromeとSafariの内側のパディングを削除 */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
/*
 1. iOSおよびSafariでクリック可能なタイプのスタイルを設定できない問題を修正
 2. Safariでフォントプロパティを「継承」に変更
*/
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}
/*--------------------------------*/
/* インタラクティブ               */
/*--------------------------------*/
/* Edge、IE 10以降、およびFirefoxに正しい表示を追加 */
details {
  display: block;
}
/* すべてのブラウザに正しい表示を追加 */
summary {
  display: list-item;
}
/*--------------------------------*/
/* その他                         */
/*--------------------------------*/
/*  IE10以降で正しい表示を追加 */
template {
  display: none;
}
/* IE10に正しい表示を追加 */
[hidden] {
  display: none;
}
/*=======================================================================*/
/* normalize.css 終了                                                    */
/*=======================================================================*/

/*=================================*/
/* slick slider                    */
/*=================================*/
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
      -ms-user-select: none;
          user-select: none;
  touch-action: pan-y;
}

@media print, screen and (min-width: 768px) {
  .slick-slider {
    width: 864px;
    margin: 0 auto 0;
  }
}
@media screen and (max-width: 767px) {
  .slick-slider {
    width: calc(630 / 750 * 107vw);
    margin: 0 auto 0;
    padding-top: calc(40 / 750 * 100vw);
  }
}
.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
}
.slick-list:focus {
  outline: none;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}
.slick-list p {
  position: absolute;
  font-weight: bold;
  color: crimson;
  text-shadow: 4px 0 4px #fff,0 4px 4px #fff,-4px 0 4px #fff,0 -4px 4px #fff;
}
@media print, screen and (min-width: 768px) {
  .slick-list p {
	font-size: 43px;
	top: -40px;
	left: 15px;
  }
}
@media screen and (max-width: 767px) {
  .slick-list p {
	font-size: 4.5vw;;
	top: -4vw;
	left: 2.1vw;
  }
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  transform: translate3d(0, 0, 0);
}
.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.slick-track:before,
.slick-track:after {
  content: "";
  display: table;
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}
.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}
[dir="rtl"] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
  margin: 0 auto 0;
  width: 100%;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
  display: none;
}
.slick-dots {
  list-style-type: none;
  padding: 0;
  margin: 0;
  font-size: 0;
  text-align: center;
}
@media print, screen and (min-width: 768px) {
  .slick-dots {
    margin-top: 10px;
  }
}
@media screen and (max-width: 767px) {
  .slick-dots {
    margin-top: calc(20 / 750 * 100vw);
  }
}
.slick-dots > li {
  display: inline-block;
}
@media print, screen and (min-width: 768px) {
  .slick-dots > li {
    margin: 0 7px;
  }
}
@media screen and (max-width: 767px) {
  .slick-dots > li {
    margin: 0 calc(8 / 750 * 100vw);
  }
}
.slick-dots > li.slick-active button {
  background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
}
.slick-dots button {
  border: 1px solid #16A;
  background-color: #fff;
  border-radius: 50%;
  overflow: hidden;
  text-indent: 140%;
  white-space: nowrap;
  box-sizing: border-box;
}
@media print, screen and (min-width: 768px) {
  .slick-dots button {
    width: 10px;
    height: 10px;
    cursor: pointer;
    padding: 0;
  }
}
@media screen and (max-width: 767px) {
  .slick-dots button {
    width: calc(16 / 750 * 100vw);
    height: calc(16 / 750 * 100vw);
    padding: 0;
  }
}
.slick-dots button:focus {
  outline: none;
}
.slick-arrow {
  overflow: hidden;
  text-indent: -9999px;
  white-space: nowrap;
  border: none;
  position: absolute;
  padding: 0;
  z-index: 1;
}
@media print, screen and (min-width: 768px) {
  .slick-arrow {
    top: 226px;
    width: 44px;
    height: 44px;
  }
}
@media screen and (max-width: 767px) {
  .slick-arrow {
    top: 50%;
  }
}
.slick-arrow:focus {
  outline: none;
}
.slick-prev {
  cursor: pointer;
  transform: rotate(45deg);
}
@media print, screen and (min-width: 768px) {
  .slick-prev {
    left: -34px;
    width: 28px;
    height: 28px;
    border: 3px solid;
    border-color: transparent transparent #16A #16A;
    background: none;
  }
}
@media screen and (max-width: 767px) {
  .slick-prev {
    left: calc(-5 / 750 * 100vw);
    width: 18px;
    height: 18px;
    border: 2px solid;
    border-color: transparent transparent #16A #16A;
    background: none;
    transform: rotate(45deg);
  }
}
.slick-next {
  cursor: pointer;
  transform: rotate(45deg);
}
@media print, screen and (min-width: 768px) {
  .slick-next {
    right: -34px;
    width: 28px;
    height: 28px;
    border: 3px solid;
    border-color: #16A #16A transparent transparent;
    background: none;
  }
}
@media screen and (max-width: 767px) {
  .slick-next {
    right: calc(-5 / 750 * 100vw);
    width: 18px;
    height: 18px;
    border: 2px solid;
    border-color: #16A #16A transparent transparent;
    background: none;
    transform: rotate(45deg);
  }
}

/*=================================*/
/* utility                         */
/*=================================*/
@media screen and (max-width: 767px) {
  .ut-pcOnly {
    display: none !important;
  }
}
@media print, screen and (min-width: 768px) {
  .ut-spOnly {
    display: none !important;
  }
}
@media print, screen and (min-width: 768px) {
  .ut-mb30--pc {
    margin-bottom: 30px !important;
  }
}
@media print, screen and (min-width: 768px) {
  .ut-pt30--pc {
    padding-top: 30px !important;
  }
}
@media screen and (max-width: 767px) {
  .ut-ml20--sp {
    margin-left: 5.33vw !important;
  }
}
@media print, screen and (min-width: 768px) {
  .ut-ml10--pc {
    margin-left: 10px !important;
  }
}

/*=================================*/
/* original                        */
/*=================================*/
html {
  font-family: -apple-sysytem, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Verdana, Roboto, "Droid Sans", sans-serif;
}
body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
@media print, screen and (min-width: 768px) {
  body {
    min-width: 1000px;
    overflow-x: auto;
  }
}
@media screen and (max-width: 767px) {
  body {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    font-size: 3.733vw;
  }
}
img {
  vertical-align: middle;
}
.ly-wrapper {
  background-color: #ddeeff;
  width: 100%;
}
@media print, screen and (min-width: 768px) {
  .ly-wrapper {
    padding-top: 126px;
    padding-bottom: 30px;
  }
}
@media screen and (max-width: 767px) {
  .ly-wrapper {
    padding-top: 11vw;
    padding-bottom: 8vw;
  }
}
@media print, screen and (min-width: 768px) {
  .ly-wrapper.ly-wrapper--logoOnly {
    padding-top: 0;
    padding-bottom: 60px;
  }
}
@media screen and (max-width: 767px) {
  .ly-wrapper.ly-wrapper--logoOnly {
    padding-top: 0;
    padding-bottom: 8vw;
  }
}
.st-container {
  box-sizing: border-box;
  display: block;
  margin: auto;
}
@media print, screen and (min-width: 768px) {
  .st-container {
    width: 960px;
    padding: 0 10px;
  }
}
@media screen and (max-width: 767px) {
  .st-container {
    width: 100%;
    padding: 0 4vw;
  }
}

.st-container--white {
  background: #ddeeff;
}

.st-breadcrumb_wrap {
  border-bottom: 1px solid #555;
  background: #eef9ff;
}
@media print, screen and (min-width: 768px) {
  .st-breadcrumb_wrap .st-breadcrumb_wrap--logoOnly .st-breadcrumb {
    padding: 16px 10px 10px;
    width: 960px;
  }
}
.st-breadcrumb {
  display: flex;
  margin: 0 auto;
  box-sizing: border-box;
}
@media print, screen and (min-width: 768px) {
  .st-breadcrumb {
    padding: 16px 10px 10px;
    width: 960px;
  }
}
@media screen and (max-width: 767px) {
  .st-breadcrumb {
    padding: 3.267vw 4vw 2.8vw;
  }
}
.st-breadcrumb_item {
  color: inherit;
  font-weight: bold;
  line-height: 1;
}
@media print, screen and (min-width: 768px) {
  .st-breadcrumb_item {
    font-size: 12px;
    padding-left: 1.8em;
    text-indent: -1.8em;
  }
}
@media screen and (max-width: 767px) {
  .st-breadcrumb_item {
    position: relative;
    font-size: 2.8vw;
    max-width: 28em;
    padding-left: 1.5em;
  }
}
.st-breadcrumb_item:before {
  content: "\00FF1E";
  font-weight: normal;
  line-height: 1;
}
@media print, screen and (min-width: 768px) {
  .st-breadcrumb_item:before {
    margin: auto 7px;
  }
}
@media screen and (max-width: 767px) {
  .st-breadcrumb_item:before {
    position: absolute;
    top: 0;
    left: 0;
    margin: auto 0.5vw;
  }
}
@media print, screen and (min-width: 768px) {
  .is-ipad .st-breadcrumb_link,
  .is-ipad .st-breadcrumb_item {
    display: flex;
  }
}
@media print, screen and (min-width: 768px) {
  .st-breadcrumb_item--home {
    flex-shrink: 0;
  }
}
@media screen and (max-width: 767px) {
  .st-breadcrumb_item--home {
    min-width: 3.5em;
    padding-left: 0;
  }
}
.st-breadcrumb_item--home:before {
  content: none;
}
.st-breadcrumb_link {
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  text-decoration: none;
}
.st-breadcrumb_link:hover {
  text-decoration: underline;
}

.st-footer {
  background: #cceeff linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.1));
}
@media print, screen and (min-width: 768px) {
  .st-footer {
    border-top: 1px solid #fff;
    overflow: hidden;
    position: relative;
  }
}
.st-footer_upper {
  display: flex;
  border-bottom: 1px solid #555;
}
@media print, screen and (min-width: 768px) {
  .st-footer_upper {
    height: 24px;
  }
}
@media screen and (max-width: 767px) {
  .st-footer_upper .st-container {
    padding: 0;
  }
}
.st-footer_return, .st-footer_return2 {
  font-weight: bold;
  line-height: 1;
  text-decoration: none;
  background-color: #16A;
  box-sizing: border-box;
  margin: 0 0 0 auto;
  color: #fff;
}
.st-footer_return2 {
  background-color: #366;
}
@media print, screen and (min-width: 768px) {
  .st-footer_return {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    font-size: 12px;
    width: 116px;
    height: 24px;
    padding: 0 12px;
    transition: opacity 0.4s;
  }
  .st-footer_return2 {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 12px;
    width: 130px;
    height: 24px;
    padding: 0 12px;
    transition: opacity 0.4s;
  }
  .st-footer_return:hover, .st-footer_return2:hover {
    opacity: 0.7;
  }
}
@media screen and (max-width: 767px) {
  .st-footer_return, .st-footer_return2 {
    height: 9vw;
    font-size: 3.1vw;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}

@media print, screen and (min-width: 768px) {
  .st-footer_middle {
    margin-bottom: 20px;
  }
}
.st-footer_under {
  text-align: center;
}
@media print, screen and (min-width: 768px) {
  .st-footer_under {
    margin: auto;
    width: 960px;
    padding: 16px 0 0;
  }
}
@media screen and (max-width: 767px) {
  .st-footer_under {
    padding: 3vw 0 0.01vw;
    position: relative;
  }
}
@media print, screen and (min-width: 768px) {
  .st-footer_btnWrap {
    margin-bottom: 40px;
  }
}
@media screen and (max-width: 767px) {
  .st-footer_btnWrap {
    margin-top: 5.33vw;
    margin-bottom: 10.667vw;
  }
}
.st-relation {
  line-height: 1;
  display: flex;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .st-relation {
    margin: 0 0 5.33vw;
    flex-wrap: wrap;
  }
}
@media print, screen and (min-width: 768px) {
  .st-relation_item {
    font-size: 14px;
    margin: 0 14px 16px;
  }
}
@media screen and (max-width: 767px) {
  .st-relation_item {
    font-size: 2.933vw;
    margin: 1.33vw 1.33vw 1.33vw 0;
    padding-right: 1.33vw;
    border-right: 1px solid #000;
  }
  .st-relation_item:last-child {
    margin-right: 0;
    padding-right: 0;
    border-right: none;
  }
}
.st-relation_link {
  color: #16A;
  text-decoration: none;
  display: flex;
}
.st-relation_link:hover {
  text-decoration: underline;
}
.st-footer_under_txt {
  margin: 0;
}
@media print, screen and (min-width: 768px) {
  .st-footer_under_txt {
    font-size: 12px;
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-footer_under_txt {
    font-size: 2.67vw;
    margin-bottom: 2.67vw;
  }
}

/*=================================*/
/* ヘッダー                        */
/*=================================*/
header,
#header,
.site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
}
.st-header {
  background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
}
@media screen and (max-width: 767px) {
  .st-header {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 100;
	background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
  }
}
.st-header.st-header--logoOnly {
  position: relative;
}
.st-header.st-header--logoOnly::after {
  pointer-events: none;
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  right: 0;
  bottom: -8px;
  height: 8px;
  background-image: linear-gradient(to bottom, rgba(0,0,0,0.3), rgba(0,0,0,0));
}
.st-header_upper {
  margin: 0 auto;
  display: flex;
  justify-content: center;
}
@media print, screen and (min-width: 768px) {
  .st-header_upper {
    width: 100%;
    height: 34px;
    padding: 3px 0;
	background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
    z-index: 200;
	position: fixed;
  }
}
@media screen and (max-width: 767px) {
  .st-header_upper {
    width: 100%;
    height: 12vw;
    padding: 1.867vw 0 1.867vw 4vw;
    box-sizing: border-box;
	background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
	position: relative;
  }
}
@media print, screen and (min-width: 768px) {
  .st-header_upper_inner {
    width: 940px;
    display: flex;
    justify-content: space-between;
  }
}
@media print, screen and (min-width: 768px) {
  .st-headerLogo {
    width: 91px;
	margin-top:4px;
  }
}
@media screen and (max-width: 767px) {
  .st-headerLogo {
    width: 24vw;
	margin-top: 2px;
	margin-left: -40px;
  }
}
.st-headerLogo img {
  width: 100%;
}
.st-headerMoji {
    vertical-align:middle;
	color:white;
	transform:skewX(-15deg);
}
@media print, screen and (min-width: 768px) {
  .st-headerMoji {
	margin-top: 2px;
	margin-left: 4px;
	font-size: 10px;
  }
}
@media screen and (max-width: 767px) {
  .st-headerMoji {
	margin-top: 0px;
	margin-left: 4px;
	display: grid;		/* 上下中央1 */
	place-items: center;/* 上下中央2 */
	font-size: 2.6vw;
  }
}
.st-header_right {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .st-header_right {
    display: none;
  }
}
@media print, screen and (min-width: 768px) {
  .st-header_btn {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .st-header_btn {
    background: #ff5577;
    width: 12vw;
    height: 12vw;
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
    padding: 2.6vw 0 0;
    box-sizing: border-box;
	cursor: pointer;
  }
}
.st-header_btn_inner,
.st-header_btn_inner span {
  display: inline-block;
  transition: all 0.4s;
  box-sizing: border-box;
}
.st-header_btn_inner {
  position: relative;
  width: 6vw;
  height: 5.6vw;
  caret-color: transparent;
}
.st-header_btn_inner span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 0.8vw;
  background-color: #fff;
  border-radius: 4px;
}
.st-header_btn_inner span:nth-of-type(1) {
  top: 0;
}
.st-header_btn_inner span:nth-of-type(2) {
  top: 2.2vw;
}
.st-header_btn_inner span:nth-of-type(3) {
  bottom: 0.4vw;
}
.st-header_btn.is-active .st-header_btn_inner span:nth-of-type(1) {
  transform: translateY(2.2vw) rotate(-45deg);
}
.st-header_btn.is-active .st-header_btn_inner span:nth-of-type(2) {
  opacity: 0;
}
.st-header_btn.is-active .st-header_btn_inner span:nth-of-type(3) {
  transform: translateY(-2.2vw) rotate(45deg);
}
.st-header_btnTxt {
  color: #fff;
  font-weight: bold;
  line-height: 0.2;
  font-size: 2vw;
  display: block;
  margin-top: 0vw;
  caret-color: transparent;
}
@media print, screen and (min-width: 768px) {
  .st-headerLink {
    display: flex;
  }
}
@media screen and (max-width: 767px) {
  .st-headerLink {
    padding: 6.67vw 0;
  }
}
@media print, screen and (min-width: 768px) {
  .st-headerLink_item {
    margin-left: 10px;
    margin-top: 2px;
  }
}
@media screen and (max-width: 767px) {
  .st-headerLink_item {
    text-align: center;
    margin-bottom: 5.33vw;
  }
  .st-headerLink_item:last-of-type {
    margin-bottom: 0;
  }
}
.st-headerLink_item a {
  display: flex;
  line-height: 1.75;
  color: #fff;
  text-decoration: none;
  position: relative;
}
@media print, screen and (min-width: 768px) {
  .st-headerLink_item a {
    font-size: 12px;
    padding-left: 24px;
  }
  .st-headerLink_item a:hover {
    text-decoration: underline;
  }
}
@media screen and (max-width: 767px) {
  .st-headerLink_item a {
    display: inline-block;
    font-size: 4vw;
  }
  .st-headerLink_item a:hover {
    text-decoration: underline;
  }
}
.st-headerLink_item a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background-repeat: no-repeat;
  background-size: contain;
  margin: auto;
}
@media print, screen and (min-width: 768px) {
  .st-headerLink_item a::before {
    width: 17px;
    height: 17px;
  }
}
@media screen and (max-width: 767px) {
  .st-headerLink_item a::before {
    width: 5.6vw;
    height: 5.6vw;
  }
}

/* =========================================================
   スマホ用メニュー上部リンク
   お問い合わせ／会社概要／コラム
   ========================================================= */
@media screen and (max-width: 767px) {
  .st-headerLink--spTop {
    display: flex;
    gap: 1.5vw;          /* 少し狭く */
    padding: 2.2vw 4vw;  /* 上下の余白を少し狭く */
    background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
  }

  .st-headerLink--spTop .st-headerLink_item {
    flex: 1;
    margin-bottom: 0;
    text-align: center;
  }

  .st-headerLink--spTop .st-headerLink_item a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 8.8vw;       /* ボタンの高さを少し低く */
    font-size: 4vw;      /* 文字を大きく */
    font-weight: bold;
    line-height: 1.0;    /* 行間を狭く */
    color: #fff;
    text-decoration: none;
    border: 1px solid rgba(255,255,255,0.7);
    border-radius: 1.5vw;
    box-sizing: border-box;
  }
}

@media print, screen and (min-width: 768px) {
  .st-headerSearch {
    margin-top: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-headerSearch {
    padding: 5.33vw 4vw;
    background: #eee;
    border-bottom: 1px solid #b4c4cf;
  }
}
.st-header_rightLogo {
  position: absolute;
}
@media print, screen and (min-width: 768px) {
  .st-header_rightLogo {
    width: 66px;
    right: 0;
    bottom: 11px;
  }
}
@media screen and (max-width: 767px) {
  .st-header_rightLogo {
    width: 16.53vw;
    height: 9.33vw;
    right: 21.336vw;
    top: 0;
    bottom: 0;
    margin: auto;
  }
}
.st-header_rightLogo img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .st-header--logoOnly .st-header_rightLogo {
    right: 4vw;
  }
}
@media print, screen and (min-width: 768px) {
  .st-headerFollowing {
    transition: transform 0.4s;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 5;
	margin-top: 38px;
  }
/*
  .st-headerFollowing.is-fixed {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 5;
	margin-top: 38px;
  }
  .st-headerFollowing.is-unshow {
    transform: translateY(-86px);
  }
*/
}
@media print, screen and (min-width: 768px) {
  .st-header_under {
    background: #cceeff;
    width: 100%;
    position: absolute;
    display: block !important;
    min-width: 1000px;
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .st-header_under {
	background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
    display: none;
    height: calc(100vh - 13.5vw);
    overflow-y: auto;
  }
}
.st-header_under::after {
  pointer-events: none;
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  right: 0;
  bottom: -8px;
  height: 8px;
  background-image: linear-gradient(to bottom, rgba(0,0,0,0.3), rgba(0,0,0,0));
}
.st-header_under_bar {
    background:#103D65;
    height:6px;
}
@media screen and (max-width: 767px) {
  .st-header_under_bar {
    display: none;
  }
}
.st-nav {
  margin: 0 auto;
  box-sizing: border-box;
  position: relative;
  z-index: 5;
}
@media print, screen and (min-width: 768px) {
  .st-nav {
    width: 940px;
    padding: 16px 0;
    display: flex;
    justify-content: space-between;
  }
}
@media screen and (max-width: 767px) {
  .st-nav {
    padding: 5.33vw 4vw;
    width: 100%;
    background: #eee;
  }
}
@media screen and (max-width: 767px) {
  .st-header_spBtn {
    padding: 5.33vw 4vw 0;
    background: #eee;
  }
  .st-header_spBtn .st-btn {
    font-size: 8.53vw;
  }
}
.st-navItem {
  overflow: hidden;
  position: relative;
}
@media print, screen and (min-width: 768px) {
  .st-navItem {
    width: 180px;
  }
  .st-navItem:hover {
    overflow: visible;
  }
  .st-navItem:hover .st-navItemLabel {
	background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
    color: #fff;
    border-radius: 8px 8px 0 0;
  }
  .st-navItem:hover .st-navItemLabel::after {
    border-color: #fff;
  }
  .st-navItem:hover .st-nav_lowerList {
    display: block;
    max-height: 400px;
    opacity: 1;
	background: #EFF linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.1));
  }
}
@media screen and (max-width: 767px) {
  .st-navItem {
    margin-bottom: 1.33vw;
  }
  .st-navItem.is-active .st-navItemLabel::after {
    /* transform: rotate(45deg); 初めから開く */
    transform: rotate(90deg);
  }
}
.st-navItem[data-current="true"] .st-navItemLabel {
  background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
  color: #fff;
}
@media print, screen and (min-width: 768px) {
  .st-navItem[data-current="true"] .st-navItemLabel::after {
    border-color: #fff;
  }
}
@media screen and (max-width: 767px) {
  .st-navItem[data-current="true"] .st-navItemLabel::before,
  .st-navItem[data-current="true"] .st-navItemLabel::after {
    background: #fff;
  }
}
.st-navItemLabel {
  border-radius: 8px;
  border: 2px solid #16A;
  box-sizing: border-box;
  background: #EFF linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.1));
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #222;
  font-weight: bold;
  padding-right: 16px;
  margin: 0;
  line-height: 1.2;
}
@media print, screen and (min-width: 768px) {
  .st-navItemLabel {
    height: 54px;
    font-size: 14px;
    transition: 0.3s;
  }
}
@media screen and (max-width: 767px) {
  .st-navItemLabel {
    font-size: 5vw;
    width: 100%;
    padding: 3.33vw;
    flex-direction: column;
  }
}
@media print, screen and (min-width: 768px) {
  .st-navItemLabel::after {
    content: "";
    position: absolute;
    border-top: 2px solid #16A;
    border-right: 2px solid #16A;
    transform: rotate(135deg);
    transition: 0.3s;
    top: 20px;
    right: 15px;
    width: 7px;
    height: 7px;
  }
}
@media screen and (max-width: 767px) {
  .st-navItemLabel::before,
  .st-navItemLabel::after {
	background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
    content: "";
    position: absolute;
    top: 6.8vw;
    right: 4vw;
    width: 4vw;
    height: 0.53vw;
  }
  .st-navItemLabel::after {
    /* transform: rotate(90deg); 初めから開く */
    transform: rotate(0);
    transition: 0.4s;
  }
}
/* =========================================================
   現在選択中メニューの表示切替
   ・PC：通常はページ名、hover時に分類名へ切替
   ・スマホ：JSで分類名へ置換
   ========================================================= */
.st-navItem[data-current="true"] .st-navItemLabel {
  position: relative;
}
@media print, screen and (min-width: 768px) {
  .st-navItem[data-current="true"]:hover .st-navItemLabel {
    color: transparent;
  }
  .st-navItem[data-current="true"]:hover .st-navItemLabel::before {
    content: attr(data-parent-label);
    position: absolute;
    top: 0;
    left: 0;
    right: 16px;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: bold;
    white-space: nowrap;
    pointer-events: none;
  }
}

.st-nav_lowerList {
  width: 100%;
  margin: auto;
  transition: 0.5s max-height;
  box-sizing: border-box;
}
@media print, screen and (min-width: 768px) {
  .st-nav_lowerList {
    border-radius: 0 0 8px 8px;
    background: #fff;
    border: 2px solid #16A;
    opacity: 0;
    position: absolute;
    left: 0;
    top: 50px;
    max-height: 300px;
    overflow: hidden;
    display: block !important;
  }
}
@media screen and (max-width: 767px) {
  .st-nav_lowerList {
    border-radius: 10px;
    margin-top: 2.13vw;
    width: 100%;
    /* display: none; 初めから開く */
    display: block;
    padding: 2.67vw;
    background: #d9d9d9;
  }
}
@media print, screen and (min-width: 768px) {
  .st-nav_lowerItem {
    border-bottom: 2px solid #16A;
  }
}
@media screen and (max-width: 767px) {
  .st-nav_lowerItem {
    margin-bottom: 1.33vw;
  }
}
.st-nav_lowerItem:last-of-type {
  border-bottom: none;
  margin-bottom: 0;
}
.st-nav_lowerLink {
  display: flex;
  align-items: center;
  color: #222;
  text-decoration: none;
  box-sizing: border-box;
  font-weight: bold;
  position: relative;
}
@media print, screen and (min-width: 768px) {
  .st-nav_lowerLink {
    font-size: 14px;
    height: 54px;
    padding: 0 10px 0 30px;
    transition: 0.3s;
  }
  .st-nav_lowerLink:hover {
	background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
    color: #fff;
  }
  .st-nav_lowerLink:hover::before {
    border-color: transparent transparent transparent #fff;
  }
}
@media screen and (max-width: 767px) {
  .st-nav_lowerLink {
    justify-content: center;
    font-size: 5vw;
    height: 11.73vw;
    background: #fff;
    border-radius: 10px;
  }
}
.st-nav_lowerLink::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-color: transparent transparent transparent #16A;
}
@media print, screen and (min-width: 768px) {
  .st-nav_lowerLink::before {
    left: 10px;
    border-width: 4px 0 4px 6px;
  }
}
@media screen and (max-width: 767px) {
  .st-nav_lowerLink::before {
    left: 5.33vw;
    border-width: 1.067vw 0 1.067vw 1.6vw;
  }
}
.st-nav_lowerLink--application {
  background: #ff5577;
  color: #fff;
}
.st-nav_lowerLink--application::before {
  border-color: transparent transparent transparent #fff;
}
.red { color: red; }

@media screen and (max-width: 767px) {
  .st-closebtn_wrap {
    padding: 3vw 4vw 4vw;
  }
}
@keyframes follow {
  0% {
    bottom: -106px;
  }
  100% {
    bottom: -80px;
  }
}

.st-arrow {
  position: relative;
  border-color: inherit;
}
.st-arrow:after {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-color: inherit;
  margin: auto;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.st-arrow--application1 {
  display: block;
  margin: auto 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--application1 {
    width: 24px;
    height: 24px;
    left: 240px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--application1 {
    width: 3.467vw;
    height: 3.467vw;
    left: 4vw;
  }
}
.st-arrow--application1:after {
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #fff;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--application1:after {
    border-width: 12px 0 12px 18px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--application1:after {
    border-width: 1.6vw 0 1.6vw 2.4vw;
  }
}
.st-arrow--up {
  display: block;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(-45deg);
}
@media print, screen and (min-width: 768px) {
  .st-arrow--up {
    top: 3px;
    width: 8px;
    height: 8px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--up {
    top: 0.8vw;
    width: 2.67vw;
    height: 2.67vw;
  }
}
.st-arrow--up::after {
  display: none;
}
.st-arrow--left {
  display: block;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(-135deg);
}
@media print, screen and (min-width: 768px) {
  .st-arrow--left {
    top: 0px;
    width: 8px;
    height: 8px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--left {
    top: 0vw;
    width: 2.67vw;
    height: 2.67vw;
  }
}
.st-arrow--left::after {
  display: none;
}
.st-arrow--details1 {
  display: block;
  margin: auto 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--details1 {
    width: 16px;
    height: 16px;
    left: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--details1 {
    width: 5.867vw;
    height: 5.867vw;
    left: 1.33vw;
  }
}
.st-arrow--details1:after {
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #16A;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--details1:after {
    border-width: 4px 0 4px 6px;
    right: -2px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--details1:after {
    border-width: 1.33vw 0 1.33vw 1.867vw;
    right: -0.53vw;
  }
}
.button:hover .st-arrow--details1:after {
  border-left-color: #d4d4d4;
}
.st-arrow--details2 {
  display: block;
  margin: auto 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--details2 {
    width: 16px;
    height: 16px;
    left: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--details2 {
    width: 5.867vw;
    height: 5.867vw;
    left: 1.33vw;
  }
}
.st-arrow--details2:after {
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #fff;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--details2:after {
    border-width: 4px 0 4px 6px;
    right: -2px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--details2:after {
    border-width: 1.33vw 0 1.33vw 1.867vw;
    right: -0.53vw;
  }
}
.button:hover .st-arrow--details2:after {
  border-left-color: inherit;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--details2--right {
    left: initial;
    right: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--details2--right {
    left: initial;
    right: 1.33vw;
  }
}
.st-arrow--details3 {
  display: block;
  margin: auto 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--details3 {
    width: 16px;
    height: 16px;
    left: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--details3 {
    width: 5.867vw;
    height: 5.867vw;
    left: 1.33vw;
  }
}
.st-arrow--details3:after {
  border-top-color: transparent;
  border-right-color: #000;
  border-bottom-color: transparent;
  border-left-color: transparent;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--details3:after {
    border-width: 4px 6px 4px 0;
    right: -2px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--details3:after {
    border-width: 1.33vw 1.867vw 1.33vw 0;
    right: -0.53vw;
  }
}
.button:hover .st-arrow--details3:after {
  border-left-color: #d4d4d4;
}
.st-arrow--input1 {
  display: block;
  margin: auto 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--input1 {
    width: 16px;
    height: 16px;
    left: 5px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--input1 {
    width: 5.867vw;
    height: 5.867vw;
    left: 1.33vw;
  }
}
.st-arrow--input1:after {
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #16A;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--input1:after {
    border-width: 4px 0 4px 6px;
    right: -2px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--input1:after {
    border-width: 1.33vw 0 1.33vw 1.867vw;
    right: -0.53vw;
  }
}
.button:hover .st-arrow--input1:after {
  border-left-color: #d4d4d4;
}
.st-arrow--download1 {
  display: block;
  margin: auto 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--download1 {
    width: 16px;
    height: 16px;
    left: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--download1 {
    width: 5.867vw;
    height: 5.867vw;
    left: 1.33vw;
  }
}
.st-arrow--download1:after {
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #16A;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--download1:after {
    border-width: 4px 0 4px 6px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--download1:after {
    border-width: 1.33vw 0 1.33vw 1.867vw;
  }
}
.button:hover .st-arrow--download1:after {
  border-left-color: #d4d4d4;
}
.st-arrow--download2 {
  display: block;
  margin: auto 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--download2 {
    width: 16px;
    height: 16px;
    left: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--download2 {
    width: 5.867vw;
    height: 5.867vw;
    left: 1.33vw;
  }
}
.st-arrow--download2:after {
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #212c7d;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--download2:after {
    border-width: 4px 0 4px 6px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--download2:after {
    border-width: 1.33vw 0 1.33vw 1.867vw;
  }
}
.button:hover .st-arrow--download2:after {
  border-left-color: #d4d4d4;
}
.st-arrow--download3 {
  display: block;
  margin: auto 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--download3 {
    width: 16px;
    height: 16px;
    left: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--download3 {
    width: 5.867vw;
    height: 5.867vw;
    left: 1.33vw;
  }
}
.st-arrow--download3:after {
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #306725;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--download3:after {
    border-width: 4px 0 4px 6px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--download3:after {
    border-width: 1.33vw 0 1.33vw 1.867vw;
  }
}
.button:hover .st-arrow--download3:after {
  border-left-color: #d4d4d4;
}
.st-arrow--download4 {
  display: block;
  margin: auto 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--download4 {
    width: 16px;
    height: 16px;
    left: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--download4 {
    width: 5.867vw;
    height: 5.867vw;
    left: 1.33vw;
  }
}
.st-arrow--download4:after {
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #ccc376;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--download4:after {
    border-width: 4px 0 4px 6px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--download4:after {
    border-width: 1.33vw 0 1.33vw 1.867vw;
  }
}
.button:hover .st-arrow--download4:after {
  border-left-color: #d4d4d4;
}
.st-arrow--download5 {
  display: block;
  margin: auto 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--download5 {
    width: 16px;
    height: 16px;
    left: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--download5 {
    width: 5.867vw;
    height: 5.867vw;
    left: 1.33vw;
  }
}
.st-arrow--download5:after {
  border-top-color: transparent;
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-left-color: #cd4b5e;
}
@media print, screen and (min-width: 768px) {
  .st-arrow--download5:after {
    border-width: 4px 0 4px 6px;
  }
}
@media screen and (max-width: 767px) {
  .st-arrow--download5:after {
    border-width: 1.33vw 0 1.33vw 1.867vw;
  }
}
.button:hover .st-arrow--download5:after {
  border-left-color: #d4d4d4;
}

.st-btn {
  font-weight: normal;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-appearance: none;
          appearance: none;
  outline: none;
  transition: opacity 0.4s;
  cursor: pointer;
}
.st-btn:hover {
  text-decoration: none;
  opacity: 0.7;
}
.st-btn--close1 {
  color: #16A;
  font-weight: bold;
  background-color: #fff;
  box-sizing: border-box;
  border-width: 0;
  border-color: #fff;
  padding: 0;
  margin: auto;
  position: relative;
}
@media print, screen and (min-width: 768px) {
  .st-btn--close1 {
    font-size: 18px;
    width: 384px;
    transition: background-color 0.4s, border-color 0.4s;
  }
  .st-btn--close1:hover {
    opacity: 1;
    background-color: #0584bf;
    border-color: #0584bf;
  }
}
@media screen and (max-width: 767px) {
  .st-btn--close1 {
    font-size: 4.533333333333333vw;
    width: 100%;
    height: 14.933333333333335vw;
  }
}
.st-btn--close1::before,
.st-btn--close1::after {
  content: "";
  top: 0;
  right: 4vw;
  bottom: 0;
  margin: auto;
  position: absolute;
  width: 8vw;
  height: 0.8vw;
  background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4));
}
.st-btn--close1::before {
  transform: rotate(45deg);
}
.st-btn--close1::after {
  transform: rotate(-45deg);
}

/*=================================*/
/* 追加                            */
/*=================================*/
/* background */
.bk_ffffff { background: #ffffff; }
.bk_fffffc { background: #fffffc; }
.bk_ffffcc { background: #ffffcc; }
.bk_366 { background: #366 linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4)); }
.bk_16A { background: #16A linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4)); }
.bk_D02020 { background: #D02020 linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.4)); }
.bk_c0f0f0 { background: #c0f0f0 linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.2)); }
.bk_c0e0ff { background: #c0e0ff linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.2)); }
.bk_ffe0e0 { background: #ffe0e0 linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.2)); }
.bk_efffff { background: #efffff; }
.bk_eeffee { background: #eeffee; } /* 緑背景 */
.bk_effeff { background: #effeff; }
.bk_dfffff { background: #dfffff; } /* 青背景 */
.bk_fffefe { background: #fffefe; }
.bk_fff8f8 { background: #fff8f8; } /* 赤背景 */

/* border */
.bd_366 { border: 1px solid #366; }
.bd_16A { border: 1px solid #16A; }
.bd_D02020 { border: 1px solid #D02020; }

/* box1 width:940px */
.box1, .box1B {
  box-sizing: border-box;
  padding: 0;
  margin: auto;
  border-radius: 10px;
  overflow: hidden;
}
.box1A {
  box-sizing: border-box;
  padding: 0;
  margin: auto;
  overflow: hidden;
}
@media print, screen and (min-width: 768px) {
  .box1, .box1A {
    width: 940px;
    padding-bottom: 10px;
    margin-top: 10px;
  }
  .box1B {
    width: 94%;
   /*  padding-bottom: 6px;
    margin-top: 6px; */
  }
}
@media screen and (max-width: 767px) {
  .box1, .box1A {
    padding-bottom: 4.8vw;
    margin: 2.8vw 4vw 0;
    text-align: center;
  }
  .box1B {
    padding-bottom: 4.8vw;
    margin: 0 4vw 0;
    text-align: center;
  }
}
.box1_headline, .box1B_headline {
	color: #fff;
	font-weight: bold;
	text-align: center;
	display: block;
	width: 100%;
    line-height: 1.2;
}
.box1A_headline {
	color: #000;
	font-weight: bold;
	text-align: left;
	display: block;
	width: 100%;
    line-height: 1.2;
}
@media print, screen and (min-width: 768px) {
  .box1_headline, .box1A_headline {
    font-size: 22px;
    padding: 10px 0 8px 8px;
    margin: auto;
  }
  .box1B_headline {
    font-size: 18px;
    padding: 10px 0 8px 8px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) {
  .box1_headline, .box1A_headline {
    font-size: 4.9vw;
    padding: 1.4vw 0 1vw 1vw;
    margin: auto;
  }
  .box1B_headline {
    font-size: 3.8vw;
    padding: 1.4vw 0 1vw 1vw;
    margin: auto;
  }
}
.box1_body {
  padding: 15px 10px 0 10px;
}

.box_column {
  padding: 0px 10px 0 10px;
  margin: auto;
}
@media print, screen and (min-width: 768px) {
  .box_column {
	width: 940px;
  }
}

.box_column2 {
  margin: auto;
}
@media print, screen and (min-width: 768px) {
  .box_column2 {
	padding: 10px 10px 0 2px;
	margin-bottom:-0.7em;
	width: 940px;
	font-size:16px;
  }
}
@media screen and (max-width: 767px) {
  .box_column2 {
	padding: 2vw 2vw 0 1vw;
	margin-bottom:-1vw;
	font-size:2.8vw;
  }
}

/* box2 width:910px */
.box2 {
  box-sizing: border-box;
  padding: 0;
  margin: auto;
  overflow: hidden;
}
@media print, screen and (min-width: 768px) {
  .box2 {
    width: 910px;
  }
}
@media screen and (max-width: 767px) {
  .box2 {
    margin: -0.8vw 0 -3.4vw;
  }
}
.box2_headline {
  color: #000;
  font-weight: bold;
  display: block;
  width: 100%;
  text-align: left;
}
@media print, screen and (min-width: 768px) {
  .box2_headline {
    line-height: 1;
    font-size: 18px;
    padding: 10px 0 8px 8px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) {
  .box2_headline {
    font-size: 3.6vw;
    padding: 1vw 0 0.5vw 1vw;
    margin: auto;
  }
}
.box2_body {
  padding: 0;
}
.box2_body0 {
  padding: 0;
  border: 1px solid #c0e0ff; /* 緑枠線 */
}
.box2_body1 {
  padding: 0;
  border: 1px solid #b0e0e0; /* 青枠線 */
}
.box2_body2 {
  padding: 0;
  border: 1px solid #ffd0d0; /* 赤枠線 */
}

/* box3 width:440px */
.box3 {
  box-sizing: border-box;
  padding: 0;
  margin: auto;
  overflow: hidden;
}
@media print, screen and (min-width: 768px) {
  .box3 {
    width: 440px;
  }
}
@media screen and (max-width: 767px) {
  .box3 {
    margin: 0;
  }
}
.box3_headline {
  color: #000;
  font-weight: bold;
  display: block;
  width: 100%;
  text-align: left;
  line-height: 1.2;
}
@media print, screen and (min-width: 768px) {
  .box3_headline {
    font-size: 20px;
    padding: 10px 0 8px 8px;
    margin: auto;
  }
}
@media screen and (max-width: 767px) {
  .box3_headline {
    font-size: 3.8vw;
    padding: 1.2vw 0 1vw 1vw;
    margin: auto;
  }
}
.box3_body {
  padding: 0 10px 0 10px;
}
.box3_body1 {
  padding: 0 10px 1px 10px;
}
.box3_body2 {
  padding: 6px 10px 6px 10px;
}
/* box4_headline width:100% */
.box4_headline {
  color: #000;
  font-weight: bold;
  display: block;
  width: 100%;
  text-align: center;
}
@media print, screen and (min-width: 768px) {
  .box4_headline {
    line-height: 1;
    font-size: 20px;
    padding: 7px 0 7px 0;
    margin: 0;
  }
}
@media screen and (max-width: 767px) {
  .box4_headline {
    font-size: 3.6vw;
    padding: 0.5vw 0 0.5vw 0;
    margin: 0;
  }
}
/* box5 width:420px */
.box5 {
	text-align: left;
}
@media print, screen and (min-width: 768px) {
  .box5 {
    width: 420px;
    font-size: 16px;
    padding: 5px 5px 5px 5px;
  }
  .box5 img {
    width: 200px;
	margin-top:-8px;
  }
}
@media screen and (max-width: 767px) {
  .box5 {
	width: 84vw;
    font-size: 3.4vw;
    padding: 0vw 1vw 1vw 1vw;
  }
  .box5 img {
    width: 40vw;
	margin-top:0px;
  }
}
/* box6 height: 190px */
.box6 {
	position: relative;
	text-align: center;
}
.box6a, .box6b {
	position: absolute;
	text-align: left;
}
@media print, screen and (min-width: 768px) {
  .box6 {
	height: 190px;
  }
  .box6a {
	top: 163px;
	left: 0px;
  }
  .box6b {
	top: 177px;
	left: 0px;
  }
}
@media screen and (max-width: 767px) {
  .box6 {
	height: 38vw;
  }
  .box6a {
	top: 32.2vw;
	left: -2vw;
  }
  .box6b {
	top: 35vw;
	left: -2vw;
  }
}
/* box7 width:420px */
.box7 {
	text-align: left;
}
@media print, screen and (min-width: 768px) {
  .box7 {
    width: 420px;
    padding: 5px 0px 5px 20px;
  }
}
@media screen and (max-width: 767px) {
  .box7 {
	width: 84vw;
    padding: 1vw 1vw 2vw 2.2vw;
  }
}
/* box8 width:500px */
.box8 {
	text-align: left;
    font-size: 24px;
	margin: auto;
}
h1.box8 {
  font-weight: normal;
}
.box8B {
	text-align: left;
    font-size: 26px;
	margin: auto;
}
h1.box8B {
  font-weight: normal;
  margin: 0 auto;
  padding: 0;
}
.box8A {
	text-align: center;
    font-size: 26px;
	margin: auto;
}
.box8A2 {
	text-align: center;
    font-size: 26px;
	margin: auto;
}
h1.box8A {
  font-weight: normal;
  margin: 0 auto;
  padding: 0;
}
h1.box8A2 {
  font-weight: normal;
  margin: 0 auto;
  padding: 0;
}
.box8s {
	text-align: center;
    font-size: 17px;
	margin: auto;

}
@media print, screen and (min-width: 768px) {
  .box8 {
    width: 500px;
    padding: 20px 0 0 0;
  }
  .box8B {
    width: 500px;
    padding: 20px 0 0 0;
  }
  h1.box8B {
    width: 500px;
    padding: 20px 0 0 0;
  }
  .box8A {
    width: 600px;
    padding: 0 0 0 0;
  }
  h1.box8A {
    width: 600px;
    padding: 0;
  }
  h1.box8A2 {
    width: 600px;
    padding: 0;
  }
  .box8s {
    width: 900px;
    padding: 20px 0 0 0;
	margin-bottom: -14px;
  }
}
@media screen and (max-width: 767px) {
  .box8 {
	width: 82vw;
    font-size: 4.1vw;
    padding: 1vw 0 0 0;
  }
  .box8B {
	width: 88vw;
    font-size: 4.8vw;
    padding: 1vw 0 0 0;
  }
  h1.box8B {
    width: 90vw;
    font-size: 4.7vw;
    padding: 1vw 0 0 0;
  }
  .box8A {
	width: 90vw;
    font-size: 4.7vw;
    padding: 1vw 0 0 0;
  }
  h1.box8A {
    width: 90vw;
    font-size: 4.7vw;
    padding: 1vw 0 0 0;
  }
  h1.box8A2 {
    width: 93vw;
    font-size: 4.3vw;
    padding: 1vw 0 0 0;
  }
  .box8s {
	width: 80vw;
    font-size: 3.4vw;
    padding: 2vw 0 0 0;
	margin-bottom: 1vw;
  }
}

/* headline color */
.hd_366 { border-left: 7px solid #366; }
.hd_16A { border-left: 7px solid #16A; }
.hd_D02020 { border-left: 7px solid #D02020; }

/* st-head1 */
.st-head1 {
  color: #000;
  background: #efffff;
  line-height: 2.5;
  border-left: 5px solid #D02020;
  padding-left: 10px;
  font-weight: bold;
  /* display: block; */
  width: 100%;
}

/* st-text1 */
.st-text1 {
  margin: 0;
  text-align: left;
}
.st-image1 {
	border: 1px solid #CCC;
}
.st-image940 {
	border: 1px solid #CCC;
}
@media print, screen and (min-width: 768px) {
  .st-text1 {
    font-size: 14px;
  }
  .st-image1 {
    width: 400px;
  }
  .st-image3 {
    width: 400px;
	margin: 7px 0 7px 0;
  }
  .st-image4 {
    width: 195px;
	margin: 7px 0 0 0;
  }
  .st-image4b {
    width: 280px;
	margin: 7px 0 0 0;
  }
  .st-image5 {
    width: 360px;
	margin: 14px 0 14px 0;
  }
  .st-image940 {
    width: 940px;
  }
}
@media screen and (max-width: 767px) {
  .st-text1 {
    font-size: 3.0vw;
  }
  .st-image1 {
    width: 72vw;
  }
  .st-image3 {
    width: 72vw;
	margin: 0 0 7px 0;
  }
  .st-image4 {
    width: 36vw;
	margin: 0 0 7px 0;
  }
  .st-image4b {
    width: 36vw;
	margin: 0 0 7px 0;
  }
  .st-image5 {
    width: 72vw;
	margin: 3vw 0 3vw 0;
  }
  .st-image940 {
    width: 90vw;
  }
}

/* st-text2 */
.st-text2 {
  margin: 0;
  text-align: left;
}
@media print, screen and (min-width: 768px) {
  .st-text2 {
    font-size: 16px;
  }
}
@media screen and (max-width: 767px) {
  .st-text2 {
    font-size: 4.2vw;
  }
}
/* st-text3 */
.st-text3, .st-text3A {
  margin: 0;
  text-align: left;
}
.st-text3B {
  margin: 0;
  text-align: left;
  font-weight: bold;
}
@media print, screen and (min-width: 768px) {
  .st-text3 {
    font-size: 20px;
  }
  .st-text3A {
    font-size: 18px;
	margin-bottom: -6px;
  }
  .st-text3B {
    font-size: 20px;
	margin-bottom: -6px;
  }
}
@media screen and (max-width: 767px) {
  .st-text3 {
    font-size: 4.2vw;
  }
  .st-text3A {
    font-size: 3.5vw;
	margin-bottom: 3.5vw;
  }
  .st-text3B {
    font-size: 4.2vw;

  }
}
/* st-text14 */
.st-text14 {
  margin: 0;
  text-align: left;
}
.st-text14C {
  text-align: left;
}
@media print, screen and (min-width: 768px) {
  .st-text14, .st-text14C {
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .st-text14 {
    font-size: 2.8vw;
  }
  .st-text14C {
    font-size: 3.1vw;
  }
}
/* st-text15 */
.st-text15 {
  margin: 0;
  text-align: left;
}
@media print, screen and (min-width: 768px) {
  .st-text15 {
    font-size: 15px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .st-text15 {
    font-size: 3.5vw;
  }
}
/* st-text16 */
.st-text16, .st-text17, .st-text16C {
  margin: 0;
  text-align: left;
}
.st-text16B, .st-text18B, .st-text20B  {
  margin: 0;
  text-align: left;
  font-weight: bold;
}
@media print, screen and (min-width: 768px) {
  .st-text16, .st-text16B, .st-text16C {
    font-size: 16px;
  }
  .st-text17 {
    font-size: 17px;
  }
  .st-text18B {
    font-size: 18px;
  }
  .st-text20B {
    font-size: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-text16, .st-text16B {
    font-size: 3.8vw;
  }
  .st-text16C {
    font-size: 3.2vw;
  }
  .st-text17 {
    font-size: 4.1vw;
  }
  .st-text18B {
    font-size: 4.1vw;
  }
  .st-text20B {
    font-size: 4.3vw;
  }
}
/* st-text18 */
.st-text18 {
  margin: 0;
  text-align: left;
}
.st-text18c {
  margin: 0;
  text-align: left;
  color:crimson;
}
@media print, screen and (min-width: 768px) {
  .st-text18 {
    font-size: 18px;
  }
  .st-text18c {
    font-size: 18px;
  }
}
@media screen and (max-width: 767px) {
  .st-text18 {
    font-size: 3.3vw;
  }
  .st-text18c {
    font-size: 2.9vw;
  }
}
/* st-text20 */
.st-text20 {
  margin: 0;
}
.st-text20A {
  margin: 0 0 0 10px;
}
@media print, screen and (min-width: 768px) {
  .st-text20, .st-text20A {
    font-size: 20px;
  }
}
@media screen and (max-width: 767px) {
  .st-text20, .st-text20A {
    font-size: 3.8vw;
  }
}
/* st-text22 */
.st-text22 {
  margin: 0;
}
.st-text22A {
  margin: 0 0 0 10px;
}
@media print, screen and (min-width: 768px) {
  .st-text22, .st-text22A {
    font-size: 22px;
  }
}
@media screen and (max-width: 767px) {
  .st-text22, .st-text22A {
    font-size: 4.4vw;
	text-align: left;
  }
}
/* st-text26 */
.st-text26 {
  margin: 0;
  font-weight: bold;
}
@media print, screen and (min-width: 768px) {
  .st-text26 {
    font-size: 26px;
  }
}
@media screen and (max-width: 767px) {
  .st-text26 {
    font-size: 5.4vw;
  }
}
/* st-text10 */
.st-text10 {
  margin-left: 5px;
  font-weight: bold;
  color: blue;
}
@media print, screen and (min-width: 768px) {
  .st-text10 {
    font-size: 10px;
  }
}
@media screen and (max-width: 767px) {
  .st-text10 {
    font-size: 3vw;
  }
}
/* st-text11 */
.st-text11 {
  margin-left: 5px;
  font-weight: bold;
  color: blue;
}
@media print, screen and (min-width: 768px) {
  .st-text11 {
    font-size: 11px;
  }
}
@media screen and (max-width: 767px) {
  .st-text11 {
    font-size: 3vw;
  }
}

/* SgtPeppers */
.sgtPeppers {
  margin: auto;
  width: 336px;
  line-height: 1.8;
}
.st-text12 {
  margin: 0;
  text-align: left;
  font-size: 12px;
}
.st-text12d {
  margin: 0 0 -6px 0;
  text-align: left;
  font-size: 12px;
}
.st-image2 {
  width: 62px;
}
@media screen and (max-width: 767px) {
  .sgtPeppers {
	width: 79vw;
  }
  .st-text12, .st-text12d {
    font-size: 2.9vw;
  }
  .st-image2 {
    width: 14.0vw;
  }
}
.st-text12a {
  text-align: left;
}
@media print, screen and (min-width: 768px) {
  .st-text12a {
    font-size: 12px;
  }
}
@media screen and (max-width: 767px) {
  .st-text12a {
    font-size: 2.4vw;
  }
}
.st-text12c {
  text-align: center;
}
@media print, screen and (min-width: 768px) {
  .st-text12c {
    font-size: 12px;
  }
}
@media screen and (max-width: 767px) {
  .st-text12c {
    font-size: 2.8vw;
  }
}

/* Steve Jobs */
.SteveJobs, .Kant {
	margin: auto;
}
.st-text11 {
	margin: 0;
	text-align: left;
}
@media print, screen and (min-width: 768px) {
  .SteveJobs {
	width: 400px;
  }
  .Kant {
	width: 350px;
  }
  .st-text11 {
	font-size: 11px;
  }
  .st-image2j {
	width: 45px;
  }
}
@media screen and (max-width: 767px) {
  .SteveJobs {
	width: 74vw;
  }
  .Kant {
	width: 63vw;
  }
  .st-text11 {
    font-size: 2vw;
  }
  .st-image2j {
    width: 9vw;
  }
}

/* 縦並び変更 */
@media print, screen and (min-width: 768px) {
  .tate-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .tate-menu2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
	/* height: 76px; */
  }
}

@media print, screen and (min-width: 768px) {
  .tate-list {
    width: 440px;
  }
  .tate-list0 {
    width: 455px;
  }
  .tate-list440 {
    width: 440px;
	padding-top: 10px;
  }
  .tate-list210 {
    width: 210px;
  }
  .tate-list16 {
    width: 440px;
  }
  .tate-list16 ul {
    padding: 4px 0 0 1px;
  }
}
@media screen and (max-width: 767px) {
  .tate-list {
    /* width: 100%; */
    /* width: 98%; */
	width: 100%;
  }
  .tate-list0 {
    /* width: 98%; */
	width: 80vw;
  }
  .tate-list440 {
    /* width: 98%; */
	width: 80vw;
    /* margin-top: 1vw; */
  }
  .tate-list210 {
    /* width: 98%; */
	width: 80vw;
  }
  .tate-list16 {
    /* width: 98%; */
	width: 100%;
  }
  .tate-list16 ul {
    padding: 0 0 0 1vw;
  }
}
/* 箇条書き頭三角 */
ul.hd_list {
	padding:0.3em 0.3em 0em 0.5em;
	list-style-type:none;
}
ul.hd_list li {
	position:relative;
	color:#3F51B5;
}
@media print, screen and (min-width: 768px) {
  ul.hd_list li {
	padding: 0.0em 0 0.3em 0.8em;
  }
}
@media screen and (max-width: 767px) {
  ul.hd_list li {
	padding: 0.0vw 0 0.3vw 1.5vw;
  }
}
ul.hd_list li:before {
	position:absolute;
	content:'';
	left: 0em;
	height:0;
	width:0;
	border-style: solid;
	border-width: 6px 0 6px 9px;
	border-color: transparent transparent transparent #3F51B5;
}
@media print, screen and (min-width: 768px) {
  ul.hd_list li:before {
	top: 0.3em;
  }
}
@media screen and (max-width: 767px) {
  ul.hd_list li:before {
	top: 1vw;
	left: -1vw;
  }
}
ul.hd_list li.hd_list2:before {
	position:absolute;
	content:'';
	top: 0.3em;
	left: 0em;
	height:0;
	width:0;
	border-style: solid;
	border-width: 6px 0 6px 9px;
	border-color: transparent transparent transparent crimson;
}
ul.hd_list li.hd_list2 {
	color: crimson;
	font-weight: bold;
}
ul.hd_list li.hd_list2a:before {
	position:absolute;
	content:'';
	top: 0.3em;
	left: 0em;
	height:0;
	width:0;
	border-style: solid;
	border-width: 6px 0 6px 9px;
	border-color: transparent transparent transparent crimson;
}
ul.hd_list li.hd_list2a {
	color: crimson;
	font-weight: bold;
	margin-top: 6px;
}
ul.hd_list li.hd_list3:before {
	position:absolute;
	content:'';
	top: 0.3em;
	left: 0em;
	height:0;
	width:0;
	border-style: solid;
	border-width: 6px 0 6px 9px;
	border-color: transparent transparent transparent blue;
}
ul.hd_list li.hd_list3 {
	color: blue;
	font-weight: bold;
	margin-top: 6px;
}
/* 箇条書き頭三角2 */
ul.hd_list_2 {
	padding:0.3em 0.3em 0em 0.5em;
	list-style-type:none;
}
ul.hd_list_2 li {
	position:relative;
	color:#3F51B5;
}
@media print, screen and (min-width: 768px) {
  ul.hd_list_2 li {
	padding: 0.0em 0 0.3em 1.1em;
  }
}
@media screen and (max-width: 767px) {
  ul.hd_list_2 li {
	padding: 0.3vw 0 0.6vw 3.6vw;
  }
}
ul.hd_list_2 li:before {
	position:absolute;
	content:'';
	left: 0em;
	height:0;
	width:0;
	border-style: solid;
	border-width: 8px 0 8px 11px;
	border-color: transparent transparent transparent #3F51B5;
}
@media print, screen and (min-width: 768px) {
  ul.hd_list_2 li:before {
	top: 0.35em;
  }
}
@media screen and (max-width: 767px) {
  ul.hd_list_2 li:before {
	top: 1.4vw;
  }
}
/* 文字修飾 */
.shadow1, .shadow1a {
	color: crimson;
	text-shadow: 2px 0 2px #fff,0 2px 2px #fff,-2px 0 2px #fff,0 -2px 2px #fff;
}
.shadow2, .shadow2a {
	color: blue;
	text-shadow: 2px 0 2px #fff,0 2px 2px #fff,-2px 0 2px #fff,0 -2px 2px #fff;
}
.shadow3, .shadow3a {
	color: darkslategray;
	text-shadow: 2px 0 2px #fff,0 2px 2px #fff,-2px 0 2px #fff,0 -2px 2px #fff;
}
.shadow4, .shadow4a {
	color: black;
	text-shadow: 2px 0 2px #fff,0 2px 2px #fff,-2px 0 2px #fff,0 -2px 2px #fff;
}
.shadow5, .shadow5a, .shadow7 {
	color: blue;
	text-shadow: 2px 0 2px #fff,0 2px 2px #fff,-2px 0 2px #fff,0 -2px 2px #fff;
	z-index: 5;
}
.shadow6, .shadow6a {
	color: blue;
	text-shadow: 3px 0 3px #fff,0 3px 3px #fff,-3px 0 3px #fff,0 -3px 3px #fff;
}
@media print, screen and (min-width: 768px) {
  .shadow1 {
	font-size: 20px;
  }
  .shadow1a {
	font-size: 22px;
  }
  .shadow2 {
	font-size: 20px;
  }
  .shadow2a {
	font-size: 22px;
  }
  .shadow3 {
	font-size: 20px;
  }
  .shadow3a {
	font-size: 22px;
  }
  .shadow4 {
	font-size: 20px;
  }
  .shadow4a {
	font-size: 22px;
  }
  .shadow5 {
	font-size: 16px;
  }
  .shadow5a {
	font-size: 18px;
  }
  .shadow6 {
	font-size: 24px;
  }
  .shadow6a {
	font-size: 26px;
  }
  .shadow7 {
	font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  .shadow1 {
	font-size: 3.6vw;
  }
  .shadow1a {
	font-size: 4.6vw;
  }
  .shadow2 {
	font-size: 3.3vw;
  }
  .shadow2a {
	font-size: 4.2vw;
  }
  .shadow3 {
	font-size: 3.6vw;
  }
  .shadow3a {
	font-size: 4.2vw;
  }
  .shadow4 {
	font-size: 4.0vw;
  }
  .shadow4a {
	font-size: 4.0vw;
  }
  .shadow5 {
	font-size: 3.2vw;
  }
  .shadow5a {
	font-size: 3.2vw;
  }
  .shadow6 {
	font-size: 4.6vw;
  }
  .shadow6a {
	font-size: 4.0vw;
  }
  .shadow7 {
	font-size: 3.2vw;
  }
}
.bold {
	font-weight: bold;
	color: black;
}
.bldcms {
	font-weight: bold;
	color: crimson;
}
.bldblu {
	font-weight: bold;
	color: blue;
}
.bldgrn {
	font-weight: bold;
	color: darkslategray;
}
.crimson {
	color: crimson;
}
.blue {
	color: blue;
}
.nmlblk {
	font-weight: normal;
	color: black;
}
/* sgt.AI フォント：Verdana-BoldItalic */
span.Verdana-BI {
	font-family: Verdana;
	font-weight: bold;
	font-style: italic;
	color: crimson;
}
span.Verdana-BIw {
	font-family: Verdana;
	font-weight: bold;
	font-style: italic;
}
span.Verdana-BI16 {
	font-family: Verdana;
	font-weight: bold;
	font-style: italic;
}
@media print, screen and (min-width: 768px) {
  span.Verdana-BI {
	font-size: 28px;
  }
  span.Verdana-BIw {
	font-size: 23px;
  }
}
@media screen and (max-width: 767px) {
  span.Verdana-BI {
    font-size: 5vw;
  }
  span.Verdana-BIw {
	font-size: 3.7vw;
  }
}

.sgt01, .sgt02, .sgt03, .sgt04 {
	text-align: center;
	margin: 0;
}
.font16 {
	text-align: center;
	margin: 5px 0 0 0;
}
.font16a, .font16R {
	text-align: left;
	margin: 0;
}
.font16b {
	text-align: left;
	margin: 10px;
}
.font16c {
	text-align: center;
	margin: 10px 10px 5px 10px;
}
@media print, screen and (min-width: 768px) {
  .sgt01 {
	font-size: 26px;
  }
  .sgt02 {
	font-size: 20px;
  }
  .sgt02a {
	font-size: 20px;
  }
  .sgt03 {
	font-size: 18px;
  }
  .sgt04 {
	font-size: 22px;
  }
  .font17 {
	font-size: 17px;
  }
  .font18 {
	font-size: 18px;
  }
  .font16, .font16a, .font16b, .font16c .font16d, .font16R {
	font-size: 16px;
  }
  .font14 {
	font-size: 14px;
  }
  .font14B {
	font-size: 14px;
	font-weight: bold;
  }
  .font22 {
	font-size: 22px;
  }
}
@media screen and (max-width: 767px) {
  .sgt01 {
    font-size: 4.0vw;
  }
  .sgt02 {
    font-size: 4.0vw;
  }
  .sgt02a {
    font-size: 4.0vw;
  }
  .sgt03 {
    font-size: 4.2vw;
  }
  .sgt04 {
    font-size: 4.4vw;
  }
  .font17 {
	font-size: 3.3vw;
  }
  .font18 {
	font-size: 3.9vw;
  }
  .font16, .font16a, .font16b, .font16c {
	font-size: 3.3vw;
  }
  .font16d {
	font-size: 3.0vw;
  }
  .font16R {
	font-size: 3.3vw;
	color: red;
  }
  .font14 {
	font-size: 3.1vw;
  }
  .font14B {
	font-size: 3.1vw;
	font-weight: bold;
  }
  .font22 {
	font-size: 4.0vw;
  }
}
/* 段組み */
div.blk0 {
	margin: 10px 0 5px 20px;
	width: 420px;
}
@media print, screen and (min-width: 768px) {
  div.blk0 {
	width: 420px;
  }
}
@media screen and (max-width: 767px) {
  div.blk0 {
	width: 75vw;
  }
}
div.blk1 {
	border: 1px solid #CCC;
	padding-top: 3px;
	float: left;
	width: 50%;
	background-color: #EEE;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 34px;
	color: #999;
}
div.blk1:hover {
	border: 1px solid crimson;
	background-color: crimson;
	color: white;
}
div.blk2 {
	border-top: 1px solid #CCC;
	border-right: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	padding-top: 3px;
	background-color: #EEE;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 34px;
	color: #999;
}
div.blk2:hover {
	border-top: 1px solid crimson;
	border-right: 1px solid crimson;
	border-bottom: 1px solid crimson;
	background-color: crimson;
	color: white;
}
.musOV {
	text-decoration: none;
}
p.shosai {
	text-align: center;
	font-size: 12px;
	color: #999;
	padding: 0 0 0 22px;
	line-height: 0;
}
/* 段組み2 */
.koutei1 {
	border: 1px solid #366;
	background-color: #c0f0f0;
	writing-mode: vertical-rl;
	-moz-text-align-last: justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
}
.koutei11 {
	border: 1px solid #366;
	background-color: #c0f0f0;
	writing-mode: vertical-rl;
	letter-spacing: 3px;
	text-align: left;
	font-weight: bold;
}
.koutei12 {
	border: 1px solid #366;
	background-color: #fdd;
	writing-mode: vertical-rl;
	letter-spacing: 3px;
	text-align: left;
	font-weight: bold;
}
@media print, screen and (min-width: 768px) {
  .koutei1 {
	height: 122px;
	font-size: 16px;
	margin-left: 18px;
	padding: 4px 2px 4px 2px;
  }
  .koutei11, .koutei12 {
	height: 156px;
	font-size: 16px;
	margin-left: 18px;
	padding: 4px 8px 4px 8px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .koutei1 {
	height: 24.4vw;
	font-size: 3.2vw;
	margin-left: 3.6vw;
	padding: 0.8vw 0.4vw 0.8vw 0.4vw;
  }
  .koutei11, .koutei12 {
	height: 31.2vw;
	font-size: 3.2vw;
	margin-left: 3.6vw;
	padding: 0.8vw 1.6vw 0.8vw 1.6vw;
  }
}
.koutei0 {
	border: 1px solid #366;
	background-color: #c0f0f0;
	height: 120px;
	writing-mode: vertical-rl;
	padding: 4px 2px 4px 2px;
	-moz-text-align-last: justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
	position: absolute;
	top: 60px;
	margin-left: 30px;
}
.koutei20 {
	position: relative;
	text-align: left;
}
@media print, screen and (min-width: 768px) {
  .koutei20 {
	height: 104px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .koutei20 {
	height: 20.8vw;
  }
}
.koutei21 {
	background-color: #c0f0f0;
	float: left;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}
@media print, screen and (min-width: 768px) {
  .koutei21 {
	border: 1px solid #366;
	padding: 4px 4px 4px 4px;
	width: 90px;
	height: 80px;
	margin-left: 14px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .koutei21 {
	border: 0.2vw solid #366;
	padding: 0.8vw 0.8vw 0.8vw 0.8vw;
	width: 18vw;
	height: 16vw;
	margin-left: 2.8vw;
  }
}
.koutei22 {
	background-color: #c0f0f0;
	float: left;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}
@media print, screen and (min-width: 768px) {
  .koutei22 {
	border: 1px solid #366;
	padding: 4px 4px 4px 4px;
	width: 90px;
	height: 80px;
	margin-left: 26px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .koutei22 {
	border: 0.2vw solid #366;
	padding: 0.8vw 0.8vw 0.8vw 0.8vw;
	width: 18vw;
	height: 16vw;
	margin-left: 5.2vw;
  }
}
.koutei23 {
	background-color: #c0f0f0;
	float: left;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}
@media print, screen and (min-width: 768px) {
  .koutei23 {
	border: 1px solid #366;
	padding: 4px 4px 4px 4px;
	width: 90px;
	height: 80px;
	margin-left: 26px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .koutei23 {
	border: 0.2vw solid #366;
	padding: 0.8vw 0.8vw 0.8vw 0.8vw;
	width: 18vw;
	height: 16vw;
	margin-left: 5.2vw;
  }
}
.koutei240 {
	position: relative;
	text-align: left;
}
@media print, screen and (min-width: 768px) {
  .koutei240 {
	height: 180px;
  }
}
@media screen and (max-width: 767px) {
  .koutei240 {
	height: 38.298vw;
  }
}
.koutei24a {
	border: 1px solid #366;
	background-color: #c0f0f0;
	float: left;
	text-align: center;
	margin-left: 0px;
}
@media print, screen and (min-width: 768px) {
  .koutei24a {
	width: 160px;
	height:130px;
	padding: 40px 4px 4px 4px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .koutei24a {
	width: 32vw;
	height:26vw;
	padding: 8vw 0.8vw 0.8vw 0.8vw;
  }
}
.koutei24b {
	border: 1px solid #366;
	background-color: #c0f0f0;
	float: left;
	text-align: center;
}
@media print, screen and (min-width: 768px) {
  .koutei24b {
	width: 160px;
	height:130px;
	padding: 40px 4px 4px 4px;
	margin-left: 40px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .koutei24b {
	width: 32vw;
	height:26vw;
	padding: 8vw 0.8vw 0.8vw 0.8vw;
	margin-left: 8vw;
  }
}
.koutei31 {
	border: 1px solid #366;
	background-color: #c0f0f0;
	width: 200px;
	height: 20px;
	padding: 4px 4px 4px 4px;
	float: left;
	text-align: center;
	margin-left: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.koutei41div {
	position: relative;
	text-align: left;
}
.koutei41 {
	background-color: #c0f0f0;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	color: blue;
	writing-mode: vertical-rl;
	-moz-text-align-last: justify;
	text-align-last: justify;
	text-justify:inter-ideograph;
}
@media print, screen and (min-width: 768px) {
  .koutei41 {
	border: 1px solid #366;
	padding: 14px 4px 14px 4px;
	margin-left: 20px;
	font-size: 20px;
  }
  .koutei41div {
	margin: 5px 0 5px 10px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .koutei41 {
	border: 0.2vw solid #366;
	padding: 2.8vw 0.8vw 2.8vw 0.8vw;
	margin-left: 4vw;
	font-size: 4vw;
  }
  .koutei41div {
	margin: 1vw 0 1vw 2vw;
  }
}

/* 三角右矢印 */
.sankaku1, .sankaku11 {
	width: 0;
	height: 0;
	border-style: solid;
	border-color: transparent transparent transparent #7a0;
	position: absolute;
}
@media print, screen and (min-width: 768px) {
  .sankaku1 {
	top: 35px;
	border-width: 30px 0 30px 15px;
	margin-left: 5px;
  }
  .sankaku11 {
	top: 50px;
	border-width: 30px 0 30px 15px;
	margin-left: 5px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .sankaku1 {
	top: 7vw;
	border-width: 6vw 0 6vw 3vw;
	margin-left: 1vw;
  }
  .sankaku11 {
	top: 10vw;
	border-width: 6vw 0 6vw 3vw;
	margin-left: 1vw;
  }
}
.sankaku2, .sankaku2a {
	width: 0;
	height: 0;
	border-style: solid;
	border-color: transparent transparent transparent #7a0;
	position: absolute;
}
.sankaku2::after, .sankaku2a::after {
	content: "";
	position: absolute;
}
@media print, screen and (min-width: 768px) {
  .sankaku2 {
	top: 0px;
	border-width: 20px 0 20px 10px;
	margin-left: 13px;
  }
  .sankaku2::after {
	bottom: -8px;
	left: -20px;
	border: 8px solid #7a0;
  }
  .sankaku2a {
	top: 18px;
	border-width: 20px 0 20px 10px;
	margin-left: 13px;
  }
  .sankaku2a::after {
	bottom: -8px;
	left: -20px;
	border: 8px solid #7a0;
  }
}
@media screen and (max-width: 767px) {
  .sankaku2 {
	top: 1vw;
	border-width: 4vw 0 4vw 2vw;
	margin-left: 2.6vw;
  }
  .sankaku2::after {
	bottom: -1.6vw;
	left: -4vw;
	border: 1.6vw solid #7a0;
  }
  .sankaku2a {
	top: 3.6vw;
	border-width: 4vw 0 4vw 2vw;
	margin-left: 2.6vw;
  }
  .sankaku2a::after {
	bottom: -1.6vw;
	left: -4vw;
	border: 1.6vw solid #7a0;
  }
}
.sankaku3 {
	width: 0;
	height: 0;
	border-style: solid;
	border-color: transparent #F77 transparent transparent;
	position: absolute;
	margin-left: 2px;
}
.sankaku3::after {
	content: "";
	position: absolute;
}
@media print, screen and (min-width: 768px) {
  .sankaku3 {
	top: 45px;
	border-width: 20px 10px 20px 0;
	margin-left: 2px;
  }
  .sankaku3::after {
	bottom: -8px;
	left: 4px;
	border: 8px solid #F77;
  }
}
@media screen and (max-width: 767px) {
  .sankaku3 {
	top: 9vw;
	border-width: 4vw 2vw 4vw 0;
	margin-left: 0.4vw;
  }
  .sankaku3::after {
	bottom: -1.6vw;
	left: 0.8vw;
	border: 1.6vw solid #F77;
  }
}
.sankaku4 {
	width: 0;
	height: 0;
	border-style: solid;
	border-color: transparent transparent transparent #7a0;
	position: absolute;
}
.sankaku4::after {
	content: "";
	position: absolute;
}
@media print, screen and (min-width: 768px) {
  .sankaku4 {
	top: 36px;
	border-width: 24px 0 24px 13px;
	margin-left: 24px;
  }
  .sankaku4::after {
	bottom: -10px;
	left: -33px;
	border: 10px solid #7a0;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .sankaku4 {
	top: 7.2vw;
	border-width: 4.8vw 0 4.8vw 2.6vw;
	margin-left: 4.8vw;
  }
  .sankaku4::after {
	bottom: -2vw;
	left: -6.6vw;
	border: 2vw solid #7a0;
  }
}
.sankaku5 {
	width: 0;
	height: 0;
	border-style: solid;
	border-color: transparent #F77 transparent transparent;
	position: absolute;
}
.sankaku5::after {
	content: "";
	position: absolute;
}
@media print, screen and (min-width: 768px) {
  .sankaku5 {
	top: 92px;
	border-width: 24px 13px 24px 0;
	margin-left: 2px;
  }
  .sankaku5::after {
	bottom: -10px;
	left: 13px;
	border: 10px solid #F77;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .sankaku5 {
	top: 18.4vw;
	border-width: 4.8vw 2.6vw 4.8vw 0;
	margin-left: 0.4vw;
  }
  .sankaku5::after {
	bottom: -2vw;
	left: 2.6vw;
	border: 2vw solid #F77;
  }
}

/* 均等割付 */
.kinto {
     padding:0;
     -moz-text-align-last: justify;
     text-align-last: justify;
     text-justify:inter-ideograph;
     border:none;
}
/* 文字数幅均等7文字 */
span.moji7 {
     display: inline-block;
     width: 7em;
}
span.moji2 {
     display: inline-block;
     width: 2em;
}
/* 文字位置セット */
.moji01 {
	position: absolute;
}
@media print, screen and (min-width: 768px) {
  .moji01 {
	top: 1px;
	margin-left: 4px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .moji01 {
	top: 0.2vw;
	margin-left: 0.8vw;
  }
}
.moji02 {
	position: absolute;
}
@media print, screen and (min-width: 768px) {
  .moji02 {
	top: 1px;
	margin-left: 44px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .moji02 {
	top: 0.2vw;
	margin-left: 8.8vw;
  }
}
.moji03 {
	position: absolute;
}
@media print, screen and (min-width: 768px) {
  .moji03 {
	top: 86px;
	margin-left: 14px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .moji03 {
	top: 17.2vw;
	margin-left: 2.8vw;
  }
}
.moji04 {
	position: absolute;
}
@media print, screen and (min-width: 768px) {
  .moji04 {
	top: 86px;
	margin-left: 54px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .moji04 {
	top: 17.2vw;
	margin-left: 10.8vw;
  }
}
/* 余白 */
.yohaku1 {
	height: 10px;
}
@media screen and (max-width: 767px) {
  .yohaku1 {
	display: none;
  }
}
/* 下矢印 */
.arrow1 {
  position: relative;
  width: 30px;
  height: 42px;
  border-left: 16px solid #5bc0de;
  border-right: 16px solid #5bc0de;
  box-sizing: border-box;
  margin: 10px auto 36px auto;
}
.arrow1::after {
  content: "";
  position: absolute;
  bottom: -28px;
  left: -30px;
  border-top: 30px solid #5bc0de;
  border-left: 30px solid transparent;
  border-right: 30px solid transparent;
}
/* 下矢印の上に文字 */
.arrow1 p {
  position: absolute;
  width: 300px;
  left:-150px;
  top:10px;
  margin:auto;
  text-align:center;
  font-weight: bold;
}
.arrow2, .arrow2A {
  position: relative;
  width: 20px;
  height: 22px;
  border-left: 12px solid #5bc0de;
  border-right: 12px solid #5bc0de;
  box-sizing: border-box;
}
@media print, screen and (min-width: 768px) {
  .arrow2 {
	margin: 6px auto 6px auto;
  }
  .arrow2A {
	margin: 6px auto 24px auto;
  }
}
@media screen and (max-width: 767px) {
  .arrow2 {
	margin: 5.2vw auto 2.4vw auto;
  }
  .arrow2A {
	margin: 1.8vw auto 5.0vw auto;
  }
}
.arrow2::after, .arrow2A::after {
  content: "";
  position: absolute;
  bottom: -17px;
  left: -25px;
  border-top: 18px solid #5bc0de;
  border-left: 26px solid transparent;
  border-right: 26px solid transparent;
}
/* 下矢印の上に文字 */
.arrow2 p, .arrow2A p {
  position: absolute;
  width: 300px;
  left:-150px;
  top:2px;
  margin:auto;
  text-align:center;
  font-weight: bold;
}
.arrow3 {
  position: relative;
  width: 20px;
  height: 10px;
  border-left: 12px solid #5bc0de;
  border-right: 12px solid #5bc0de;
  box-sizing: border-box;
  margin: 6px auto 16px auto;
}
.arrow3::after {
  content: "";
  position: absolute;
  bottom: -11px;
  left: -25px;
  border-top: 12px solid #5bc0de;
  border-left: 26px solid transparent;
  border-right: 26px solid transparent;
}
/* 矢印ベース */
@media print, screen and (min-width: 768px) {
  .ya {
	position: relative;
	display: inline-block;
	margin: 10px 0 20px 0px;
	color: #000;
	vertical-align: middle;
	text-decoration: none;
	font-size: 1px;
  }
  .ya::before,
  .ya::after {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
  }
}
@media screen and (max-width: 767px) {
  .ya {
	position: absolute;
  }
}
/* 斜め左下矢印 */
@media print, screen and (min-width: 768px) {
  .ya1::before {
	left: -20px;
	width: 40px;
	height: 5px;
	background: #7a0;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
  }
  .ya1::after {
	top: 10px;
	left: -17px;
	width: 18px;
	height: 18px;
	border-left: 5px solid #7a0;
	border-bottom: 5px solid #7a0;
  }
}
/* 斜め右下矢印 */
@media print, screen and (min-width: 768px) {
  .ya2::before {
	left: -14px;
	width: 40px;
	height: 5px;
	background: #7a0;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
  }
  .ya2::after {
	top: 10px;
	left: 0px;
	width: 18px;
	height: 18px;
	border-right: 5px solid #7a0;
	border-bottom: 5px solid #7a0;
  }
}
/* 見出しテキスト切り替えアニメーション */
.anim_headline {
	color: #fff;
	font-weight: bold;
	text-align: center;
	display: block;
	width: 100%;
	height: 1.5em;
	display: inline-block;
	overflow-y: hidden;
}
.anim_headline span {
	position: relative;
	display: inline-block;
	width: 100%;
	height: 100%;
}
.anim_text1 span {
	animation: ShiftText1 15s linear infinite;
}
@keyframes ShiftText1 {
	0% { opacity: 0; }
	1%, 33% { top: 0; opacity: 1; }
	34%, 66% { top: -1.5em; }
	67%, 100% { top: -3em; }
}
.anim_text2 span {
	animation: ShiftText2 15s linear infinite;
}
@keyframes ShiftText2 {
	0%, 11% { top: -3em; opacity: 1; }
	12% { opacity: 0; }
	13%, 45% { top: 0; opacity: 1; }
	46%, 78% { top: -1.5em; }
	79%, 100% { top: -3em; }
}
.anim_text3 span {
	animation: ShiftText3 15s linear infinite;
}
@keyframes ShiftText3 {
	0%, 22% { top: -3em; opacity: 1; }
	23% { opacity: 0; }
	24%, 56% { top: 0; opacity: 1; }
	57%, 89% { top: -1.5em; }
	90%, 100% { top: -3em; }
}
@media print, screen and (min-width: 768px) {
  .anim_headline {
    font-size: 22px;
    padding: 6px 0 4px 8px;
    margin: auto;
  }
  .anim_body {
	padding: 7px 8px 3px 8px;
  }
}
@media screen and (max-width: 767px) {
  .anim_headline {
    font-size: 3.9vw;
    padding: 0.8vw 0 0.8vw 1vw;
    margin: auto;
  }
  .anim_body {
	padding: 0.6vw 1.3vw 0vw 1.3vw;
	padding-bottom: -20px;
  }
}

/* テキスト切り替えアニメーション */
p.texta {
  font-size: 1.5em;
  display: inline-block;
  vertical-align: top;
}
.texts{
display: inline-block;
  width: 2em;
  height: 1.5em;
  /* border: 1px solid red; */
  text-align: center;
  overflow-y: hidden;
  font-weight: bold;
  color: blue;
}
.texts span{
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
}
.texts span{
  animation: ShiftText 20s linear infinite;
}
@keyframes ShiftText{
  0% {
    opacity: 0;
  }
  1%, 20% {
    top: 0;
    opacity: 1;
  }
  21%, 40% {
    top: -1.5em;
  }
  41%, 60% {
    top: -3em;
  }
  61%, 80% {
    top: -4.5em;
  }
  81%, 100% {
    top: -6em;
  }
}
/* ビデオ再生 */
@media print, screen and (min-width: 768px) {
  .video1 {
	width: 910px;
  }
}
@media screen and (max-width: 767px) {
  .video1 {
	width: 83vw;

  }
}
/* ビデオ再生ボタン */
.video2 {
	color: blue;
	font-weight: bold;
}
@media print, screen and (min-width: 768px) {
  .video2 {
	width: 400px;
	height: 40px;
	font-size: 16px;
	margin-top: 10px;
  }
}
@media screen and (max-width: 767px) {
  .video2 {
	width: 76vw;
	height: 9vw;
	font-size: 3.6vw;
	margin-top: 2vw;
  }
}

/* image 説明文 */
.img-text {
	position: relative;
}

.img-text p {
	position: absolute;
	font-weight: bold;
	color: blue;
	text-shadow: 3px 0 3px #fff,0 3px 3px #fff,-3px 0 3px #fff,0 -3px 3px #fff;
}

@media print, screen and (min-width: 768px) {
  .img-text p {
	font-size: 16px;
	top: -56px;
	left: 10px;
  }
}
@media screen and (max-width: 767px) {
  .img-text p {
	font-size: 2.5vw;;
	top: -10.5vw;
	left: 2.5vw;
  }
}
/* 強調文 */
.stgcms {
	color: crimson;
	font-weight: bold;
	text-align: center;
}
@media print, screen and (min-width: 768px) {
  .stgcms {
	font-size: 26px;
	width: 905px;
	margin: 5px 0 5px 0;
  }
}
@media screen and (max-width: 767px) {
  .stgcms {
	font-size: 3.2vw;
	width: 85vw;
	margin: 0;
  }
}
/* 文字の枠 */
.waku01 {
    width: 100%;
}
@media print, screen and (min-width: 768px) {
  .waku01 {
	margin-left: 30px;
  }
}
@media screen and (max-width: 767px) {
  .waku01 {
	margin-left: 7vw;
  }
}
.waku11 {
	text-align: left;
}
@media print, screen and (min-width: 768px) {
  .waku11 {
	font-size: 30px;
	margin: 5px 0 15px 0;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .waku11 {
	font-size: 6vw;
	margin: 1vw 0 3vw 0;
  }
}
/* 段組み3 */
.dan3 {
	background-color: #EEE;
	align-items: center;
	justify-content: center;
	color: crimson;
}
.dan3:hover {
	border: 1px solid crimson;
	background-color: crimson;
	color: white;
	cursor: pointer;
}
@media print, screen and (min-width: 768px) {
  .dan3 {
	border: 1px solid crimson;
	padding: 3px 16px 0 16px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .dan3 {
	border: 0.2vw solid crimson;
	padding: 0.6vw 3.2vw 0 3.2vw;
  }
}
.dan3b {
	border: 1px solid blue;
	padding: 3px 16px 0 16px;
	background-color: #EEE;
	align-items: center;
	justify-content: center;
	color: blue;
}
.dan3b:hover {
	border: 1px solid blue;
	background-color: blue;
	color: white;
	cursor: pointer;
}
@media print, screen and (min-width: 768px) {
  .dan3b {
	border: 1px solid blue;
	padding: 3px 16px 0 16px;
  }
}
@media screen and (max-width: 767px) { /* 500 */
  .dan3b {
	border: 0.2vw solid blue;
	padding: 0.6vw 3.2vw 0 3.2vw;
  }
}

/* height設定 */
.h10 { height:10px; }
.h15 { height:15px; }
.h16 { height:16px; }
.h18 { height:18px; }
.h20 { height:20px; }
.h23 { height:23px; }
.h25 { height:25px; }
.h26 { height:26px; }
.h27 { height:27px; }
.h28 { height:28px; }
.h60 { height:60px; }
.h74 { height:74px; }
/* width設定 */
.w100p { width:100%; }
.w95p { width:95%; }
.w90p { width:90%; }
.w80p { width:80%; }
.w20p { width:20%; }
.w30 { width:30px; }
.w50 { width:50px; }
.w70 { width:70px; }
.w90 { width:90px; }
.w100 { width:100px; }
.w120 { width:120px; }
.w400 { width:400px; }
/* table属性 */
table.tb00 { border-spacing:0px; } table.tb00 tr td { padding:0px; }
table.tb01 { border-spacing:0px; } table.tb01 tr td { padding:1px; }
table.tb02 { border-spacing:0px; } table.tb01 tr td { padding:2px; }
table.tb03 { border-spacing:0px; } table.tb03 tr td { padding:3px; }
table.tb07 { border-spacing:0px; } table.tb08 tr td { padding:7px; }
table.tb08 { border-spacing:0px; } table.tb08 tr td { padding:8px; }
table.tb10 { border-spacing:1px; } table.tb10 tr td { padding:0px; }
table.tb11 { border-spacing:1px; } table.tb11 tr td { padding:1px; }
table.tb12 { border-spacing:1px; } table.tb12 tr td { padding:2px; }
table.tb15 { border-spacing:1px; } table.tb15 tr td { padding:5px; }
table.tb23 { border-spacing:2px; } table.tb23 tr td { padding:3px; }
table.tb31 { border-spacing:3px; } table.tb31 tr td { padding:1px; }
table.lh50p tr td { line-height:50%; }
table.lh75p tr td { line-height:75%; }
/* 背景色 */
.bgc0 { background-color:#eff8f8; }
.bgc1 { background-color:#e8f0f0; }
.bgc2 { background-color:#d0e8f0; }
.bgc3 { background-color:#c0e0f0; }
.bgc3a { background-color:#bee; }
.bgc3b { background-color:#cef; }
.bgc4 { background-color:#b0d0e8; }
.bgc5 { background-color:#a0c0e0; }
.bgc6 { background-color:#80a0c8; }
.bgCFC { background-color:#CCFFCC; }
/* 線色 */
.bdc6 { border: solid 1px #80a0c8; }
.bdc7 { border: solid 1px #205080; }
.bd090 table, td, th { border: solid 1px #009900; }
/* 白枠線 */
.bdfff table, td { border: solid 1px #FFF; }
.bdfff2 table, td { border: solid 2px #FFF; }
.bdfff3 table, td { border: solid 3px #FFF; }
/* 位置揃え */
.alc { text-align:center; }
.all { text-align:left; }
.alr { text-align:right; }
.vat { vertical-align:top; }
.vam { vertical-align:middle; }
.vab { vertical-align:bottom; }

/* Q&Aデザイン */
.cp_qa *, .cp_qa *:after, .cp_qa *:before {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.cp_qa .cp_actab, .cp_qa .cp_actab2 {
	position: relative;
	overflow: hidden;
	width: 100%;
	color: #1b2538;
}
.cp_qa .cp_actab input, .cp_qa .cp_actab2 input {
	position: absolute;
	opacity: 0;
}
@media print, screen and (min-width: 768px) {
  .cp_qa .cp_actab, .cp_qa .cp_actab2 {
	margin: 0.8em 0 0 0;
  }
}
@media screen and (max-width: 767px) {
  .cp_qa .cp_actab {
	margin: 0.4em 0 0 0;
  }
  .cp_qa .cp_actab2 {
	margin-top: 0.4em;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: -0.8em;
  }
}
/* 質問 */
.cp_qa .cp_actab label, .cp_qa .cp_actab2 label {
	/* font-weight: bold; */
	line-height: 1.6em;
	position: relative;
	display: block;
	margin: 0;
	padding: 0.5em 3.0em 0.5em 2.5em;
	cursor: pointer;
	text-indent: 1em;
	border-radius: 0.5em;
	background: rgba(27,37,56,0.1);
	text-align: left;
}
.cp_qa .cp_actab label::before, .cp_qa .cp_actab2 label::before {
	font-family: serif;
	font-size: 1.5em;
	color: crimson;
	margin-left: -2em;
	padding-right: 0.5em;
	content: 'Q';
}
.cp_qa .cp_actab label:hover, .cp_qa .cp_actab2 label:hover {
	transition: all 0.3s;
	color: #00838f;
}
/* --質問の＋アイコン */
.cp_qa .cp_actab label::after, .cp_qa .cp_actab2 label::after {
	font-size: 1.7em;
	font-weight: bold;
	line-height: 1.7em;
	position: absolute;
	top: 0;
	right: 0;
	color: #366;
	content: '＋';
	display: inline-block;
	width: 2em;
	height: 2em;
	-webkit-transition: transform 0.4s;
	        transition: transform 0.4s;
}
/* 答え */
.cp_qa .cp_actab .cp_actab-content, .cp_qa .cp_actab2 .cp_actab-content {
	position: relative;
	overflow: hidden;
	max-height: 0;
	-webkit-transition: max-height 0.2s;
	        transition: max-height 0.2s;
	border-radius: 0 0 0.5em 0.5em;
	text-align: left;
}
.cp_qa .cp_actab .cp_actab-content::before, .cp_qa .cp_actab2 .cp_actab-content::before {
	font-family: serif;
	color: blue;
	position: absolute;
	padding: 0;
	content: 'A';
}
@media print, screen and (min-width: 768px) {
  .cp_qa .cp_actab .cp_actab-content, .cp_qa .cp_actab2 .cp_actab-content {
	padding: 0 0 0 2.1em;
  }
  .cp_qa .cp_actab .cp_actab-content::before, .cp_qa .cp_actab2 .cp_actab-content::before {
	font-size: 1.5em;
	margin: 0 0 0 -1.1em;
  }
}
@media screen and (max-width: 767px) {
  .cp_qa .cp_actab .cp_actab-content, .cp_qa .cp_actab2 .cp_actab-content {
	padding: 0 0 0 1.7em;
  }
  .cp_qa .cp_actab .cp_actab-content::before, .cp_qa .cp_actab2 .cp_actab-content::before {
	font-size: 1.2em;
	margin: 0 0 0 -1.2em;
  }
}
.cp_qa .cp_actab .cp_actab-content p, .cp_qa .cp_actab2 .cp_actab-content p {
	margin: 0.5em 1em 0.5em 0;
}
/* 質問を開いた時の仕様 */
/* --答えの高さ */
.cp_qa .cp_actab input:checked ~ .cp_actab-content, .cp_qa .cp_actab2 input:checked ~ .cp_actab-content {
	max-height: 40em;
	border-width: 0 8px 8px 8px;
	border-style: solid;
	border-color: rgba(27,37,56,0.1);
}
/* 質問をクリックした時のアイコンの動き */
.cp_qa .cp_actab input:checked ~ label, .cp_qa .cp_actab2 input:checked ~ label {
	color: #00838f;
	border-radius: 0.5em 0.5em 0 0;
}
/* 質問をクリックした時の+の動き */
.cp_qa .cp_actab input[type=checkbox]:checked + label::after, .cp_qa .cp_actab2 input[type=checkbox]:checked + label::after {
	-webkit-transform: rotateZ(45deg);
	transform: rotateZ(45deg);
	-webkit-transform-origin: 55% 45%;
	transform-origin: 55% 45%;
}

/* コラムデザイン */
.cm_qa *, .cm_qa *:after, .cm_qa *:before {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.cm_qa .cm_actab, .cm_qa .cm_actab2 {
	position: relative;
	overflow: hidden;
	width: 100%;
	color: #1b2538;
}
.cm_qa .cm_actab input {
	position: absolute;
	opacity: 0;
}
@media print, screen and (min-width: 768px) {
  .cm_qa .cm_actab, .cm_qa .cm_actab2 {
	margin: 0.8em 0 0 0;
  }
}
@media screen and (max-width: 767px) {
  .cm_qa .cm_actab {
	margin: 0.4em 0 0 0;
  }
  .cm_qa .cm_actab2 {
	margin-top: 0.4em;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: -0.8em;
  }
}
/* タイトル */
.cm_qa .cm_actab label {
	font-weight: bold;
	line-height: 1.6em;
	position: relative;
	display: block;
	margin: 0;
	padding: 0.8em 3.0em 0.5em 0.3em;
	cursor: pointer;
	text-indent: 1em;
	border-radius: 0.5em;
	background: rgba(27,37,56,0.1);
	text-align: left;
}
.cm_qa .cm_actab label::before {
	font-family: serif;
	font-size: 1.5em;
	color: crimson;
	margin-left: -2em;
	padding-right: 0.5em;
}
.cm_qa .cm_actab label:hover {
	transition: all 0.3s;
	/* color: #00838f; */
	color: blue;
}
/* タイトルの＋アイコン */
.cm_qa .cm_actab label::after {
	font-size: 1.7em;
	font-weight: bold;
	line-height: 1.7em;
	position: absolute;
	top: 0;
	right: 0;
	color: #366;
	content: '＋';
	display: inline-block;
	width: 2em;
	height: 2em;
	-webkit-transition: transform 0.4s;
	        transition: transform 0.4s;
}
/* 内容 */
.cm_qa .cm_actab .cm_actab-content {
	position: relative;
	overflow: hidden;
	max-height: 0;
	-webkit-transition: max-height 0.2s;
	        transition: max-height 0.2s;
	border-radius: 0 0 0.5em 0.5em;
	text-align: left;
}
.cm_qa .cm_actab .cm_actab-content::before {
	font-family: serif;
	color: blue;
	position: absolute;
	padding: 0;
}
@media print, screen and (min-width: 768px) {
  .cm_qa .cm_actab label {
	font-size: 20px;
  }
  .cm_qa .cm_actab .cm_actab-content {
	padding: 0 0 0 1.1em;
  }
  .cm_qa .cm_actab .cm_actab-content::before {
	font-size: 1.5em;
	margin: 0 0 0 -2.1em;
  }
}
@media screen and (max-width: 767px) {
  .cm_qa .cm_actab label {
	font-size: 4.0vw;
  }
  .cm_qa .cm_actab .cm_actab-content {
	padding: 0 0 0 0.7em;
  }
  .cm_qa .cm_actab .cm_actab-content::before {
	font-size: 1.2em;
	margin: 0 0 0 -1.2em;
  }
}
.cm_qa .cm_actab .cm_actab-content p {
	margin: 0.5em 1em 0.5em 0;
}
/* 質問を開いた時の仕様 */
/* --答えの高さ */
.cm_qa .cm_actab input:checked ~ .cm_actab-content {
	max-height: 150em;
	border-width: 0 8px 8px 8px;
	border-style: solid;
	border-color: rgba(27,37,56,0.14);
}
/* 質問をクリックした時のアイコンの動き */
.cm_qa .cm_actab input:checked ~ .column-heading label {
  color: blue;
  border-radius: 0.5em 0.5em 0 0;
}
/* 質問をクリックした時の+の動き */
.cm_qa .cm_actab input[type=checkbox]:checked + .column-heading label::after {
  -webkit-transform: rotateZ(45deg);
  transform: rotateZ(45deg);
  -webkit-transform-origin: 55% 45%;
  transform-origin: 55% 45%;
}
/* h92_column.html コラム見出し用：h2の標準デザインを打ち消す */
.cm_qa .cm_actab .column-heading {
  margin: 0;
  padding: 0;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
}
.cm_qa .cm_actab .column-heading {
  margin: 0;
  padding: 0;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
}
.cm_qa .cm_actab .column-heading label {
  color: blue;
}

/* メール送信フォーム */
.Form {
	margin: auto;
	width: 100%;
}
.Form-Item, .Form-Item2, .Form-Item3, .Form-Item4 {
	display: flex;
	align-items: center;
	border-bottom: 1px solid #ddd;
	padding: 5px 10px 5px 10px;
}
@media print, screen and (min-width: 768px) {
  .Form-Item2 {
	float: left;
  }
  .Form-Item3 {
	padding: 5px 500px 5px 10px;
  }
  .Form-Item4 {
	padding: 5px 450px 5px 10px;
  }
}
@media print, screen and (min-width: 768px) {
  .Form-Item-Label {
	font-weight: bold;
	font-size: 16px;
	/* width: 150px; */
    display: flex;
	flex: 0 0 170px;
  }
  .Form-Item-Label2 {
	font-weight: bold;
	font-size: 16px;
	/* width: 150px; */
    display: flex;
	flex: 0 0 90px;
  }
}
@media screen and (max-width: 767px) {
  .Form-Item-Label {
	font-weight: bold;
	font-size: 3.6vw;
    display: flex;
	flex: 0 0 28vw;
	text-align: left;
  }
  .Form-Item-Label2 {
	font-weight: bold;
	font-size: 3.6vw;
    display: flex;
	flex: 0 0 28vw;
	text-align: left;
  }
}
@media print, screen and (min-width: 768px) {
  .Form-Item-Label2 {
	width: 100px;
  }
}
.Form-Item-Label-Required {
	text-align: center;
	background: #FC5778;
	color: #fff;
	border-radius: 5px;
	margin-left: 6px;
	padding-top: 3px;
	width: 27px;
	height: 18px;
	font-size: 10px;
}
.Form-Item-Input {
	border: 1px solid #ccc;
	padding-left: 1em;
	padding-right: 1em;
	background: #eee;
	flex: 1;
	border-radius: 6px;
	margin-left: 10px;
	height: 40px;
	width: 100%;
	max-width: 706px;
	font-size: 16px;
}
.Form-Item-select {
	border: 1px solid #ccc;
	padding-left: 1em;
	padding-right: 1em;
	background: #eee;
	flex: 1;
	border-radius: 6px;
	margin-left: 10px;
	height: 40px;
	width: 100%;
	max-width: 706px;
	font-size: 16px;
}
@media print, screen and (min-width: 768px) {
  /* 数量（select name="Suryo"）＝左 */
  .Form-Item2:has(select[name="Suryo"]) {
    float: left;
    width: calc(50% - 10px);   /* 余裕を作って折り返し防止 */
    box-sizing: border-box;
    /* margin-right: 20px; */       /* 左右の間隔 */
  }
  /* 購入金額＝右（直後の .Form-Item を想定） */
  .Form-Item2:has(select[name="Suryo"]) + .Form-Item {
    float: left;
    width: calc(50% - 10px);
    box-sizing: border-box;
    /* これが入っていると必ず下段になるので潰す */
    clear: none !important;
  }
  /* 次の行以降は回り込み解除（次の要素から改行） */
  .Form-Item2:has(select[name="Suryo"]) + .Form-Item + * {
    clear: both;
  }
}

.Form-Btn {
	border-radius: 6px;
	margin: 10px auto 10px auto;
	padding-top: 10px;
	padding-bottom: 10px;
	width: 180px;
	display: block;
	letter-spacing: 0.05em;
	font-weight: bold;
	font-size: 20px;
	cursor: pointer;
}
.Form-Btn2 {
	border-radius: 6px;
	width: 180px;
	display: block;
	letter-spacing: 0.05em;
	font-weight: bold;
	font-size: 20px;
}
.Form-Btn2div {
	text-align: center;
	margin: 10px auto 10px auto;
	padding-top: 10px;
	padding-bottom: 10px;
}
input::placeholder {
	color: #555;
	font-size: 0.8em;
}
@media print, screen and (min-width: 768px) {
  .Form-note {
	font-size: 11pt;
	color:blue;
  }
}
@media screen and (max-width: 767px) {
  .Form-note {
	font-size: 2.8vw;
	color:blue;
  }
}
/*=================================*/
/* image slider                    */
/*=================================*/
.slider {
    position: relative;
    width: 440px;
    overflow: hidden;
    display: flex;
    align-items: center;
	margin: auto;
}
.slide-container {
    display: flex;
    transition: transform 0.3s ease-in-out;
	margin: auto;
	padding-bottom: 5px;
}
.slide {
    width: 400px;
    margin-left: 20px;
}
.arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(128, 128, 128, 0.5);
    color: white;
    padding: 2px 4px 3px 3px;
    cursor: pointer;
    z-index: 10;
    font-size: 26px;
}
.left-arrow {
    left: 2px;
}
.right-arrow {
    right: -1px;
}
@media screen and (max-width: 767px) {
  .arrow {
    padding: 3px 5px 5px 6px;
  }
  .left-arrow {
    left: 2px;
  }
  .right-arrow {
    right: 2px;
  }
}

.arrow.hidden {
    display: none;
}
@media screen and (max-width: 767px) {
    .slider {
        width: 84vw;
    }
    .slide {
        width: calc(84vw - 40px);
    }
}
/* ユーザーによる選択を無効化 */
.slider, .slide, .arrow {
    user-select: none; /* テキスト選択を無効化 */
    -webkit-user-select: none; /* WebKitブラウザ向け */
    -moz-user-select: none; /* Firefox向け */
    -ms-user-select: none; /* Internet Explorer向け */
}
/* 矢印ボタンのハイライト（反転）を無効化 */
.arrow {
    -webkit-tap-highlight-color: transparent; /* モバイルブラウザ向け */
}
/* span 幅セット（頭揃え用） */
.spanW210 {
  display: inline-block;
  width: 210px;
}
@media screen and (max-width: 767px) {
  .spanW210 {
  width: 20w;
  }
}

/*=================================*/
/* image size                      */
/*=================================*/
.man_image_div {
	position: absolute;
	text-align: right;
}
@media print, screen and (min-width: 768px) {
  .man_image_div {
	width: 420px;
	margin-top: 5px;
  }
  .man_image {
	height: 70px;
  }
}
@media screen and (max-width: 767px) {
  .man_image_div {
	width: 85vw;
	margin-top: 5px;
  }
  .man_image {
	height: 10vw;
  }
}
/*=================================*/
/* image 上に文字オーバーラップ    */
/*=================================*/
.slick-list2 {
  position: relative;
}
.slick-list2 p {
  position: absolute;
  font-weight: bold;
  color: #F79;
  opacity: 1.3;
  text-shadow: 4px 0 4px #fff,0 4px 4px #fff,-4px 0 4px #fff,0 -4px 4px #fff;
}
@media print, screen and (min-width: 768px) {
  .slick-list2 {
	width: 440px;
  }
  .slick-list2 p {
	font-size: 32px;
	top: 220px;
	left: 30px;
  }
}
@media screen and (max-width: 767px) {
  .slick-list2 {
	width: 84vw;
  }
  .slick-list2 p {
	font-size: 5.5vw;;
	top: 40.5vw;
	left: 7vw;
  }
}
/*=================================*/
/* image size                      */
/*=================================*/
.spHead {
	width: 100%;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	margin: 12px 0 5px 0;
}
/*--------------------------------*/
/* トグルボタン　　　　　         */
/*--------------------------------*/
@media print, screen and (min-width: 768px) {
  .toggle-button-container {
	position: absolute;
    padding: 10px 0 8px 8px;
	left: 320px;
	top: -48px;"
  }
}
@media screen and (max-width: 767px) {
  .toggle-button-container {
	position: absolute;
    padding: 1.1vw 0 1vw 1vw;
	left: 45vw;
	top: -9.4vw;"
  }
}
.toggle-button {
  position: relative;
  height: 10px;
  margin-top: 20px;
  background-color: #fff;
  border-radius: 4px;
}
.gd {
  display: grid;
}
.knob,
.btn-bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.btn {
  position: relative;
  top: 20%;
  width: 156px;
  height: 30px;
  margin: -20px 0 0 0;
  overflow: hidden;
}
.btn.btn-pill,
.btn.btn-pill > .btn-bg {
  border-radius: 100px;
}
.btn.btn-rect {
  border-radius: 2px;
}
.checkbox {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 3;
}
.knob {
  z-index: 2;
}
.btn-bg {
  width: 100%;
  background-color: #cbf7fc;
  transition: 0.3s ease all;
  z-index: 1;
}
/* Button 10 */
#button-10 .knob:before,
#button-10 .knob:after,
#button-10 .knob span {
  position: absolute;
  top: 0px;
  width: 70px;
  height: 12px;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  line-height: 1;
  padding: 9px 4px;
  border-radius: 2px;
  transition: 0.3s ease all;
}
#button-10 .knob:before {
  content: "";
  left: 0px;
  background-color: #03a9f4;
}
#button-10 .knob:after {
  content: "法人の方";
  right: 0px;
  color: #4e4e4e;
}
#button-10 .knob span {
  display: inline-block;
  left: 0px;
  color: #fff;
  z-index: 1;
}
#button-10 .checkbox:checked + .knob span {
  color: #4e4e4e;
}
#button-10 .checkbox:checked + .knob:before {
  left: 78px;
  background-color: #f44336;
}
#button-10 .checkbox:checked + .knob:after {
  color: #fff;
}
#button-10 .checkbox:checked ~ .btn-bg {
  background-color: #fcebeb;
}
/*--------------------------------*/
/* 申し込み動機　　　　　         */
/*--------------------------------*/
@media print, screen and (min-width: 768px) {
  .chkbox {
	display: flex;
	align-items: center;
	gap: 3px; /* チェックボックスとテキストの間の隙間 */
	font-size: 14px;
  }
  .label-container {
	padding-left: 12px;
	display: flex;
	flex-wrap: wrap;
  }
}
@media screen and (max-width: 767px) {
  .chkbox {
	display: flex;
	align-items: center;
	gap: 0px;
	font-size: 12px;
  }
  .label-container {
	padding-left: 2.2vw;
	display: flex;
	flex-wrap: wrap;
  }
}
/* =========================================
   スマホ用 前後ページボタン（縦長「く」デザイン）
   ========================================= */
@media screen and (max-width: 767px) {

  #prev-page-button,
  #next-page-button {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 90px;              /* 少し縦長に調整 */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 60px;           /* 矢印自体を大きくして縦長感UP */
    color: rgba(0, 0, 0, 0.45);
    font-weight: normal;       /* 太さは控えめのほうが綺麗 */
    line-height: 1;
    z-index: 9998;
    cursor: pointer;
    user-select: none;
  }

  #prev-page-button {
    left: 4px;
  }

  #next-page-button {
    right: 4px;
  }

  /* 「く」に近い縦長矢印 */
  #prev-page-button::before {
    content: "⟨";   /* 左向き */
  }

  #next-page-button::before {
    content: "⟩";   /* 右向き */
  }
}

/* PC ではボタン非表示 */
@media screen and (min-width: 768px) {
  #prev-page-button,
  #next-page-button {
    display: none;
  }
}

/* =========================================
   スライドアニメーション用オーバーレイ
   ========================================= */
#page-slide-overlay {
  position: fixed;
  inset: 0;
  background: #ffffff;
  z-index: 9999;
  overflow: hidden;
}

/* 現在ページを包むコンテナ（これを横に動かす） */
#page-slide-current {
  width: 100%;
  height: 100%;
  transition: transform 0.4s ease-out;
}
/*--------------------------------*/
/* ページ最下部 Notes  　         */
/*--------------------------------*/
.notes-box {
    position: relative;
    border: 1px solid #999;
    border-radius: 10px;
    background: #fff;
    box-sizing: border-box;

}
/* タイトル（枠にかぶせる） */
.notes-title {
    position: absolute;
    top: -10px;
    left: 20px;
    padding: 0px 12px;
    border: 1px solid #999;
    border-radius: 4px;
    background: #fff;
    font-size: 14px;
    font-weight: bold;
}
/* 中身 */
.notes-content {
    font-size: 16px;
    line-height: 1.4;
}
@media print, screen and (min-width: 768px) {
  .notes-box {
    width: 940px;
    padding: 20px 20px 10px;
	margin: 30px auto 20px auto;
  }
  .notes-content {
	margin: 0;
  }
}
@media screen and (max-width: 767px) {
  .notes-box {
    width: 92vw;
    padding: 3.6vw 4vw 4vw;
	margin: 5vw auto 2vw auto;
  }
  .notes-content {
	margin: 6px -4px -4px -4px;
  }
}
/*--------------------------------*/
/* 表組み　　　　　　  　         */
/*--------------------------------*/
.compare-table {
  border-collapse: collapse;     /* 升目をきれいに */
  width: 100%;
}
.compare-table th,
.compare-table td {
  border: 1px solid #aaa;        /* 薄いグレー */
  padding: 10px 12px;
  font-size: 16px;
}
.compare-table th {
  background-color: #eee;     /* 見出しを少しだけ強調 */
  text-align: center;
}
.compare-table td {
  background-color: #fff;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .compare-table th,
  .compare-table td {
	font-size: 3.3vw;
  }
}
/* =========================================================
   動画ボタン・注記（h12 / h21 ほか）
   ========================================================= */
.video-container {
  text-align: center;
  margin: 10px 0;
}
.video-button {
  display: inline-block;
  padding: 12px 24px;
  font-size: 16px;
  background-color: #007ACC;
  color: #fff;
  border-radius: 6px;
  text-decoration: none;
  cursor: pointer;
}
.video-button:hover {
  background-color: #005A99;
}
@media print, screen and (min-width: 768px) {
  .video-button {
    font-size: 16px;
  }
}
@media screen and (max-width: 767px) {
  .video-button {
    font-size: 3.5vw;
  }
}
.note {
  font-size: 14px;
  color: #555;
  margin-top: 4px;
}
.note2 {
  text-align: center;
  font-size: 10px;
  color: #555;
  margin-top: -3px;
}
.note2-normal {
  margin-top: 0;
}
.note3 {
  text-align: center;
  font-weight: bold;
  color: blue;
  margin-top: 2px;
}
@media print, screen and (min-width: 768px) {
  .note3 {
    font-size: 14px;
  }
}
@media screen and (max-width: 767px) {
  .note3 {
    font-size: 2.8vw;
  }
}

/* =========================================================
   h41_environment.html 用
   ========================================================= */
.ManualPage-container {
  margin-left: 14px;
  margin-bottom: 6px;
}
.ManualPage-button {
  display: inline-block;
  padding: 10px 10px;
  font-size: 15px;
  background-color: #007ACC;
  color: #fff;
  border-radius: 6px;
  text-decoration: none;
  cursor: pointer;
  width: 120px;
  text-align: center;
}
.ManualPage-button:hover {
  background-color: #005A99;
}
@media screen and (max-width: 767px) {
  .ManualPage-button {
    padding: 2vw 1vw;
    font-size: 3vw;
    border-radius: 6px;
    width: 24vw;
  }
}
.ManualPage1-container {
  margin-left: 14px;
  margin-bottom: 6px;
}
.ManualPage1-button {
  display: inline-block;
  padding: 10px 10px;
  font-size: 15px;
  background-color: #007ACC;
  color: #fff;
  border-radius: 6px;
  text-decoration: none;
  cursor: pointer;
  width: 120px;
  text-align: center;
}
.ManualPage1-button:hover {
  background-color: #005A99;
}
.ManualPage2-container {
  margin-left: 14px;
  margin-bottom: 6px;
}
.ManualPage2-button {
  display: inline-block;
  padding: 10px 10px;
  font-size: 15px;
  background-color: #EC2828;
  color: #fff;
  border-radius: 6px;
  text-decoration: none;
  cursor: pointer;
  width: 130px;
  text-align: center;
}
.ManualPage2-button:hover {
  background-color: #D23434;
}
.img_st1 {
  width: 218px;
}
.img_st2 {
  width: 141px;
}
.img_st3 {
  width: 310px;
}
.div_LH {
  line-height: 10px;
}
.div_LH2 {
  line-height: 2px;
}
@media screen and (max-width: 767px) {
  .img_st1 {
    width: 45vw;
  }
  .img_st2 {
    width: 27vw;
  }
  .img_st3 {
    width: 60vw;
  }
  .div_LH {
    line-height: 6vw;
  }
  .div_LH2 {
    line-height: 2vw;
  }
}
/* =========================================================
   アニメGIF POPUP表示
   ========================================================= */
.gif-popup-overlay {
  display: none;
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.65);
  justify-content: center;
  align-items: center;
}
.gif-popup-overlay.is-show {
  display: flex;
}
.gif-popup-box {
  position: relative;
  width: 659px;
  height: 421px;
  background: #fff;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.45);
}
.gif-popup-image {
  display: block;
  width: 659px;
  height: 421px;
}
.gif-popup-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 50%;
  background: #333;
  color: #fff;
  font-size: 24px;
  line-height: 36px;
  cursor: pointer;
}
/* スマホなど画面が小さい場合ははみ出さないようにする */
@media screen and (max-width: 900px) {
  .gif-popup-box {
    width: 94vw;
    height: auto;
  }
  .gif-popup-image {
    width: 100%;
    height: auto;
  }
  .gif-popup-close {
    top: -14px;
    right: -10px;
  }
}
/* =========================================================
   h43_order.html メール確認欄 レスポンシブ調整
   ・PC：1行に整列
   ・スマホ：送信ボタンを1行目、コード入力＋確認ボタンを2行目
   ========================================================= */
.Form-Item:has(#sendMailCodeBtn) > div {
  box-sizing: border-box;
}

#sendMailCodeBtn,
#checkMailCodeBtn,
#MailCode {
  box-sizing: border-box;
}

/* PC表示 */
@media print, screen and (min-width: 768px) {
  .Form-Item:has(#sendMailCodeBtn) > div {
    width: 65% !important;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    text-align: left !important;
  }

  #sendMailCodeBtn {
    width: 130px !important;
    height: 32px;
    margin: 0 !important;
    cursor: pointer;
  }

  #MailCode {
    width: 120px !important;
    height: 32px;
    margin: 0 !important;
    padding: 0 8px;
    text-align: center;
  }

  #checkMailCodeBtn {
    width: 70px !important;
    height: 32px;
    margin: 0 !important;
    cursor: pointer;
  }

  #MailVerifyMsg {
    flex-basis: 100%;
    margin-top: 2px !important;
    line-height: 1.4;
  }
}

/* スマホ表示 */
@media screen and (max-width: 767px) {
  .Form-Item:has(#sendMailCodeBtn) {
    align-items: flex-start;
  }
  .Form-Item:has(#sendMailCodeBtn) .Form-Item-Label {
    padding-top: 1.4vw;
  }
  .Form-Item:has(#sendMailCodeBtn) > div {
    width: calc(100% - 28vw) !important;
    display: grid;
    grid-template-columns: 1fr 0.42fr;
    gap: 1.4vw;
    text-align: left !important;
  }
  #sendMailCodeBtn {
    grid-column: 1 / -1;
    width: 100% !important;
    height: 9.4vw;
    margin: 0 !important;
    padding: 0;
    border-radius: 1.2vw;
    font-size: 3.3vw;
    font-weight: bold;
    cursor: pointer;
  }
  #MailCode {
    grid-column: 1 / 2;
    width: 100% !important;
    height: 9.4vw;
    margin: 0 !important;
    padding: 0 1.6vw;
    border: 1px solid #ccc;
    border-radius: 1.2vw;
    background: #eee;
    font-size: 3.4vw;
    text-align: center;
  }
  #checkMailCodeBtn {
    grid-column: 2 / 3;
    width: 100% !important;
    height: 9.4vw;
    margin: 0 !important;
    padding: 0;
    border-radius: 1.2vw;
    font-size: 3.3vw;
    font-weight: bold;
    cursor: pointer;
  }
  #MailVerifyMsg {
    grid-column: 1 / -1;
    margin-top: 0.2vw !important;
    font-size: 2.7vw !important;
    line-height: 1.45;
  }
}