@charset "utf-8";
/* ----------------------------------------------------------------
    Reset
----------------------------------------------------------------- */
main {
    /* for IE 11 */
    display: block;
}

/* ----------------------------------------------------------------
    Content
----------------------------------------------------------------- */
/* .content
----------------------------------------------- */
.content {
    padding: 40px 0 30px;
}

.content-inner {
    width: 100%;
    max-width: 1220px;
    margin: 0 auto;
    padding: 0 10px;
}

.content-inner > *:first-child {
    margin-top: 0;
}

.content-inner > *:last-child {
    margin-bottom: 0;
}

@media only screen and (max-width: 714px) {
    .content {
        padding: 30px 0;
    }
}

/* ----------------------------------------------------------------
    Main Visual
----------------------------------------------------------------- */
/* .mv
----------------------------------------------- */
.mv {
    height: 400px;
    color: #fff;
    overflow: hidden;
    position: relative;
}

.mv::before,
.mv::after {
    content: "";
    display: block;
    border-style: solid;
    border-width: 180px 180px 0 0;
    position: absolute;
    z-index: 2;
}

.mv::before {
    width: 0;
    height: 0;
    border-width: 180px 180px 0 0;
    border-color: #0087ff transparent transparent transparent;
    top: 0;
    left: 0;
}

.mv::after {
    width: 0;
    height: 0;
    border-width: 0 0 180px 180px;
    border-color: transparent transparent #0087ff transparent;
    right: 0;
    bottom: 0;
}

.mv-inner {
    width: 100%;
    max-width: 883px;
    padding: 0 10px;
    position: absolute;
    top: 75px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
}

.mv-hdg {
    font-size: 2.2rem;
    text-align: center;
}

.mv-hdg ._sub {
    display: block;
    padding-bottom: 15px;
    font-weight: 400;
    letter-spacing: 0.2em;
    position: relative;
}

.mv-hdg ._sub::after {
    content: '';
    display: block;
    width: 100%;
    height: 3px;
    background: #fff;
    position: absolute;
    bottom: 0;
    left: 0;
}

.mv-hdg-image {
    display: block;
    margin-top: 28px;
}

.mv-image img {
    max-width: none;
    min-width: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 1;
    transform: translateX(-50%);
}

.mv-block {
    max-width: 884px;
    margin: 46px auto 0;
    padding: 12px 25px 13px 175px;
    background: #00c4a1;
    border-radius: 2px;
    position: relative;
}

.mv-block p {
    margin: 0;
    font-size: 1.8rem;
    line-height: 1.33333;
    letter-spacing: 0.07em;
}

.mv-block img {
    position: absolute;
    top: -24px;
    left: 20px;
}

@media only screen and (min-width: 1400px) {
    .mv {
        height: 0;
        padding-top: 28.572%;
    }
}

@media only screen and (max-width: 830px) {
    .mv-inner {
        top: 46px;
    }
}

@media only screen and (max-width: 714px) {
    .mv {
        height: initial;
    }

    .mv::before {
        border-width: 142px 142px 0 0;
    }

    .mv::after {
        border-width: 0 0 142px 142px;
    }

    .mv-inner {
        top: 50%;
        transform: translate(-50%, -50%);
    }

    .mv-hdg {
        font-size: 1.6rem;
    }

    .mv-hdg ._sub {
        padding-bottom: 6px;
    }

    .mv-hdg ._sub::after {
        height: 1px;
    }

    .mv-hdg-image {
        margin-top: 16px;
    }

    .mv-block {
        margin-top: 52px;
        padding: 67px 10px 15px 10px;
    }

    .mv-block p {
        font-size: 1.3rem;
        line-height: 1.5384;
    }

    .mv-block img {
        padding: 0 5px;
        top: -32px;
        left: 50%;
        transform: translateX(-50%);
    }

    .mv-image img {
        position: static;
        transform: translateX(0);
    }
}

/* ----------------------------------------------------------------
    List
----------------------------------------------------------------- */
/* .list-prod
----------------------------------------------- */
.list-prod {
    display: flex;
    flex-wrap: wrap;
    margin: -20px 0 0 -30px;
}

.list-prod > li {
    width: calc(100% / 3 - 30px);
    margin: 20px 0 0 30px;
    border: 1px solid #ccc;
}

.list-prod-link {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    align-items: center;
    height: 100%;
    padding: 20px;
    font-size: 2rem;
    font-weight: 700;
    text-decoration: none;
}

.list-prod-link > span {
    margin-left: 20px;
    padding-left: 30px;
    position: relative;
}

.list-prod-link > span::before {
    content: "";
    display: block;
    width: 9px;
    height: 9px;
    border-top: 1px solid #005bac;
    border-right: 1px solid #005bac;
    position: absolute;
    top: 12px;
    left: 0;
    transform: rotate(45deg);
}

@media only screen and (max-width: 850px) {
    .list-prod {
        width: 100%;
        flex-direction: column;
    }

    .list-prod > li {
        width: 100%;
    }

    .list-prod-link {
        font-size: 1.8rem;
    }

    .list-prod-link > span::before {
        top: 10px;
    }
}

/* .list-panel
----------------------------------------------- */
.list-panel {
    display: flex;
    flex-wrap: wrap;
    margin: -40px 0 0 -52px;
}

.list-panel > li {
    flex-basis: calc(50% - 52px);
    margin: 40px 0 0 52px;
}

@media only screen and (max-width: 850px) {
    .list-panel {
        flex-direction: column;
        margin: -30px 0 0;
    }

    .list-panel > li {
        margin: 30px 0 0;
    }
}

/* .list-seminar
----------------------------------------------- */
.list-seminar {
    display: flex;
    flex-wrap: wrap;
    margin: -30px 0 30px -30px;
}

.list-seminar > li {
    width: calc(100% / 3 - 30px);
    margin: 30px 0 0 30px;
    position: relative;
}

.list-seminar._col-02 > li {
    width: calc(100% / 2 - 30px);
    margin: 30px 0 0 30px;
    position: relative;
}


.list-seminar._col-01 > li {
    width: 100%;
    margin: 30px 0 0 30px;
    position: relative;
}

.list-seminar > li > a {
    display: block;
    height: 100%;
    padding: 20px;
    text-decoration: none;
    border: 1px solid #ccc;
}

.list-seminar > li > a::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: rgb(255, 255, 255, .4);
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    transition: opacity .1s ease-out;
}

.list-seminar > li > a:hover,
.list-seminar > li > a:active,
.list-seminar > li > a:focus {
    border-color: #ff96b9;
    color: inherit;
}

.list-seminar > li > a:hover::before,
.list-seminar > li > a:active::before,
.list-seminar > li > a:focus::before {
    opacity: 1;
}

.list-seminar > li > a:hover img,
.list-seminar > li > a:active img,
.list-seminar > li > a:focus img {
    opacity: 1;
}

.list-seminar-hdg {
    display: block;
    margin-bottom: 29px;
    padding: 4px 10px;
    background: #005bac;
    font-size: 2.2rem;
    font-weight: 400;
    color: #fff;
    text-align: center;
    text-decoration: none;
    position: relative;
}

.list-seminar-hdg:after {
    content: "";
    display: block;
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    position: absolute;
    top: 50%;
    right: 15px;
    transform: rotate(45deg) translateY(-50%);
}

.list-seminar-item {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
}

.list-seminar._col-01 > li .list-seminar-item {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
}

.list-seminar._col-01 > li .list-seminar-item .list-seminar-text {
    text-align: left;
    width: 70%;
    margin-left: 20px;
}

.list-seminar._col-01 > li .list-seminar-item .list-seminar-text p{
    text-align: left;
}

.list-seminar-item > img {
    margin-bottom: 19px;
}

.list-seminar-text > p {
    margin-bottom: 6px;
    font-size: 1.6rem;
    font-weight: 700;
    text-align: center;
}

.list-seminar-text > ul {
    margin: 0;
    font-size: 1.6rem;
}

.list-seminar-text > ul > li {
    margin-bottom: 5px;
    padding-left: 22px;
    position: relative;
}

.list-seminar-text > ul > li:before {
    content: url(/seminar/trial/images/icon-check.png);
    display: block;
    width: 17px;
    height: 17px;
    position: absolute;
    top: 3px;
    left: 0;
}

@media only screen and (max-width: 850px) {
    .list-seminar {
        flex-direction: column;
        margin: -30px 0 0;
    }

    .list-seminar > li {
        width: 100%;
        padding: 20px 15px;
        margin: 30px 0 0;
    }

    .list-seminar-hdg {
        margin-bottom: 20px;
        padding: 3px 10px;
        font-size: 1.8rem;
    }

    .list-seminar-text > p {
        font-size: 1.4rem;
    }

    .list-seminar-text > ul {
        font-size: 1.4rem;
    }

    .list-seminar-text > ul > li {
        margin-bottom: 4px;
    }

.list-seminar._col-01 {
        width: 100%;
        padding: 0;
        margin: -30px 0 30px -30px;
}

.list-seminar._col-01 > li .list-seminar-item  {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
}

}

/* .sa-list
----------------------------------------------- */
.sa-list > li {
    padding-left: 14px;
    position: relative;
}

.sa-list > li::before {
    content: "";
    display: block;
    width: 4px;
    height: 4px;
    background: #ccc;
    position: absolute;
    top: 10px;
    left: 0;
}

.sa-list > li {
    font-size: 1.6rem;
}

@media only screen and (max-width: 640px) {
    .sa-list > li {
        font-size: 1.4rem;
    }
}

/* ----------------------------------------------------------------
    Link
----------------------------------------------------------------- */
/* .ge-link-list
----------------------------------------------- */
.ge-link-list._ge-col-04 {
    display: flex;
    flex-wrap: wrap;
    margin: -7px 0 0 -2%;
}

.ge-link-list._ge-col-04 > li {
    width: calc(100% / 4 - 2%);
    margin: 7px 0 0 2%;
}

@media only screen and (max-width: 640px) {
    .ge-link-list._ge-col-04 {
        display: block;
    }

    .ge-link-list._ge-col-04 > li {
        width: 100%;
    }
}

/* ----------------------------------------------------------------
    Panel
----------------------------------------------------------------- */
/* .panel
----------------------------------------------- */
.panel {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 30px;
    border: 1px solid #ccc;
}

.panel-hdg {
    margin-bottom: 30px;
    padding: 4px 10px;
    background: #005bac;
    font-size: 2.2rem;
    font-weight: 400;
    color: #fff;
    text-align: center;
}

.panel-desc {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 19px;
}

.panel-desc-text {
    width: 56%;
}

.panel-desc-text > p {
    margin-bottom: 6px;
    font-size: 1.6rem;
    font-weight: 700;
}

.panel-desc-list {
    margin: 0;
    font-size: 1.6rem;
}

.panel-desc-list > li {
    margin-bottom: 5px;
    padding-left: 22px;
    position: relative;
}

.panel-desc-list > li:last-of-type {
    margin-bottom: 0;
}

.panel-desc-list > li::before {
    content: url(/seminar/trial/images/icon-check.png);
    display: block;
    width: 17px;
    height: 17px;
    position: absolute;
    top: 3px;
    left: 0;
}

.panel-desc-list > li > img {
    vertical-align: middle;
}

.panel-desc-image {
    display: flex;
    justify-content: center;
    flex-shrink: 0;
    width: 44%;
    padding: 0 10px;
}

.panel-text {
    font-size: 1.4rem;
}

.panel-box {
    padding: 20px;
    background: #f3f3f3;
}

.panel-btn {
    display: block;
    width: 100%;
    max-width: 370px;
    margin: 0 auto;
    padding: 10px 40px 11px;
    background: #ef8425;
    border-radius: 50vh;
    font-size: 1.6rem;
    color: #fff;
    text-align: center;
    text-decoration: none;
    position: relative;
    transition: background .2s ease-out;
}

.panel-btn:hover,
.panel-btn:active,
.panel-btn:focus {
    background: #ff9c00;
    color: #fff;
}

.panel-btn::after {
    content: "";
    display: block;
    width: 6px;
    height: 6px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%) rotate(-45deg);
}

@media only screen and (max-width: 850px) {
    .panel {
        padding: 20px 15px;
    }

    .panel-hdg {
        margin-bottom: 20px;
        padding: 3px 10px;
        font-size: 1.8rem;
    }

    .panel-desc {
        flex-direction: column-reverse;
        align-items: center;
        margin-bottom: 15px;
    }

    .panel-desc-text {
        width: 100%;
    }

    .panel-desc-text > p {
        font-size: 1.4rem;
        text-align: center;
    }

    .panel-desc-image {
        width: 100%;
        margin-bottom: 14px;
    }

    .panel-desc-list {
        font-size: 1.4rem;
    }

    .panel-desc-list > li {
        margin-bottom: 4px;
    }

    .panel-text {
        margin-bottom: 20px;
    }

    .panel-box {
        padding: 20px 15px;
    }

    .panel-btn {
        padding: 12px 40px;
        font-size: 1.4rem;
    }
}

/* ----------------------------------------------------------------
    Box
----------------------------------------------------------------- */
.box-privacy {
    padding: 25px 30px;
    border: 1px solid #ccc;
    margin-bottom: 48px;
}
.box-privacy > *:last-child {
    margin-bottom: 0;
}
.box-privacy__emphasis {
    text-align: center;
    margin-bottom: 16px;
    line-height: 2;
}
.box-privacy__hdg {
    position: relative;
    margin-bottom: 16px;
    text-align: center;
}
.box-privacy__hdg::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    background-color: #ccc;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.box-privacy__hdg > h3 {
    position: relative;
    display: inline-block;
    font-size: 1.8rem;
    text-align: center;
    padding: 0 16px;
    background-color: #fff;
}
@media only screen and (max-width: 640px) {
    .box-privacy {
        padding: 25px 15px;
    }
    .box-privacy__emphasis > em {
        font-size: 1.6rem;
    }
    .box-privacy__hdg > h3 {
        padding: 0 4px;
    }
    .box-privacy > .sa-list > li {
        font-size: 1.6rem;
    }
}

/* ----------------------------------------------------------------
    Media
----------------------------------------------------------------- */
/* .sa-media
----------------------------------------------- */
.sa-media {
    display: flex;
    flex-direction: column-reverse;
}

.sa-media > img {
    width: 100%;
    margin-bottom: 15px;
}

.sa-media-caption {
    font-size: 1.8rem;
    font-weight: 700;
    text-align: center;
}

/* .media-lyt
----------------------------------------------- */
.media-lyt {
    display: flex;
    margin-bottom: 55px;
}

.media-lyt._left {
    flex-direction: row-reverse;
}

.media-lyt .media-item {
    flex-shrink: 0;
    margin-left: 30px;
}

.media-lyt._left .media-item {
    margin-right: 30px;
    margin-left: 0;
}

@media only screen and (max-width: 640px) {
    .media-lyt {
        flex-direction: column-reverse;
        margin-bottom: 30px;
    }

    .media-lyt._left {
        flex-direction: column-reverse;
    }

    .media-lyt .media-item {
        width: 100%;
        margin-bottom: 28px;
        margin-left: 0;
    }

    .media-lyt .media-item > img {
        width: 100%;
    }

    .media-lyt._left .media-item {
        margin-right: 0;
    }
}

/* ----------------------------------------------------------------
    Table
----------------------------------------------------------------- */
/* .table
----------------------------------------------- */
.table {
    margin: 0 0 30px;
}

.table > table {
    width: 100%;
    table-layout: fixed;
}

.table > table > colgroup > col:first-of-type {
    width: 29%;
}

.table > table > colgroup > col:nth-child(2) {
    width: 29.2%;
}

.table > table > colgroup > col:nth-child(3) {
    width: 22.5%;
}

.table > table > colgroup > col:last-of-type {
    width: 232px;
}

.table > table > tbody > tr {
    background: #f5f5f5;
}

.table > table > tbody > tr + tr {
    border-top: 6px solid #fff;
}

.table > table > tbody th,
.table > table > tbody td {
    vertical-align: middle;
}

.table > table > tbody th :first-child,
.table > table > tbody td :first-child {
    margin-top: 0;
}

.table > table > tbody th :last-child,
.table > table > tbody td :last-child {
    margin-bottom: 0;
}

.table > table > tbody th {
    padding: 40px 30px;
    font-size: 1.6rem;
    font-weight: 700;
    text-align: left;
}

.table > table > tbody ._lb {
    display: block;
}

.table > table > tbody td {
    padding: 20px;
    position: relative;
}

.table > table > tbody td::before {
    content: "";
    display: block;
    width: 1px;
    height: 64%;
    background: #cacaca;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.table > table > tbody td [class*="link"] {
    margin-left: 10px;
}

.table > table > tbody td p {
    margin-bottom: 0;
}

.table > table > tbody td p._tel {
    font-size: 1.4rem;
    line-height: 1.3;
}

.table > table > tbody td p._date {
    font-size: 1rem;
    line-height: 1.8;
}

@media only screen and (max-width: 640px) {
    .table > table,
    .table > table > tbody th,
    .table > table > tbody td {
        display: block;
        text-align: center;
    }

    .table > table > tbody > tr + tr {
        border-top-width: 12px;
    }

    .table > table > tbody th,
    .table > table > tbody td {
        padding: 20px;
    }

    .table > table > tbody td::before {
        width: 88.5%;
        height: 1px;
        top: 0;
        left: 50%;
        transform: translate(-50%, 0);
    }

    .table > table > tbody td p {
        margin-bottom: 4px;
    }

    .table > table > tbody td p._tel,
    .table > table > tbody td p._date {
        margin-bottom: 0;
    }

    .table > table > tbody td p._tel {
        font-size: 1.6rem;
    }

    .table > table > tbody{
        display: block;
    }

    .table > table > tbody > tr{
        width: 100%;
        display: block;
    }

    .table > table > colgroup > col:first-of-type {
        width: 100%;
    }
}

/* ----------------------------------------------------------------
    Button
----------------------------------------------------------------- */
/* .sa-btn
----------------------------------------------- */
.sa-btn a,
.sa-btn button {
    display: inline-block;
    padding: 11px 24px;
    background: #ffa10a;
    box-shadow: inset 0 -3px #f18b0c;
    border-radius: 50vh;
    font-size: 1.8rem;
    font-weight: 700;
    color: #fff;
    text-align: center;
    text-decoration: none;
    transition: background 0.2s ease-out;
}

.sa-btn a:hover,
.sa-btn a:active,
.sa-btn a:focus,
.sa-btn button:hover,
.sa-btn button:active,
.sa-btn button:focus {
    background: #ff8d12;
}

.sa-btn._disabled span {
    display: inline-block;
    padding: 11px 24px;
    background: #ddd;
    box-shadow: inset 0 -3px #a0a0a0;
    border-radius: 50vh;
    font-size: 1.8rem;
    font-weight: 700;
    color: #a0a0a0;
    text-align: center;
    cursor: default;
}

@media only screen and (max-width: 640px) {
    .sa-btn {
        text-align: center;
    }

    .sa-btn a,
    .sa-btn button,
    .sa-btn._disabled span {
        width: 100%;
        max-width: 355px;
    }
}