@charset "UTF-8";
@import url("//fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&display=swap");
@import url("//fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap");
@import url("//fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;400;600&display=swap");
html {
    scroll-behavior: smooth;
}

body {
    font-family: Lato, "Noto Sans JP", "Hiragino Sans",
        "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    font-weight: 400;
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@media (max-width: 768px) {
    body {
        font-size: 14px;
    }
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600;
}

h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
    margin-top: 0;
}

h2 {
    margin: 2.5em 0 1em;
    font-size: 28px;
}

@media (max-width: 768px) {
    h2 {
        font-size: 20px;
    }
}

h3 {
    margin: 3em 0 0.5em;
}

h4 {
    margin: 2em 0 0.5em;
}

h5 {
    margin: 1em 0 0.5em;
    font-size: 1rem;
}

p {
    line-height: 1.5;
}

div p:last-child {
    margin-bottom: 0;
}

b,
strong {
    font-weight: 600;
}

img {
    max-width: 100%;
}

ul li::marker,
ol li::marker {
    color: #909090;
    margin-right: 0.5em;
}
ul, ol {
  margin: 1em 0;
  padding-inline-start: 0;
}
ul li {
  list-style: none;
}
ol li {
  list-style: decimal;
  margin-left: 2em;
}

a {
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
}

caption {
    caption-side: top;
    padding: 0.5em 0;
    color: #333;
}

hr {
    margin: 3em 0;
    border: solid 1px #eee;
}

@media (max-width: 768px) {
    hr {
        margin: 40px 0;
    }
}

iframe {
    border: none;
}

/* global-header
----------------------------------------------- */
.global-header {
    width: 100%;
    top: 0;
    background: rgba(255, 255, 255, 0.9);
    z-index: 20;
    padding: 10px 10px 0;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-font-feature-settings: "palt";
    font-feature-settings: "palt";
}

.global-header a {
    color: #333;
    text-decoration: none;
}

.global-header ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
}

@media (max-width: 1024px) {
    .global-header {
        padding: 0;
    }
}

.global-header.fixed {
    position: fixed;
    -webkit-animation: framein 0.5s ease 0s 1 alternate;
    animation: framein 0.5s ease 0s 1 alternate;
    padding: 0;
}

@media (min-width: 1025px) {
    .global-header.fixed .global-header-inner {
        height: 70px;
    }
    .global-header.fixed .global-header-navi-sub {
        display: none;
    }
}

@-webkit-keyframes framein {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

@keyframes framein {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    100% {
        -webkit-transform: translateY(0%);
        transform: translateY(0%);
    }
}

.global-header-inner {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 1200px;
    min-width: 1000px;
    height: 100px;
    margin: auto;
}

@media (max-width: 1024px) {
    .global-header-inner {
        min-width: 0;
        height: 60px;
        padding: 0 10px;
    }
}

@media (max-width: 1024px) {
    .global-header-logo img {
        width: 160px;
    }
}

.global-header-navi {
    font-size: 14px;
    font-weight: 500;
}

.global-header-navi ul {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.global-header-navi li {
    margin: 0;
}

.global-header-navi a {
    display: block;
    padding: 0.3em 1em;
    -webkit-transition: color 0.2s ease;
    transition: color 0.2s ease;
}

.global-header-navi a:hover {
    color: #4A2087;
}

@media (max-width: 1200px) {
    .global-header-navi a {
        padding: 0.3em 0.75em;
    }
}

.global-header-navi .en {
    font-weight: 600;
}

@media (max-width: 1024px) {
  .global-header-navi {
    padding: 5px 0;
    border-top: solid 1px #eee;
  }
}

.global-header-navi-sub {
    position: absolute;
    top: 4px;
    right: 5px;
    font-size: 14px;
}

.global-header-navi-sub > ul > li {
    margin: 0;
    padding: 0 1em;
    line-height: 1;
}

.global-header-navi-sub > ul > li:not(:first-child) {
    border-left: solid 1px #ddd;
}

.global-header-navi-sub a {
    -webkit-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
}

.global-header-navi-sub a:hover {
    opacity: 0.7;
}

.global-header-navi-sub .logout {
    display: none;
}

@media (max-width: 1024px) {
  .global-header-navi-sub {
    position: static;
    padding: 5px 0;
    border-top: solid 1px #eee;
  }
  .global-header-navi-sub > ul > li:not(:first-child) {
    border-left: none;
  }
  .global-header-navi-sub .logout {
    display: block;
    width: 100%;
    margin-top: 5px;
    padding-top: 5px;
    border-top: solid 1px #eee;
  }
  .global-header-navi-sub .logout a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .global-header-navi-sub .logout a:before {
    content: "\f2f5";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    font-size: 1.25em;
    margin-right: 5px;
  }
}

.global-header-signon li {
    margin: 5px;
}

.global-header-signon .login a {
    width: 120px;
    font-size: 14px;
}

.global-header-signon .regist a {
    width: 130px;
    font-size: 14px;
}

@media (max-width: 1024px) {
    .global-header-signon {
        margin-left: auto;
    }
    .global-header-signon .login .btn-wire {
        width: auto;
        font-size: 12px;
        height: 40px;
    }
    .global-header-signon .regist {
        display: none;
    }
}

.global-header-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: auto;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

@media (max-width: 1024px) {
    .global-header-menu {
        display: block;
        position: absolute;
        top: 60px;
        left: 0;
        width: 100vw;
        height: 100vh;
        padding: 0;
        background: #fff;
        z-index: -1;
        opacity: 0;
        pointer-events: none;
    }
    .global-header-menu a {
        display: block;
        text-align: center;
        font-size: 16px;
        font-weight: 400;
        padding: 16px 0;
    }
    .global-header-menu ul {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }
    .global-header-menu li {
      width: 50%;
      line-height: 1.5 !important;
    }
}

@media (max-width: 1024px) {
    .global-header-menu.active,
    .global-header-menu[active] {
      top: 60px;
      opacity: 1;
      z-index: 100;
      pointer-events: auto;
    }
}

.global-header-menu-toggle {
    display: none;
}

@media (max-width: 1024px) {
    .global-header-menu-toggle {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 40px;
        height: 40px;
        background: #4A2087;
        cursor: pointer;
    }
}

.toggle-icon {
    position: relative;
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.toggle-icon .toggle-icon-obj {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    position: absolute;
    width: 20px;
    height: 2px;
}

.toggle-icon .toggle-icon-obj:nth-child(1) {
    top: 2px;
}

.toggle-icon .toggle-icon-obj:nth-child(2) {
    top: 9px;
}

.toggle-icon .toggle-icon-obj:nth-child(3) {
    bottom: 2px;
}

.toggle-icon .toggle-icon-obj:before,
.toggle-icon .toggle-icon-obj:after {
    display: block;
    content: "";
    border-radius: 2px;
    background: #fff;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
}

.toggle-icon .toggle-icon-obj:before {
    width: 2px;
    height: 2px;
}

.toggle-icon .toggle-icon-obj:after {
    width: 15px;
    height: 2px;
}

[active] .toggle-icon .toggle-icon-obj {
    width: 20px;
    height: 2px;
    border-radius: 2px;
    background: #fff;
}

[active] .toggle-icon .toggle-icon-obj:nth-child(1) {
    top: 9px;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

[active] .toggle-icon .toggle-icon-obj:nth-child(2) {
    display: none;
}

[active] .toggle-icon .toggle-icon-obj:nth-child(3) {
    top: 9px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

[active] .toggle-icon .toggle-icon-obj:before,
[active] .toggle-icon .toggle-icon-obj:after {
    display: none;
}

.flashnews {
    margin: 40px 0 0;
    padding: 0 10px;
}

@media (max-width: 1024px) {
    .flashnews {
        margin: 20px 0 0;
    }
}

.flashnews-inner {
    max-width: 1000px;
    margin: 0 auto;
    padding: 8px;
    background: #999;
    color: #fff;
    border-radius: 4px;
    line-height: 1;
}

/* wrapper
コンテンツ枠のスタイル定義
----------------------------------------------- */
main > section {
    padding: 80px 10px;
}

@media (max-width: 768px) {
    main > section {
        padding: 40px 10px;
    }
}

.contents-wrapper {
    border-top: solid 1px #ddd;
    padding: 80px 10px;
    clear: both;
}

.imgcover + .contents-wrapper,
.contents-header + .contents-wrapper,
.page-title + .contents-wrapper {
    border-top: none;
}

@media (max-width: 768px) {
    .contents-wrapper {
        padding: 40px 10px;
    }
}

.contents-inner,
.main_col {
    max-width: 1000px;
    margin: auto;
}

@media (min-width: 769px) {
    .contents-center {
        text-align: center;
    }
}

.section-title {
    font-size: 32px;
    margin: 0 0 1em;
}

@media (max-width: 768px) {
    .section-title {
        font-size: 24px;
    }
}

.section-border {
    border-top: solid 1px #eee;
}

/* contents-header
----------------------------------------------- */
.contents-header,
.page-title {
    background: #4A2087;
    padding: 0 10px;
    color: #fff;
}

.contents-header-inner,
.page-title h1 {
    position: relative;
    max-width: 1200px;
    margin: auto;
}

.contents-header-inner h1,
.page-title h1 h1,
.contents-header-inner .contents-header-title,
.page-title h1 .contents-header-title {
    display: inline-block;
    line-height: 1.25;
    margin: 0;
    padding: 20px 0;
    font-size: 32px;
    font-weight: 600;
}

.contents-header-inner h1 font,
.page-title h1 h1 font,
.contents-header-inner .contents-header-title font,
.page-title h1 .contents-header-title font {
    color: #fff !important;
}

@media (max-width: 768px) {
    .contents-header-inner,
    .page-title h1 {
        min-width: 0;
    }
    .contents-header-inner h1,
    .page-title h1 h1,
    .contents-header-inner .contents-header-title,
    .page-title h1 .contents-header-title {
        padding: 13px 0;
        font-size: 20px;
    }
}

/* 画像背景カバー
----------------------------------------------- */
.imgcover {
    background-size: cover;
    background-position: center;
    background-color: #4A2087;
}

.imgcover-inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 1200px;
    height: 400px;
    margin: auto;
    padding: 0 10px;
    text-align: center;
    color: #fff;
}

@media (max-width: 768px) {
    .imgcover-inner {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        height: auto;
        padding: 20px 10px;
    }
}

.imgcover-title {
    font-size: 40px;
    margin: 0;
}

@media (max-width: 768px) {
    .imgcover-title {
        font-size: 24px;
    }
}

/* 汎用タイトル
----------------------------------------------- */
.title-aside {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1em;
}

.title-aside h3 {
    display: inline-block;
    font-size: 24px;
    margin: 0;
}

.title-aside aside {
    position: relative;
    display: inline-block;
    padding-left: 35px;
}

.title-aside aside:before {
    position: absolute;
    top: 50%;
    left: 10px;
    display: inline-block;
    content: "";
    width: 15px;
    height: 1px;
    background: #333;
}

@media (max-width: 768px) {
    .title-aside {
        display: block;
    }
    .title-aside h3 {
        font-size: 18px;
    }
    .title-aside aside {
        padding-left: 0;
    }
    .title-aside aside:before {
        display: none;
    }
}

/* index-feature
トップページ「クラウドクレジットが選ばれる理由」
----------------------------------------------- */
.index-feature ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 40px 0;
    padding: 0;
}

.index-feature li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    list-style: none;
    width: 33.333%;
    padding: 0 20px;
}

.index-feature li:not(:first-child) {
    border-left: solid 1px #eee;
}

.index-feature figure {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 80px;
}

.index-feature h3 {
    font-size: 24px;
    margin: 0 0 1em;
}

.index-feature p {
    text-align: left;
}

@media (max-width: 768px) {
    .index-feature ul {
        display: block;
        margin: 0;
    }
    .index-feature li {
        position: relative;
        display: block;
        width: 100%;
        padding: 20px 0 20px 80px;
        clear: both;
    }
    .index-feature li:not(:first-child) {
        border-left: none;
        border-top: solid 1px #eee;
    }
    .index-feature figure {
        position: absolute;
        left: 0;
        display: inline-block;
        width: 64px;
        text-align: center;
    }
    .index-feature figure img {
        max-width: 64px;
    }
    .index-feature h3 {
        font-size: 16px;
        margin-bottom: 8px;
    }
    .index-feature p {
        margin: 0;
    }
}

.index-feature-rate {
    display: inline-block;
    color: #4A2087;
    font-weight: 900;
}

.index-feature-rate span:nth-of-type(1) {
    font-size: 32px;
}

.index-feature-rate span:nth-of-type(2) {
    font-size: 48px;
}

@media (max-width: 768px) {
    .index-feature-rate span {
        display: block;
        text-align: left;
        line-height: 1;
    }
    .index-feature-rate span:nth-of-type(1) {
        font-size: 18px;
    }
    .index-feature-rate span:nth-of-type(2) {
        font-size: 24px;
    }
}

/* index-performance
トップページ「クラウドクレジットが選ばれる理由」
----------------------------------------------- */
.index-performance {
    background: #fff;
    margin-top: 40px;
    padding: 0 30px;
    text-align: left;
}

.index-performance > div {
    padding: 30px 0;
}

.index-performance > div:not(:first-child) {
    border-top: solid 1px #ddd;
}

.index-performance h3 {
    font-size: 18px;
    margin-bottom: 1em;
}

@media (max-width: 768px) {
    .index-performance {
        margin-top: 20px;
        padding: 0 10px;
    }
    .index-performance > div {
        padding: 20px 0;
    }
    .index-performance > div:last-child {
        padding-bottom: 10px;
    }
    .index-performance h3 {
        font-size: 1rem;
    }
}

.index-performance-total {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    line-height: 1;
}

.index-performance-total h3 {
    margin: 0;
}

.index-performance-total .num {
    font-size: 80px;
    color: #4A2087;
    text-align: right;
}

@media (max-width: 768px) {
    .index-performance-total {
        display: block;
    }
    .index-performance-total h3 {
        margin-bottom: 1em;
    }
    .index-performance-total .num {
        font-size: 40px;
    }
}

.index-performance-yield {
    padding: 24px 16px;
    border-bottom: 1px solid #dbdbdb;
}

.index-performance-yield-graph-pict {
    min-width: 300px;
    min-height: 300px;
}

.index-performance-operation-graph {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

@media (max-width: 768px) {
    .index-performance-operation-graph {
        display: block;
    }
}

.index-performance-operation-graph-pict {
    width: 300px;
    height: 300px;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.index-performance-operation-graph-legend {
    padding-left: 20px;
}

.index-performance-operation-graph-legend dl {
    width: 100%;
    margin-bottom: 8px;
    white-space: nowrap;
    overflow: hidden;
}

.index-performance-operation-graph-legend dt {
    display: inline-block;
    width: 24px;
    height: 24px;
    line-height: 24px;
    font-weight: 600;
    text-align: center;
    color: #fff;
}

.index-performance-operation-graph-legend dd {
    display: inline-block;
    margin: 0;
}

.index-performance-operation-graph-legend .per {
    width: 3.5em;
    margin-right: 1em;
    font-size: 16px;
    font-weight: 600;
    text-align: right;
}

.index-performance-operation-graph-legend dl:nth-of-type(1) dt {
    background: #2f98e8;
}

.index-performance-operation-graph-legend dl:nth-of-type(2) dt {
    background: #42b8b8;
}

.index-performance-operation-graph-legend dl:nth-of-type(3) dt {
    background: #ffc64c;
}

.index-performance-operation-graph-legend dl:nth-of-type(4) dt {
    background: #ff9438;
}

.index-performance-operation-graph-legend dl:nth-of-type(5) dt {
    background: #ff5879;
}
.index-performance-operation-graph-legend dl:nth-of-type(6) dt {
    background: #5b5b5b;
}

@media (max-width: 768px) {
    .index-performance-operation-graph-legend {
        padding-left: 0;
    }
    .index-performance-operation-graph-legend dl {
        font-size: 12px;
        margin-bottom: 4px;
    }
    .index-performance-operation-graph-legend dt {
        width: 18px;
        height: 18px;
        line-height: 18px;
    }
    .index-performance-operation-graph-legend .per {
        font-size: 14px;
        margin-right: 0.7em;
    }
}

.performance-score .index-performance-operation-graph {
  display: block;
}
.index-performance-operation-graph-legend.flexsup {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: space-around;
  padding: 0;
}
.index-performance-operation-graph-legend.flexsup dl {
  width: auto;
}

.index-performance-numbers {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    text-align: center;
}

.index-performance-numbers h3 {
    font-size: 1rem;
}

.index-performance-numbers p {
    margin: 0;
}

.index-performance-numbers .num {
    font-size: 56px;
    line-height: 1;
}

@media (max-width: 768px) {
    .index-performance-numbers h3 {
        font-size: 12px;
        margin-bottom: 0.5em;
    }
    .index-performance-numbers p {
        font-size: 10px;
    }
    .index-performance-numbers .num {
        font-size: 24px;
    }
}

.index-performance-btns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 30px;
}

.index-performance-btns div {
    width: 49%;
}

.index-performance-btns a {
    width: 100%;
}

@media (max-width: 1024px) {
    .index-performance-btns {
        display: block;
    }
    .index-performance-btns div {
        width: 100%;
    }
    .index-performance-btns div:not(:first-child) {
        margin-top: 10px;
    }
}

.simple-disclaimer {
    margin: 1em 0;
    -webkit-padding-start: 2rem;
    padding-inline-start: 2rem;
    font-size: 0.75rem;
    color: #909090;
}
.simple-disclaimer li {
    list-style-type: disc;
}


.operation-result-legend td {
    text-align: right;
}

.operation-result-legend thead th {
    font-size: 0.875rem;
    font-weight: 400;
    text-align: center;
}

.operation-result-legend tbody tr {
    border-bottom: solid 1px #eee;
}

.operation-result-legend tbody th, .operation-result-legend tbody td {
    padding: 4px 0;
    white-space: nowrap;
}

.operation-result-legend .total {
    border-bottom: solid 3px #eee;
}

.operation-result-legend .total td {
    padding-left: 2em;
    font-size: 1.25rem;
    font-weight: 600;
}

.operation-result-legend .legend0 td {
    font-weight: 600;
}

@media (max-width: 768px) {
    .operation-result-legend th {
        white-space: nowrap;
    }
    .operation-result-legend thead th {
        font-size: 0.725rem;
    }
    .operation-result-legend .total td {
        font-size: 1em;
    }
}

/* index-fundpackage-list, index-fund-list
トップページのファンドリスト周り
----------------------------------------------- */
.index-fundpackage-list {
    margin-bottom: 60px;
}

.index-fundpackage-list .fundpackage-list {
    margin-bottom: 30px;
}

.index-fund-list .fundcards {
    margin-bottom: 30px;
}

/* .fundcards : ファンドカード表示
----------------------------------------------- */
.fundcards {
    max-width: calc((320px + 8px * 2) * 3);
    margin: 0 auto;
    padding: 0;
}

.fundcards a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    color: #333;
    text-decoration: none;
}

.fundcards > li,
.fundcards .card {
    width: 320px;
    list-style: none;
}

.fundcards .card {
    margin-bottom: 20px;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.fundcards .card:hover {
    -webkit-box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
}

@media (max-width: 1024px) {
    .fundcards .card {
        width: 49%;
        margin-right: 0;
        margin-left: 0;
    }
}

@media (max-width: 768px) {
    .fundcards .card {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
    }
}

.fundcard-thumbnail {
    background-size: cover;
    background-repeat: no-repeat;
    overflow: hidden;
    position: relative;
    width: 100%;
    padding: 40% 0 0;
    border-radius: 4px 4px 0 0;
    background-image: url("/img/fund/fund_default-thumbnail.jpg");
    background-color: #f9f9f9;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.fundcard-remain {
    position: absolute;
    top: 8px;
    width: 140px;
    text-align: center;
    color: #fff;
    padding: 4px 0;
    background-color: #4A2087;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    font-size: 18px;
    font-weight: bold;
    line-height: 24px;
}

.fundcard-overview {
    padding: 12px 16px;
}

@media (max-width: 768px) {
    .fundcard-overview {
        padding: 10px;
    }
}

.fundcard-title {
    padding-bottom: 10px;
    font-size: 18px;
    font-weight: 700;
    font-style: normal;
    line-height: 24px;
    overflow: hidden;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.fundcard-features {
    padding: 0;
}

.fundcard-features li {
    display: inline-block;
    list-style: none;
    font-size: 13px;
    font-weight: bold;
    line-height: 18px;
    padding: 2px 4px;
    border-radius: 4px;
    background: #ddd;
}

.fundcard-features .fundcard-features-element {
    background: #4A2087;
    color: #fff;
}

.fundcard-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 8px 0;
    margin: auto 16px 0;
    border-top: 1px solid #eee;
}

.fundcard-info dl {
    width: 100%;
    margin: 0;
}

.fundcard-info dt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 3em;
    font-size: 12px;
    text-align: center;
}

.fundcard-info dt small {
    display: block;
    font-size: 10px;
}

.fundcard-info dd {
    margin: 0;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
}

.fundcard-info dd small {
    font-size: 0.7em;
    margin: 0 0.15em;
}

@media (max-width: 768px) {
    .fundcard-info {
        margin: auto 10px 0;
    }
}

.fundcard-progress {
    padding: 0 16px 16px;
}

.fundcard-progress .progress-detail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 1em;
}

/* fundpackage-list
-----------------------------------------------	*/
.fundpackage-list {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0;
}

.fundpackage-item {
    position: relative;
    background-color: #fff;
    border-radius: 4px;
    border: solid 1px #eee;
    -webkit-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    margin: 20px 0;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.fundpackage-item:hover {
    background-color: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.1);
    position: relative;
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
}

.fundpackage-item a {
    display: block;
    color: #333;
}

.fundpackage-item a:hover {
    opacity: 0.6;
    text-decoration: none;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
}

.fundpackage-item-link,
.fundpackage-item-wrap,
.fundpackage-info-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    position: relative;
    text-decoration: none;
    color: #525252;
}

.fundpackage-item-img,
.fundpackage-info-img {
    width: 100%;
    min-height: 230px;
    -webkit-box-flex: 0;
    -ms-flex: 0 320px;
    flex: 0 320px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
    bottom: 0;
}

.fundpackage-item-remaining {
    position: absolute;
    top: 16px;
    left: 0;
    width: 140px;
    text-align: center;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    padding: 4px 0;
    background-color: #4A2087;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}

.fundpackage-item-detail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 16px;
}

.fundpackage-item-title {
    width: 100%;
    line-height: 1;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}

.fundpackage-item-title h2 {
    font-size: 24px;
    margin: 0 0 10px;
}

.fundpackage-item-description {
    font-size: 14px;
    line-height: 1.5;
}

.fundpackage-item-data {
    display: -ms-grid;
    display: grid;
    -ms-grid-rows: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    -ms-grid-columns: 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    width: 100%;
    text-align: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.fundpackage-item-data > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 8px;
    height: 100%;
}

.fundpackage-item-rate {
    -ms-grid-column: 1;
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    grid-row: 1/3;
}

.fundpackage-item-rate .fundpackage-item-label {
    height: 32px;
}

.fundpackage-item-term {
    -ms-grid-column: 2;
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    grid-row: 1/3;
}

.fundpackage-item-term .fundpackage-item-label {
    height: 32px;
}

.fundpackage-item-unit {
    -ms-grid-column: 3;
    -ms-grid-row: 1;
    border-bottom: 1px solid #eee;
    -ms-grid-column-span: 1;
    grid-column: 3/4;
}

.fundpackage-item-number {
    -ms-grid-column: 4;
    -ms-grid-row: 1;
    border-bottom: 1px solid #eee;
    -ms-grid-column-span: 1;
    grid-column: 4/5;
}

.fundpackage-item-country {
    -ms-grid-column: 3;
    -ms-grid-row: 2;
    -ms-grid-column-span: 1;
    grid-column: 3/4;
}

.fundpackage-item-currency {
    -ms-grid-column: 4;
    -ms-grid-row: 2;
    -ms-grid-column-span: 1;
    grid-column: 4/5;
}

.fundpackage-item-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 12px;
    margin-bottom: 8px;
}

.fundpackage-item-txt {
    font-size: 14px;
    font-weight: 700;
}

.fundpackage-item-rate .fundpackage-item-txt,
.fundpackage-item-term .fundpackage-item-txt {
    font-size: 32px;
}

@media (max-width: 768px) {
    .fundpackage-item-rate .fundpackage-item-txt,
    .fundpackage-item-term .fundpackage-item-txt {
        font-size: 24px;
    }
}

.fundpackage-span {
    text-align: right;
    font-size: 12px;
}

.progress,
.progress-bar,
.progress-success {
    width: 100%;
    height: 24px;
    border-radius: 24px;
}

.progress {
    position: relative;
    background-color: #e0e0e0;
    overflow: hidden;
}

.progress-bar {
    background: -webkit-gradient(
        linear,
        left top,
        right top,
        from(rgb(119, 76, 183)),
        to(rgb(74, 32, 135))
    );
    background: linear-gradient(90deg, rgb(119, 76, 183), rgb(74, 32, 135));
}

.progress-success {
    background-color: #15b6e5;
}

.progress-detail {
    position: absolute;
    top: 0;
    width: 100%;
    line-height: 24px;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    color: #fff;
    text-shadow: 0 0 4px #000;
}

.progress-detail .icon-help-white {
    vertical-align: middle;
}

@media only screen and (max-width: 768px) {
    .fundpackage-item-link,
    .fundpackage-item-wrap {
        display: block;
    }
    .fundpackage-item-img {
        width: 100%;
        height: 140px;
        min-height: 0;
    }
    .fundpackage-item-detail {
        padding: 16px;
    }
    .fundpackage-item-title h2 {
        font-size: 18px;
    }
    .fundpackage-item-title p {
        margin: 0;
    }
    .fundpackage-item-data {
        -ms-grid-rows: 1fr;
        grid-template-rows: 1fr;
        -ms-grid-columns: 1fr 1fr;
        grid-template-columns: 1fr 1fr;
    }
    .fundpackage-item-data > div {
        grid-row: auto;
        grid-column: auto;
    }
    .fundpackage-item-rate,
    .fundpackage-item-term {
        border-bottom: 1px solid #eee;
    }
}

.fundpackage-info-detail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-left: 24px;
}

.fundpackage-info-description {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 16px;
}

.fundpackage-info-img {
    border-radius: 4px;
    -webkit-box-flex: 0;
    -ms-flex: 0 40%;
    flex: 0 40%;
}

.fundpackage-info-data {
    display: -ms-grid;
    display: grid;
    -ms-grid-rows: 1fr;
    grid-template-rows: 1fr;
    -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    width: 100%;
    text-align: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.fundpackage-info-data > div {
    padding: 8px;
    height: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.fundpackage-info-rate,
.fundpackage-info-term,
.fundpackage-info-unit,
.fundpackage-info-fee,
.fundpackage-info-fee-rate {
    border-bottom: 1px solid #eee;
}

.fundpackage-info-rate {
    -ms-grid-column: 1;
    -ms-grid-row: 1;
    -ms-grid-column-span: 3;
    grid-column: 1/4;
}

.fundpackage-info-term {
    -ms-grid-column: 4;
    -ms-grid-row: 1;
    -ms-grid-column-span: 3;
    grid-column: 4/7;
}

.fundpackage-info-unit {
    -ms-grid-column: 1;
    -ms-grid-row: 2;
    -ms-grid-column-span: 2;
    grid-column: 1/3;
}

.fundpackage-info-fee {
    -ms-grid-column: 3;
    -ms-grid-row: 2;
    -ms-grid-column-span: 2;
    grid-column: 3/5;
}

.fundpackage-info-fee-rate {
    -ms-grid-column: 5;
    -ms-grid-row: 2;
    -ms-grid-column-span: 2;
    grid-column: 5/7;
}

.fundpackage-info-number {
    -ms-grid-column: 1;
    -ms-grid-row: 3;
    -ms-grid-column-span: 2;
    grid-column: 1/3;
}

.fundpackage-info-country {
    -ms-grid-column: 3;
    -ms-grid-row: 3;
    -ms-grid-column-span: 2;
    grid-column: 3/5;
}

.fundpackage-info-currency {
    -ms-grid-column: 5;
    -ms-grid-row: 3;
    -ms-grid-column-span: 2;
    grid-column: 5/7;
}

.fundpackage-info-label {
    font-size: 12px;
    margin-bottom: 8px;
}

.fundpackage-info-txt {
    font-size: 14px;
    font-weight: 700;
}

.fundpackage-info-rate .fundpackage-info-txt,
.fundpackage-info-term .fundpackage-info-txt {
    font-size: 32px;
}

@media only screen and (max-width: 768px) {
    .fundpackage-info-wrap {
        display: block;
    }
    .fundpackage-info-img {
        width: 100%;
        height: 130px;
    }
    .fundpackage-info-detail {
        padding: 0;
    }
}

.fundpackage-items thead th {
    text-align: left;
}

.fundpackage-items tbody th {
    text-align: left;
}

.fundpackage-portfolio-chart {
    max-width: 360px;
    margin: auto;
}

.fund-table {
    width: 100%;
    margin: 0 0 20px 0;
}

.fund-table th,
.fund-table td {
    padding: 8px 4px;
}

.fund-table thead th {
    background: #eee;
    font-size: 10px;
    white-space: nowrap;
    text-align: center;
    font-weight: 600;
}

.fund-table tbody tr {
    cursor: pointer;
}

.fund-table tbody td {
    border-bottom: solid 1px #ddd;
    font-size: 12px;
    text-align: center;
    white-space: nowrap;
}

.fund-table tbody td.title {
    font-size: 13px;
    -moz-text-align-last: left;
    text-align-last: left;
    white-space: normal;
}

.fund-table tbody td.interest,
.fund-table tbody td.norm,
.fund-table tbody td.day {
    text-align: right;
}

.fund-table tbody td.percentage {
    position: relative;
    text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 2px #fff;
}

.fund-table tbody td.day {
    font-size: 13px;
    font-weight: 600;
}

.fund-table tbody td.status-fix span,
.fund-table tbody td.status-fix a.btn-invest {
    display: block;
    background: #4A2087;
    height: auto;
    line-height: 1.8;
    padding: 0 0.5em;
    color: #fff;
    border-radius: 2px;
    text-indent: 0;
    text-align: center;
}

.fund-table tbody td.status-fix span.norm-clear,
.fund-table tbody td.status-fix a.btn-invest.norm-clear {
    background: #eee;
    color: #333;
}

.fund-table tbody td.status-fix span.norm-noclear,
.fund-table tbody td.status-fix a.btn-invest.norm-noclear {
    background: #999;
}

.fund-table tbody tr {
    position: relative;
}

.fund-table tbody tr:hover {
    background: #f9f9f9;
}

.fund-table .gauge {
    display: block;
    width: 100%;
    height: 1.5em;
    margin-bottom: -1.5em;
    background: #e0e0e0;
    text-align: left;
}

.fund-table .gauge .bar {
    display: inline-block;
    height: 100%;
    background: #4A2087;
}

.labels {
  display: block;
}

.labels span {
  display: inline-block;
  background-color: #eee;
  padding: 2px 4px;
  margin-right: 4px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
}

.labels .label-blue {
  background-color: #ddf4fc;
  color: #0d87b4;
}

.labels .label-red {
  background-color: #ffe6e6;
  color: #c00;
}

.labels .label-gray {
  background-color: #eee;
}

/* fund-search
-----------------------------------------------	*/
@media (min-width: 769px) {
    .fund-search {
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 200px 1fr;
        grid-template-columns: 200px 1fr;
        margin-bottom: 24px;
        font-size: 14px;
    }
}

@media (max-width: 768px) {
    .fund-search {
        font-size: 12px;
        background: #f6f6f6;
        padding: 8px;
        margin-bottom: 16px;
        border-radius: 4px;
    }
}

.fund-search-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

@media (min-width: 769px) {
    .fund-search-header {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center;
        background: #eee;
        -ms-grid-column: 1;
        -ms-grid-row: 1;
    }
}

@media (max-width: 768px) {
    .fund-search-header {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }
}

@media (max-width: 768px) {
    .fund-search-result:before {
        content: "：";
    }
}

@media (min-width: 769px) {
    .fund-search-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding-left: 16px;
        -ms-grid-column: 2;
        -ms-grid-row: 1;
    }
}

@media (max-width: 768px) {
    .fund-search-body > div {
        margin-top: 8px;
    }
}

@media (min-width: 769px) {
    .fund-search-type {
        width: 30%;
        padding-bottom: 16px;
    }
}

@media (min-width: 769px) {
    .fund-search-status {
        width: calc(70% - 16px);
    }
}

.fund-search-keyword input[type="text"] {
    height: 32px !important;
}

@media (min-width: 769px) {
    .fund-search-keyword {
        width: 60%;
    }
}

/* fund-search-v2
-----------------------------------------------	*/
@media (min-width: 661px) {
  .investmentrecord-filter {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 14px;
  }
}

@media (max-width: 660px) {
  .investmentrecord-filter {
    font-size: 12px;
    background: #f6f6f6;
    padding: 8px;
    margin-bottom: 16px;
    border-radius: 4px;
  }
}

@media (min-width: 661px) {
  .investmentrecord-filter-type {
    width: 40%;
  }
}

@media (max-width: 660px) {
  .investmentrecord-filter-type {
    margin-bottom: 8px;
  }
}

@media (min-width: 661px) {
  .investmentrecord-filter-terms {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: right;
    -ms-flex-pack: right;
    justify-content: right;
    width: 55%;
  }
}

@media (min-width: 661px) {
  .investmentrecord-filter-keyword {
    width: 60%;
    margin-right: 10px;
  }
}

@media (max-width: 660px) {
  .investmentrecord-filter-keyword {
    margin-bottom: 8px;
  }
}

.investmentrecord-filter-keyword input[type=text] {
  height: 32px !important;
}

.investmentrecord-filter-sort .form-select {
  width: 8em;
}

@media (max-width: 660px) {
  .investmentrecord-filter-sort .form-select {
    width: 50%;
  }
}

/* holdfund-list
-----------------------------------------------	*/
.holdfund-list {
  padding: 0;
}

.holdfund-list ul {
  padding: 0;
}

.holdfund-list .card {
  margin: 16px 0;
}

.holdfund-head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  line-height: 24px;
  font-size: 12px;
}

@media (min-width: 769px) {
  .holdfund-head {
    padding: 0 0 16px;
  }
}

@media (max-width: 768px) {
  .holdfund-head {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0 0 8px;
  }
}

.holdfund-period {
  padding-left: 1em;
}

.holdfund-period strong {
  color: #491D81;
}

@media (max-width: 768px) {
  .holdfund-period {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    width: 100%;
    padding: 8px 0 0 0;
    line-height: 1.5em;
  }
}

.holdfund-purchase {
  padding-left: 1em;
}

@media (min-width: 769px) {
  .holdfund-purchase:before {
    content: "/　";
  }
}

@media (max-width: 768px) {
  .holdfund-purchase {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
    width: 100%;
    padding: 0;
    line-height: 1.5em;
  }
}

@media (min-width: 661px) {
  .holdfund-status {
    margin-left: auto;
  }
}

@media (max-width: 768px) {
  .holdfund-status {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    margin-left: 8px;
  }
}

.holdfund-title {
  margin: 0;
}

.holdfund-status {
  position: relative;
}

@media (min-width: 769px) {
  .holdfund-title {
    font-size: 18px;
    padding: 0 0 16px;
  }
}

@media (max-width: 768px) {
  .holdfund-title {
    font-size: 14px;
    padding: 0 0 8px;
  }
}

.holdfund-status .icon-help {
  position: absolute;
  top: -0.5em;
  right: -0.5em;
  text-shadow: 0 0 1px #fff;
}

.holdfund-status .icon-help:hover {
  opacity: 1;
}

.holdfund-title a {
  color: #333;
}

.holdfund-title a:hover {
  color: gray;
}

.holdfund-data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  border-bottom: solid 1px #eee;
}

.holdfund-data > div {
  width: 100%;
  border-top: solid 1px #eee;
}

@media (min-width: 769px) {
  .holdfund-data > div {
    padding: 8px 16px;
  }
}

@media (max-width: 768px) {
  .holdfund-data {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .holdfund-data > div {
    width: 50%;
    padding: 8px;
  }
}

.holdfund-label {
  padding-bottom: 4px;
  position: relative;
}

@media (min-width: 769px) {
  .holdfund-label {
    font-size: 12px;
  }
}

@media (max-width: 768px) {
  .holdfund-label {
    font-size: 10px;
  }
}

.holdfund-label sub {
  display: block;
  position: absolute;
  font-size: 10px;
}

.holdfund-txt {
  text-align: right;
}

@media (min-width: 769px) {
  .holdfund-txt {
    font-size: 16px;
  }
}

@media (max-width: 768px) {
  .holdfund-txt {
    font-size: 14px;
  }
}

.holdfund-exlabel {
  font-size: 10px;
}

.holdfund-extxt {
  font-size: 12px;
  text-align: right;
}

.holdfund-table {
  border-top: solid 1px #eee;
}

@media (min-width: 769px) {
  .holdfund-table {
    padding: 16px;
  }
}

@media (max-width: 768px) {
  .holdfund-table {
    padding: 8px;
  }
}

.holdfund-table table {
  width: 100%;
  font-size: 12px;
  border-spacing: 0;
}

.holdfund-table th,
.holdfund-table td {
  padding: 2px 8px;
}

.holdfund-table th:first-child,
.holdfund-table td:first-child {
  padding-left: 0;
}

.holdfund-table th:last-child,
.holdfund-table td:last-child {
  padding-right: 0;
}

.holdfund-table thead th {
  font-weight: normal;
  white-space: nowrap;
  padding-bottom: 8px;
}

.holdfund-table tbody td:not(:first-child) {
  white-space: nowrap;
  text-align: right;
}

.holdfund-table label {
  width: 100%;
  text-align: center;
}

.holdfund-table a {
  color: #04c;
}

.holdfund-table a:hover {
  color: #6699ff;
}

@media (max-width: 768px) {
  .holdfund-table {
    overflow: auto;
  }
  .holdfund-table table {
    width: auto;
  }
  .holdfund-table tbody td:first-child {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 80vw;
  }
}

.holdfund-docs {
  font-size: 12px;
  padding: 0;
  border-top: solid 1px #eee;
}

.holdfund-docs ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  border-left: solid 1px #eee;
  margin: 0;
}

.holdfund-docs li {
  margin: 0;
  padding: 0;
  border-right: solid 1px #eee;
  border-bottom: solid 1px #eee;
}

.holdfund-docs span {
  display: block;
  color: #999;
  padding: 8px;
}

.holdfund-docs a {
  display: block;
  background: none;
  color: #04c;
  padding: 8px;
  border-radius: 0;
}

.holdfund-docs a:hover {
  background: none;
}

@media (min-width: 769px) {
  .holdfund-docs li {
    width: calc(100% / 4);
  }
}

@media (max-width: 768px) {
  .holdfund-docs {
    font-size: 12px;
  }
  .holdfund-docs li {
    width: calc(100% / 2);
  }
  .holdfund-docs a {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
}

.holdfund-docs a.btn-html:before {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f35d";
  min-width: 16px;
  min-height: 16px;
  margin-right: 8px;
  text-align: center;
  color: #999;
  background: none;
}

.label-type-package,
.label-type-fund,
.label-status-applying,
.label-status-purchased,
.label-status-inoperation,
.label-status-overdue,
.label-status-repaid,
.label-status-failure,
.label-status-cancel {
    display: inline-block;
    margin: 0;
    padding: 0 16px;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.label-type-package {
    background: #3BB8B9;
}

.label-type-fund {
    background: #4A2087;
}

.label-status-applying {
    background: #5ccacb;
}

.label-status-purchased {
    background: #2f9292;
}

.label-status-inoperation {
    background: #09a;
}

.label-status-overdue {
    background: #491D81;
}

.label-status-repaid {
    background: #37bef0;
}

.label-status-failure,
.label-status-cancel {
    background: #999;
}

/* fund-contents : ファンド詳細画面
-----------------------------------------------	*/
.fund-contents,
.fund-detail,
.fundpackage-detail {
    padding: 40px 10px 80px;
}

@media (max-width: 768px) {
    .fund-contents,
    .fund-detail,
    .fundpackage-detail {
        padding: 10px 10px 40px;
    }
}

@media all and (min-width: 769px) {
    .fund-contents-inner{
        max-width: 1000px;
        margin: auto;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
    .fund-contents-main,
    .split-contents-main {
        width: 100%;
    }
    .fund-contents-widgets{
        width: 260px;
        min-width: 260px;
        margin-left: 30px;
    }
    .fund-view .fund-contents-inner {
        display: block;
    }
    .fund-view .fund-contents-main {
        width: 100%;
    }
}

.fund-contents h2 {
    margin: 2.5em 0 0.5em;
}

.fund-contents h2:first-child {
    margin-top: 0;
}

.fund-detail .fund-contents-main > section:not(:first-child) {
    padding-top: 110px;
    margin-top: 0;
}

@media (max-width: 768px) {
    .fund-detail .fund-contents-main > section:not(:first-child) {
        padding-top: 60px;
        margin-top: 0;
    }
}

.fundpackage-detail .fund-contents-main > section:not(:first-child) {
    padding-top: 48px;
}

.fund-contents-main h2:not(.editorTitle2) {
    font-size: 1.125rem;
}

.fund-contents-main h2 + h3 {
    margin-top: 1rem;
}

.fund-contents-main img {
    max-width: 100% !important;
    height: auto !important;
}

.fund-contents-main table {
    max-width: 100%;
}

.fundpackage-table td {
    white-space: nowrap;
}

.fund-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

@media (max-width: 768px) {
    .fund-navigation ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
}

.fund-navigation li {
    display: inline-block;
    margin: 0 0.5em 0.5em 0;
}

@media (max-width: 768px) {
    .fund-navigation li {
        margin: 0 2% 0.5em 0;
        width: 49%;
    }
    .fund-navigation li:nth-of-type(even) {
        margin-right: 0;
    }
}

.fund-navigation a {
    position: relative;
    display: block;
    border: solid 1px #ddd;
    line-height: 1;
    padding: 0.75em 2em 0.75em 0.75em;
    font-size: 14px;
    background: #fff;
    color: #333;
    text-decoration: none;
}

.fund-navigation a:after {
    position: absolute;
    right: 0.75em;
    display: inline-block;
    content: "\f107";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    color: #909090;
    margin-left: 1em;
}

.fund-navigation a:hover {
    color: #4A2087;
    text-decoration: none;
}

.fund-navigation a:hover:after {
    color: #4A2087;
}

@media (max-width: 768px) {
    .fund-navigation a {
        font-size: 12px;
    }
}

.fund-navigation + section {
    padding-top: 40px !important;
}

@media (max-width: 768px) {
    #gain-simulator-link:before {
        content: "";
        display: block;
        height: 60px;
    }
}

.fund-cta ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    list-style: none;
    margin: 16px 0;
    padding: 0;
    font-size: 14px;
    text-align: center;
}

.fund-cta ul a {
    color: #909090;
}

@media (max-width: 768px) {
    .fund-cta {
        position: fixed;
        left: 0;
        bottom: 0;
        z-index: 10;
        width: 100%;
        padding: 10px 10px 0;
        background: rgba(255, 255, 255, 0.9);
        text-align: center;
    }
    .fund-cta ul {
        margin: 0;
        font-size: 13px;
        font-weight: 600;
    }
    .fund-cta ul a {
        display: block;
        width: 100%;
        padding: 12px 6px;
    }
}

.widget {
    border: solid 1px #eee;
    padding: 10px;
    font-size: 13px;
    margin-top: 16px;
    background: #fff;
}

.widget h2 {
    font-size: 1rem;
    margin-bottom: 1rem;
}

.widget ul:last-child,
.widget ol:last-child {
    margin-bottom: 0;
}

.gain-simulator dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0;
}

.gain-simulator dt,
.gain-simulator dd {
    margin: 10px 0;
    white-space: nowrap;
    font-size: 12px;
}

.gain-simulator dt {
    width: 45%;
    line-height: 2rem;
}

.gain-simulator dd {
    width: 55%;
    font-size: 1rem;
}

.gain-simulator .unit {
    margin-left: 4px;
    font-size: 12px;
    white-space: nowrap;
}

.gain-simulator .input,
.gain-simulator .result {
    background: #eee;
    padding: 0 10px;
}

.gain-simulator .input input {
    width: calc(100% - 2rem);
    text-align: right;
    font-size: 1.25em;
}

.gain-simulator .result {
    margin-bottom: 10px;
}

.gain-simulator .result dt,
.gain-simulator .result dd {
    line-height: 2rem;
}

.gain-simulator .result .val {
    display: inline-block;
    width: calc(100% - 2rem);
    text-align: right;
    background: rgba(255, 255, 255, 0.6);
    border-radius: 4px;
    padding: 0 4px;
    font-size: 1rem;
}

.gain-simulator .result #after_tax_earnings {
    font-weight: 600;
}

@media all and (min-width: 769px) and (min-height: 800px) {
    .fund-contents-widgets .sticky,
    .fund-navigation .sticky {
        position: sticky;
        top: 90px;
        z-index: 5;
        width: 260px;
    }
}

/* bulk-items : ファンド購入
-----------------------------------------------	*/
.bulk-items {
    width: 100%;
}

.bulk-items thead {
    background: #eee;
}

.bulk-items tr {
    border-bottom: solid 1px #eee;
}

.bulk-items th {
    font-size: 10px;
    padding: 8px;
}

.bulk-items th:nth-of-type(2) {
    text-align: center;
}

.bulk-item {
    padding: 16px 0;
    line-height: 1.2;
}

.bulk-item h3 a {
    color: #04c;
}

.bulk-item h3 a font {
    font-size: 12px;
}

.bulk-item-datas {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.bulk-item-data {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 40%;
    padding: 8px 8px 8px 0;
}

.bulk-item-label {
    font-size: 10px;
    width: 7em;
    padding-right: 8px;
    white-space: nowrap;
}

.bulk-item-txt {
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
}

.bulk-item-progress {
    margin-right: 16px;
}

.bulk-amount {
    position: relative;
    padding: 8px;
    font-size: 10px;
    white-space: nowrap;
    background: #f9f9f9;
    text-align: center;
    white-space: nowrap;
}

.bulk-amount input {
    width: 4em;
    font-size: 14px;
}

.bulk-amount-alert {
    padding-top: 0.5em;
    color: #491D81;
}

.bulk-amount-alert:before {
    content: "\f071";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 0.3em;
}

.bulk-invested .bulk-input {
  position: relative;
}

.bulk-input {
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}

.bulk-input input {
  min-width: 5em;
  text-align: right;
}

.bulk-unit {
  position: relative;
  top: 3px;
  font-size: 0.9em;
}

.bulk-invested .bulk-input input {
  padding-left: 8px;
}

.bulk-invested .bulk-input:before {
  content: "+";
  color: #999;
  display: inline-block;
  position: absolute;
  left: 3px;
  top: calc(50% - 0.5rem);
  font-size: 1rem;
  line-height: 1;
}

.bulk-totalamount {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 16px;
    background: #f9f9f9;
}

.bulk-totalamount h3 {
    width: 50px;
    margin: 0;
    font-size: 12px;
    white-space: nowrap;
}

.bulk-totalamount .amount {
    width: calc(100% - 50px);
    line-height: 1;
    font-size: 32px;
    font-weight: 600;
    text-align: right;
}

.bulk-totalamount .amount span {
    font-size: 12px;
    margin-left: 8px;
}

.bulk-limit {
    width: 100%;
    text-align: right;
    padding: 4px 0 0;
    font-size: 12px;
    font-weight: 400;
    opacity: 0.8;
}

.bulk-cta .btn-cta {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.bulk-alert {
    width: 100%;
    padding: 0 0 1em 0;
    text-align: center;
    font-size: 12px;
    color: #491D81;
    background: #f9f9f9;
}

.bulk-alert:before {
    content: "\f071";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 0.3em;
}

.bulk-na .bulk-amount {
    font-size: 12px;
    color: #909090;
}

@media all and (min-width: 769px) {
    .bulk-item-data:nth-of-type(3),
    .bulk-item-data:nth-of-type(6) {
        width: 20%;
    }
}

@media (max-width: 768px) {
    .bulk-item h3 {
        font-size: 14px;
    }
    .bulk-item h3 a font {
        font-size: 10px;
    }
    .bulk-item-data {
        width: 50%;
        padding: 4px 8px 4px 0;
    }
    .bulk-item-label {
        font-size: 10px;
        text-align: right;
    }
    .bulk-item-txt {
        font-size: 10px;
    }
    .bulk-item-rate .bulk-item-txt,
    .bulk-item-term .bulk-item-txt {
        font-size: 14px;
    }
    .bulk-amount {
        text-align: right;
    }
    .bulk-amount input {
        display: block;
        width: 100%;
    }
    .bulk-amount-alert {
        text-align: center;
        font-size: 8px;
    }
    .bulk-na .bulk-amount {
        text-align: center;
    }
    .bulk-widgets {
        position: fixed;
        left: 0;
        bottom: 0;
        z-index: 21;
        width: 100%;
        height: 120px;
        padding: 8px;
        background: rgba(255, 255, 255, 0.9);
    }
    .bulk-widget-cta {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    .bulk-totalamount {
        width: 65%;
        padding: 8px;
        text-align: left;
    }
    .bulk-totalamount .amount {
        font-size: 18px;
    }
    .bulk-totalamount .amount span {
        font-size: 12px;
        margin-left: 8px;
    }
      .bulk-cta {
        width: 35%;
    }
    .bulk-cta .btn-std {
        font-size: 16px;
    }
    .bulk-alert {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
        font-size: 10px;
        padding: 0.5em 0 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        background: none;
    }
}

.widget-ui ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    align-items: center;
    list-style: none;
    margin: 4px 0;
    padding: 0;
    font-size: 14px;
    text-align: center;
}

.widget-ui ul a {
    color: #909090;
    cursor: pointer;
}

@media (max-width: 768px) {
    .widget-ui ul {
        font-size: 13px;
        font-weight: 600;
    }
    .widget-ui li {
        white-space: nowrap;
    }
}

@media (max-width: 768px) {
    .fold-widgets {
        overscroll-behavior: contain;
        display: flex;
        flex-direction: column;
    }
    .fold-widgets.close,
    .fold-widgets.open {
        -webkit-transition: height 0.3s 0s ease;
        transition: height 0.3s 0s ease;
    }
    .fold-widgets.close {
        overflow-y: hidden;
        justify-content: space-between;
    }
    .fold-widgets.close .fold-target {
        display: none;
    }
    .fold-widgets.open {
        overflow-y: auto;
    }
    .fold-widgets.open .fold-target {
        display: block;
    }
}

.score-opt h2 .icon-help {
    float: right;
}
.score-opt input[type="text"] {
    height: auto;
}

.score-opt-ui {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 8px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.score-opt-budget {
    white-space: nowrap;
}

.score-opt-budget input {
    width: 4em;
    margin: 0 2px;
    text-align: right;
}

.score-opt-submit {
    width: 100%;
    padding-left: 1em;
    font-size: 11px
}

.score-opt-submit .btn-wire {
    width: 100%;
}

.score-opt-result {
    background: #f9f9f9;
    padding: 8px;
}

.score-opt-result dl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0;
}

.score-opt-result dt {
    font-weight: normal;
    white-space: nowrap;
    text-align: left;
}

.score-opt-result dd {
    background: rgba(255, 255, 255, 0.8);
    padding: 4px 6px;
    font-size: 16px;
    white-space: nowrap;
}

.score-opt-result dd small {
    font-size: 10px;
}

.score-opt-tip {
    position: absolute;
    left: 1.5em;
    margin-top: -2.5em;
    padding: 2px 4px;
    background: #4A2087;
    border-radius: 2px;
    font-size: 12px;
    font-weight: 600;
    color: #fff;
}

.score-opt-tip:after {
    display: block;
    position: absolute;
    left: calc(50% - 4px);
    bottom: -4px;
    width: 8px;
    height: 8px;
    content: "";
    background: #4A2087;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* holdlist : holdfund-list v2
-----------------------------------------------	*/
.holdlist {
  border-top: solid 1px #eee;
}

.holdlist-item {
  border-bottom: solid 1px #eee;
}

.holdlist-title {
  position: relative;
}

.holdlist-title a {
  display: block;
}

.holdlist-title a:before {
  display: block;
  content: "\f105";
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  position: absolute;
  left: 10px;
}

.holdlist-operation .holdlist-title a {
  padding: 10px 130px 10px 20px;
}

@media (max-width: 1024px) {
  .holdlist-operation .holdlist-title a {
    padding: 10px 120px 10px 20px;
  }
}

.holdlist-repaid .holdlist-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.holdlist-repaid .holdlist-title a {
  display: block;
  width: 100%;
  padding: 10px 10px 10px 20px;
}

.holdlist-status {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  top: 10px;
  right: 10px;
}

.holdlist-status > div {
  font-size: smaller;
  font-weight: bold;
  white-space: nowrap;
  text-align: center;
}

.holdlist-result {
  padding: 10px;
  white-space: nowrap;
}

.holdlist-result small {
  margin-left: 0.5em;
}

@media (max-width: 660px) {
  .holdlist-result small {
    display: block;
  }
}

[class^="holdlist-abc"] {
  width: 28px;
  line-height: 28px;
  color: #fff;
}

@media (max-width: 1024px) {
  [class^="holdlist-abc"] {
    width: 20px;
    line-height: 20px;
    font-size: small;
  }
}

.holdlist-abc-a {
  background: #2f98e8;
}

.holdlist-abc-b {
  background: #42b8b8;
}

.holdlist-abc-c {
  background: #ffc64c;
}

.holdlist-abc-d {
  background: #ff9438;
}

.holdlist-abc-e {
  background: #ff5879;
}

.holdlist-abc-z {
  background: #5b5b5b;
}

[class^="holdlist-phase"] {
  width: 80px;
  line-height: 28px;
  margin-left: 10px;
}

@media (max-width: 1024px) {
  [class^="holdlist-phase"] {
    width: 80px;
    line-height: 20px;
    font-size: small;
    margin-left: 5px;
  }
}

.holdlist-phase-before {
  background: #ccc;
}

.holdlist-phase-operation {
  background: #0a9;
  color: #fff;
}

.holdlist-phase-deferral {
  background: #491D81;
  color: #fff;
}

@media (min-width: 661px) {
  .holdlist-detail {
    padding: 10px;
  }
}

@media (max-width: 660px) {
  .holdlist-detail {
    padding: 10px 0;
  }
}

.holdlist-data {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.holdlist-data > div {
  padding: 0 5px;
  margin-bottom: 10px;
}

@media (max-width: 660px) {
  .holdlist-data {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .holdlist-data > div {
    width: 50%;
    padding: 0 10px;
  }
}

.holdlist-label {
  font-size: 12px;
  position: relative;
}

@media (max-width: 660px) {
  .holdlist-label sub {
    display: block;
    position: absolute;
    font-size: 10px;
  }
}

.holdlist-txt {
  text-align: right;
  font-size: 1rem;
}

.holdlist-txt sup {
  top: 0;
  line-height: 0.75;
}

.holdlist-actualyield .holdlist-txt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.holdlist-yield .holdlist-txt {
  display: -ms-flexbox;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.holdlist-note {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  background: #f9f9f9;
  margin-bottom: 10px;
  font-size: 12px;
}

.holdlist-note-head {
  width: 100px;
  padding: 8px;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}

.holdlist-note-body {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: 8px;
}

.holdlist-docs {
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-pack: space-evenly;
  -ms-flex-pack: space-evenly;
  justify-content: space-evenly;
}

.holdlist-docs li {
  height: 100%;
  color: #999;
  width: 25%;
}

@media (max-width: 660px) {
  .holdlist-docs li {
    width: 50%;
  }
}

.holdlist-docs a, .holdlist-docs span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 12px;
  padding: 8px;
  background: #fff;
  border: solid 1px #eee;
}

.holdlist-docs a:hover {
  text-decoration: none;
  font-weight: 600;
}

.holdlist-docs .fas {
  margin-right: 0.5em;
  color: #999;
}

.holdlist-item.active .holdlist-title a:before {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.holdlist-item.active .holdlist-result {
  display: none;
}

/* steplist
「クラウドクレジットのはじめかた」や「ファンドの組成プロセス」で利用
----------------------------------------------- */
.steplist {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
}

.steplist > li {
    position: relative;
    list-style: none;
    padding: 0 20px;
    font-size: 14px;
}

.steplist > li:not(:first-child):before {
    content: "";
    display: block;
    position: absolute;
    top: 50px;
    left: -15px;
    border-style: solid;
    border-width: 30px 0 30px 30px;
    border-color: transparent transparent transparent #eee;
}

.steplist figure {
    margin-bottom: 0;
}

.steplist h3 {
    margin-top: 0;
    font-size: 18px;
    margin-bottom: 1em;
}

.steplist p {
    text-align: left;
}

@media (max-width: 768px) {
    .steplist {
        display: block;
        margin: 0;
    }
    .steplist > li {
        display: block;
        width: 100%;
        padding: 30px 0 20px 80px;
        clear: both;
    }
    .steplist > li:not(:first-child):before {
        content: "";
        display: block;
        position: absolute;
        top: 0px;
        left: 20px;
        border-style: solid;
        border-width: 15px 15px 0 15px;
        border-color: #eee transparent transparent transparent;
    }
    .steplist figure {
        position: absolute;
        left: 0;
        display: inline-block;
        text-align: center;
    }
    .steplist figure img {
        max-width: 80px;
    }
    .steplist h3 {
        font-size: 16px;
        margin-bottom: 8px;
    }
    .steplist p {
        margin: 0;
    }
}

/* signup-flow
トップページ「クラウドクレジットのはじめかた」
----------------------------------------------- */
.signup-flow {
    margin: 40px 0;
}

.signup-flow .steplist li {
    width: 33.333%;
}

@media (max-width: 768px) {
    .signup-flow {
        margin: 0;
    }
    .signup-flow .steplist li {
        width: 100%;
    }
}

/* formprocess
はじめての方へ「ファンドの組成プロセス」
----------------------------------------------- */
.formprocess {
    margin: 40px 0;
}

.formprocess .steplist > li {
    width: 25%;
}

.formprocess .steplist ul {
    text-align: left;
}

.formprocess .steplist figure {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 140px;
    margin-bottom: 1em;
}

@media (max-width: 768px) {
    .formprocess .steplist > li {
        width: 100%;
        min-height: 110px;
    }
    .formprocess .steplist figure {
        width: 80px;
        height: auto;
        text-align: center;
    }
    .formprocess .steplist figure img {
        max-width: 60px;
        max-height: 50px;
    }
}

.formprocess-sale {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 80px;
}

.formprocess-sale:before {
    position: absolute;
    top: 0;
    content: "";
    display: block;
    width: 100%;
    border-bottom: solid 4px #eee;
}

.formprocess-sale:after {
    content: "";
    display: block;
    position: absolute;
    top: 0px;
    left: calc(50% - 30px);
    border-style: solid;
    border-width: 30px 30px 0 30px;
    border-color: #eee transparent transparent transparent;
}

.formprocess-sale figure {
    width: 160px;
}

.formprocess-sale div {
    text-align: left;
}

@media (max-width: 768px) {
    .formprocess-sale {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: start;
        padding-top: 30px;
    }
    .formprocess-sale:before {
        display: none;
    }
    .formprocess-sale:after {
        top: 0;
        left: 20px;
        border-style: solid;
        border-width: 15px 15px 0 15px;
        border-color: #eee transparent transparent transparent;
    }
    .formprocess-sale figure {
        width: 80px;
        text-align: center;
    }
    .formprocess-sale img {
        max-width: 60px;
        max-height: 50px;
    }
}

/* news-list
お知らせ一覧
----------------------------------------------- */
.news-list {
    margin: 40px 0;
    padding: 0;
    text-align: left;
}

.news-list li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    margin-bottom: 0.8em;
}

.news-list time {
    margin-right: 2em;
}

.news-list .news-list-title {
    margin: 0;
    font-size: 1em;
    font-weight: 400;
}

@media (max-width: 768px) {
    .news-list {
        margin: 20px 0;
    }
    .news-list li {
        display: block;
    }
    .news-list time {
        margin-right: 0;
    }
}

/* blog-list
お知らせ一覧
----------------------------------------------- */
.blog-list {
    margin: 40px 0;
    padding: 0;
    text-align: left;
}

.blog-list li {
    list-style: none;
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: solid 1px #eee;
    clear: both;
    overflow: hidden;
}

.blog-list .eyecatch {
    display: inline-block;
    float: right;
    width: 160px;
    height: 120px;
    margin: 0 0 1em 1em;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}

.blog-list .blog-list-title {
    font-size: 28px;
    margin: 0 0 1rem;
}

.blog-list .blog-list-title a {
    color: #333;
}

.blog-list .excerpt {
    margin: 0;
}

@media (max-width: 768px) {
    .blog-list {
        margin: 20px 0;
    }
    .blog-list li {
        margin-bottom: 20px;
        padding-bottom: 20px;
    }
    .blog-list .eyecatch {
        display: block;
        float: none;
        width: 100%;
        height: 120px;
        margin: 0 0 1rem;
        background-size: cover;
    }
    .blog-list .blog-list-title {
        font-size: 18px;
    }
}

.blog-list-lite {
    margin: 0;
    padding: 0;
    text-align: left;
}

.blog-list-lite li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    list-style: none;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.blog-list-lite li:not(:last-child) {
    border-bottom: solid 1px #eee;
}

.blog-list-lite .eyecatch-link {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    line-height: 1;
}

.blog-list-lite .eyecatch {
    display: inline-block;
    width: 80px;
    height: 60px;
    margin: 0 0 0 1em;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.blog-list-lite .blog-list-title {
    width: 100%;
    margin: 0;
    font-size: 1.2rem;
    font-weight: normal;
}

.blog-list-lite .blog-list-title a {
    display: block;
    color: #333;
}

@media (max-width: 768px) {
    .blog-list-lite li {
        display: block;
        padding: 16px 0;
    }
    .blog-list-lite .eyecatch {
        display: block;
        float: none;
        width: 100%;
        height: 120px;
        margin: 0 0 1rem;
        background-size: cover;
    }
    .blog-list-lite .blog-list-title {
        font-size: 1rem;
    }
}

/* duedili-dl
ファンド組成プロセスのデューデリジェンス枠
----------------------------------------------- */
.duedili {
    position: relative;
    background: #f9f9f9;
    margin: 0;
    padding: 24px;
}

/* company
会社紹介ページ用クラス
----------------------------------------------- */
.slogan {
    margin: 1em 0;
    font-size: 40px;
    font-weight: 600;
}

@media (max-width: 768px) {
    .slogan {
        text-align: center;
        font-size: 24px;
    }
}

.ceo-message {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.ceo-message figure {
    text-align: center;
}

@media (max-width: 768px) {
    .ceo-message {
        display: block;
    }
    .ceo-message figure img {
        max-width: 160px;
    }
}

.ceo-message-contents {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.ceo-message-contents nav {
    margin-top: auto;
}

.ceo-message-contents nav ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 -8px;
    padding: 0;
    list-style: none;
}

.ceo-message-contents nav li {
    width: 50%;
    padding: 8px;
}

.ceo-message-contents nav a {
    width: 100%;
}

@media (max-width: 768px) {
    .ceo-message-contents nav {
        margin-top: 24px;
    }
}

.ceo-sign {
    margin-top: 40px;
}

@media (max-width: 768px) {
    .ceo-sign {
        margin-top: 0;
    }
    .ceo-sign img {
        max-width: 200px;
    }
}

.partners ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0;
    list-style: none;
}

.partners li {
    width: 33.3%;
    padding: 20px;
}

@media (max-width: 768px) {
    .partners li {
        padding: 8px;
    }
}

.company-detail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 2em 0;
}

.company-detail th,
.company-detail td {
    padding: 8px;
    font-size: 14px;
}

.company-detail th {
    white-space: nowrap;
    vertical-align: top;
}

@media (max-width: 768px) {
    .company-detail tr,
    .company-detail th,
    .company-detail td {
        display: block;
        padding: 0;
    }
    .company-detail tr {
        margin-bottom: 1.5em;
    }
    .company-detail td {
        padding-left: 1em;
    }
}

.company-map iframe {
    width: 100%;
    height: 400px;
}

@media (max-width: 768px) {
    .company-map iframe {
        height: 160px;
    }
}

.officers {
    padding: 0;
    list-style: none;
}

.officers li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 0 80px;
}

.officers li:last-child {
    margin-bottom: 0;
}

@media (max-width: 768px) {
    .officers li {
        display: block;
        margin: 0 0 60px;
    }
}

.officers-img {
    width: 320px;
}

@media (max-width: 768px) {
    .officers-img {
        width: 100%;
        margin-bottom: 1em;
    }
    .officers-img img {
        width: 100%;
    }
}

.officers-prof {
    width: calc(100% - 320px);
    font-size: 14px;
    padding-left: 2em;
}

.officers-prof .position {
    margin-bottom: 0.75rem;
}

.officers-prof h3 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 0 1rem;
    padding: 0 0 1rem;
    line-height: 1;
    border-bottom: solid 1px #eee;
}

.officers-prof h3 .name {
    font-size: 28px;
}

.officers-prof h3 .en {
    margin-left: 2em;
    font-weight: normal;
    font-size: 14px;
}

.officers-prof table {
    font-size: 13px;
}

.officers-prof th {
    white-space: nowrap;
    padding: 4px 0;
}

.officers-prof td {
    padding: 4px 0 4px 1em;
}

@media (max-width: 768px) {
    .officers-prof {
        width: auto;
        padding-left: 0;
    }
}

.history h2:not(:first-child) {
    margin-top: 32px;
    padding-top: 32px;
    border-top: solid 1px #eee;
}

.history table {
    width: 100%;
}

.history tr:not(:last-child) th,
.history tr:not(:last-child) td {
    padding-bottom: 1em;
}

.history th {
    width: 5em;
    text-align: right;
    vertical-align: top;
    color: #333;
}

.history td {
    padding-left: 3em;
}

.history p {
    margin-bottom: 0.5em;
}

/* entry : お知らせ、ブログ系ページ用クラス
----------------------------------------------- */
.entry-body {
    max-width: 800px;
}

.entry-body img {
    max-width: 100% !important;
    height: auto !important;
}

.entry-meta {
    padding: 0;
    margin: 0 0 1em;
}

.entry-meta > div {
    display: inline-block;
    margin: 0;
}

.entry-meta > div:not(:first-child) {
    margin-left: 0.5em;
}

.entry-meta .category a {
    display: block;
    padding: 0.2em 0.5em;
    background: #eee;
    color: #333;
    border-radius: 4px;
}

.entry-meta .category a:hover {
    opacity: 0.7;
    text-decoration: none;
}

.entry-title {
    margin: 0 0 1.5em;
    padding: 0 0 1.5em;
    border-bottom: solid 1px #eee;
    font-size: 28px;
}

@media (max-width: 768px) {
    .entry-title {
        font-size: 20px;
    }
}

.entry-eyecatch {
    margin: 0 0 40px;
    text-align: center;
}

/* coresatellite contents
-----------------------------------------------	*/
.uni-wrap .coresatellite-contents {
    padding: 0;
}

.coresatellite-contents {
    width: 1000px;
    margin: 0 auto;
    padding: 40px 0;
}

.coresatellite-contents > h2 {
    font-size: 18px;
    font-weight: bold;
    margin: 32px 0 8px;
}

.coresatellite-contents > h2:first-child {
    margin-top: 0;
}

@media only screen and (max-width: 767px) {
    .coresatellite-contents {
        width: auto;
        padding: 8px;
    }
}

.coresatellite-overview {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 64px;
}

.coresatellite-overview > h2 {
    font-size: 18px;
    margin: 32px 0 8px;
}

.coresatellite-overview .body {
    width: 100%;
    padding-right: 16px;
    word-wrap: break-word;
}

.coresatellite-overview .body p {
    line-height: 2.2em;
}

.coresatellite-overview .image {
    -webkit-box-flex: 1;
    -ms-flex: 1 75%;
    flex: 1 75%;
}

@media only screen and (max-width: 767px) {
    .coresatellite-overview {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        padding: 0 16px;
    }
    .coresatellite-overview .image {
        height: 180px;
        margin-bottom: 8px;
    }
}

.coresatellite-list {
    max-width: 1000px;
    margin: 0 auto;
    list-style-type: none;
    padding: 0;
}

.coresatellite-item {
    position: relative;
    background-color: #fff;
    margin: 40px 0;
}

.coresatellite-item-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    position: relative;
    text-decoration: none;
    color: #525252;
}

.coresatellite-item-img {
    width: 100%;
    min-height: 130px;
    -webkit-box-flex: 0;
    -ms-flex: 0 320px;
    flex: 0 320px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
    bottom: 0;
}

@media only screen and (max-width: 767px) {
    .coresatellite-item-img {
        margin: 0 auto;
    }
}

.coresatellite-item-detail {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1 1;
    flex: 1 1;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0 16px;
}

.coresatellite-item-title {
    width: 100%;
    line-height: 1;
    margin-bottom: 0;
    padding-bottom: 10px;
}

.coresatellite-item-title h2 {
    font-size: 24px;
}

.coresatellite-item-description {
    font-size: 14px;
    line-height: 2.2;
}

.disclaimer {
    position: relative;
    background-color: #fff;
    margin-top: 48px;
    padding: 16px;
    border: 1px solid #ddd;
}

.disclaimer h2 {
    margin: 2em 0 1em !important;
    padding-bottom: 0 !important;
    border: none !important;
    font-size: 16px !important;
}

.disclaimer h2:first-child {
    margin-top: 0 !important;
}

.disclaimer ul {
    padding-left: 2em;
    font-size: 12px;
}

.disclaimer-title {
    position: relative;
    padding: 0 0 0 32px !important;
}

.disclaimer-title:before {
    display: block;
    content: "";
    width: 24px;
    height: 24px;
    position: absolute;
    top: calc(50% - 12px);
    left: 0;
    background-image: url(data:image/png;base64,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);
    background-size: cover;
}

/* .campaign campaign以下等の汎用コンテンツ表示
-----------------------------------------------	*/
.campaign {
    max-width: 800px;
    margin: auto;
    padding: 40px 0;
    font-size: 16px;
}

.campaign-title {
    margin-bottom: 40px;
}

.campaign-body h1,
.campaign-body h2,
.campaign-body h3,
.campaign-body h4,
.campaign-body h5,
.campaign-body h6 {
    margin: 2em 0 0.5em;
}

.campaign-body p {
    margin: 1em 0 0.5em;
}

.campaign-body img {
    max-width: 100%;
}

.campaign-body th {
    white-space: nowrap;
}

.campaign-body ul,
.campaign-body ol {
    margin: 1em 0;
    padding-left: 2em;
}

.campaign-body ul li,
.campaign-body ol li {
    margin: 4px 0;
}

.campaign-body ul ul,
.campaign-body ul ol,
.campaign-body ol ul,
.campaign-body ol ol {
    margin: 0;
}

.campaign-body ul li {
    list-style-type: disc;
}

.campaign-body ul ul li {
    list-style-type: circle;
}

.campaign-body ol li {
    list-style-type: decimal;
}

.campaign-body a {
    color: #04c;
}

@media all and (max-width: 768px) {
    /* mobile */
    .campaign {
        padding-top: 0px;
        padding-right: 8px;
        padding-left: 8px;
    }
    .campaign-title {
        margin: 16px 0 24px;
    }
    .campaign-title h1 {
        font-size: 5vw;
    }
    .campaign-body .table-campaign {
        font-size: 14px;
    }
    .campaign-body img {
        height: auto;
    }
}

.table-campaign {
    margin: auto;
    border: solid 1px #4A2087;
}

.table-campaign th,
.table-campaign td {
    padding: 0.5em 0.75em;
}

.table-campaign thead th {
    background-color: #fdf0e1;
    text-align: center;
}

.table-campaign tbody tr {
    border-top: solid 1px #4A2087;
}

.campaign-flow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.campaign-flow figure {
  width: 100px;
  margin-bottom: 0;
}

.campaign-flow .introducer, .campaign-flow .addressee, .campaign-flow .common {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 20px;
}

.campaign-flow .introducer div, .campaign-flow .addressee div, .campaign-flow .common div {
  width: 500px;
  padding: 10px;
  border-radius: 4px;
}

.campaign-flow .introducer div p:first-child, .campaign-flow .addressee div p:first-child, .campaign-flow .common div p:first-child {
  margin-top: 0;
}

.campaign-flow .introducer figure {
  margin-right: 20px;
}

.campaign-flow .introducer div {
  background-color: #fff0d7;
}

.campaign-flow .addressee {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-flow: row-reverse;
  flex-flow: row-reverse;
}

.campaign-flow .addressee figure {
  margin-left: 20px;
}

.campaign-flow .addressee div {
  background-color: #ddf4fc;
}

.campaign-flow .common {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.campaign-flow .common div {
  width: 560px;
  background-color: #f9f9f9;
}

@media all and (max-width: 660px) {
  .campaign-flow {
    font-size: 0.875rem;
  }
  .campaign-flow figure {
    width: 60px;
  }
  .campaign-flow .introducer div, .campaign-flow .addressee div {
    width: calc(100% - 70px);
  }
  .campaign-flow .introducer figure {
    margin-right: 10px;
  }
  .campaign-flow .addressee figure {
    margin-left: 10px;
  }
  .campaign-flow .common div {
    width: calc(100% - 140px);
  }
}

.campaign-steps {
  display: flex;
  flex-wrap: wrap;
}

.campaign-steps dt,
.campaign-steps dd {
  margin: 1rem 0;
}

.campaign-steps dt {
  width: 25%;
}

.campaign-steps dd {
  width: 75%;
  padding-left: 1rem;
}

body {
    height: auto !important;
}

@media (max-width: 768px) {
    body {
        padding-top: 0;
    }
}

p {
    margin-bottom: 1.5rem;
}

a {
    color: #007bff;
}

#mainwrap {
    padding-bottom: 80px;
}

@media (max-width: 768px) {
    #mainwrap {
        padding-bottom: 40px;
    }
}

.page-title {
    position: relative;
    border: none;
}

.page-title h1 {
    width: auto;
    line-height: 1.25;
    margin: 0 auto;
    padding: 20px 0;
    font-size: 32px;
    font-weight: 600;
}

.page-title font {
    color: #fff !important;
}

@media (max-width: 768px) {
    .page-title {
        min-width: 0;
    }
    .page-title h1 {
        padding: 13px 0;
        font-size: 20px;
    }
}

.uni-wrap {
    padding: 80px 10px;
}

@media (max-width: 768px) {
    .uni-wrap {
        padding: 40px 10px;
    }
}

a[class^="btn48"]:hover {
    color: #4A2087;
    text-decoration: none;
}

.mypage-title-v2 nav ul {
    padding: 0;
}

.mypage-title-v2 nav ul li {
    margin: 0;
}

#contentwrap {
    padding-bottom: 0;
}

.fund-pagetab ul {
    padding: 0;
}

.fund-contents-main > section:not(:first-child) {
    margin-top: 0;
}

.fund-contents-main h2.editorTitle2 {
    margin: 2.5em 0 1em;
    padding: 0;
    border: none;
    font-size: 1.5em;
}

.fund-contents-main h2 + h2.editorTitle2 {
    margin-top: 1em;
}

.report-index ul {
    padding: 0;
}

.report-index h3 {
    margin: 0;
}
/* contact
----------------------------------------------- */
.contact-form dl > div {
    margin-bottom: 2.5em;
}

.contact-form dl > div input,
.contact-form dl > div textarea,
.contact-form dl > div select {
    padding: 12px;
    background: #f9f9f9;
    border-color: #ddd;
    outline: none;
}

.contact-form dl > div select {
    width: 6em;
}

.contact-form dl > div input ::-webkit-input-placeholder,
.contact-form dl > div textarea ::-webkit-input-placeholder {
    color: #909090;
}

.contact-form dl > div input ::-moz-placeholder,
.contact-form dl > div textarea ::-moz-placeholder {
    color: #909090;
}

.contact-form dl > div input :-ms-input-placeholder,
.contact-form dl > div textarea :-ms-input-placeholder {
    color: #909090;
}

.contact-form dl > div input ::-ms-input-placeholder,
.contact-form dl > div textarea ::-ms-input-placeholder {
    color: #909090;
}

.contact-form dl > div input ::placeholder,
.contact-form dl > div textarea ::placeholder {
    color: #909090;
}

@media (max-width: 768px) {
    .contact-form dl > div {
        margin-bottom: 2em;
    }
    .contact-form dl > div input,
    .contact-form dl > div textarea {
        width: 100%;
    }
    .contact-form .contact-form-name dd:not(:last-child) {
        margin-right: 0;
    }
}

.contact-form-name dd:not(:last-child) {
    margin-right: 24px;
}

@media (max-width: 768px) {
    .contact-form-name dd:not(:last-child) {
        margin-right: 0;
    }
}

.contact-form-mail input {
    width: 100%;
    max-width: 540px;
}

.contact-form-comment textarea {
    width: 100%;
}

.contact-submit-txt ul {
    padding: 0;
}

.contact-submit-txt ul li::marker {
    content: none;
}

.contact-submit-btn {
    margin-top: 60px;
    text-align: center;
}

@media (max-width: 768px) {
    .contact-submit-btn {
        margin-top: 40px;
    }
}

/* confirm
----------------------------------------------- */
.contact-confirm dt {
    margin-bottom: 0.5em;
}

@media (max-width: 768px) {
    .contact-confirm .contact-form-name {
        margin-right: 0;
    }
    .contact-confirm .contact-form-name dd:not(:last-child) {
        margin-right: 1em;
    }
    .contact-confirm .contact-form-name .flex-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
}

.contact-confirm-btn {
    margin-top: 80px;
}

.contact-confirm-btn input:not(:last-child) {
    margin-right: 24px;
}

@media (max-width: 768px) {
    .contact-confirm-btn {
        margin-top: 40px;
        text-align: center;
    }
    .contact-confirm-btn input:not(:last-child) {
        margin-right: 0;
        margin-bottom: 24px;
    }
}

.box-submit {
    padding-top: 0;
    border-top: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.box-submit .btn-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    padding: 0;
}

.box-submit .btn-list li {
    float: none;
}

.sign-up .box-normal {
    padding: 16px;
}

main > section.procedure {
    padding: 0;
}

.procedure.forms dl,
.procedure.sign-up dl {
    padding: 0;
}

.procedure.forms .btn-list,
.procedure.sign-up .btn-list {
    width: auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.procedure .form-btns a {
    text-decoration: none;
}

footer {
    background: #fff;
    padding-bottom: 120px;
}

/* footer-cta
----------------------------------------------- */
.footer-cta .contents-inner,
.footer-cta .main_col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.footer-cta figure {
    margin-right: 60px;
}

.footer-cta h2 {
    line-height: 1.5;
    margin: 0 0 0.5em;
    font-size: 40px;
}

.footer-cta p {
    font-size: 24px;
    margin-bottom: 1em;
}

@media (max-width: 1024px) {
    .footer-cta h2 {
        font-size: 32px;
        white-space: nowrap;
    }
}

@media (max-width: 768px) {
    .footer-cta {
        overflow: hidden;
    }
    .footer-cta .contents-inner,
    .footer-cta .main_col {
        display: block;
    }
    .footer-cta figure {
        float: left;
        margin-right: 10px;
    }
    .footer-cta figure img {
        width: 20vw;
    }
    .footer-cta h2 {
        font-size: 4vw;
        white-space: nowrap;
    }
    .footer-cta p {
        font-size: 3vw;
        white-space: nowrap;
    }
}

.footer-cta-btns {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.footer-cta-btns a {
    width: 260px;
}

.footer-cta-btns .btn-std {
    margin-right: 20px;
}

@media (max-width: 768px) {
    .footer-cta-btns {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        clear: both;
    }
    .footer-cta-btns div {
        width: 48%;
    }
    .footer-cta-btns a {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
    }
}

/* footer-contact
お客様専用お問い合わせ窓口周り
----------------------------------------------- */
.footer-contact {
    padding: 40px 10px;
}

.footer-contact .contents-inner,
.footer-contact .main_col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.footer-contact h2 {
    margin: 0;
    font-size: 18px;
}

@media (max-width: 1024px) {
    .footer-contact .contents-inner,
    .footer-contact .main_col {
        display: block;
        text-align: center;
    }
}

@media (max-width: 768px) {
    .footer-contact .btn-wire {
        width: 100%;
    }
}

.footer-contact-tell {
    text-align: center;
}

.footer-contact-tell h3 {
    font-size: 48px;
    line-height: 1;
    white-space: nowrap;
}

.footer-contact-tell i {
    color: #4A2087;
}

.footer-contact-tell a {
    color: #333;
}

@media (max-width: 768px) {
    .footer-contact-tell {
        margin: 20px 0;
    }
    .footer-contact-tell h3 {
        font-size: 40px;
    }
}

/* footer-disclaimer
ディスクレーマー表記周り
----------------------------------------------- */
.footer-disclaimer {
    background: #393939;
    color: #fff;
    padding: 50px 10px;
}

.footer-disclaimer h2 {
    font-size: 18px;
}

@media (max-width: 768px) {
    .footer-disclaimer {
        padding: 20px 10px;
    }
    .footer-disclaimer h2 {
        font-size: 16px;
    }
    .footer-disclaimer p {
        font-size: 12px;
    }
}

/* footer-navi
フッターナビゲーション
----------------------------------------------- */
.footer-navi {
    padding: 40px 10px;
}

.footer-navi .contents-inner,
.footer-navi .main_col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.footer-navi a {
    color: #333;
}

.footer-navi ul {
    margin: 0;
    padding: 0;
}

.footer-navi li {
    list-style: none;
    line-height: 1.5;
    margin: 8px 0;
    font-size: 13px;
}

@media (max-width: 768px) {
    .footer-navi {
        padding: 20px 10px;
    }
    .footer-navi .contents-inner,
    .footer-navi .main_col {
        display: block;
    }
    .footer-navi h3 {
        display: block;
        position: relative;
        padding: 8px;
        margin: 0;
        cursor: pointer;
    }
    .footer-navi h3:after {
        position: absolute;
        right: 20px;
        color: #ddd;
        font-family: "Font Awesome 5 Free";
        content: "\f105";
    }
    .footer-navi h3[active] {
        background: #f9f9f9;
    }
    .footer-navi h3[active]:after {
        content: "\f107";
    }
    .footer-navi ul {
        display: none;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin: 0;
        background: #f9f9f9;
    }
    .footer-navi ul[active] {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    .footer-navi li {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 50%;
        margin: 0;
    }
    .footer-navi a {
        display: block;
        height: 100%;
        padding: 8px;
    }
}

/* footer-navi
クラウドクレジット公式メディア周り
----------------------------------------------- */
.footer-sns {
    padding: 0 10px;
}

.footer-sns .contents-inner,
.footer-sns .main_col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-top: solid 1px #eee;
    padding: 30px 0;
    text-align: center;
}

.footer-sns h2 {
    font-size: 14px;
    margin: 0;
}

.footer-sns ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 0 0 10px;
    padding: 0;
}

.footer-sns li {
    list-style: none;
    margin: 0 15px;
}

.footer-sns a {
    display: block;
    color: #333;
}

.footer-sns a:hover {
    opacity: 0.7;
}

.footer-sns .fab {
    font-size: 32px;
}

@media (max-width: 768px) {
    .footer-sns .contents-inner,
    .footer-sns .main_col {
        display: block;
        padding: 20px 0;
    }
    .footer-sns h2 {
        margin-bottom: 1em;
    }
    .footer-sns ul {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
}

/* footer-info
フッター末端情報
----------------------------------------------- */
.footer-info {
    padding: 0 10px;
}

.footer-info a {
    color: #333;
}

.footer-info .contents-inner,
.footer-info .main_col {
    border-top: solid 1px #eee;
    padding: 30px 0;
    text-align: center;
    font-size: 12px;
}

@media (max-width: 768px) {
    .footer-info .contents-inner,
    .footer-info .main_col {
        padding: 20px 0;
        font-size: 10px;
    }
}

/* mobile-cta
----------------------------------------------- */
.cta-widget {
    position: fixed;
    bottom: 0;
    z-index: 10;
    width: 100%;
    padding: 0 10px;
    background: rgba(255, 255, 255, 0.9);
    text-align: center;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-animation: framein-up 1s 4s ease both;
    animation: framein-up 1s 4s ease both;
}

.cta-widget section {
    padding: 10px 0;
}

.cta-widget section:not(:first-child) {
    padding-top: 0;
}

.cta-widget-close {
    position: absolute;
    right: -40px;
    top: calc(50% - 12px);
    cursor: pointer;
    line-height: 1;
    margin: 0;
    font-size: 24px;
    color: #909090;
}

@media (max-width: 768px) {
    .cta-widget-close {
        right: 0;
        top: -20px;
        font-size: 16px;
        width: 24px;
        height: 24px;
        line-height: 24px;
    }
}

.cta-widget-check {
    display: none;
}

.cta-widget-check:checked + .cta-widget-inner {
    display: none;
}

.cta-widget-inner {
    position: relative;
    max-width: 1000px;
    margin: 0 auto;
}

.mobile-cta {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.mobile-cta .regist {
    width: 100%;
    margin-right: 10px;
}

.mobile-cta a {
    width: 100%;
}

@media (min-width: 769px) {
    .mobile-cta {
        display: none;
    }
}

/* campaign-widget
----------------------------------------------- */
.campaign-widget {
    position: fixed;
    bottom: 0;
    z-index: 9;
    width: 100%;
    padding: 10px;
    background: rgba(255, 255, 255, 0.9);
    -webkit-transform: translateY(200%);
    transform: translateY(200%);
    -webkit-animation: campaign-widget-up 1s 4s ease both;
    animation: campaign-widget-up 1s 4s ease both;
}

@media (max-width: 768px) {
    .campaign-widget {
        bottom: 60px;
    }
}

.campaign-widget-inner {
    max-width: 1000px;
    margin: 0 auto;
}

@-webkit-keyframes campaign-widget-up {
    0% {
        -webkit-transform: translateY(200%);
        transform: translateY(200%);
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes campaign-widget-up {
    0% {
        -webkit-transform: translateY(200%);
        transform: translateY(200%);
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

/* footer-gotop
----------------------------------------------- */
.footer-gotop {
    position: fixed;
    right: 40px;
    bottom: 40px;
    z-index: 15;
    -webkit-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
    opacity: 0;
}

.footer-gotop.active {
    opacity: 1;
}

@media (max-width: 768px) {
    .footer-gotop {
        display: none;
    }
}

.footer-gotop a {
    display: block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background: #eee;
    border-radius: 50%;
    color: #333;
    opacity: 0.7;
}

.footer-gotop a:hover {
    opacity: 1;
}

/* ui class : 汎用的に使うボタン、リスト、表などのクラス群
-----------------------------------------------	*/
/* card : 汎用カードリスト
-----------------------------------------------	*/
.card-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0;
}

.cards {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: auto -8px;
    font-size: 0.875rem;
}

@media (max-width: 660px) {
    .cards {
        display: block;
    }
}

.card,
.card-simple {
    background-color: #fff;
    border: solid 1px #eee;
    border-radius: 4px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.card img,
.card-simple img {
    max-width: 100%;
}

.card h3,
.card-simple h3 {
    font-size: 1em;
}

.card {
    -webkit-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.15);
}

.card-simple {
    border-color: #dbdbdb;
}

.card-wrap {
    padding: 16px;
}

@media (max-width: 768px) {
    .card-wrap {
        padding: 8px;
    }
}

/* link
----------------------------------------------- */
a.pdf:before {
    display: inline-block;
    content: "\f1c1";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    margin-right: 0.5em;
}

/* modal : 汎用モーダル
----------------------------------------------- */
.modal {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 10000;
    display: none;
    text-align: left;
}

.modal-back {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    cursor: pointer;
}

.modal-box {
    background-color: #fff;
    border-radius: 4px;
    max-width: 80%;
    min-width: 768px;
    padding: 24px;
    top: 10%;
    left: 10%;
    position: absolute;
    cursor: auto;
}

.modal-box.othersite {
    max-width: 768px;
}

@media only screen and (max-width: 768px) {
    .modal-box {
        width: 94%;
        max-width: 94%;
        min-width: 240px;
        left: 3% !important;
        padding: 16px;
    }
}

.modal-box p:not(:first-child) {
    margin-top: 0.8em;
}

.modal-content {
    position: relative;
}

@media only screen and (max-width: 768px) {
    .modal-content {
        height: 100%;
    }
}

.modal-title {
    margin: 0;
    padding: 0 24px 16px 0px;
    font-size: 18px;
    border-bottom: 1px solid #dbdbdb;
}

.modal-txt {
    padding: 16px 0px 0;
    overflow: auto;
    max-height: 70vh;
}

.modal-close {
    height: 24px;
    width: 24px;
    position: absolute;
    right: 0;
    cursor: pointer;
}

.modal-close:hover {
    opacity: 0.8;
}

.modal-close .fa-times {
    fill: #333;
}

.modal .holdfund-table table {
    width: 600px;
}

@media only screen and (max-width: 768px) {
    .modal .holdfund-table table {
        width: auto;
    }
}

/* flexbox
----------------------------------------------- */
.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.flex-column {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.flex-wrap {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.flex-row,
.flex-row-2,
.flex-row-3,
.flex-row-4,
.flex-row-5 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -8px;
    width: calc(100% + 16px);
}

.flex-col {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1;
    padding: 8px;
}

.flex-row-2 .flex-col {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    max-width: 50%;
}

.flex-row-3 .flex-col {
    -ms-flex-preferred-size: 33%;
    flex-basis: 33%;
    max-width: 33%;
}

.flex-row-4 .flex-col {
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    max-width: 25%;
}

.flex-row-5 .flex-col {
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
    max-width: 20%;
}

@media only screen and (max-width: 768px) {
    .flex-row,
    .flex-row-2,
    .flex-row-3,
    .flex-row-4,
    .flex-row-5 {
        display: block;
    }
    .flex-row .flex-col,
    .flex-row-2 .flex-col,
    .flex-row-3 .flex-col,
    .flex-row-4 .flex-col,
    .flex-row-5 .flex-col {
        max-width: 100%;
    }
}

.flex-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.flex-list > div {
    width: 100%;
}

@media (max-width: 768px) {
    .flex-list {
        display: block;
    }
}

.justify-between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.justify-around {
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.justify-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.align-items-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

/* animation keyframes */
@-webkit-keyframes fadein {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes fadein {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fadeout {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@keyframes fadeout {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes fadeinout {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadeinout {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes framein-up {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes framein-up {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

/* list
----------------------------------------------- */
.normal-list {
    margin: 1em 0;
    -webkit-padding-start: 0;
    padding-inline-start: 0;
}

.normal-list li {
    list-style: disc;
    margin-left: 2em;
}

.link-list li {
    position: relative;
    margin: 0 0 0.5em;
    padding: 0 0 0 16px;
}

.link-list li > a {
    color: #04c;
}

.link-list li > a:hover {
    opacity: 0.5;
    text-decoration: underline;
}

.link-list li > a:before {
    position: absolute;
    top: calc(1em - 10px);
    left: 0;
    content: "";
    display: inline-block;
    border: solid 5px transparent;
    border-left-color: #04c;
    margin-right: 6px;
}

.termlist {
    padding-left: 0;
    list-style-type: none;
}

.termlist li {
    position: relative;
    padding-left: 2em;
}

.termlist .item {
    position: absolute;
    left: 0;
}

.aster-list {
    list-style: none;
}

.aster-list li {
    position: relative;
    padding-left: 1.5em;
}

.aster-list li:before {
    position: absolute;
    left: 0;
    content: "※";
}

.pdf-list {
  list-style: none;
}

.pdf-list li {
  position: relative;
  margin: 0.5rem 0 0 2em;
}

.pdf-list li:before {
  display: inline-block;
  position: absolute;
  left: -1.25em;
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  content: "\f1c1";
  color: #962511;
}

/* border-dl
登録の流れなど、下罫線付き一覧用
----------------------------------------------- */
.border-dl dt:not(:first-child) {
    border-top: solid 1px #ddd;
    padding-top: 24px;
    margin-top: 24px;
}

/* 新規登録フローなど
----------------------------------------------- */
@media only screen and (min-width: 769px) {
    .flow-list {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        margin: 0 auto;
        padding: 0;
    }
    .flow-list li {
        position: relative;
        background: #eee;
        margin: 0;
        padding: 0 8px;
        min-width: 6em;
        height: 40px;
        line-height: 40px;
        border-radius: 4px;
        color: #333;
        white-space: nowrap;
    }
    .flow-list li:not(:last-child) {
        margin: 0 30px 0 0;
        border-radius: 4px 0 0 4px;
    }
    .flow-list li:not(:last-child):after {
        content: "";
        display: block;
        border: solid 15px transparent;
        border-top-color: #eee;
        border-right-color: #eee;
        border-radius: 4px;
        position: absolute;
        top: calc(50% - 15px);
        right: -15px;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    .flow-list li.current {
        background: #4A2087;
        color: #fff;
    }
    .flow-list li.current:after {
        border-top-color: #4A2087;
        border-right-color: #4A2087;
    }
    .flow-list li.done {
        background: #ede8f3;
        color: rgba(51, 51, 51, 0.4);
    }
    .flow-list li.done:after {
        border-top-color: #ede8f3;
        border-right-color: #ede8f3;
    }
}

@media only screen and (max-width: 768px) {
    .flow-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    .flow-list li {
        list-style: none;
        position: relative;
        width: 20%;
        padding-top: 24px;
        font-size: 8px;
        line-height: 1.1;
        counter-increment: step;
        text-align: center;
    }
    .flow-list li:before {
        display: block;
        content: "";
        position: absolute;
        top: 10px;
        right: -50%;
        border-top: solid 1px #ddd;
        width: 100%;
    }
    .flow-list li:last-child:before {
        display: none;
    }
    .flow-list li:after {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        content: counter(step);
        position: absolute;
        top: 0;
        left: calc(50% - 10px);
        width: 20px;
        height: 20px;
        border-radius: 20px;
        margin: 0 auto 8px;
        background: #ddd;
    }
    .flow-list li.current:after {
        background: #4A2087;
        color: #fff;
    }
    .flow-list li.done:after {
        background: #ede8f3;
        color: rgba(51, 51, 51, 0.4);
    }
}

/* table
----------------------------------------------- */
.table-basic,
.table-border {
  border-spacing: 0;
}

.table-basic th, .table-basic td,
.table-border th,
.table-border td {
  padding: 4px 8px;
}

.table-basic th,
.table-border th {
  font-weight: bold;
}

.table-basic caption {
  font-weight: 600;
}

.table-basic th,
.table-basic td {
  border: solid 1px #ddd;
}

.table-basic th {
  font-weight: 400;
  background: #f9f9f9;
}

.table-border {
  border-top: solid 1px #ddd;
  border-left: solid 1px #ddd;
}

.table-border th,
.table-border td {
  border-right: solid 1px #ddd;
  border-bottom: solid 1px #ddd;
}

.table-border th {
  background: none;
}

.table-clear {
  border: none !important;
}

.table-clear th,
.table-clear td {
  padding: 4px 8px !important;
  border: none !important;
  background: none !important;
}

.table-clear th:first-child,
.table-clear td:first-child {
  padding-left: 0;
}

.table-clear th:last-child,
.table-clear td:last-child {
  padding-right: 0;
}

.table-clear thead th {
  white-space: nowrap;
}

.table-clear tbody th {
  font-weight: normal;
}

@media only screen and (max-width: 768px) {
.table-sp-row th, .table-sp-row td {
        display: block;
    }
    .table-basic .table-sp-row th, .table-basic .table-sp-row td {
        border-top: none;
    }
    .table-basic .table-sp-row:first-child {
        border-top: solid 1px #ddd;
    }
    .table-sp-col th, .table-sp-col td {
        display: table-cell;
    }
    .table-clear th,
    .table-clear td {
        padding: 4px;
    }
}

.table-sp-wrap {
    position: relative;
    overflow: auto;
}

.table-sp-wrap table {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

@media only screen and (max-width: 767px) {
    .table-sp-wrap th:first-child {
        white-space: nowrap;
    }
}

/* フォームパーツ
----------------------------------------------- */
input {
    outline: none;
}

input[type="text"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="email"] {
    line-height: 1;
    border-radius: 4px;
    border: solid 1px #ccc;
    padding: 4px;
}

.search-text {
    display: inline-block;
    position: relative;
}

.search-text input[type="text"] {
    border: solid 1px #ddd;
    border-radius: 4px;
    width: 100%;
    padding-right: 30px;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.search-text input[type="submit"] {
    position: absolute;
    top: calc(50% - 8px);
    right: 8px;
    display: block;
    background-color: transparent;
    border: none;
    border-radius: none;
    width: 16px;
    height: 16px;
    min-height: 0;
    padding: 0;
    background-image: url(data:image/png;base64,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);
    background-size: cover;
    background-position: center;
    font-size: 0;
    opacity: 0.5;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.search-text:hover input[type="text"] {
    border-color: #bbb;
}

.search-text:hover input[type="submit"] {
    opacity: 1;
}

.toggle-btns {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin: 0;
    padding: 0;
    background: #f6f6f6;
    border: solid 1px #ddd;
    border-radius: 4px;
    overflow: hidden;
}

.toggle-btns li {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 0;
}

.toggle-btns label {
    display: block;
    cursor: pointer;
    border-left: solid 1px #ddd;
    margin: 0;
    line-height: 30px;
    color: #999;
    text-align: center;
    white-space: nowrap;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.toggle-btns label:hover {
    color: #666;
}

.toggle-btns label:hover a {
    color: #666;
}

.toggle-btns a {
    color: #999;
    text-decoration: none;
}

.toggle-btns a:hover {
    color: #666;
}

.toggle-btns li:first-child a,
.toggle-btns li:first-child label {
    border-left: none;
}

.toggle-on {
    background: #fff;
    color: #000 !important;
    cursor: default !important;
}

.form-select {
    position: relative;
    display: inline-block;
    border: solid 1px #ddd;
    border-radius: 4px;
    background: #fff;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.form-select:before {
    display: inline-block;
    content: "";
    position: absolute;
    top: calc(50% - 6px);
    right: 8px;
    width: 12px;
    height: 12px;
    background-image: url(data:image/png;base64,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);
    background-size: cover;
    background-position: center;
    opacity: 0.5;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.form-select:hover {
    border-color: #bbb;
}

.form-select:hover:before {
    opacity: 1;
}

.form-select select {
    width: 100%;
    border: none;
    height: 30px;
    padding-left: 8px;
    background: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
}

.fund-search-sort, .form-selects {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  border: solid 1px #ddd;
  border-radius: 4px;
  background: #fff;
}

.fund-search-sort:hover, .form-selects:hover {
  border-color: #bbb;
}

.fund-search-sort .form-select, .form-selects .form-select {
  background: none;
  border: none;
  border-radius: 0;
  border-left: solid 1px #eee;
}

.fund-search-sort .form-select:first-child, .form-selects .form-select:first-child {
  border-left: none;
}

.fund-search-sort .form-select:hover, .form-selects .form-select:hover {
  border-color: #eee;
}

@media (min-width: 769px) {
  .fund-search .fund-search-sort, .fund-search .form-selects {
    width: calc(40% - 16px);
  }
}

.fund-search .form-select {
  width: 50%;
}

/* link
----------------------------------------------- */
.link-arrow:before {
    display: inline-block;
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    content: "\f105";
    margin-right: 0.3em;
}

.toggleArrow:before {
    display: inline-block;
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    content: "\f0da";
    width: 0.8em;
    text-align: center;
    margin-right: 0.3em;
}

.toggleArrow.active:before {
    content: "\f0d7";
}

.toggleFadein {
    opacity: 0;
    -webkit-animation: fadein 0.5s ease forwards;
    animation: fadein 0.5s ease forwards;
}

@keyframes fadein {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* button
----------------------------------------------- */
.btn,
.btn-translucent,
.btn-wire,
.btn-wire-gray,
.btn-std,
input.btn-std,
.btn-gray,
input.btn,
input.btn-translucent,
input.btn-wire,
input.btn-wire-gray,
input.btn-std,
input.btn-gray {
    display: inline-block;
    line-height: 1;
    padding: 13px 1em;
    font-weight: 600;
    white-space: nowrap;
    text-align: center;
    border: none;
    -webkit-transition: background 0.2s ease, opacity 0.2s ease;
    transition: background 0.2s ease, opacity 0.2s ease;
}

.btn:hover,
.btn-translucent:hover,
.btn-wire:hover,
.btn-wire-gray:hover,
.btn-std:hover,
.btn-gray:hover,
input.btn:hover,
input.btn-translucent:hover,
input.btn-wire:hover,
input.btn-wire-gray:hover,
input.btn-std:hover,
input.btn-gray:hover {
    text-decoration: none;
}

.btn-medium {
    font-size: 18px;
    padding: 15px 1em;
}

.btn-large {
    font-size: 24px;
    padding: 20px 1em;
}

@media (max-width: 768px) {
    .btn-large {
        font-size: 16px;
        padding: 15px 1em;
    }
}

.btn-small {
    font-size: 12px;
}

.btn-arrow {
    position: relative;
    padding-right: 40px;
}

.btn-arrow:after {
    position: absolute;
    right: 16px;
    top: calc(50% - 8px);
    display: block;
    font-family: "Font Awesome 5 Free";
    font-size: 16px;
    content: "\f054";
}

.btn-translucent {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.btn-translucent:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.2);
}

.btn-wire {
    -webkit-box-shadow: inset 0 0 1px 1px #4A2087;
    box-shadow: inset 0 0 1px 1px #4A2087;
    background: white;
    color: #4A2087 !important;
}

.btn-wire:hover {
    background: rgba(74,32,135,0.1);
}

.btn-wire-gray {
    -webkit-box-shadow: inset 0 0 1px 1px #ddd;
    box-shadow: inset 0 0 1px 1px #ddd;
    background: white;
    color: #333 !important;
}

.btn-wire-gray:hover {
    background: rgba(221, 221, 221, 0.2);
}

.btn-wire-gray.btn-arrow:after {
    color: #ddd;
}

.btn-std {
    border-radius: 0;
}

.btn-std,
input.btn-std {
    background: #4A2087;
    color: white !important;
}
.btn-std:hover,
input.btn-std:hover {
    background-color: #212121;
}

.btn-cta,
input.btn-cta {
    padding: 16px;
    font-size: 18px;
    border-bottom: solid 6px #4A2087;
    border-radius: 2px;
}

.btn-gray {
    background: #eee;
    color: #333;
}

.btn-gray:hover {
    background: #dadada;
    color: #333;
}

.btn-gray.btn-cta {
    border-bottom: solid 6px #d5d5d5;
    color: #909090;
    cursor: default;
}

.btn-gray.btn-cta:hover {
    background: #eee;
}

.btn-wire:disabled, .btn-wire.disabled {
    -webkit-box-shadow: inset 0 0 1px 1px #eee;
    box-shadow: inset 0 0 1px 1px #eee;
    background: #eee;
    color: #909090 !important;
}


/* navigation
----------------------------------------------- */
.navi-tab {
    margin: 0 0 40px;
    font-size: 16px;
}

.navi-tab ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: 0;
    border-bottom: solid 1px #ddd;
}

.navi-tab li {
    list-style: none;
    margin: 0;
}

.navi-tab a {
    display: block;
    line-height: 40px;
    margin-bottom: -1px;
    padding: 0 1.5em;
    color: #909090;
    text-decoration: none;
}

.navi-tab a:hover {
    color: #333;
}

.navi-tab .current-cat a {
    font-weight: 600;
    color: #333;
    border-bottom: solid 1px #4A2087;
}

@media (max-width: 768px) {
    .navi-tab {
        margin: 0 0 20px;
        font-size: 12px;
    }
    .navi-tab ul {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        border-bottom: none;
    }
    .navi-tab li {
        margin-top: 0.3rem;
        margin-bottom: 0.3rem;
    }
    .navi-tab a {
        padding: 0;
        margin-right: 1.5em;
        line-height: 2;
    }
}

/* pagination : ページャーリスト
----------------------------------------------- */
.pagination {
  margin-top: 20px;
}

.pagination .screen-reader-text {
    display: none;
}

.pagination ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: 0;
}

.pagination li {
    margin: 0;
    list-style: none;
    font-size: 14px;
}

.pagination a,
.pagination span {
    display: block;
    min-width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
}

.pagination a {
    color: #333;
    text-decoration: none;
}

.pagination a:hover {
    background: #f9f9f9;
}

.pagination span {
    color: #ddd;
}

.pagination .current {
    color: #333;
    background: #eee;
}

@media (max-width: 768px) {
    .pagination ul {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
}

/* icon
----------------------------------------------- */
.icon,
.icon-16,
.icon-24,
.icon-32,
.icon-64 {
    min-width: 16px;
    min-height: 16px;
    display: inline-block;
    vertical-align: middle;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.icon-16 {
    width: 16px;
    height: 16px;
}

.icon-24 {
    width: 24px;
    height: 24px;
}

.icon-32 {
    width: 32px;
    height: 32px;
}

.icon-64 {
    width: 64px;
    height: 64px;
}

/* .help-icon
-----------------------------------------------	*/
.icon-help,
.icon-help-white {
    display: inline-block;
    text-shadow: none;
    width: 14px;
    height: 14px;
    line-height: 1;
    border-radius: 100%;
    color: #909090;
    cursor: pointer;
    margin: 0;
    background-image: none !important;
}

.icon-help:before,
.icon-help-white:before {
    display: inline-block;
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    content: "\f059";
    font-size: 14px;
    line-height: 1;
}

.icon-help:hover,
.icon-help-white:hover {
    opacity: 0.7;
}

.icon-help {
    background-color: #fff;
}

.icon-help-white {
    color: #fff;
}

.icon-help-taparea {
    position: relative;
}

.icon-help-taparea:after {
    display: block;
    content: "";
    position: absolute;
    top: -12px;
    left: -12px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.call-help {
  cursor: pointer;
}

.call-help:hover {
  opacity: 0.7;
}

/* .help-tip : 汎用ヘルプチップ
-----------------------------------------------	*/
.help-tip {
    position: absolute;
    background: #fdf0e1;
    max-width: 300px;
    min-width: 200px;
    padding: 8px;
    z-index: 100;
    font-size: 12px;
    text-align: left;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    opacity: 0;
    -webkit-animation: fadein 0.2s ease both;
    animation: fadein 0.2s ease both;
}

.help-tip p {
    margin: 0.7em 0;
}

.help-tip p:first-child {
    margin-top: 0;
}

.help-tip:after {
    position: absolute;
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    bottom: -5px;
    left: calc(50% - 5px);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    background: #fdf0e1;
    -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
}

.mask {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    top: 0;
    left: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.5);
    position: fixed;
    width: 100vw;
    height: 100vh;
}

.unmask {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.loading-spinner {
    display: inline-block;
    padding: 24px;
    border-radius: 10%;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
}

.loading-spinner .fa-spinner.l {
    font-size: 64px;
}
.loading-spinner .fa-spinner.m {
    font-size: 32px;
}
.loading-spinner .fa-spinner.s {
    font-size: 16px;
}

@media (max-width: 768px) {
    .slide-table {
        position: relative;
        overflow-x: scroll;
        white-space: nowrap;
    }
    .slide-table .slide-icon {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 100px;
        height: 100px;
        position: absolute;
        top: calc(50% - 50px);
        left: calc(50% - 50px);
        font-size: 64px;
        background: rgba(0, 0, 0, 0.3);
        color: #fff;
        line-height: 1;
        border-radius: 4px;
        opacity: 0;
        -webkit-animation: fadeinout 4s ease infinite;
        animation: fadeinout 4s ease infinite;
    }
}

.dashboard-title {
    font-size: 1.1rem;
    margin: 2rem 0 0;
}

.dashboard-summary {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: auto -8px;
    font-size: 0.875rem;
}

.dashboard-summary .summary-asset {
    width: 320px;
}

.dashboard-summary .summary-score {
    width: calc(100% - 320px);
}

.dashboard-summary .summary-score .card-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.dashboard-summary .score-table {
    width: 240px;
}

.dashboard-summary .score-chart {
    width: calc(100% - 240px);
    padding-left: 16px;
}

.dashboard-summary table {
    width: 100%;
}

.dashboard-summary th, .dashboard-summary td {
    padding: 16px 0;
}

.dashboard-summary th {
    font-weight: 400;
    line-height: 1;
}

.dashboard-summary td {
    font-weight: 600;
    font-size: 1.5rem;
    text-align: right;
}

.dashboard-summary tr:first-child th, .dashboard-summary tr:first-child td {
    padding-top: 0;
}

.dashboard-summary tr:not(:first-child) th, .dashboard-summary tr:not(:first-child) td {
    border-top: solid 1px #eee;
}

.dashboard-summary small {
    font-size: 10px;
}

.dashboard-summary .btn-gray {
    width: 100%;
}

@media (max-width: 768px) {
    .dashboard-summary {
        display: block;
    }
    .dashboard-summary .summary-asset {
        width: auto;
    }
    .dashboard-summary .summary-score {
        width: auto;
    }
    .dashboard-summary .summary-score .card-wrap {
        display: block;
    }
    .dashboard-summary .summary-table,
    .dashboard-summary .score-table {
        width: auto;
    }
    .dashboard-summary .score-chart {
        width: auto;
        padding: 8px 0 0 0;
    }
    .dashboard-summary tr:first-child th, .dashboard-summary tr:first-child td {
        padding-top: 8px;
    }
    .dashboard-summary .btn-gray {
        font-size: 0.75rem;
    }
}

.dashboard-charts h3 {
    font-size: 1rem;
    font-weight: 400;
    text-align: center;
  }

  @media (max-width: 768px) {
    .dashboard-charts {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }
    .dashboard-charts .flex-col {
      width: 50%;
      -ms-flex-preferred-size: auto;
      flex-basis: auto;
    }
    .dashboard-charts .flex-col:first-child {
      width: 100%;
    }
    .dashboard-charts h3 {
      font-size: 0.75rem;
    }
  }

.mymessage-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

@media (max-width: 768px) {
    .mymessage-head {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
}

.mymessage-unread,
.mymessage-link {
    font-size: 14px;
}

.mymessage-unread {
    margin-left: 1em;
    font-weight: normal;
}

.mymessage-unread em {
    margin: 0 0.2em;
    color: #491D81;
}

@media (max-width: 768px) {
    .mymessage-unread {
        margin-left: auto;
    }
}

.mymessage-summary,
.mymessage-nav,
.mymessage-meta {
    font-size: 0.875rem;
}

.mymessage-summary {
    margin: 8px 0;
    border-top: solid 1px #eee;
}

.mymessage-summary a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0.625em;
    color: #999;
    background: #f9f9f9;
    border-bottom: solid 1px #eee;
}

@media (max-width: 768px) {
    .mymessage-summary a {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: 0.625em 0;
    }
}

.mymessage-summary .icon {
    padding-right: 5px;
}

@media (max-width: 768px) {
    .mymessage-summary .icon {
        padding: 0 4px;
        width: 24px;
    }
}

.mymessage-summary .title {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

@media (max-width: 768px) {
    .mymessage-summary .title {
        width: calc(100% - 24px);
    }
}

.mymessage-summary time {
    display: block;
    margin-left: auto;
    padding-left: 2em;
    white-space: nowrap;
    font-size: 12px;
    color: #999;
}

@media (max-width: 768px) {
    .mymessage-summary time {
        width: 100%;
        padding: 0 0 0 24px;
    }
}

.mymessage-summary .unread a {
    color: #333;
    background: none;
}

.mymessage-summary .unread a span {
    font-weight: 600;
}

.mymessage-summary a:hover {
    background: #eee;
    color: #333;
    text-decoration: none;
}

.mymessage-nav {
    margin: 8px 0;
    border-bottom: solid 1px #eee;
    -webkit-font-feature-settings: "palt" 1;
    font-feature-settings: "palt" 1;
}

.mymessage-nav ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 0 -1px;
}

@media (max-width: 768px) {
    .mymessage-nav ul {
        overflow-x: scroll;
    }
}

.mymessage-nav a {
    display: block;
    line-height: 40px;
    padding: 0 1.5em;
    color: #999;
    white-space: nowrap;
}

.mymessage-nav a:hover {
    color: #333;
    text-decoration: none;
}

@media (max-width: 768px) {
    .mymessage-nav a {
        padding: 0 0.5em;
    }
}

.mymessage-nav li.current-cat a {
    color: #333;
    border-bottom: solid 1px #4A2087;
}

.mymessage-nav li.unread a:after {
    display: inline-block;
    content: "";
    width: 0.5em;
    height: 0.5em;
    margin: 0 0 0.5em 0.5em;
    border-radius: 100%;
    background: #491D81;
}

.mymessage-nav i {
    margin-right: 4px;
}

@media (max-width: 768px) {
    .mymessage-nav {
        font-size: 0.75rem;
    }
}

.mymessage-summary .fa-circle {
    color: transparent;
}

.mymessage-summary .fa-exclamation-circle {
    color: #491D81;
}

.mymessage-summary .fa-star {
    color: #dc0;
}

.mymessage-meta {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 8px 0;
}

.mymessage-meta a {
    color: #999;
}

.mymessage-meta a:hover {
    color: #333;
}

.mymessage-meta i {
    margin-right: 4px;
}

.mymessage-meta .allread {
    margin-left: auto;
}

@media (max-width: 768px) {
    .mymessage-meta {
        font-size: 0.75rem;
    }
}

.portfolio-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 8px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 12px;
}

.portfolio-head-paragraph:not(:last-of-type) {
    margin-bottom: 8px;
}

.portfolio-table {
    width: 100%;
    margin-bottom: 8px;
}

.portfolio-table th,
.portfolio-table td {
    white-space: nowrap;
}

.portfolio-table th {
    padding: 8px;
}

.portfolio-table thead th {
    background: #f9f9f9;
    font-size: 0.75rem;
    font-weight: 600;
}

@media (max-width: 768px) {
    .portfolio-table thead th {
        font-size: 0.625rem;
    }
}

.portfolio-table thead th:not(:first-child) {
    width: 12em;
    padding: 8px 24px;
    text-align: center;
}

.portfolio-table tbody th,
.portfolio-table tbody td {
    font-size: 0.875rem;
    border-bottom: solid 1px #eee;
}

@media (max-width: 768px) {
    .portfolio-table tbody th,
    .portfolio-table tbody td {
        font-size: 0.75rem;
    }
}

.portfolio-table tbody th {
    font-weight: 400;
}

@media (max-width: 768px) {
    .portfolio-table tbody th {
        text-align: center;
        line-height: 1;
        font-size: 0.675rem;
    }
}

.portfolio-table tbody td {
    text-align: right;
    padding: 8px 24px;
}

.portfolio-table .irr {
    font-size: 1.125rem;
    font-weight: 600;
    color: #999;
    text-align: center;
}

.portfolio-table .gain {
    color: #3bb8b9;
}

.portfolio-table .loss {
    color: #f30;
}

.portfolio-chart {
    margin: 40px 0;
}

@media (max-width: 768px) {
    .portfolio-chart {
        margin: 24px 0;
    }
}

.portfolio-desc h3 {
    font-size: 0.875rem;
    font-weight: 400;
}

.portfolio-desc-body {
    display: none;
    font-size: 0.75rem;
    font-weight: 400;
}

.depositmoney-account {
  background-color: #eee;
  padding: 10px;
}

.table-userdata {
    width: 100%;
}

.table-userdata tr {
    border-bottom: solid 1px #ddd;
}

.table-userdata tr:first-child {
    border-top: solid 1px #ddd;
}

.table-userdata tr.parent {
    border-bottom: none;
}

.table-userdata th, .table-userdata td {
    padding: 1rem;
}

@media (max-width: 660px) {
    .table-userdata tr {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .table-userdata td {
        padding-top: 0;
    }
}

@media (min-width: 661px) {
    .performance-score {
        width: 380px;
    }
    .portfolio-charts {
      width: calc(100% - 380px);
    }
}

.performance-score-result {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-bottom: solid 1px #eee;
    margin: 0 0 8px 0;
    padding: 0 0 8px 0;
}

.performance-score-result dt {
    font-weight: 400;
    line-height: 2rem;
    margin: 0;
}

.performance-score-result dd {
    font-size: 1.5rem;
    font-weight: 600;
    text-align: right;
    line-height: 2rem;
    margin: 0;
}

@media (max-width: 660px) {
    .performance-score-result {
        display: block;
    }
    .performance-score-result dt {
        line-height: 1.5;
    }
}

.performance-score-table {
    width: 100%;
}

.performance-score-table th {
    font-weight: 400;
}

.performance-score-table td {
    text-align: right;
}

.performance-chart .card-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%;
}

@media (min-width: 661px) {
    .performance-chart {
        width: calc(100% - 380px);
    }
}

/* utility class : 他クラスに添加して余白などの微調整に使えるユーティリティクラス
-----------------------------------------------	*/
@media (max-width: 768px) {
    .sp-hide {
        display: none !important;
    }
}

@media (min-width: 769px) {
    .pc-hide {
        display: none !important;
    }
}

.hide,
.hidden,
[hide][hide] {
    display: none !important;
}

.box-center {
    margin-right: auto;
    margin-left: auto;
}

.inline-block {
    display: inline-block;
}

/* width & height
----------------------------------------------- */
.w10p {
    width: 10%;
}

.w20p {
    width: 20%;
}

.w25p {
    width: 25%;
}

.w30p {
    width: 30%;
}

.w33p {
    width: 33.333%;
}

.w40p {
    width: 40%;
}

.w50p {
    width: 50%;
}

.w60p {
    width: 60%;
}

.w70p {
    width: 70%;
}

.w75p {
    width: 75%;
}

.w80p {
    width: 80%;
}

.w90p {
    width: 90%;
}

.w100p {
    width: 100%;
}

.w100px {
    width: 100px;
}

.w200px {
    width: 200px;
}

.w300px {
    width: 300px;
}

.w400px {
    width: 400px;
}

.w500px {
    width: 500px;
}

.w600px {
    width: 600px;
}

.w700px {
    width: 700px;
}

.w800px {
    width: 800px;
}

@media (max-width: 768px) {
    .w400px,
    .w500px,
    .w600px,
    .w700px,
    .w800px {
        max-width: calc(100% - 20px);
    }
}

.h10p {
    height: 10%;
}

.h20p {
    height: 20%;
}

.h25p {
    height: 25%;
}

.h33p {
    height: 33.333%;
}

.h50p {
    height: 50%;
}

.h100p {
    height: 100%;
}

.lh1 {
    line-height: 1 !important;
}

.lh2 {
    line-height: 2 !important;
}

.lh3 {
    line-height: 3 !important;
}

.lh4 {
    line-height: 4 !important;
}

.lh5 {
    line-height: 5 !important;
}

/* margin & padding
----------------------------------------------- */
.m0 {
    margin: 0px !important;
}

.mt0 {
    margin-top: 0px !important;
}

.mr0 {
    margin-right: 0px !important;
}

.mb0 {
    margin-bottom: 0px !important;
}

.ml0 {
    margin-left: 0px !important;
}

.m8 {
    margin: 8px !important;
}

.mt8 {
    margin-top: 8px !important;
}

.mr8 {
    margin-right: 8px !important;
}

.mb8 {
    margin-bottom: 8px !important;
}

.ml8 {
    margin-left: 8px !important;
}

.m16 {
    margin: 16px !important;
}

.mt16 {
    margin-top: 16px !important;
}

.mr16 {
    margin-right: 16px !important;
}

.mb16 {
    margin-bottom: 16px !important;
}

.ml16 {
    margin-left: 16px !important;
}

.m24 {
    margin: 24px !important;
}

.mt24 {
    margin-top: 24px !important;
}

.mr24 {
    margin-right: 24px !important;
}

.mb24 {
    margin-bottom: 24px !important;
}

.ml24 {
    margin-left: 24px !important;
}

.m32 {
    margin: 32px !important;
}

.mt32 {
    margin-top: 32px !important;
}

.mr32 {
    margin-right: 32px !important;
}

.mb32 {
    margin-bottom: 32px !important;
}

.ml32 {
    margin-left: 32px !important;
}

.m40 {
    margin: 40px !important;
}

.mt40 {
    margin-top: 40px !important;
}

.mr40 {
    margin-right: 40px !important;
}

.mb40 {
    margin-bottom: 40px !important;
}

.ml40 {
    margin-left: 40px !important;
}

.m48 {
    margin: 48px !important;
}

.mt48 {
    margin-top: 48px !important;
}

.mr48 {
    margin-right: 48px !important;
}

.mb48 {
    margin-bottom: 48px !important;
}

.ml48 {
    margin-left: 48px !important;
}

.m56 {
    margin: 56px !important;
}

.mt56 {
    margin-top: 56px !important;
}

.mr56 {
    margin-right: 56px !important;
}

.mb56 {
    margin-bottom: 56px !important;
}

.ml56 {
    margin-left: 56px !important;
}

.m64 {
    margin: 64px !important;
}

.mt64 {
    margin-top: 64px !important;
}

.mr64 {
    margin-right: 64px !important;
}

.mb64 {
    margin-bottom: 64px !important;
}

.ml64 {
    margin-left: 64px !important;
}

.m72 {
    margin: 72px !important;
}

.mt72 {
    margin-top: 72px !important;
}

.mr72 {
    margin-right: 72px !important;
}

.mb72 {
    margin-bottom: 72px !important;
}

.ml72 {
    margin-left: 72px !important;
}

.m80 {
    margin: 80px !important;
}

.mt80 {
    margin-top: 80px !important;
}

.mr80 {
    margin-right: 80px !important;
}

.mb80 {
    margin-bottom: 80px !important;
}

.ml80 {
    margin-left: 80px !important;
}

.mtauto {
  margin-top: auto;
}

.mrauto {
  margin-right: auto;
}

.mbauto {
  margin-bottom: auto;
}

.mlauto {
  margin-left: auto;
}

.m10 {
    margin: 10px !important;
}

.mt10 {
    margin-top: 10px !important;
}

.mr10 {
    margin-right: 10px !important;
}

.mb10 {
    margin-bottom: 10px !important;
}

.ml10 {
    margin-left: 10px !important;
}

.m20 {
    margin: 20px !important;
}

.mt20 {
    margin-top: 20px !important;
}

.mr20 {
    margin-right: 20px !important;
}

.mb20 {
    margin-bottom: 20px !important;
}

.ml20 {
    margin-left: 20px !important;
}

.m30 {
    margin: 30px !important;
}

.mt30 {
    margin-top: 30px !important;
}

.mr30 {
    margin-right: 30px !important;
}

.mb30 {
    margin-bottom: 30px !important;
}

.ml30 {
    margin-left: 30px !important;
}

.p0 {
    padding: 0px !important;
}

.pt0 {
    padding-top: 0px !important;
}

.pr0 {
    padding-right: 0px !important;
}

.pb0 {
    padding-bottom: 0px !important;
}

.pl0 {
    padding-left: 0px !important;
}

.p8 {
    padding: 8px !important;
}

.pt8 {
    padding-top: 8px !important;
}

.pr8 {
    padding-right: 8px !important;
}

.pb8 {
    padding-bottom: 8px !important;
}

.pl8 {
    padding-left: 8px !important;
}

.p16 {
    padding: 16px !important;
}

.pt16 {
    padding-top: 16px !important;
}

.pr16 {
    padding-right: 16px !important;
}

.pb16 {
    padding-bottom: 16px !important;
}

.pl16 {
    padding-left: 16px !important;
}

.p24 {
    padding: 24px !important;
}

.pt24 {
    padding-top: 24px !important;
}

.pr24 {
    padding-right: 24px !important;
}

.pb24 {
    padding-bottom: 24px !important;
}

.pl24 {
    padding-left: 24px !important;
}

.p32 {
    padding: 32px !important;
}

.pt32 {
    padding-top: 32px !important;
}

.pr32 {
    padding-right: 32px !important;
}

.pb32 {
    padding-bottom: 32px !important;
}

.pl32 {
    padding-left: 32px !important;
}

.p40 {
    padding: 40px !important;
}

.pt40 {
    padding-top: 40px !important;
}

.pr40 {
    padding-right: 40px !important;
}

.pb40 {
    padding-bottom: 40px !important;
}

.pl40 {
    padding-left: 40px !important;
}

.p48 {
    padding: 48px !important;
}

.pt48 {
    padding-top: 48px !important;
}

.pr48 {
    padding-right: 48px !important;
}

.pb48 {
    padding-bottom: 48px !important;
}

.pl48 {
    padding-left: 48px !important;
}

.p56 {
    padding: 56px !important;
}

.pt56 {
    padding-top: 56px !important;
}

.pr56 {
    padding-right: 56px !important;
}

.pb56 {
    padding-bottom: 56px !important;
}

.pl56 {
    padding-left: 56px !important;
}

.p64 {
    padding: 64px !important;
}

.pt64 {
    padding-top: 64px !important;
}

.pr64 {
    padding-right: 64px !important;
}

.pb64 {
    padding-bottom: 64px !important;
}

.pl64 {
    padding-left: 64px !important;
}

.p72 {
    padding: 72px !important;
}

.pt72 {
    padding-top: 72px !important;
}

.pr72 {
    padding-right: 72px !important;
}

.pb72 {
    padding-bottom: 72px !important;
}

.pl72 {
    padding-left: 72px !important;
}

.p80 {
    padding: 80px !important;
}

.pt80 {
    padding-top: 80px !important;
}

.pr80 {
    padding-right: 80px !important;
}

.pb80 {
    padding-bottom: 80px !important;
}

.pl80 {
    padding-left: 80px !important;
}

.p10 {
    padding: 10px !important;
}

.pt10 {
    padding-top: 10px !important;
}

.pr10 {
    padding-right: 10px !important;
}

.pb10 {
    padding-bottom: 10px !important;
}

.pl10 {
    padding-left: 10px !important;
}

.p20 {
    padding: 20px !important;
}

.pt20 {
    padding-top: 20px !important;
}

.pr20 {
    padding-right: 20px !important;
}

.pb20 {
    padding-bottom: 20px !important;
}

.pl20 {
    padding-left: 20px !important;
}

.p30 {
    padding: 30px !important;
}

.pt30 {
    padding-top: 30px !important;
}

.pr30 {
    padding-right: 30px !important;
}

.pb30 {
    padding-bottom: 30px !important;
}

.pl30 {
    padding-left: 30px !important;
}

/* font & text
----------------------------------------------- */
.fs075rem {
  font-size: .75rem !important;
}

.fs1rem {
  font-size: 1rem !important;
}

.fs11rem {
  font-size: 1.1rem !important;
}

.fs12rem {
  font-size: 1.2rem !important;
}

.fs13rem {
  font-size: 1.3rem !important;
}

.fs14rem {
  font-size: 1.4rem !important;
}

.fs11rem {
    font-size: 1.1rem !important;
}

.fs12rem {
    font-size: 1.2rem !important;
}

.fs13rem {
    font-size: 1.3rem !important;
}

.fs14rem {
    font-size: 1.4rem !important;
}

.fs15rem {
  font-size: 1.5rem !important;
}

.fs2rem {
  font-size: 2rem !important;
}

.fs10 {
    font-size: 10px !important;
}

.fs11 {
    font-size: 11px !important;
}

.fs12 {
    font-size: 12px !important;
}

.fs13 {
    font-size: 13px !important;
}

.fs14 {
    font-size: 14px !important;
}

.fs15 {
    font-size: 15px !important;
}

.fs16 {
    font-size: 16px !important;
}

.fs17 {
    font-size: 17px !important;
}

.fs18 {
    font-size: 18px !important;
}

.fs19 {
    font-size: 19px !important;
}

.fs20 {
    font-size: 20px !important;
}

.fs24 {
    font-size: 24px !important;
}

.fs32 {
    font-size: 32px !important;
}

.ta-center {
    text-align: center !important;
}

.ta-right {
    text-align: right !important;
}

.ta-left {
    text-align: left !important;
}

.center {
    margin-right: auto;
    margin-left: auto;
}

.va-top {
    vertical-align: top !important th, td;
    vertical-align-vertical-align: top !important;
}

.va-middle {
    vertical-align: middle !important th, td;
    vertical-align-vertical-align: middle !important;
}

.va-bottom {
    vertical-align: bottom !important th, td;
    vertical-align-vertical-align: bottom !important;
}

.va-sub {
    vertical-align: sub !important th, td;
    vertical-align-vertical-align: sub !important;
}

.nowrap {
    white-space: nowrap;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.clear:before,
.clear:after {
    content: "";
    display: table;
}

.clear:after {
    clear: both;
}

/* color
----------------------------------------------- */
.bg-gray {
    background-color: #393939;
}

.bg-gray-light {
    background-color: #f9f9f9;
}

.bg-white {
    background-color: #fff !important;
}

.bg-main {
    background-color: #4A2087 !important;
}

.bg-pale-main {
    background-color: rgba(240, 150, 0, 0.1) !important;
}

.color-txt {
    color: #333;
}

.color-gray {
    color: #909090;
}

.color-red {
    color: #ff5677;
}

.color-blue {
    color: #2696eb;
}

.color-green {
    color: #3bb8b9;
}

.color-em {
    color: #491D81;
}

.color-main {
    color: #4A2087;
}

.color-warning {
    color: #c00;
}

.color-white {
    color: #fff;
}

.color-gain {
  color: #0a9;
}

.color-loss {
  color: #EA5E6F;
}

.copy-btn {
    position: relative;
    border: none;
    background: none;
    padding: 4px;
}
.copy-btn .tooltip,
.referral-link-container .copy-btn .tooltip {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #4A2087;
    color: #fff;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    transition: opacity 0.3s, visibility 0.3s;
    z-index: 10;
}
.copy-btn .tooltip.show,
.referral-link-container .copy-btn .tooltip.show {
    visibility: visible;
    opacity: 1;
}
.copy-btn .tooltip.error,
.referral-link-container .copy-btn .tooltip.error {
    background-color: red;
}
.copy-btn:focus {
    outline: none;
}

.fa-copy:before {
    color: gray;
}
.referral-link-container {
    border: 1px solid gray;
    display: flex;
    margin: 20px 0px;
    border-radius: 8px;
}

.referral-link-container .copy-btn .fa-copy:before {
    color: white;
    padding-right: 5px;
}
.referral-copy-btn {
    background-color: #4A2087;
    color: white;
    border-radius: 0 7px 7px 0;
    padding: 10px 20px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
}
.referral-copy-btn:hover {
    background-color: #212121;
}
.url-display {
    flex: 1;
    border-radius: 8px 0 0 8px;
    padding: 10px 20px;
    font-size: 14px;
    color: #333;
    word-break: break-all;
    white-space: nowrap;
    overflow: hidden; 
}
@media screen and (max-width: 768px) {
    .referral-copy-btn .btn-text {
        display: none !important;
    }
}