/* MEMO
ver. corp:2025-M08-D29
Do not use 2byte Charactor.
[z-index range] = 0 - 99
[cache control] = ?ver=YYYYMMDD
[colors]
service   primary color                secondary color
.home   = #dc1c26  rgb(220, 28, 38)    #
.kabu   = #528fcc  rgb(82, 143, 204)   #
.fund   = #3d6b99  rgb(61, 107, 153)   #
.fxneo  = #de9414  rgb(222, 148, 20)   #
.fxop   = #de9414  rgb(222, 148, 20)   #
.c365   = #de9414  rgb(222, 148, 20)   #
.cfd    = #1f1f99  rgb(31, 31, 153)    #3333c9  rgb(51, 51, 201)
.ixop   = #143d66  rgb(20, 61, 102)    #528fcc  rgb(82, 143, 204)
.fbond  = #52a3cc  rgb(82, 163, 204)   #
.mypage = #53b324  rgb(83, 179, 36)    #
[comment]
Webkit focus off
Webkit Mobile Safari
++++++++++++++++++++++++++++++++++++++++ */
/*@import url(./webfont.css);/* static.click-sec fonts CDN */
/* +++++++++++++++++++++++++++++++++++++ */

/* reset
++++++++++++++++++++++++++++++++++++++++ */
body {
  padding: 0;
  margin: 0;
}
.header-top,
.footer-bottom {
  box-sizing: border-box;

  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;

  text-align: left;
  font-weight: normal;
  line-height: 1;

  /* used webfont family */
  font-family: "Roboto", "YakuHanJP", "Subset-NotoSansJP", Meiryo, sans-serif;/* static.click-sec fonts CDN */
  /*font-family: "Roboto Flex", "Noto Sans JP", sans-serif;/* google fonts CDN */

  /* Set based on webfont */
  letter-spacing: normal;
  font-feature-settings: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.header-top *,
.footer-bottom * {
  box-sizing: inherit;
  margin: 0;
  padding: 0;
  font-size: 100%;
  font: inherit;
  letter-spacing: normal;
  text-decoration-skip-ink: none;
  -webkit-text-decoration-skip: none;
  text-decoration-skip: none;
  text-underline-offset: auto;
  outline: none;
}
.header-top *::before,
.header-top *::after,
.footer-bottom *::before,
.footer-bottom *::after {
  box-sizing: inherit;
  letter-spacing: normal;
}
.header-top ul,
.header-top ol,
.footer-bottom ul,
.footer-bottom ol {
  list-style: none;
}


/* header-top
++++++++++++++++++++++++++++++++++++++++ */
.header-top {
  position: relative;
  width: 100%;
  min-width: 1200px;
  background-image: linear-gradient(to bottom, #fff 0px, #fff 47px, #dde0e5 47px, #dde0e5 48px, transparent 48px);
  background-size: 48px 48px;
  background-position: top;
  background-repeat: repeat-x;
  color: #212e46;
}

/* disabled */
.header-top .disabled,
.header-top .is-disabled {
  opacity: 0.25;
  pointer-events: none;
}

/* link */
.header-top a,
.header-top a:link,
.header-top a:visited,
.header-top a:hover {
  color: inherit;
  text-decoration: none;
}
.header-top a:active,
.header-top a:focus {
  opacity: 0.6;
}

/* btn
++++++++++++++++++++++++++++++++++++++++ */
/* html btn ++++++++++++++++++++ */
.header-top .btn-login > a,
.header-top .btn-logout > a {
  display: inline-block;
  padding: 0 10px;
  border: 2px solid transparent;
  border-radius: 100vh;
  background-color: #fff;
  font-size: 13px;
  line-height: 20px;
  text-align: center;
  transition: opacity 0.2s ease;
}

.header-top .btn-login,
.header-top .btn-logout {
  position: absolute;
  top: 60px;
  right: 0;
}
.header-top .btn-login > a,
.header-top .btn-logout > a {
  width: 80px;
  padding: 0;
  border-color: #0c9dc2;
  color: #0c9dc2;
  letter-spacing: -1px;
}
.header-top .btn-login > a:hover,
.header-top .btn-logout > a:hover {
  background-color: #e1e9f0;
}

.header-megamenu .btn-login,
.header-megamenu .btn-logout {
  position: absolute;
  top: 12px;
  right: 0;
}
.header-megamenu .btn-login > a,
.header-megamenu .btn-logout > a {
  border: 1px solid #fff;
  background-color: transparent;
  color: #fff;
  line-height: 22px;
  transition: color 0.2s ease, border-color 0.2s ease;
}
.header-megamenu .btn-login > a:hover,
.header-megamenu .btn-logout > a:hover {
  color: #5fa6ed;
  border-color: currentColor;
  background-color: transparent;
}

.header-top .btn-demo-account > a,
.header-top .btn-demo-account-fxneo > a,
.header-top .btn-platinumchart > a,
.header-top .btn-bank > a,
.header-top .btn-exchange > a,
.header-top .btn-tool > a {
  display: inline-block;
  padding: 0 11px;
  border: 1px solid transparent;
  border-color: #9da5b3;
  border-radius: 4px;
  background-color: #fff;
  font-size: 13px;
  line-height: 22px;
  text-align: center;
  transition: background-color 0.2s ease;
}
.header-top .btn-demo-account > a,
.header-top .btn-demo-account-fxneo > a,
.header-top .btn-platinumchart > a,
.header-top .btn-bank > a {
  color: #4c89af;
}
.header-top .btn-demo-account > a:hover,
.header-top .btn-demo-account-fxneo > a:hover,
.header-top .btn-platinumchart > a:hover,
.header-top .btn-bank > a:hover {
  background-color: #e1eaf0;
}

.header-top .btn-demo-account,
.header-top .btn-demo-account-fxneo {
  position: absolute;
  top: 60px;
  right: 88px;
}

.header-top .btn-exchange > a {
  padding-right: 12px;
  padding-left: 12px;
  font-weight: bold;
  letter-spacing: 4px;
  text-indent: 4px;
}
.header-top .btn-exchange > a:not(:hover) {
  border-color: transparent;
  color: #fff;
  background-color: #53b324;
}
.header-top .btn-exchange > a:hover {
  background-color: #e6f0e1;
  color: #53b324;
}

.header-top .btn-tool > a {
  color: #53b324;
}
.header-top .btn-tool > a:hover {
  background-color: #e6f0e1;
}

.header-top .btn-nisa > a {
  color: #2ba313;
}
.header-top .header-tab .header-nav li.btn-nisa a {
  display: inline-block;
  width: 96px;
  padding: 0 11px;
  border: 1.5px solid currentColor;
  border-radius: 4px;
  background-color: #fff;
  font-size: 14px;
  line-height: 22px;
  letter-spacing: 2px;
  text-indent: 2px;
  text-align: center;
  transition: background-color 0.2s ease;
}
.header-top .header-tab .header-nav li.btn-nisa a:hover {
  background: #f1f6f1;
}
.header-top .header-tab .header-nav li.btn-nisa a::after {
  content: none;
}


/* background image btn ++++++++++++++++++++ */
.header-top .btn-support {
  position: absolute;
  top: 60px;
  right: 112px;
}
.header-top .btn-support > a {
  display: block;
  width: 24px;
  height: 24px;
  background: url(../images/header-top-icon-support.svg);
  /* Text Away fix Chrome */
  white-space: nowrap;
  text-indent: 200%;
  overflow: hidden;
}

/* ++++++++++++++++++++ */
.header-top .btn-open-shortest {
  position: absolute;
  top: 14px;
  right: 0;
}
.header-top .btn-open-shortest > a {
  display: block;
  width: 320px;
  height: 18px;
  background: 0 -126px no-repeat;
  background-image: url(../images/header-top-start.svg?ver=20231104);
  /* Text Away fix Chrome */
  white-space: nowrap;
  text-indent: 200%;
  overflow: hidden;
}

/* ++++++++++++++++++++ */
.header-top .btn-open {
  position: absolute;
  top: 14px;
  right: 0;
}
.header-top .btn-open > a {
  display: block;
  width: 192px;
  height: 18px;
  /* Preload */
  background: 0 480px no-repeat;
  background-image: url(../images/header-top-start.svg?ver=20231104);
  /* Text Away fix Chrome */
  white-space: nowrap;
  text-indent: 200%;
  overflow: hidden;
}
.header-top .btn-open.account > a {
  background-position: 0 -108px;
}

/* ++++++++++++++++++++ */
.header-top .btn-start {
  position: absolute;
  top: 62px;
  right: 0;
}
.header-top .btn-start > a {
  display: block;
  width: 192px;
  height: 18px;
  /* Preload */
  background: 0 480px no-repeat;
  background-image: url(../images/header-top-start.svg?ver=20231104);
  /* Text Away fix Chrome */
  white-space: nowrap;
  text-indent: 200%;
  overflow: hidden;
}
.header-top .btn-start.kabu > a {
  background-position: 0 0;
}
.header-top .btn-start.fxneo > a {
  background-position: 0 -18px;
}
.header-top .btn-start.fxop > a {
  background-position: 0 -36px;
}
.header-top .btn-start.c365 > a {
  background-position: 0 -54px;
}
.header-top .btn-start.cfd > a {
  background-position: 0 -72px;
}
.header-top .btn-start.fbond > a {
  background-position: 0 -90px;
}

/* ++++++++++++++++++++ */
.header-top .btn-account > a {
  display: block;
  width: 176px;
  height: 72px;
  /* Preload */
  background: url(../images/header-top-account.svg?ver=20231104) 0 480px no-repeat;
  /* Text Away fix Chrome */
  white-space: nowrap;
  text-indent: 200%;
  overflow: hidden;
}
.header-top .btn-account.kabu > a {
  background-position: 0 0;
}
.header-top .btn-account.fund > a {
  background-position: 0 -72px;
}
.header-top .btn-account.fxneo > a {
  background-position: 0 -144px;
}
.header-top .btn-account.fxop > a {
  background-position: 0 -216px;
}
.header-top .btn-account.c365 > a {
  background-position: 0 -288px;
}
.header-top .btn-account.cfd > a {
  background-position: 0 -360px;
}
.header-top .btn-account.ixop > a {
  background-position: 0 -432px;
}
.header-top .btn-account.fbond > a {
  background-position: 0 -504px;
}
.header-top .btn-account.open > a {
  background-position: 0 -576px;
}

/* header-global
++++++++++++++++++++++++++++++++++++++++ */
.header-global {
  position: relative;
  margin: 0 auto;
  width: 1200px;
  height: 96px;
}
.header-global a {
  color: inherit;
}

.header-global .logo {
  position: absolute;
  top: 0;
  left: 0;
  width: 208px;
  height: 48px;
  background: url(../images/header-top-logo.svg);
  white-space: nowrap;
  text-indent: 200%;
  overflow: hidden;
}
.header-global .logo a {
  display: block;
  width: 100%;
  height: 100%;
}
.header-global .logo a:focus {
  background-color: rgba(255,255,255,0.5);
}

.header-global .status {
  position: absolute;
  top: 48px;
  width: 100%;
  height: 12px;
  overflow: hidden;
  text-align: right;
  color: #4d586b;
  font-size: 10px;
  line-height: 12px;
}
.header-global .status span + span {
  margin-left: 12px;
}

/* header-tab
++++++++++++++++++++++++++++++++++++++++ */
.header-tab {
  overflow: hidden;
  padding: 0 0 0 240px;
  height: 48px;
}
.header-tab > li {
  float: left;
  width: 96px;
  height: 100%;
  /* Preload */
  background: url(../images/header-top-tab.svg?ver=20250331) no-repeat 200% 0;
  /* Text Away fix Chrome , Case of non A tag */
  white-space: nowrap;
  text-indent: -200%;
  overflow: hidden;
}
.header-tab > li > a {
  display: block;
  height: 100%;
  /* Text Away fix Chrome */
}
.header-tab > li > a:active,
.header-tab > li > a:focus {
  background-color: rgba(0,0,0,0.1) !important;
}
/* NEW 365FX/KABU */
.header-tab .c365::before {
  position: absolute;
  top: 0;
  left: 720px;
  width: 96px;
  height: 8px;
  background-repeat: no-repeat;
  background-position: center bottom;
  background-size: 48px 8px;
  background-image: url(../images/header-top-new-badge.svg);
  overflow: hidden;
  text-indent: 200%;
  white-space: nowrap;
  content: "NEW";
}

/* menu */
.header-tab .home {
  background-position-x: 0;
}
.header-tab .kabu {
  background-position-x: -96px;
}
.header-tab .fund {
  background-position-x: -192px;
}
.header-tab .fxneo {
  background-position-x: -288px;
}
.header-tab .fxop {
  background-position-x: -384px;
}
.header-tab .c365 {
  background-position-x: -480px;
}
.header-tab .cfd {
  background-position-x: -576px;
}
.header-tab .ixop {
  background-position-x: -672px;
}
.header-tab .fbond {
  background-position-x: -768px;
}
.header-tab .mypage {
  background-position-x: -864px;
}
.header-tab .fuop { /* 20231104 delete */
  display: none !important;
}

/* hover */
.header-tab .home:hover,
.header-tab .home.is-hover,
.header-tab .home.is-hover.on,
.header-tab .kabu:hover,
.header-tab .kabu.is-hover,
.header-tab .kabu.is-hover.on,
.header-tab .fund:hover,
.header-tab .fund.is-hover,
.header-tab .fund.is-hover.on,
.header-tab .fxneo:hover,
.header-tab .fxneo.is-hover,
.header-tab .fxneo.is-hover.on,
.header-tab .fxop:hover,
.header-tab .fxop.is-hover,
.header-tab .fxop.is-hover.on,
.header-tab .c365:hover,
.header-tab .c365.is-hover,
.header-tab .c365.is-hover.on,
.header-tab .cfd:hover,
.header-tab .cfd.is-hover,
.header-tab .cfd.is-hover.on,
.header-tab .ixop:hover,
.header-tab .ixop.is-hover,
.header-tab .ixop.is-hover.on,
.header-tab .fbond:hover,
.header-tab .fbond.is-hover,
.header-tab .fbond.is-hover.on,
.header-tab .mypage:hover,
.header-tab .mypage.is-hover,
.header-tab .mypage.is-hover.on {
  background-position-y: -48px;
}

/* on */
.header-tab .home.on,
.header-tab .kabu.on,
.header-tab .fund.on,
.header-tab .fxneo.on,
.header-tab .fxop.on,
.header-tab .c365.on,
.header-tab .cfd.on,
.header-tab .ixop.on,
.header-tab .fbond.on,
.header-tab .mypage.on {
  background-position-y: -96px;
}

/* demo */
.header-tab .demo-fxneo,
.header-tab .demo-fxop,
.header-tab .demo-ixop,
.header-tab .demo-cfd {
  width: 100%;
  background: url(../images/header-top-demo-badge.gif) left center no-repeat !important;
}

/* megamenu hover area support */
.header-tab > li:not(.disabled) {
  overflow: visible;
}
.header-tab > li > a {
  height: calc(100% + 40px);
  margin-top: -40px;
}
.header-tab > li > a::before,
.header-tab > li > a::after {
  position: relative;
  z-index: 99;
  visibility: hidden;
  display: block;
}
.header-tab > li > a[class*=js-]::before,
.header-tab > li > a[class*=js-]::after {
  content: "";
}
.header-tab > li > a::before {
  position: absolute;
  top: 34px;
  left: 0;
  width: 1200px;
  height: 16px;
}
.header-tab > li > a::after {
  left: 50%;
  width: 100px;
  height: 100px;
  transform: translate(-52%, 24px) rotate(45deg);
}
.header-tab > li.is-hover > a:hover::before,
.header-tab > li.is-hover > a:hover::after {
  visibility: visible;
}

/* header-nav
++++++++++++++++++++++++++++++++++++++++ */
.header-nav {
  position: absolute;
  top: 60px;
  left: 0;
  width: 100%;
  height: 28px;
  padding: 0;
  font-size: 15px;
  text-indent: 0;
}
.header-nav > li {
  position: relative;
  float: left;
  height: 28px;
}
.header-nav > li:not(:first-child) {
  margin-left: 26px;
}
.header-nav-shrink > li:not(:first-child) {
  margin-left: 24px;
}
.header-nav [class*=btn-] + [class*=btn-] {
  margin-left: 8px;
}
.header-nav > li:not([class*=btn-]) {
  padding-top: 1px;
  line-height: 20px;
}
.header-nav > li:not([class*=btn-])::after {
  position: absolute;
  top: 24px;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 2px;
  content: "";
}
.header-nav > li:not([class*=btn-]):hover::after {
  background-color: #212e46;
}
.header-nav > li:not([class*=btn-]):active::after {
  opacity: 0.6;
}
.header-nav > li:not([class*=btn-]) a {
  display: inline-block;
  height: 28px;
}
.header-nav > li:not([class*=btn-]) a::before {
  position: absolute;
  top: -12px;
  right: -8px;
  left: -8px;
  bottom: -4px;
  z-index: 1;
  display: block;
  content: "";
}

.header-nav > li .sm {
  font-size: 12px;
}

/* home only */
.home .header-nav > li:not([class*=btn-]) a {
  letter-spacing: 0.1em;
}
.home .header-nav > li:not(:first-child) {
  margin-left: 40px;
}


/* on */
.header-nav .on > a {
  color: #dc1c26;
}
.home .header-nav .on > a {
  color: #dc1c26;
}
.home .header-nav .on.btn-bank > a {
  border-color: #dcdee4;
  color: #dc1c26;
}
.kabu .header-nav .on > a {
  color: #528fcc;
}
.fund .header-nav .on > a {
  color: #3d6b99;
}
.fxneo .header-nav .on > a {
  color: #de9414;
}
.fxop .header-nav .on > a {
  color: #de9414;
}
.c365 .header-nav .on > a {
  color: #de9414;
}
.cfd .header-nav .on > a {
  color: #3333c9;
}
.ixop .header-nav .on > a {
  color: #528fcc;
}
.fbond .header-nav .on > a {
  color: #52a3cc;
}
.mypage .header-nav .on > a {
  color: #53b324;
}
.demo-fxneo .header-nav .on > a {
  color: #de9414;
}
.demo-fxop .header-nav .on > a {
  color: #de9414;
}
.demo-ixop .header-nav .on > a {
  color: #528fcc;
}
.demo-cfd .header-nav .on > a {
  color: #1f1f99;
}

/* header-search (corp)
++++++++++++++++++++++++++++++++++++++++ */
.header-search input,
.header-search button {
  font-size: 100%;
  font: inherit;
}
.header-search input::placeholder {
  color: inherit;
  opacity: 0.5;
}
.header-search input::-webkit-input-placeholder {
  color: inherit;
  opacity: 0.5;
}
.header-search input[type=text]:-ms-input-placeholder {
  color: rgba(33,46,70,0.6);
}

.header-search {
  position: absolute;
  top: 48px;
  right: 0;
  z-index: 2;
  width: 1200px;
  height: 0;
  visibility: hidden;
}
.header-search > .field {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  overflow: hidden;
  width: 184px;
  padding: 0;
  transition: 0.3s ease;
}
.header-search [type="text"] {
  width: 100%;
  height: 48px;
  margin: 0;
  padding: 12px 0;
  border: 0;
  background-color: #fff;
  color: #212e46;
  font-size: 18px;
  line-height: 24px;
}
.header-search .btn-search,
.header-search .btn-close {
  position: absolute;
  top: 12px;
  display: block;
  overflow: hidden;
  width: 24px;
  height: 24px;
  border: 0;
  /* Text Away fix Chrome */
  white-space: nowrap;
  text-indent: 200%;
  cursor: pointer;
}
.header-search .btn-search {
  left: 0;
  background: url(../images/header-top-icon-search.svg);
}
.header-search label.btn-search {
  visibility: visible;
}
.header-search .btn-close {
  right: 0;
  display: none;
}
.header-search .btn-close::before,
.header-search .btn-close::after {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 2px;
  height: 20px;
  background-color: rgba(33,46,70,0.6);
  content: "";
}
.header-search .btn-close::before {
  transform: translate(-50%,-50%) rotate(45deg);
}
.header-search .btn-close::after {
  transform: translate(-50%,-50%) rotate(-45deg);
}
/* toggle */
.header-top [id^="header_search_tgl"],
.header-search > [type="checkbox"] {
  position: absolute;
  z-index: -2;
  opacity: 0.001;
}
/* show */
[id^="header_search_tgl"]:checked ~ * .header-search > .field,
.header-search > [type="checkbox"]:checked ~ .field {
  width: 100%;
  visibility: visible;
}
[id^="header_search_tgl"]:checked ~ * .header-search > .field [type="text"],
.header-search > [type="checkbox"]:checked ~ .field [type="text"] {
  padding-right: 32px;
  padding-left: 32px;
}
[id^="header_search_tgl"]:checked ~ * .header-search > .field label.btn-search, 
.header-search > [type="checkbox"]:checked ~ .field label.btn-search {
  display: none;
}
[id^="header_search_tgl"]:checked ~ * .header-search > .field .btn-close,
.header-search > [type="checkbox"]:checked ~ .field .btn-close {
  display: block;
  visibility: visible;
}

/* header-megamenu
++++++++++++++++++++++++++++++++++++++++ */
.header-megamenu {
  position: absolute;
  top: 32px;
  z-index: 99;
  overflow: hidden;
  width: 100%;
  margin: auto;
  color: #fff;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center top;
}
.header-megamenu {
  background-size: auto calc(16px + 272px);
  background-image: linear-gradient(to bottom,
    transparent 0, transparent 16px, 
    rgba(33,46,70,0.96) 16px, rgba(33,46,70,0.96) 224px,
    #212e46 224px, #212e46 288px,
    rgba(33,46,70,0.96) 288px, rgba(33,46,70,0.96) 352px,
    transparent);
}
.header-megamenu.is-loggedout {
  background-size: auto calc(16px + 208px);
  background-image: linear-gradient(to bottom,
    transparent 0, transparent 16px, 
    rgba(33,46,70,0.96) 16px, rgba(33,46,70,0.96) 224px,
    transparent);
}
.header-megamenu a {
  color: #fff;
}

.header-megamenu > li {
  position: relative;
  width: 1200px;
  margin: auto;
}
.header-megamenu > li::after {/* tab arrow */
  position: absolute;
  top: -16px;
  transform: translateX(-50%);
  display: block;
  border: 8px solid transparent;
  border-bottom-color: rgba(33,46,70,0.9);
  content: "";
  pointer-events: none;

  flex-direction: column;
  justify-content: flex-start;
}
.header-megamenu > .home::after {
  left: 288px;
}
.header-megamenu > .kabu::after {
  left: 384px;
}
.header-megamenu > .fund::after {
  left: 480px;
}
.header-megamenu > .fxneo::after {
  left: 576px;
}
.header-megamenu > .fxop::after {
  left: 672px;
}
.header-megamenu > .c365::after {
  left: 768px;
}
.header-megamenu > .cfd::after {
  left: 864px;
}
.header-megamenu > .ixop::after {
  left: 960px;
}
.header-megamenu > .fbond::after {
  left: 1056px;
}
.header-megamenu > .mypage::after {
  left: 1152px
}
.header-megamenu > li::before {/* hover area support */
  position: absolute;
  top: 0;
  left: calc(50% - 50vw);
  right: calc(50% - 50vw);
  z-index: -1;
  display: block;
  content: "";
}
.header-megamenu.is-loggedout > li:before {
  height: calc(208px + 16px)
}
.header-megamenu > li:before  {
  height: calc(272px + 16px);
}

/* megamenu on|off */
.header-megamenu {
  visibility: hidden;
  overflow: hidden;
  height: 0;
  padding-top: 16px;
  transform: translate3d(0,0,0);
  transition: height 0.2s ease 0s;
  pointer-events: none;
}
.header-megamenu.is-on {
  visibility: visible;
  transition-duration: 0.6s;
}
.header-megamenu.is-on {
  height: calc(16px + 272px + 16px);
}
.header-megamenu.is-on.is-loggedout {
  height: calc(16px + 208px + 16px);
}

.header-megamenu.is-on > * {
  pointer-events: auto;
}
.header-megamenu > li {
  display: none;
}
.header-megamenu > li.is-on {
  display: block;
}

/* contents */
.header-megamenu .contents {
  position: relative;
  width: 1200px;
  margin: auto;
  padding: 16px 0;
  display: flex;
  flex-wrap: wrap;
}
.header-megamenu .col {
  height: 176px;
  padding-top: 12px;
}
.header-megamenu .col:nth-child(1) {
  position: relative;
  width: 202px;
  padding-right: 26px;
}
.header-megamenu .col:nth-child(2) {
  position: relative;
  display: flex;
  flex-wrap: nowrap;
  width: 826px;
  padding-top: 8px;
  padding-right: 32px;
  padding-bottom: 32px;
  padding-left: 33px;
  border-left: 1px solid rgba(255,255,255,0.3);
}
.header-megamenu .col:nth-child(3) {
  width: 172px;
  padding-left: 31px;
  border-left: 1px solid rgba(255,255,255,0.3);
}

/* ttl */
.header-megamenu .ttl {
  margin-bottom: 12px;
  font-size: 32px;
  line-height: 36px;
  letter-spacing: 0.05em;
}
.header-megamenu .kabu .ttl {
  letter-spacing: 8px;
}
.header-megamenu .c365 .ttl {
  font-size: 24px;
  letter-spacing: -1px;
}
.header-megamenu .fxop .ttl {
  margin-bottom: 7px;
}
.header-megamenu  .ixop .ttl .narrow {
  display: inline-block;
  font-size: 18px;
  letter-spacing: -0.5px;
}
.header-megamenu .fbond .ttl {
  letter-spacing: 8px;
}


/* banner */
.header-megamenu .bnr {
  position: absolute;
  left: 0;
  bottom: 0;
  width: calc(100% - 26px);
}
.header-megamenu .bnr img {
  max-width: 100%;
}

.header-megamenu .bnr-wide {
  position: absolute;
  left: 33px;
  bottom: 0;
  width: 760px;
  height: 24px;
  text-align: center;
  line-height: 0;
  opacity: 0.8;
  transition: opacity 0.1s ease-out;
}
.header-megamenu .bnr-wide:hover {
  opacity: 1;
}

/* menu */
.header-megamenu .menu {
  display: grid;
  grid-template-columns: repeat(3, 248px);
  grid-template-rows: repeat(4, 32px);
  grid-auto-flow: dense;
  gap: 0 8px;
  width: 100%;
}
.header-megamenu .menu .c1 {
  grid-column-start: 1;
}
.header-megamenu .menu .c2 {
  grid-column-start: 2;
}
.header-megamenu .menu .c3 {
  grid-column-start: 3;
}
.header-megamenu .menu .sm {
  display: inline-block;
  font-size: 13px;
  vertical-align: baseline;
}
.header-megamenu .menu a {
  display: block;
  padding: 4px 16px;
  border-radius: 4px;
  color: #fff;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.05em;
  transition: background-color 0.2s ease-out;
}
.header-megamenu .home .menu a:hover {
  background-color: rgba(220,28,38,0.9);
}
.header-megamenu .kabu .menu a:hover {
  background-color: rgba(82,143,204,0.9);
}
.header-megamenu .fund .menu a:hover {
  background-color: rgba(61,107,153,0.9);
}
.header-megamenu .fxneo .menu a:hover {
  background-color: rgba(222,148,20,0.9);
}
.header-megamenu .fxop .menu a:hover {
  background-color: rgba(222,148,20,0.9);
}
.header-megamenu .c365 .menu a:hover {
  background-color: rgba(222,148,20,0.9);
}
.header-megamenu .cfd .menu a:hover {
  background-color: rgba(86, 86, 220, 0.9);
}
.header-megamenu .ixop .menu a:hover {
  background-color: rgba(82, 143, 204, 0.9);
}
.header-megamenu .fbond .menu a:hover {
  background-color: rgba(82,163,204,0.9);
}
.header-megamenu .mypage .menu a:hover {
  background-color: rgba(83,179,36,0.9);
}

/* menu-sub */
.header-megamenu .menu-sub {
  padding-top: 20px;
  font-size: 13px;
  line-height: 16px;
}
.header-megamenu .menu-sub li {
  min-height: 24px;
}
/* .header-megamenu .menu-sub li + li {
} */
.header-megamenu .menu-sub a {
  display: block;
  padding: 4px 0;
  transition: color 0.2s ease-out;
}
.header-megamenu .menu-sub a:hover {
  color: #8deb63;
}

/* service-guide */
.header-megamenu .service-guide {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 64px;
}
.header-megamenu .service-guide > dl {
  display: flex;
  width: 1200px;
  margin: auto;
  font-size: 14px;
  line-height: 16px;
}

.header-megamenu .service-guide dt {
  position: relative;
  margin-top: 24px;
  padding-right: 16px;
  /* color: rgba(255,255,255,0.5); */
  transition: color 0.2s ease-out;
  letter-spacing: 0.05em;
}
.header-megamenu .service-guide dt::before {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 8px;
  height: 16px;
  background: url(../images/header-top-arrow.svg) no-repeat right top;
  content: "";
}
.header-megamenu .service-guide ul {
  display: flex;
  padding-left: 24px;
}
.header-megamenu .service-guide a {
  position: relative;
  display: inline-block;
  padding: 24px 16px;
  transition: color 0.2s ease-out;
  letter-spacing: 0.05em;
}
.header-megamenu .home .service-guide a:hover {
  color: #e96167;
}
.header-megamenu .kabu .service-guide a:hover {
  color: #5fa6ed;
}
.header-megamenu .fund .service-guide a:hover {
  color: #4592e1;
}
.header-megamenu .fxneo .service-guide a:hover {
  color: #e9bd63;
}
.header-megamenu .fxop .service-guide a:hover {
  color: #deac49;
}
.header-megamenu .c365 .service-guide a:hover {
  color: #d3a345;
}
.header-megamenu .cfd .service-guide a:hover {
  color: #8d8fed;
}
.header-megamenu .ixop .service-guide a:hover {
  color: #5fa6ed;
}
.header-megamenu .fbond .service-guide a:hover {
  color: #5fbded;
}
.header-megamenu .mypage .service-guide a:hover {
  color: #8deb63;
}

/* footer
++++++++++++++++++++++++++++++++++++++++ */
.footer-security,
.footer-bottom {
  --footer-svg-icon-facebook: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2224%22%20height%3D%2225%22%20viewBox%3D%220%200%2024%2025%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M22%2012.861C22%207.305%2017.523%202.8%2012%202.8S2%207.305%202%2012.861c0%205.022%203.657%209.184%208.438%209.939v-7.03h-2.54V12.86h2.54v-2.216c0-2.522%201.492-3.915%203.777-3.915%201.094%200%202.238.197%202.238.197v2.476h-1.26c-1.243%200-1.63.775-1.63%201.57v1.888h2.773l-.443%202.908h-2.33V22.8c4.78-.755%208.437-4.917%208.437-9.939%22%20fill%3D%22%23000000%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E");
  --footer-svg-icon-twitter: url("data:image/svg+xml;charset=utf8,%3Csvg%20enable-background%3D%22new%200%200%2064%2065.4%22%20height%3D%2265.4%22%20viewBox%3D%220%200%2064%2065.4%22%20width%3D%2264%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22m38%2027.6%2024-27.6h-5.6l-20.8%2024-16.6-24h-19l25%2036.4-25%2029h5.6l21.8-25.4%2017.4%2025.4h19.2zm-7.6%209-2.6-3.6-20.2-28.8h8.6l16.2%2023.2%202.6%203.6%2021.2%2030.2h-8.6z%22%2F%3E%3C%2Fsvg%3E");
  --footer-svg-icon-youtube: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M22.995%209.448a8.495%208.495%200%200%200-.91-4.127%202.918%202.918%200%200%200-1.718-1%2078.31%2078.31%200%200%200-8.365-.31%2078.4%2078.4%200%200%200-8.335.3c-.548.1-1.055.357-1.459.74-.9.83-1%202.249-1.1%203.448a48.26%2048.26%200%200%200%200%206.476c.03.675.13%201.345.3%201.998.121.505.365.972.71%201.36.407.403.926.674%201.49.78%202.154.265%204.325.375%206.495.329%203.498.05%206.566%200%2010.194-.28a2.878%202.878%200%200%200%201.529-.78c.28-.28.488-.622.61-.999.357-1.096.532-2.244.519-3.398.04-.56.04-3.937.04-4.537zM9.743%2014.585V8.399l5.917%203.108c-1.66.92-3.848%201.959-5.917%203.078z%22%20fill%3D%22%23000000%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E");
  --footer-svg-icon-line: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20id%3D%22LINE_LOGO%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2248%22%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3A%23000%3Bstroke-width%3A0px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22Black%22%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M37.18%2C0H10.82C4.84%2C0%2C0%2C4.84%2C0%2C10.82v26.36c0%2C5.98%2C4.84%2C10.82%2C10.82%2C10.82h26.36c5.98%2C0%2C10.82-4.84%2C10.82-10.82V10.82C48%2C4.84%2C43.16%2C0%2C37.18%2C0ZM36.57%2C29.73h0c-3.36%2C3.86-10.87%2C8.57-12.57%2C9.29-1.71.72-1.46-.46-1.39-.86.04-.24.23-1.37.23-1.37.05-.41.11-1.04-.05-1.45-.18-.45-.89-.68-1.41-.79-7.69-1.02-13.38-6.39-13.38-12.81%2C0-7.16%2C7.18-12.99%2C16-12.99s16%2C5.83%2C16%2C12.99c0%2C2.87-1.11%2C5.45-3.43%2C7.99Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M34.67%2C18.28h-4.5c-.17%2C0-.31.14-.31.31h0v6.98h0c0%2C.17.14.31.31.31h4.5c.17%2C0%2C.31-.14.31-.31v-1.13c0-.17-.14-.31-.31-.31h-3.06v-1.18h3.06c.17%2C0%2C.31-.14.31-.31v-1.13c0-.17-.14-.31-.31-.31h-3.06v-1.18h3.06c.17%2C0%2C.31-.14.31-.31v-1.13c0-.17-.14-.31-.31-.31Z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M18.04%2C24.13h-3.06v-5.54c0-.17-.14-.31-.31-.31h-1.13c-.17%2C0-.31.14-.31.31v6.98h0c0%2C.17.14.31.31.31h4.5c.17%2C0%2C.31-.14.31-.31v-1.13c0-.17-.14-.31-.31-.31Z%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%2219.31%22%20y%3D%2218.28%22%20width%3D%221.75%22%20height%3D%227.6%22%20rx%3D%22.31%22%20ry%3D%22.31%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M28.48%2C18.28h-1.13c-.17%2C0-.31.14-.31.31v4.15l-3.2-4.32s-.02-.02-.02-.03c0%2C0%2C0%2C0%2C0%2C0%2C0%2C0-.01-.01-.02-.02%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C0-.01%2C0-.02-.01%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C0-.01%2C0-.02-.01%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C0-.01%2C0-.02%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C0-.01%2C0-.02%2C0%2C0%2C0%2C0%2C0-.01%2C0%2C0%2C0-.01%2C0-.02%2C0%2C0%2C0%2C0%2C0-.01%2C0%2C0%2C0-.01%2C0-.02%2C0%2C0%2C0%2C0%2C0-.01%2C0%2C0%2C0-.01%2C0-.02%2C0%2C0%2C0-.01%2C0-.02%2C0%2C0%2C0%2C0%2C0-.01%2C0h-1.13c-.17%2C0-.31.14-.31.31v6.98c0%2C.17.14.31.31.31h1.13c.17%2C0%2C.31-.14.31-.31v-4.15l3.2%2C4.32s.05.06.08.08c0%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C.01%2C0%2C.02.01%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C.01%2C0%2C0%2C0%2C0%2C0%2C.01%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C.01%2C0%2C.02%2C0%2C0%2C0%2C0%2C0%2C0%2C0%2C.03%2C0%2C.05.01.08.01h1.13c.17%2C0%2C.31-.14.31-.31v-6.98c0-.17-.14-.31-.31-.31Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");

  --footer-color-bg: #1d273d;
  --footer-color-txt: #e7e7e7;
  --footer-color-link: #d9d9d9;
  --footer-color-bdc: var(--header-color-rich-black-010);/* corp */
}
.footer-bottom.white {
  --footer-color-bg: #fff;
  --footer-color-txt: inherit;
  --footer-color-link: inherit;
  --footer-color-bdc: #dde0e5;
  box-shadow: 0 1px 0 0 #eeeff2 inset;
}

.footer-bottom {
  clear: both;
  width: 100%;
  min-width: 1224px;/* corp */
  background-color: #f7f7f9;/* corp */
  margin-top: 40px;
  color: var(--header-color-rich-black);/* corp */
}


/* w1080 ++++++++++++++++++++ */
.footer-inner {
  min-height: 260px;
  padding: 28px 0 64px;
  margin: 0 auto;
  width: 1080px;
}
.footer-nav {
  display: flex;
  justify-content: space-between;
  height: 20px;
  margin-bottom: 56px;
  font-size: 12px;
  line-height: 18px;
}
.footer-nav li {
  list-style-type: none;
}
.footer-nav li:not(:first-child) {
  margin-left: 24px;
}
.footer-nav a,
.footer-nav a:link,
.footer-nav a:visited{
  display: block;
  color: var(--footer-color-link);
  text-decoration: none;
}

@media (hover: hover) {
  .footer-nav a:hover,
  .footer-nav a:focus {
    text-decoration: underline;
  }
  .footer-nav a:active {
    opacity: 0.6;
  }
}
.footer-copyright {
  font-size: 11px;
  line-height: 18px;
}

/* footer-seal (old) */
.footer-seal {
  position: relative;
  width: 1080px;
  margin: 0 auto;
}
.footer-seal-wrap {
  position: absolute;
  bottom: 100px;
  right: 0;
  width: 315px;
  display: flex;
  justify-content: flex-end;
  gap: 5px;
}
.footer-seal-wrap img {
  width: 100px;
  height: auto;
}
/* old */
.footer-seal-inner {
  position: absolute;
  bottom: 16px;
  display: flex;
  justify-content: center;
  gap: 5px;
  right: 0;
}
.footer-seal-inner img {
  width: 100px;
  height: auto;
}

/* w1200 ++++++++++++++++++++ */
.footer-contents {
  padding: 24px 48px 64px;
  margin: 0 auto;
  width: 1320px;/* corp */
}

/* footer-menu */
.footer-menu {
  margin: 0 auto 16px;
  color: var(--header-color-rich-black);/* corp */
  font-size: 12px;
  line-height: 1.66666;
}
.footer-menu > [type="checkbox"] {
  position: absolute;
  z-index: -2;
  opacity: 0.001;
}

.footer-menu > label {
  display: none;
}
.footer-menu > ul {
  display: flex;
  overflow: hidden;
  margin: 0;
  padding: 0;
}
.footer-menu li + li {
  margin-left: 30px;
}
.footer-menu li > a {
  color: inherit;
  text-decoration: none;
  text-underline-offset: 4px;
}

@media (hover: hover) {
  .footer-menu li > a:hover {
    text-decoration: underline;
  }
}

/* footer-author */
.footer-author {
  margin: 0 auto;
  padding-top: 25px;
  font-size: 11px;
  line-height: 1.6;
}
.footer-author:only-child {
  padding-top: 0;
  box-shadow: none;
}

.footer-author > small {
  display: block;
}

/* security footer ++++++++++++++++++++ */
.footer-security {
  box-sizing: border-box;
  display: block;
  min-width: 1200px;
  margin: 0;
  padding: 0 0 40px;
  background: #fff;
}
.footer-security *,
.footer-security *::before,
.footer-security *::after {
  box-sizing: inherit;
}

.footer-security-header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  max-width: 1200px;
  min-height: 58px;
  margin: 0 auto;
  padding: 19px 10px;
}

.footer-security-header > .logo {
  width: 223px;
  height: 18px;
  margin: 0;
  padding: 0;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  background-image: url(../images/header-top-logo.svg);
  white-space: nowrap;
  text-indent: 200%;
  overflow: hidden;
}
.footer-security-header > .logo > a {
  display: block;
  width: 100%;
  height: 100%;
}

.footer-security-header > ul {
  display: flex;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0 0 0 20px;
}
.footer-security-header > ul > li {
  margin: 0;
  padding: 0;
}
.footer-security-header > ul > li > a {
  position: relative;
  display: block;
  width: 20px;
  height: 20px;
  background: #4d4d4d;
  -webkit-mask-size: 20px 20px;
  mask-size: 20px 20px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 200%;
}
.footer-security-header > ul > li > [href*="facebook"] {
  -webkit-mask-size: 24px;
  mask-size: 24px;
  -webkit-mask-image: var(--footer-svg-icon-facebook);
  mask-image: var(--footer-svg-icon-facebook);
}
.footer-security-header > ul > li > [href*="twitter"] {
  -webkit-mask-image: var(--footer-svg-icon-twitter);
  mask-image: var(--footer-svg-icon-twitter);
}
.footer-security-header > ul > li > [href*="youtube"] {
  -webkit-mask-image: var(--footer-svg-icon-youtube);
  mask-image: var(--footer-svg-icon-youtube);
}
.footer-security-header > ul > li > [href*="lin"] {
  -webkit-mask-image: var(--footer-svg-icon-line);
  mask-image: var(--footer-svg-icon-line);
}

.footer-security-seals {
  list-style: none;
  display: flex;
  gap: 10px;
  justify-content: center;
  margin: 0;
  padding: 40px 0 0;
}
.footer-security-seals > li {
  width: 100px;
  margin: 0;
  padding: 0;
}
.footer-security-seals > li img {
  vertical-align: top;
}

@media (max-width: 767.98px) {
  .footer-security {
    padding-right: 16px;
    padding-left: 16px;
  }
  .footer-security-header {
    flex-wrap: wrap;
    justify-content: center;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .footer-security-header > ul {
    justify-content: center;
    width: 100%;
    padding: 20px 0 0;
  }
}

/* override gmoGroupSecurity */
.footer-security-group .gmoGroupSecurity_box {
  max-width: 1200px;
}


/* gorup footer ++++++++++++++++++++ */
.footer-gmo {
  min-width: 1200px;
}


/* Group Header ++++++++++++++++++++ */
/* override */
.gmoGroupHeader {
  z-index: 98 !important;
}


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
/* responsive
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* variables
++++++++++++++++++++++++++++++++++++++++ */
.footer-security,
.header-top,
.footer-bottom,
.sug_list {
  --header-color-service-home: #dc1c26;
  --header-color-service-kabu: #528fcc;
  --header-color-service-fund: #3d6b99;
  --header-color-service-fxneo: #de9414;
  --header-color-service-fxop: #de9414;
  --header-color-service-c365: #de9414;
  --header-color-service-cfd: #1f1f99;
  --header-color-service-ixop: #143d66;
  --header-color-service-fbond: #52a3cc;

  --header-color-rich-black: #0a1f33;
  --header-color-rich-black-003: rgba(10, 31, 51, 0.03);
  --header-color-rich-black-010: rgba(10, 31, 51, 0.1);
  --header-color-rich-black-040: rgba(10, 31, 51, 0.4);
  --header-color-rich-black-060: rgba(10, 31, 51, 0.6);
  --header-color-light-gray: #f7f7f7;

  --header-color-border-line: var(--header-color-rich-black-010);
  --header-color-bg-white: rgba(255, 255, 255, 0.6);
  --header-color-bg-white-open: rgba(255, 255, 255, 1);
  --header-backdrop-filter-blur: blur(30px);

  --header-color-btn-blue: #0c9dc2;
  --header-color-btn-green: #85c20c;
  --header-color-btn-red: #ef2e42;

  --header-height-sp: 64px;
  --header-tab-item-pieces-sp: 9;
  --header-tab-item-height-sp: 48px;
  --header-tab-min-height-sp: calc(var(--header-tab-item-height-sp) * var(--header-tab-item-pieces-sp));
  --header-search-kw-height-sp: 56px;
  --header-safe-area-inset-bottom: calc(env(safe-area-inset-bottom) + 44px);

  --header-svg-bg-tab: url("data:image/svg+xml;charset=utf8,%3Csvg%20height%3D%2248%22%20viewBox%3D%220%200%20112%2048%22%20width%3D%22112%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22m0%201h100l7.543%2021.686a4%204%200%200%201%200%202.628l-7.543%2021.686h-100z%22%2F%3E%3C%2Fsvg%3E");
  --header-svg-icon-menu-open: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2224%22%20height%3D%2236%22%20viewBox%3D%220%200%2024%2036%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cg%20stroke%3D%22%23000000%22%20stroke-width%3D%221.75%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%20%3Cpath%20d%3D%22M3%2024.8h18M3%2017.8h18M3%2010.8h18%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E");
  --header-svg-icon-menu-close: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2224%22%20height%3D%2225%22%20viewBox%3D%220%200%2024%2025%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22m5.28%205.02%206.541%206.54%206.54-6.54a.75.75%200%200%201%201.061%201.06l-6.54%206.541%206.54%206.54a.75.75%200%200%201-1.06%201.061l-6.541-6.54-6.54%206.54a.75.75%200%200%201-1.061-1.06l6.54-6.541-6.54-6.54A.75.75%200%200%201%205.28%205.02z%22%20fill%3D%22%23000000%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E");
  --header-svg-icon-arrow-link: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2216%22%20height%3D%2217%22%20viewBox%3D%220%200%2016%2017%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%20%3Cpath%20d%3D%22M0%20.8h16v16H0z%22%2F%3E%20%3Cpath%20d%3D%22m7%2012.8%204.5-4-4.5-4%22%20stroke%3D%22%23000000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.2%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E");
  --header-svg-icon-arrow-open: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2216%22%20height%3D%2217%22%20viewBox%3D%220%200%2016%2017%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cg%20transform%3D%22translate(0%20.8)%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%20%3Cpath%20d%3D%22M0%200h16v16H0z%22%2F%3E%20%3Cpath%20d%3D%22M4%205.5%208%2010l4-4.5%22%20stroke%3D%22%23000000%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.2%22%2F%3E%20%3Crect%20stroke%3D%22%23000000%22%20x%3D%22.5%22%20y%3D%22.5%22%20width%3D%2215%22%20height%3D%2215%22%20rx%3D%222%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E");
  --header-svg-icon-arrow-close: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2216%22%20height%3D%2217%22%20viewBox%3D%220%200%2016%2017%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M14%20.8a2%202%200%200%201%202%202v12a2%202%200%200%201-2%202H2a2%202%200%200%201-2-2v-12a2%202%200%200%201%202-2h12zM7.552%205.901l-4%204.5a.6.6%200%200%200%20.896.798L8%207.203l3.552%203.996a.6.6%200%201%200%20.896-.798l-4-4.5a.6.6%200%200%200-.896%200z%22%20fill%3D%22%23000000%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E");
  --header-svg-icon-blank: url("data:image/svg+xml;charset=utf8,%3Csvg%20viewBox%3D%220%200%2064%2064.05%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22m60%204v43.91h-43.91v-43.91zm4-4h-51.91v51.91h51.91z%22%2F%3E%3Cpath%20d%3D%22m0%2064.05v-52.04h4v48.03l47.98-.03.01%203.99z%22%2F%3E%3Cpath%20d%3D%22m0%200h64v64h-64z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E");
  --header-svg-icon-search: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Cpath%20d%3D%22M11.93%2016.478a6.105%206.105%200%200%201-7.34-4.547%206.106%206.106%200%201%201%207.341%204.547zm8.175%202.354-3.674-3.674a7.517%207.517%200%201%200-1.273%201.273l3.674%203.674a.8.8%200%200%200%201.13%200l.142-.141a.8.8%200%200%200%200-1.131v-.001z%22%2F%3E%3C%2Fsvg%3E");
}

.footer-security,
.footer-gmo {
  min-width: auto;
}

/* ++++++++++++++++++++++++++++++++++++++++
 * for PC
++++++++++++++++++++++++++++++++++++++++ */
.header-top [id^="header_menu_tgl"],
.header-top [for^="header_menu_tgl"] {
  display: none;
}

/* SP Only */
:where(.responsive).header-top .header-subnav {
  display: none;
}

:where(.responsive).header-top .header-extranav {
  display: none;
}

:where(.responsive).header-top .header-entrance {
  display: none;
}

:where(.responsive).header-top .btn-login-sp,
:where(.responsive).header-top .btn-account-sp {
  display: none;
}

/*  */
:where(.responsive) :not(.on) > .header-nav {
  display: none;
}

:where(.responsive) .header-nav > li > a > b {
  display: none;
}

:where(.responsive) .home > .header-nav > li:first-child {
  display: none;
}
:where(.responsive) .home > .header-nav > li:first-child + li {
  margin-left: 0;
}


/* ++++++++++++++++++++++++++++++++++++++++
 * for SP
 * ++++++++++++++++++++++++++++++++++++++++ */
@media (max-width: 767.98px) {
/* ++++++++++++++++++++++++++++++++++++++++ */

/* states sticky header (js) *
html.is-open-menu,
body.is-open-menu {
} */
html.is-open-menu > body > *:not(.js-header-sp):not(.sug_list):not(main),
body.is-open-menu > *:not(.js-header-sp):not(.sug_list):not(main) {
  display: none !important;
}
html.is-open-menu > body > .js-header-sp.sticky-sp ~ main,
body.is-open-menu > .js-header-sp.sticky-sp ~  main {
  overflow: hidden !important;
  display: block !important;
  min-height: auto !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  transition: none !important;
}

html.is-disabed-scroll,
body.is-disabed-scroll {
  scroll-behavior: auto !important;
}


/* header-top
++++++++++++++++++++++++++++++++++++++++ */
.responsive.header-top {
  position: relative;
  z-index: 99;
  min-width: 320px;
  min-height: var(--header-height-sp);
  display: block;
  background: none;
  color: var(--header-color-rich-black);
  -webkit-tap-highlight-color: rgba(0,0,0,0.1);
}

/* position */
.pulldown-sp.responsive.header-top,
.sticky-sp.responsive.header-top {
  z-index: 99;
}

/* link */
.responsive.header-top a:active,
.responsive.header-top a:focus {
  opacity: 1;
}


/* btn
++++++++++++++++++++++++++++++++++++++++ */
.responsive.header-top .btn-login,
.responsive.header-top .btn-logout {
  display: none;
}

.responsive .btn-login-sp {
  position: absolute;
  z-index: 2;
  top: 8px;
  right: 68px;
  display: block;
  width: 23.47%;
  max-width: 72px;
  height: 48px;
}
.responsive .btn-login-sp > a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0;
  color: var(--header-color-btn-blue);
  font-size: 12px;
  line-height: 28px;
  letter-spacing: -0.25px;
  font-weight: bold;
}
.responsive .btn-login-sp > a::before {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 28px;
  border-radius: 100vh;
  box-shadow: 0 0 0 2px var(--header-color-btn-blue) inset;
  content: "";
}

.responsive .btn-account-sp {
  position: absolute;
  z-index: 2;
  top: 8px;
  right: 160px;
  display: block;
  width: 23.47%;
  max-width: 80px;
  height: 48px;
}
.responsive .btn-account-sp > a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0;
  color: #fff;
  font-weight: bold;
  font-size: 12px;
  line-height: 28px;
  letter-spacing: 1px;
}
.responsive .btn-account-sp > a::before {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 28px;
  border-radius: 100vh;
  background: var(--header-color-btn-red);
  content: "";
}

/* open */
.responsive [id^="header_menu_tgl"]:not(:checked) ~ .header-global > .btn-account-sp {
  display: none;
}

.sticky-sp .btn-account-sp {
  position: fixed;
}

/* background image btn ++++++++++++++++++++ */
.responsive.header-top .btn-support {
  display: none !important;
}


/* header-global
++++++++++++++++++++++++++++++++++++++++ */
.responsive .header-global {
  position: relative;
  z-index: 2;
  width: 100%;
  min-width: 320px;
  height: var(--header-height-sp);
  min-height: var(--header-height-sp);
  padding-top: var(--header-height-sp);
  overflow: hidden;
}
.responsive .header-global::before {
  position: absolute;
  top: 8px;
  right: 8px;
  bottom: 8px;
  left: 8px;
  z-index: -1;
  border-radius: 8px;
  display: block;
  background-color: var(--header-color-bg-white);
  -webkit-backdrop-filter: var(--header-backdrop-filter-blur);
  backdrop-filter: var(--header-backdrop-filter-blur);
  content: "";
  transition: background-color 0.3s ease;
}

.responsive .header-global > .logo {
  position: absolute;
  top: 8px;
  left: 24px;
  z-index: 1;
  width: 60%;
  max-width: 184px;
  height: 48px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 180px auto;
  opacity: 1;
  transition: opacity 0.05s ease;
}
.responsive .header-global > .logo.center-sp {
  left: 50%;
  transform: translateX(-50%);
}

.responsive .header-global .status {
  display: none !important;
}

/* open */
.responsive [id^="header_menu_tgl"]:checked ~ .header-global {
  height: auto;
}
.responsive [id^="header_menu_tgl"]:checked ~ .header-global::before {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: 0;
  background-color: var(--header-color-bg-white-open);
}

/* open */
.responsive [id^="header_search_tgl"] ~ [id^="header_menu_tgl"]:checked ~ .header-global > .logo {
  opacity: 0;
  pointer-events: none;
}

/* absolute */
.pulldown-sp.responsive .header-global {
  position: absolute;
}

/* sticky */
.sticky-sp.responsive .header-global {
  position: fixed;
  top: 0;
  bottom: 0;
  transition: top 0.3s ease;
}

/* sticky: scroll hidden */
.sticky-sp.responsive.is-hidden .header-global {
  top: calc(var(--header-height-sp) * -1);
}

/* sticky: open (js) */
.is-open-menu .sticky-sp.responsive .header-global {
  position: relative;
  height: auto;
}
.is-open-menu .sticky-sp.responsive .header-global::after {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  display: block;
  height: var(--header-height-sp);
  background-color: #fff;
  content: "";
}
.is-open-menu .sticky-sp.responsive .header-global > .logo {
  position: fixed;
}

.is-open-menu .sticky-sp.responsive .header-global > .btn-login-sp {
  position: fixed;
}
.is-open-menu .sticky-sp.responsive .header-global > [for="header_menu_tgl"] {
  position: fixed;
}


/* menu toggle
++++++++++++++++++++++++++++++++++++++++ */
.responsive [id^="header_menu_tgl"] {
  position: absolute;
  top: 0;
  /* z-index: -2; comment out: for faqSP iPhone bug */
  display: block;
  opacity: 0.001;
}

.responsive [for^="header_menu_tgl"] {
  position: absolute;
  z-index: 3;
  top: 8px;
  right: 12px;
  display: block;
  width: 48px;
  height: 48px;
  background: var(--header-color-rich-black);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-image: var(--header-svg-icon-menu-open);
  mask-image: var(--header-svg-icon-menu-open);
  overflow: hidden;
  text-indent: 200%;
  white-space: nowrap;
  cursor: pointer;
}

/* open */
.responsive [id^="header_menu_tgl"]:checked ~ * [for^="header_menu_tgl"] {
  -webkit-mask-image: var(--header-svg-icon-menu-close);
  mask-image: var(--header-svg-icon-menu-close);
}

/* sticky */
.sticky-sp.responsive [id^="header_menu_tgl"] {
  position: fixed;
}


/* header-menu
++++++++++++++++++++++++++++++++++++++++ */
.responsive .header-menu {
  position: relative;
  display: block;
  overflow: hidden;
  height: 0;
  padding: 0 16px;
}

/* open */
.responsive [id^="header_menu_tgl"]:checked ~ * .header-menu {
  height: auto;
  overflow: visible;
}

/* pulldown: open */
.pulldown-sp.responsive [id^="header_menu_tgl"]:checked ~ * .header-menu {
  padding-bottom: var(--header-safe-area-inset-bottom);
}

/* sticky: open */
.sticky-sp.responsive [id^="header_menu_tgl"]:checked ~ * .header-menu {
  overflow: auto;
  /* height: calc(100vh - var(--header-height-sp)); */
  padding-bottom: var(--header-safe-area-inset-bottom);
}

/* sticky: open (js) */
.is-open-menu .sticky-sp.responsive .header-menu {
  height: auto;
}


/* header-tab
++++++++++++++++++++++++++++++++++++++++ */
.responsive .header-tab {
  position: relative;
  z-index: 0;
  height: auto;
  min-height: calc(var(--header-tab-min-height-sp) + 16px);
  margin: 0 -16px;
  padding: 8px 16px 0 120px;
  overflow: visible;
  font-size: 16px;
}
.responsive .header-tab > li {
  position: static;
  float: none;
  width: auto;
  height: auto;
  white-space: normal;
  text-indent: 0;
  background: none;
}
.responsive .header-tab > li > a {
  position: absolute;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100px;
  height: 48px;
  margin: 0;
  padding: 0 8px 0 16px;
  letter-spacing: var(--header-tab-lts-sp, normal);
  -webkit-tap-highlight-color: transparent;
  transition: none;
}
.responsive .header-tab > li > a:focus {
  background-color: transparent !important;
}
.responsive .header-tab > li > a::after {
  position: static;
  transform: none;
  display: inline-block;
  width: 0;
  height: auto;
  /* margin-right: calc(-1 * var(--header-tab-lts-sp, 0)); */
}
.responsive .header-tab > li > a::before {
  position: absolute;
  top: 1px;
  left: 0;
  transform: none;
  z-index: -1;
  width: 100px;
  height: 46px;
  border: 0;
  visibility: visible;
  box-shadow: -3px 0 0 0 currentColor inset;
  background-color: transparent;
  pointer-events: none;
}

/* 365 NEW */
.header-tab .c365::before {
  content: none;
}

/* menu */
.responsive .header-tab > .mypage {
  display: none;
}
.responsive .header-tab > .home > a {
  top: 0;
  --header-tab-lts-sp: 0.05em;
}
.responsive .header-tab > .kabu > a {
  top: calc(var(--header-tab-item-height-sp) * 1);
  --header-tab-lts-sp: 0.75em;
}
.responsive .header-tab > .fund > a {
  top: calc(var(--header-tab-item-height-sp) * 2);
  --header-tab-lts-sp: 0.75em;
}
.responsive .header-tab > .fxneo > a {
  top: calc(var(--header-tab-item-height-sp) * 3);
  --header-tab-lts-sp: 0.05em;
}
.responsive .header-tab > .fxop > a {
  top: calc(var(--header-tab-item-height-sp) * 4);
  --header-tab-lts-sp: 0.075em;
}
.responsive .header-tab > .c365 > a {
  top: calc(var(--header-tab-item-height-sp) * 5);
  /* --header-tab-lts-sp: 0.075em; */
}
.responsive .header-tab > .cfd > a {
  top: calc(var(--header-tab-item-height-sp) * 6);
  --header-tab-lts-sp: 0.5em;
}
.responsive .header-tab > .ixop > a {
  top: calc(var(--header-tab-item-height-sp) * 7);
  --header-tab-lts-sp: 0.25em;
}
.responsive .header-tab > .fbond > a {
  top: calc(var(--header-tab-item-height-sp) * 8);
  --header-tab-lts-sp: 0.75em;
}

.responsive .header-tab > .home > a::before {
  color: var(--header-color-service-home);
}
.responsive .header-tab > .kabu > a::before {
  color: var(--header-color-service-kabu);
}
.responsive .header-tab > .fund > a::before {
  color: var(--header-color-service-fund);
}
.responsive .header-tab > .fxneo > a::before {
  color: var(--header-color-service-fxneo);
}
.responsive .header-tab > .fxop > a::before {
  color: var(--header-color-service-fxop);
}
.responsive .header-tab > .c365 > a::before {
  color: var(--header-color-service-c365);
}
.responsive .header-tab > .cfd > a::before {
  color: var(--header-color-service-cfd);
}
.responsive .header-tab > .ixop > a::before {
  color: var(--header-color-service-ixop);
}
.responsive .header-tab > .fbond > a::before {
  color: var(--header-color-service-fbond);
}

/* on (no js) */
.responsive:not(.is-open-menu) .header-tab > .on > a {
  color: #fff;
}
.responsive:not(.is-open-menu) .header-tab > .on > a::before {
  border-left-color: currentColor;
  box-shadow: -100px 0 0 0 currentColor;
}

/* on (js) */
.responsive .header-tab > .is-current > a {
  color: #fff;
  font-weight: bold;
}

.responsive .header-tab > .is-current > a::before {
  width: 108px;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: left center;
  -webkit-mask-size: auto 48px;
  -webkit-mask-image: var(--header-svg-bg-tab);
  mask-repeat: no-repeat;
  mask-position: left center;
  mask-size: auto 48px;
  mask-image: var(--header-svg-bg-tab);
}


/* header-nav
++++++++++++++++++++++++++++++++++++++++ */
.responsive .header-nav {
  position: relative;
  top: auto;
  left: auto;
  display: block;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  font-size: 15px;
  visibility: inherit;
  opacity: 1;
  /* transition: opacity 0.3s ease; */
}

.responsive.header-top .header-nav > li {
  display: block;
  float: none;
  height: auto;
  margin: 0;
  padding: 0;
  line-height: 1.6;
  letter-spacing: normal;
}
.responsive.header-top .header-nav > li::after {
  content: none;
}

.responsive.header-top .header-nav > li > a {
  position: relative;
  display: block;
  height: auto;
  margin: 0;
  padding: 12px 20px 12px 8px;
  border: 0;
  background: transparent;
  box-shadow: 0 1px 0 0 var(--header-color-border-line) inset;
  font: inherit;
  text-align: left;
}
.responsive.header-top .header-nav > li:first-child > a {
  box-shadow: none;
}
.responsive.header-top .header-nav > li > a::before {
  content: none;
}
.responsive.header-top .header-nav > li > a::after {
  position: absolute;
  top: 16px;
  right: 4px;
  bottom: auto;
  width: 16px;
  height: 16px;
  background: var(--header-color-rich-black);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  content: "";
}
.responsive .header-nav > li > a:not([target="_blank"]):after {
  -webkit-mask-image: var(--header-svg-icon-arrow-link);
  mask-image: var(--header-svg-icon-arrow-link);
}
.responsive .header-nav > li > a[target="_blank"]:after {
  -webkit-mask-image: var(--header-svg-icon-blank);
  mask-image: var(--header-svg-icon-blank);
  -webkit-mask-size: 14px;
  mask-size: 14px;
}

.responsive.header-top .header-nav > .subnav-parent > a {
  color: inherit;
}
.responsive.header-top .header-nav > .subnav-parent > a::after {
  height: 17px;
  -webkit-mask-image: var(--header-svg-icon-arrow-close);
  mask-image: var(--header-svg-icon-arrow-close);
}

.responsive .header-nav > li > a > b {
  display: inline;
  font-weight: normal;
}

.responsive .home > .header-nav > li:first-child {
  display: block;
}

/* close (no js) */
.responsive:not(.is-open-menu) li:not(.on) > .header-nav {
  display: none;
}

/* close (js) */
.is-open-menu li:not(.is-current) > .header-nav {
  height: 0;
  margin: 0;
  opacity: 0;
  visibility: hidden;
}
.is-open-menu .header-nav > .subnav-parent:not(.is-open-subnav) > a::after {
  -webkit-mask-image: var(--header-svg-icon-arrow-open);
  mask-image: var(--header-svg-icon-arrow-open);
}

/* nisa */
.responsive .header-tab .header-nav li.btn-nisa a {
  display: block;
  width: 100%;
  margin-top: 24px;
  margin-bottom: 8px;
  font-size: 18px;
  line-height: 33px;
}


/* header-subnav
++++++++++++++++++++++++++++++++++++++++ */
.responsive .header-subnav {
  display: block;
  overflow: hidden;
  padding: 16px 0;
  box-shadow: 0 1px 0 0 var(--header-color-border-line) inset;
  font-size: 14px;
  line-height: 1.57;
  opacity: 1;
  transition: opacity 0.2s ease;
}

.responsive .header-subnav > li > a {
  position: relative;
  display: block;
  height: auto;
  min-height: 48px;
  padding: 13px 20px 13px 28px;
  /* box-shadow: 0 1px 0 0 var(--header-color-border-line) inset; */
  transition: padding 0.15s ease, color 0.15s ease;
  letter-spacing: 0.05em;
}
.responsive .header-subnav > li:first-child > a {
  box-shadow: none;
}

.responsive li:last-child > .header-subnav > li:last-child > a {
  box-shadow: none;
}
.responsive .header-subnav > li > a::before {
  position: absolute;
  top: 22px;
  right: auto;
  bottom: auto;
  left: 9px;
  display: block;
  width: 7px;
  height: 4px;
  background: var(--header-color-border-line);
  content: "";
}
.responsive .header-subnav > li > a::after {
  position: absolute;
  top: 16px;
  right: 4px;
  bottom: auto;
  width: 16px;
  height: 16px;
  background: var(--header-color-rich-black);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  content: "";
}
.responsive .header-subnav > li > a:not([target="_blank"]):after {
  -webkit-mask-image: var(--header-svg-icon-arrow-link);
  mask-image: var(--header-svg-icon-arrow-link);
}
.responsive .header-subnav > li > a[target="_blank"]:after {
  -webkit-mask-image: var(--header-svg-icon-blank);
  mask-image: var(--header-svg-icon-blank);
  -webkit-mask-size: 14px;
  mask-size: 14px;
}

/* close (js) */
.js-header-sp .subnav-parent:not(.is-open-subnav) .header-subnav {
  padding: 0;
  line-height: 0;
  opacity: 0;
}
.js-header-sp .subnav-parent:not(.is-open-subnav) .header-subnav > li > a {
  min-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  color: rgba(0,0,0,0);
}


/* header-extranav
++++++++++++++++++++++++++++++++++++++++ */
.responsive .header-extranav {
  display: block;
  margin-top: 24px;
  padding-top: 24px;
  box-shadow: 0 2px 0 0 var(--header-color-border-line) inset;
  font-size: 15px;
  line-height: 1.6;
  text-align: center;
}
.responsive .header-extranav > li > a,
.responsive .header-extranav > li > label {
  position: relative;
  display: block;
  padding: 12px 0 12px;
  box-shadow: 0 -1px 0 0 var(--header-color-border-line) inset;
  cursor: pointer;
}


/* header-entrance
++++++++++++++++++++++++++++++++++++++++ */
.responsive .header-entrance {
  display: block;
  margin-top: 40px;
  margin-right: -16px;
  margin-left: -16px;
  padding: 56px 0;
  background-color: var(--header-color-rich-black-003);
}
.sticky-sp.responsive .header-entrance,
.pulldown-sp.responsive .header-entrance {
  margin-bottom: calc(var(--header-safe-area-inset-bottom) * -1);
}

.responsive .header-entrance [class^="btn-"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;

  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 200px;
  min-height: 48px;
  margin: 0 auto;
  padding: 8px 24px;
  border: none;
  border-radius: 100vh;
  color: #fff;
  font-weight: bold;
  font-size: 18px;
  line-height: 1.3334;
  text-align: center;
  filter: brightness(100%);
  cursor: pointer;
  transition: filter 0.25s ease;
}
.responsive .header-entrance [class^="btn-"] > b {
  order: -1;
  display: block;
  margin-right: 8px;
  margin-left: -16px;
  padding: 0 8px 0;
  border-radius: 4px;
  background-color: rgba(255, 255, 255, 0.3);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.8) inset;
  color: inherit;
  font-size: 12px;
  line-height: 20px;
  letter-spacing: 2px;
}
.responsive .header-entrance [class^="btn-"] > small {
  font-size: 14px;
}
.responsive .header-entrance .btn-red {
  background: var(--header-color-btn-red);
  letter-spacing: 4px;
  text-indent: 4px;
}
.responsive .header-entrance .btn-green {
  background-color: var(--header-color-btn-green);
}
.responsive .header-entrance .btn-blue {
  background-color: var(--header-color-btn-blue);
  letter-spacing: 2px;
}

.responsive .header-entrance .note {
  position: relative;
  margin: 24px auto 0;
  color: rgba(10, 31, 51, 0.8);
  font-size: 14px;
  line-height: 1.428;
  letter-spacing: 1.08px;
  text-align: center;
}

.responsive .header-entrance .btn-green ~ .note,
.responsive .header-entrance .btn-blue ~ .note {
  font-size: 12px;
}


/* header-search
++++++++++++++++++++++++++++++++++++++++ */
.responsive .header-search {
  position: static;
  top: auto;
  width: 100%;
  height: auto;
  padding: 0;
}

.responsive .header-search > .field {
  position: static;
  padding: 0;
  transition: 0.01s ease;
}

.responsive.header-top .header-search > .field [type="text"] {
  height: var(--header-search-kw-height-sp);
  padding: 16px 64px 16px 24px;
  background-color: transparent;
  box-shadow: 0 -1px 0 0 var(--header-color-border-line) inset;
  font-size: 16px;
  transition: none;
  visibility: visible;
  -webkit-appearance: none;
  appearance: none;
}

.responsive button.btn-search {
  top: calc(var(--header-height-sp) + 16px);
  left: auto;
  right: 16px;
  width: 40px;
  height: 24px;
  padding-left: 1px;
  border-radius: 3px;
  background: var(--header-color-rich-black-040);
  color: #fff;
  font-size: 13px;
  letter-spacing: 1px;
  text-align: center;
  text-indent: 0;
}

.responsive .header-search > .field label.btn-search {
  top: 8px;
  left: 12px;
  width: 48px;
  height: 48px;
  background: var(--header-color-rich-black);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-image: var(--header-svg-icon-search);
  mask-image: var(--header-svg-icon-search);
}

.responsive .header-search .btn-close {
  position: absolute;
  top: 8px;
  right: auto;
  left: 12px;
  display: block;
  width: 48px;
  height: 48px;
  background: var(--header-color-rich-black);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-image: var(--header-svg-icon-menu-open);
  mask-image: var(--header-svg-icon-menu-open);
  overflow: hidden;
  text-indent: 200%;
  white-space: nowrap;
  cursor: pointer;
}
.responsive .header-search .btn-close::before,
.responsive  .btn-close::after {
  content: none;
}

.responsive [id^="header_search_tgl"] {
  top: 0;
}

/* sticky */
.sticky-sp.responsive [id^="header_search_tgl"] {
  position: fixed;
}
.sticky-sp.responsive .header-search {
  bottom: 0;
  visibility: visible;
}

/* menu close */
.responsive [id^="header_menu_tgl"]:not(:checked) ~ * .field label.btn-search,
.responsive [id^="header_menu_tgl"]:not(:checked) ~ * .field label.btn-close {
  display: none;
}
.responsive [id^="header_search_tgl"]:not(:checked) ~ * .field {
  width: 0;
  height: 0;
}
.responsive [id^="header_search_tgl"]:not(:checked) ~ * .field label.btn-close {
  display: none;
}

/* search open */
.responsive [id^="header_search_tgl"]:checked ~ * .header-search > .field label.btn-search {
  display: none;
}
.responsive [id^="header_search_tgl"]:checked ~ * .header-menu > * {
  display: none;
}

/* search open (js) */
.is-open-menu .sticky-sp.responsive .header-search > .field {
  position: fixed;
  top: var(--header-height-sp);
  bottom: 0;
  z-index: 1;
  background: #fff;
}
.is-open-menu .sticky-sp.responsive .header-search > .field label.btn-search,
.is-open-menu .sticky-sp.responsive .header-search > .field label.btn-close {
  position: fixed;
  z-index: 1;
}
.is-open-menu .sticky-sp.responsive .header-search > .field button.btn-search {
  top: 16px;
}


/* header-megamenu
++++++++++++++++++++++++++++++++++++++++ */
.responsive .header-megamenu {
  display: none !important;
}


/* ++++++++++++++++++++++++++++++++++++++++
 * search input suggest
 * ++++++++++++++++++++++++++++++++++++++++ */
.responsive ~ .sug_list {
  z-index: 99;
  box-sizing: border-box;
  overflow-y: auto;
  width: 100%;
  margin: 0;
  padding: 16px 0;
  background-color: var(--header-color-bg-white);
  -webkit-backdrop-filter: var(--header-backdrop-filter-blur);
  backdrop-filter: var(--header-backdrop-filter-blur);
  box-shadow: none;
  color: var(--header-color-rich-black);
  font-family: "Roboto", "YakuHanJP", "Subset-NotoSansJP", Meiryo, sans-serif;
}
.responsive ~ .sug_list .sug_element a {
  padding: 7px 64px 7px 24px;
  font-size: 16px;
  line-height: 1.6;
}
.responsive ~ .sug_list .sug_element:hover {
  background: transparent;
}

/* pulldown *
.pulldown-sp.responsive ~ .sug_list {
} */

/* sticky */
.sticky-sp.responsive ~ .sug_list {
  overflow: auto;
  bottom: 0;
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}


/* END SP ++++++++++++++++++++++++++++++++++++++++ */
}

/* ++++++++++++++++++++++++++++++++++++++++
 * for ASP
 * ++++++++++++++++++++++++++++++++++++++++ */
.minconf.responsive.header-top .btn-login {
  height: auto;
}
.minconf.responsive .header-tab > li > a::before,
.minconf.responsive .header-tab > li > a::after {
  content: "";
}

/* */
@media (max-width: 767.98px) {
/* ++++++++++++++++++++++++++++++++++++++++ */
.minconf.responsive.header-top.sticky-sp {
  z-index: 999999;
}

.minconf.responsive .header-tab {
  padding: 0 24px 0;
}
.minconf.responsive .header-tab > li {
  position: relative;
}

.minconf.responsive .header-tab > li > a {
  position: relative;
  top: auto;
  left: auto;
  justify-content: flex-start;
  width: auto;
  height: 48px;
  padding: 0 20px 0 40px;
  border-width: 0 0 0 3px;
}
.minconf.responsive.header-top .header-tab > li > a {
  color: inherit;
}
.minconf.responsive.header-top .header-tab > li > a::before {
  left: 0;
  right: auto;
  width: 3px;
}
.minconf.responsive .header-tab > li > a::after {
  position: absolute;
  top: 20px;
  right: 8px;
  bottom: auto;
  left: auto;
  z-index: 1;
  transform: rotate(45deg);
  display: block;
  width: 8px;
  height: 8px;
  margin: 0;
  border: 0 solid;
  border-width: 1px 1px 0 0;
  border-color: var(--header-color-rich-black);
  opacity: 1;
  visibility: visible;
  content: "";
}

.minconf.responsive.header-top .header-tab > .on > a::before {
  box-shadow: -3px 0 0 0 currentColor inset;
}


/* END SP ++++++++++++++++++++++++++++++++++++++++ */
}

/* faq.click-sec.com (PC) */
#okw_contents_inner {
  margin-top: -34px;
  padding-top: 0;
}



/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
/* footer-bottom responsive
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.responsive.footer-bottom {
  display: block;
  min-width: auto;
  margin: 0;
}

/* ++++++++++++++++++++++++++++++++++++++++
 * new2022 default module
 * ++++++++++++++++++++++++++++++++++++++++ */
/* footer-links (corp only)
++++++++++++++++++++++++++++++++++++++++ */
.footer-links {
  padding: 24px 0;
  color: #0a1f33;
  color: var(--header-color-rich-black);
  /* background-color: var(--header-color-light-gray); *//* corp */
}
.footer-links > [type="checkbox"] {
  position: absolute;
  z-index: -2;
  opacity: 0.001;
}

.footer-links > label,
.footer-links > ul {
  display: block;
  max-width: 1224px;/* corp */
  margin: auto;
  margin-top: -1px;
  background-color: #fff;
  box-shadow: 0 0 0 1px var(--header-color-border-line) inset;
}
.footer-links > label {
  position: relative;
  padding: 12px 24px;
  border-radius: 3px 3px 0 0;
  font-size: 15px;
  line-height: 1.6;
  cursor: pointer;
}
.footer-links > label::after {
  position: absolute;
  top: 16px;
  right: 20px;
  bottom: auto;
  width: 16px;
  height: 17px;
  background: var(--header-color-rich-black);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-image: var(--header-svg-icon-arrow-close);
  mask-image: var(--header-svg-icon-arrow-close);
  content: "";
}

.footer-links > ul {
  overflow: hidden;
  padding: 8px 16px;
  border-radius: 0 0 3px 3px;
  font-size: 14px;
  line-height: 1.572;
  transition: opacity 0.2s ease;
}

.footer-links li > a {
  position: relative;
  display: block;
  padding: 13px 20px 13px 28px;
  color: inherit;
  text-decoration: none;
  transition: all 0.2s ease, color 0.1s ease;
}
.footer-links li:not(:last-child) > a {
  box-shadow: 0 -1px 0 0 var(--header-color-border-line) inset;
}
.footer-links li > a::before {
  position: absolute;
  top: 22px;
  right: auto;
  bottom: auto;
  left: 9px;
  display: block;
  width: 7px;
  height: 4px;
  background: var(--header-color-border-line);
  opacity: 1;
  content: "";
  transition: opacity 0.1s ease;
}
.footer-links li > a::after {
  position: absolute;
  top: 16px;
  right: 4px;
  bottom: auto;
  width: 16px;
  height: 17px;
  background: var(--header-color-rich-black);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-image: var(--header-svg-icon-arrow-link);
  mask-image: var(--header-svg-icon-arrow-link);
  content: "";
}

/* close */
.footer-links > input:not(:checked) ~ label {
  border-radius: 3px;
}
.footer-links > input:not(:checked) ~ label::after {
  -webkit-mask-image: var(--header-svg-icon-arrow-open);
  mask-image: var(--header-svg-icon-arrow-open);
}
.footer-links > input:not(:checked) ~ ul {
  padding-top: 0;
  padding-bottom: 0;
  opacity: 1;
}
.footer-links > input:not(:checked) ~ ul a {
  padding-top: 0;
  padding-bottom: 0;
  color: rgba(0,0,0,0);
  line-height: 0;
}
.footer-links > input:not(:checked) ~ ul a::before,
.footer-links > input:not(:checked) ~ ul a::after {
  opacity: 0;
}

@media (hover: hover) {
  .footer-links > label:hover {
    background-color: #eaf4f8;
    color: #005bac;
  }
  .footer-links li > a:hover {
    color: #005bac;
    text-decoration: underline;
  }
}


/* footer-sns (old)
++++++++++++++++++++++++++++++++++++++++ */
.footer-sns {
  display: flex;
  margin: 0 auto 20px;
  padding: 0;
  font-size: 12px;
}
.footer-sns > li + li {
  margin-left: 24px;
}

.footer-sns > li > a {
  position: relative;
  display: block;
  width: 32px;
  height: 32px;
  background: #d9d9d9;
  -webkit-mask-size: 24px 24px;
  mask-size: 24px 24px;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 200%;
}
.footer-sns > li > [href*="facebook"] {
  -webkit-mask-size: 28px;
  mask-size: 28px;
  -webkit-mask-image: var(--footer-svg-icon-facebook);
  mask-image: var(--footer-svg-icon-facebook);
}
.footer-sns > li > [href*="twitter"] {
  -webkit-mask-size: 20px;
  mask-size: 20px;
  -webkit-mask-image: var(--footer-svg-icon-twitter);
  mask-image: var(--footer-svg-icon-twitter);
}
.footer-sns > li > [href*="youtube"] {
  mask-size: 27px;
  -webkit-mask-image: var(--footer-svg-icon-youtube);
  mask-image: var(--footer-svg-icon-youtube);
}
.footer-sns > li > [href*="lin"] {
  -webkit-mask-image: var(--footer-svg-icon-line);
  mask-image: var(--footer-svg-icon-line);
}

@media (hover: hover) {
  .footer-sns > li > a:hover {
    opacity: 0.7;
  }
}


/* ++++++++++++++++++++++++++++++++++++++++
 * for SP
 * ++++++++++++++++++++++++++++++++++++++++ */
@media (max-width: 767.98px) {
/* ++++++++++++++++++++++++++++++++++++++++ */
.responsive.footer-bottom {
  overflow: hidden;
  -webkit-tap-highlight-color: rgba(255,255,255,0.1);
}
.responsive .footer-contents {
  width: auto;
  padding-right: 0;
  padding-left: 0;
}

/* footer-links (corp only)
++++++++++++++++++++++++++++++++++++++++ */
.responsive .footer-links {
  padding: 0;
  -webkit-tap-highlight-color: rgba(0,0,0,0.1);
}
.responsive .footer-links > label {
  margin-top: 0;
  border-radius: 0;
  box-shadow: 0 1px 0 0 var(--header-color-border-line) inset;
  font-size: 14px;
  line-height: 1.714;
}
.responsive .footer-links > ul {
  margin-top: 0;
  border-radius: 0;
  background-repeat: no-repeat;
  background-size: calc(100% - 16px * 2) 1px;
  background-position: center top;
  background-image: linear-gradient(var(--header-color-border-line), var(--header-color-border-line));
  box-shadow: none;
  font-size: 13px;
  line-height: 1.714;
}


/* footer-menu
++++++++++++++++++++++++++++++++++++++++ */
.responsive .footer-menu {
  margin-top: -24px;
  margin-bottom: 16px;
}

.responsive .footer-menu > label {
  position: relative;
  display: block;
  padding: 12px 24px;
  font-size: 14px;
  line-height: 1.714;
  cursor: pointer;
}
.responsive .footer-menu > label::after {
  position: absolute;
  top: 16px;
  right: 20px;
  bottom: auto;
  width: 16px;
  height: 17px;
  background: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-image: var(--header-svg-icon-arrow-close);
  mask-image: var(--header-svg-icon-arrow-close);
  content: "";
}

.responsive .footer-menu > ul {
  display: block;
  padding: 8px 16px;
  border-bottom: 1px solid var(--footer-color-bdc);
  background-repeat: no-repeat;
  background-size: calc(100% - 16px * 2) 1px;
  background-position: center top;
  background-image: linear-gradient(var(--footer-color-bdc), var(--footer-color-bdc));
  font-size: 13px;
  line-height: 1.714;
  transition: opacity 0.2s ease;
}

.responsive .footer-menu li + li {
  margin-left: 0;
}

.responsive .footer-menu li > a {
  position: relative;
  display: block;
  padding: 13px 20px 13px 28px;
  color: inherit;
  text-decoration: none;
  transition: all 0.2s ease, color 0.1s ease;
}
.responsive .footer-menu li:not(:last-child) > a {
  box-shadow: 0 -1px 0 0 var(--footer-color-bdc) inset;
}
.responsive .footer-menu li > a::before {
  position: absolute;
  top: 22px;
  right: auto;
  bottom: auto;
  left: 9px;
  display: block;
  width: 7px;
  height: 4px;
  background: var(--footer-color-bdc);
  opacity: 1;
  content: "";
  transition: opacity 0.1s ease;
}

.responsive .footer-menu li > a::after {
  position: absolute;
  top: 16px;
  right: 4px;
  bottom: auto;
  width: 16px;
  height: 17px;
  background: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  -webkit-mask-image: var(--header-svg-icon-arrow-link);
  mask-image: var(--header-svg-icon-arrow-link);
  content: "";
}

/* close */
.responsive .footer-menu > input:not(:checked) ~ label {
  border-radius: 3px;
}
.responsive .footer-menu > input:not(:checked) ~ label::before {
  background-color: transparent;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4) inset;
}
.responsive .footer-menu > input:not(:checked) ~ label::after {
  -webkit-mask-image: var(--header-svg-icon-arrow-open);
  mask-image: var(--header-svg-icon-arrow-open);
}
.responsive .footer-menu > input:not(:checked) ~ ul {
  padding-top: 0;
  padding-bottom: 0;
  background: none;
  opacity: 1;
}
.responsive .footer-menu > input:not(:checked) ~ ul a {
  padding-top: 0;
  padding-bottom: 0;
  color: rgba(0,0,0,0);
  line-height: 0;
}
.responsive .footer-menu > input:not(:checked) ~ ul a::before,
.responsive .footer-menu > input:not(:checked) ~ ul a::after {
  opacity: 0;
}


/* footer-author
++++++++++++++++++++++++++++++++++++++++ */
.responsive .footer-author {
  padding: 0 14px;
  box-shadow: none;
}
.responsive .footer-author > small {
  display: block;
  text-align: inherit;
}

/* footer-sns (old)
++++++++++++++++++++++++++++++++++++++++ */
.responsive .footer-sns {
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 16px;
}

.responsive .footer-sns > li > a {
  width: 44px;
  height: 44px;
  margin: 0 2px;
}
.responsive .footer-sns > li + li {
  margin-left: 0;
}

/* footer-seal (old)
++++++++++++++++++++++++++++++++++++++++ */
.responsive .footer-seal {
  position: relative;
  width: auto;
}
.responsive .footer-seal-wrap {
  display: flex;
  justify-content: center;
  position: static;
  margin: 48px auto 0;
  width: 310px;
  flex-wrap: wrap;
  justify-content: center;
}
/* old */
.responsive .footer-seal-inner {
  position: static;
  bottom: auto;
  right: auto;
  margin: 48px auto 0;
}

/* END SP ++++++++++++++++++++++++++++++++++++++++ */
}