.c-inner {
    width: calc(100% - 80px);
    max-width: 980px;
    margin-left: auto;
    margin-right: auto
}

.c-inner.c-inner--s {
    max-width: 750px
}

@media only screen and (max-width:767px) {
    .c-inner {
        width: 100%;
        max-width: none
    }
}

.header {
    position: relative !important; 
    width: 100vw;
    top: 0;
    left: 0;
    background: #fff;
    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .1);
    z-index: 100;

}

.header-inner {
    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
}

.header-upper-sp {
    display: none
}

@media only screen and (max-width:767px) {
    .header-upper-sp {
        height: 40px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding: 0 10px;
        border-bottom: 1px solid #ccc;
        overflow: hidden;
        -webkit-transition: height .2s, border-width .2s;
        transition: height .2s, border-width .2s
    }
}

@media only screen and (max-width:767px) {
    .is-scrolled .header-upper-sp {
        height: 0;
        border-width: 0
    }
}

.header-upper-sp__logo,
.splink {
    display: none !important;
}

.header-upper {
    padding: 7px 0;
    border-bottom: 1px solid #ccc;
    -webkit-transition: padding .2s;
    transition: padding .2s
}

@media only screen and (max-width:767px) {
    .header-upper {
        padding: 10px
    }
}

.header-upper__logo {
    display: block;
    width: 195px
}

@media only screen and (max-width:767px) {
    .header-upper__logo,
    .pclink {
        display: none !important;
    }

    .header-upper-sp__logo,
    .splink {
        display: block !important;
    }

    .header-upper-sp__logo {
        width: 130px;
        height: auto
    }
}

.header-upper__logo-sp {
    display: none
}

@media only screen and (max-width:767px) {
    .header-upper__logo-sp {
        display: block;
        width: calc(370/710*100%);
        max-width: 185px
    }
}

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

.header-utility-button {
    font-family: sans-serif;
    font-size: 12px;
    /*font-size: 1.2rem;*/
    font-weight: 700;
    line-height: 1;
    text-align: center;
    display: block;
    height: 32px;
    border-radius: 4px;
    position: relative
}

.header-utility-button svg {
    width: 8px;
    height: 10px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 10px;
    margin: auto;
    fill: none;
    stroke-width: 2;
    stroke-miterlimit: 10
}

.header-utility-button.header-utility-button--login {
    color: #999;
    width: 110px;
    padding: 8px 20px;
    border: 2px solid #999;
    -webkit-transition: color .2s, background-color .2s, border-color .2s;
    transition: color .2s, background-color .2s, border-color .2s
}

.header-utility-button.header-utility-button--login svg {
    stroke: currentColor;
    -webkit-transition: stroke .2s;
    transition: stroke .2s
}

.header-utility-button.header-utility-button--login:hover {
    color: #fff;
    background-color: #ccc;
    border-color: #ccc
}

.header-utility-button.header-utility-button--account {
    color: #fff;
    width: 120px;
    padding: 10px 20px;
    background: #d70d18;
    margin-left: 10px;
    text-indent: 10px;
    -webkit-transition: background-color .2s;
    transition: background-color .2s
}

.header-utility-button.header-utility-button--account:before {
    content: "";
    display: block;
    width: 15px;
    height: 10px;
    background: url(/https/kabu.com/kabuyomu/img/common/icon_account_header.png) no-repeat center;
    background-size: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 14px;
    margin: auto
}

.header-utility-button.header-utility-button--account:hover {
    background-color: #e45a62
}

.header-utility-button.header-utility-button--account svg {
    stroke: #fff
}

@media only screen and (max-width:767px) {
    .header-utility-button {
        font-size: 10px;
        text-align: left
    }

    .header-utility-button svg {
        width: 5px;
        height: 7px;
        right: 6px
    }

    .header-utility-button.header-utility-button--login {
        color: #999;
        width: 74px;
        padding: 10px;
        border: 1px solid #999;
        -webkit-transition: none;
        transition: none
    }

    .header-utility-button.header-utility-button--login svg {
        -webkit-transition: none;
        transition: none
    }

    .header-utility-button.header-utility-button--login:hover {
        color: #999;
        background-color: transparent;
        border-color: #999
    }

    .header-utility-button.header-utility-button--account {
        width: 74px;
        padding: 11px 10px;
        background: #d70d18;
        margin-left: 5px;
        text-indent: 0;
        -webkit-transition: none;
        transition: none
    }

    .header-utility-button.header-utility-button--account:before {
        content: none
    }

    .header-utility-button.header-utility-button--account:hover {
        background-color: #d70d18
    }
}

.header-main {
    padding: 15px 0
}

@media only screen and (max-width:767px) {
    .header-main {
        padding: 0
    }
}

.header-main__logo {
    display: block;
    width: calc(215/980*100%);
    max-width: 215px
}

@media only screen and (max-width:767px) {
    .header-main__logo {
        display: none
    }
}

.header-main__navi {
    max-width: calc(730/980*100%);
    overflow: hidden;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-width:767px) {
    .header-main__navi {
        max-width: initial
    }
}

.header-navi {
    font-size: 0;
    max-width: calc(100% - 60px);
    white-space: nowrap
}

@media only screen and (max-width:767px) {
    .header-navi {
        max-width: 100%
    }
}

.header-navi__item {
    font-size: 15px;
    font-size: 1.5rem;
    display: inline-block;
    font-weight: 700;
    line-height: 1;
    padding: 0 20px;
    position: relative;
    white-space: nowrap
}

.header-navi__item:before {
    content: "";
    display: block;
    width: 1px;
    height: 15px;
    background: #ccc;
    position: absolute;
    left: 0;
    top: 7px
}

.header-navi__item:first-child:before {
    content: none
}

.header-navi__item>a {
    color: #333;
    display: inline-block;
    padding: 7px 0 8px;
    position: relative
}

.header-navi__item>a:before {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background: currentColor;
    position: absolute;
    bottom: 0;
    left: 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transition: opacity .2s;
    transition: opacity .2s
}

.header-navi__item>a:hover {
    color: #d70c18
}

.header-navi__item>a:hover:before {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}

.header-navi__item>a.is-current {
    color: #d70c18
}

.header-navi__item>a.is-current:before {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}

@media only screen and (max-width:767px) {
    .header-navi__item {
        font-size: 1.2rem;
        padding: 0
    }

    .header-navi__item:before {
        height: 1em;
        top: 14px
    }

    .header-navi__item>a {
        padding: 14px
    }

    .header-navi__item>a:before {
        height: 3px;
        -webkit-transition: none;
        transition: none
    }

    .header-navi__item>a:hover:before {
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"
    }

    .header-navi__item>a.is-current:before {
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
    }
}

.header-navi-arrow {
    color: #666;
    width: 30px;
    height: 30px;
    background: #eee;
    border-radius: 4px;
    position: relative;
    z-index: 10
}

.header-navi-arrow:before {
    content: "";
    display: block;
    width: 20px;
    height: 30px;
    position: absolute;
    top: 0;
    pointer-events: none
}

.header-navi-arrow svg {
    width: 7px;
    height: 9px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-miterlimit: 10;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.header-navi-arrow.header-navi-arrow--prev:before {
    right: -20px;
    background: -webkit-linear-gradient(left, #fff 0, #fff 20%, rgba(255, 255, 255, 0) 100%);
    background: linear-gradient(to right, #fff 0, #fff 20%, rgba(255, 255, 255, 0) 100%)
}

.header-navi-arrow.header-navi-arrow--next:before {
    left: -20px;
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0, #fff 80%, #fff 100%);
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, #fff 80%, #fff 100%)
}

@media only screen and (max-width:767px) {
    .header-navi-arrow {
        display: none
    }
}

.footer {
    font-family: sans-serif;
    line-height: 1.5;
    font-size: 87.5%;
    color: #333;
    letter-spacing: .02em;
    border-top: 3px solid #a00
}

.footer a {
    color: #004d99;
    text-decoration: underline
}

div.footInfo01 {
    background: #e5e5e5;
    padding: 15px 0 10px;
    font-size: 11px
}

@media only screen and (max-width:767px) {
    div.footInfo01 {
        background: #ededed;
        padding: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

div.footInfo01 ul.footLink01 {
    width: calc(100% - 80px);
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
    zoom: 1
}

div.footInfo01 ul.footLink01:before,
div.footInfo01 ul.footLink01:after {
    content: "";
    display: table
}

div.footInfo01 ul.footLink01:after {
    clear: both
}

@media only screen and (max-width:767px) {
    div.footInfo01 ul.footLink01 {
        width: auto;
        max-width: initial;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    div.footInfo01 ul.footLink01:before,
    div.footInfo01 ul.footLink01:after {
        content: none
    }
}

div.footInfo01 ul.footLink01 li {
    float: left;
    border-left: 1px solid #cdcdcd;
    margin-left: 10px;
    padding-left: 10px
}

@media only screen and (max-width:767px) {
    div.footInfo01 ul.footLink01 li {
        float: none;
        width: 50%;
        margin-left: 0;
        padding-left: 0;
        border-left: none;
        border-bottom: 1px solid #ccc
    }

    div.footInfo01 ul.footLink01 li:nth-child(odd) {
        border-right: 1px solid #cdcdcd
    }
}

div.footInfo01 ul.footLink01 li:first-child {
    border-left: 0 none;
    margin-left: 0;
    padding-left: 0
}

div.footInfo01 ul.footLink01 li a {
    color: #333
}

@media only screen and (max-width:767px) {
    div.footInfo01 ul.footLink01 li a {
        display: block;
        padding: 8px 0 7px 9px;
        color: #333;
        text-decoration: underline;
    }
}

div.footInfo02 {
    padding: 10px 0;
    font-size: 11px;
    background: #ffffff;
}

@media only screen and (max-width:767px) {
    div.footInfo02 {
        padding: 0
    }
}

div.footInfo02 div.footInfo02-inner {
    width: calc(100% - 80px);
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
    zoom: 1
}

div.footInfo02 div.footInfo02-inner:before,
div.footInfo02 div.footInfo02-inner:after {
    content: "";
    display: table
}

div.footInfo02 div.footInfo02-inner:after {
    clear: both
}

@media only screen and (max-width:767px) {
    div.footInfo02 div.footInfo02-inner {
        width: auto;
        max-width: initial
    }
}

div.footInfo02 div.footInfo02-inner p {
    margin-bottom: 0
}

div.footInfo02 div.footInfo02-inner p.footLink02 {
    float: left
}

@media only screen and (max-width:767px) {
    div.footInfo02 div.footInfo02-inner p.footLink02 {
        background: #ededed;
        float: none
    }
}

div.footInfo02 div.footInfo02-inner p.footLink02 a {
    background: url(/https/kabu.com/kabuyomu/img/common/arrow_link_footer.svg) left .4em no-repeat;
    background-size: 4px 7px;
    padding-left: 11px;
    text-decoration: none;
    color: #6c778b
}

@media only screen and (max-width:767px) {
    div.footInfo02 div.footInfo02-inner p.footLink02 a {
        background: none;
        position: relative;
        display: block;
        padding: 8px 0 7px 9px;
        color: #333;
        text-decoration: underline;
    }
}

div.footInfo02 div.footInfo02-inner p.footLink02 a:hover {
    text-decoration: underline
}

div.footInfo02 div.footInfo02-inner p.copyright {
    float: right;
    color: #666
}

@media only screen and (max-width:767px) {
    div.footInfo02 div.footInfo02-inner p.copyright {
        float: none;
        margin-bottom: 0;
        background-size: 4px 1px;
        -webkit-background-size: 4px 1px;
        padding: 10px 0 9px;
        color: #666;
        text-align: center
    }
}

div.footInfo03 {
    border-top: 1px dashed #cdcdcd;
    padding: 15px 0 20px;
    font-size: 11px;
    background: #ffffff;
}

@media only screen and (max-width:767px) {
    div.footInfo03 {
        padding: 0 0 9px;
    }
}

div.footInfo03 div.footInfo03-inner {
    width: calc(100% - 80px);
    max-width: 980px;
    margin-left: auto;
    margin-right: auto
}

@media only screen and (max-width:767px) {
    div.footInfo03 div.footInfo03-inner {
        width: auto;
        max-width: initial
    }
}

div.footInfo03 div.footInfo03-inner p.txt01 {
    margin-bottom: 20px;
    color: #666
}

@media only screen and (max-width:767px) {
    div.footInfo03 div.footInfo03-inner p.txt01 {
        color: #333;
        margin: 7px 10px 0;
        line-height: 1.8
    }
}

div.footInfo03 div.footInfo03-inner div.logo01 {
    padding-bottom: 18px;
    border-bottom: 1px solid #e60000;
    zoom: 1
}

div.footInfo03 div.footInfo03-inner div.logo01:before,
div.footInfo03 div.footInfo03-inner div.logo01:after {
    content: "";
    display: table
}

div.footInfo03 div.footInfo03-inner div.logo01:after {
    clear: both
}

@media only screen and (max-width:767px) {
    div.footInfo03 div.footInfo03-inner div.logo01 {
        display: none
    }
}

div.footInfo03 div.footInfo03-inner div.logo01 p.kabucom {
    float: left;
    width: 130px;
    margin-bottom: 0
}

div.footInfo03 div.footInfo03-inner div.logo01 p.mufg {
    float: right;
    width: 160px;
    margin-bottom: 0
}

@media only screen and (max-width:767px) {
    .u-hidden--sp {
        display: none
    }
}