@charset "UTF-8";

/*        text                */

.sans-serif {
    font-family: "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
}

a {
    color: #0f0f33;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

p,
h1,
li {
    color: #0f0f33;
}

.br::before {
    content: "\A";
    white-space: pre;
}

/*         共通スタイル            */

body {
    box-sizing: border-box;
}

#wrap {
    max-width: 1600px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    overflow: hidden;
    box-sizing: border-box;
}

.PChide {
    display: none;
}

.responsive {
    width: 100%;
    max-width: 100%;
    height: auto;
}

.PClogo {
    height: 50px;
}

.SPlogo {
    height: 40px;
}

.clearfix:after {
    content: "";
    display: block;
    clear: both;
}

.clearfix:before {
    content: "";
    display: block;
    clear: both;
}

.clearfix {
    display: block;
}


/*         アニメーション呼び出し            */

.slidedown {
    animation-name: slidedown;
    animation-duration: 1.5s;
    animation-timing-function: ease-out;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: forwards;
    transition: all .1s ease-out;
}

.toptodown {
    animation-name: toptodown;
    animation-duration: 1.5s;
    animation-timing-function: ease-out;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: forwards;
    transition: all .1s ease-out;
}

/*         アニメーションキーフレーム           */
@keyframes toptodown {
    0% {
        opacity: 0;
        transform: translate3d(0, -150px, 0);
        color: #fff;
    }

    100% {
        opacity: 1;
        color: #0f0f33;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes delay {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slidedown {
    from {
        opacity: 0;
        transform: translatey(300px);
    }

    to {
        opacity: 1;
        transform: translatey(0);
    }
}

/*           header                    */

header {
    width: 100%;
    overflow: hidden;
    box-sizing: border-box;
    margin: 0 auto;
    display: flex;
    justify-content: center;
}

.header_inner {
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 8px;
    display: flex;
    justify-content: space-between;
    align-content: center;
    flex-wrap: wrap;
    box-shadow: 0px 3px 6px 0px rgba(51, 51, 51, 0.5);
    z-index: 100;
    height: auto;
    position: relative;
    box-sizing: border-box;
}

header h1 {
    order: 1;
    margin-right: auto;
    align-self: center;
}

header h1 img {
    margin-left: 20px;
}

#header_menu {
    order: 2;
    align-self: flex-end;
    margin-left: auto;
    align-self: center;
}

#header_menu ul li a {
    color: #28256c;
    display: block;
}

#first_nav {
    text-align: right;
    display: flex;
    justify-content: flex-end;
    margin-right: 40px;
}

#first_nav a {
    padding-left: 1em;
}

#first_nav a:hover {
    color: #28a7e1;
}

.fa-phone {
    transform: rotatey(180deg);
    margin-right: 10px;
    margin-bottom: 0.5em;
}

#second_nav {
    margin-top: 0.5px;
    transform: translateX(-40px);
    display: flex;
}

#second_nav li {
    padding: 0 15px;
}

#second_nav li a {
    position: relative;
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
}

#second_nav li:nth-child(3) {
    padding-right: 0px;
}


#second_nav a::after {
    position: absolute;
    display: block;
    top: 20px;
    content: "";
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 0%;
    background-color: #28a7e1;
    transition: 0.25s ease-in-out;
    height: 2px;
}

#second_nav a:hover::after {
    width: 100%;
}

#second_nav li span {
    position: relative;
}

#second_nav li span::before {
    display: block;
    position: absolute;
    top: 0.4em;
    left: -1em;
    width: 1em;
    height: 16px;
    content: "";
    border-left: 2px solid #28a7e1;
    color: #28a7e1;
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
}

.header_icon {
    padding-right: 0.5em;
    color: #28a7e1;
    font-weight: 900;
}

/*             パンくずリスト                */

#breadcrumb {
    padding: 15px 0 5px 0;
    margin: 0 10px 10px 10px;
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
}

#breadcrumb ol {
    margin-left: 20px;
    display: table;
}

#breadcrumb ol li {
    display: table-cell;
    white-space: nowrap;
    vertical-align: middle;
    position: relative;
    padding-right: 30px;
}

#breadcrumb li a {
    color: #35318f;
    display: block;
}

/*       ＞の設定        */

#breadcrumb ol li::after {
    position: absolute;
    display: block;
    content: '';
    content: ">";
    top: 0;
    bottom: 1px;
    right: 8px;
    color: #35318f;
}

#breadcrumb ol li:last-child {
    padding-right: 0;
    font-weight: bold;
    color: #35318f;
}

#breadcrumb ol li:last-child::after {
    display: none;
}

/*      スクロールバー    */
#breadcrumb::-webkit-scrollbar {
    height: 5px;
}

#breadcrumb::-webkit-scrollbar-track {
    border-radius: 5px;
    background: #eee;
}

#breadcrumb::-webkit-scrollbar-thumb {
    border-radius: 5px;
    background: #999;
}

.disabled {
    pointer-events: none;
    opacity: 0.65;
}


/*             コンテンツ部分               */
#content_header {
    height: auto;
    margin-top: 0;
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    margin-top: -8px;
    position: relative;
}

.inner {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: auto;
    width: 100%;
    margin-top: 90px;
    margin-left: auto;
    margin-right: auto;
}

.inner_title {
    font-weight: bold;
    font-size: 250%;
    margin-bottom: 75px;
}

.inner_title_min {
    font-weight: bold;
    font-size: 200%;
    margin-bottom: 75px;
}

.inner_title_2 {
    margin-bottom: 20px;
    margin-top: 60px;
    line-height: 1.2;
    color: #1a3d8d;
}

.school_box {
    display: flex;
    margin-bottom: 50px;
    flex-wrap: wrap;
}

.school_box h2 {
    flex-basis: 100%;
    font-size: 200%;
    text-align: left;
    font-weight: bold;
    margin-bottom: 30px;
}

.school_box img {
    max-width: 530px;
    height: auto;
    margin: auto;
    flex-basis: 530px;
}

.school_txt {
    line-height: 2;
    text-align: justify;
    flex-basis: unset;
    max-width: 450px;
}

#price_list,
#cost {
    width: auto;
    max-width: 1080px;
    box-sizing: border-box;
    margin: 0 auto;
}

.price_title {
    font-size: 200%;
    text-align: left;
    font-weight: bold;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
    max-width: 1080px;
    width: auto;
    color: #0f0f33;
}

#price_list > table th,
#price_list > table td {
    text-align: center;
    vertical-align: middle;
}

#PCtable {
    border: 2px solid #CCC;
    width: 1080px;
    margin-bottom: 20px;
}

#PCtable th {
    white-space: nowrap;
    font-weight: bold;
}

#PCtable .room {
    padding: 20px;
    font-size: 14px;
    background-color: #adddf4;
    color: #483d8b;
}

#PCtable .corner {
    background-color: #98d5f1;
    padding: 30px;
}

#PCtable .week {
    font-size: 20px;
    padding: 30px;
    background-color: #98d5f1;
    color: #483d8b;
}

#PCtable .even {
    background-color: #E5F4FB;
}

#PCtable th,
#PCtable td {
    border: 2px solid #CCC;
}

.note {
    white-space: nowrap;
    text-align: left;
    font-size: 87.5%;
}

.note p {
    margin-bottom: 15px;
}

#cost {
    margin-top: 50px;
    margin-bottom: 30px;
}

#cost > * {
    text-align: left;
}

#cost > h4 {
    color: #1a3d8d;
}

#cost > h3 {
    margin-bottom: 20px;
}

#cost h4 + p {
    margin-bottom: 20px;
    margin-top: 0.5em;
}

.mt {
    margin-top: 15px;
}

.mb {
    margin-bottom: 15px;
}

.red {
    color: #ff0000;
    margin-left: 1em;
}

.desc {
    margin-left: 1em;
}

.desc2 {
    margin-left: 2em;
}

.flex {
    display: flex;
    display: -ms-flexbox;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    width: 30%;
}

hr.tab-r-line {
    position: relative;
    top: calc(50% - 1px);
    margin: 0 10px;
    border: none;
    border-top: dotted 2px #CCC;
}

.tab-reader-box2 {
    flex: auto;
}

.flex_parent {
    display: flex;
    margin-top: 15px;
}

#school_introduction {
    margin-top: 90px;
    margin-bottom: 50px;
    text-align: center;
}

#school_introduction #video {
    max-width: 560px;
    width: 100%;
    min-height: 315px;
}

.gallery {
    margin-top: 100px;
    width: 100%;
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
    font-size: 0;
}

.space {
    width: 200px;
}

.empty {
    height: 0;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
}

.gallery a {
    margin-left: 10px;
    margin-right: 10px;
    display: inline-block;
}

.gallery img {
    width: 200px;
    height: 150px;
    margin-bottom: 20px;
    overflow: hidden
}

.object-fit-img {
    width: 200px;
    height: 150px;
    object-fit: cover;
    object-position: center;
    font-family: 'object-fit: cover; object-position: center;'
}

#pdf_btn {
    height: auto;
    top: 30;
    display: inline-block;
    font-weight: bold;
    padding: 30px;
    text-decoration: none;
    color: #FFF;
    background: #28a7e1;
    transition: .1s;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    font-size: 187.5%;
    display: flex;
    justify-content: center;
    align-self: center;
    align-items: center;
    white-space: nowrap;
    border-radius: 10px;
    margin-bottom: 70px;
    border: 2px solid #28a7e1;
    box-sizing: border-box;
}

#pdf_btn i {
    margin-left: 0.5em;
}

/*         リンクエリア           */

#link_btn {
    max-width: 1080px;
    width: 100%;
    margin: 0 auto;
    margin-top: 50px;
    margin-bottom: 50px;
}


.btn-flat-logo:nth-child(2) {
    margin-left: 100px;
}

.btn-flat-logo {
    position: relative;
    display: inline-block;
    font-weight: bold;
    padding: 25px 15px;
    text-decoration: none;
    color: #FFF;
    background: #28a7e1;
    transition: .1s;
    max-width: 400px;
    width: 100%;
    height: auto;
    font-size: 100%;
    white-space: nowrap;
    border: 2px solid #28a7e1;
    box-sizing: border-box;
}

/*            footer                 */
footer {
    max-width: 1280px;
    width: 100%;
    margin: 0 auto;
    white-space: nowrap;
    text-align: center;
}

.footer_inner {
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    padding: 0.2em;
    margin-top: 50px;
    margin-bottom: 20px;
}

footer h2 {
    order: -1;
    margin-left: 50px;
    align-self: center;
    margin-bottom: 10px;
}

footer img {
    height: 37px;
}

#footer_menu {
    order: 0;
    align-self: center;
    flex-basis: 500px;
    max-width: 500px;
}

#footer_menu ul {
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    margin-left: 2em;
    white-space: nowrap;
}

#footer_menu li {
    padding-right: 1em;
    color: #666666;
}

#footer_menu li a {
    color: #666666;
}

#footer_menu ul li:first-child ::after {
    content: "/";
    padding-left: 1em;
}


.copy {
    font-family: 'Times New Roman', 'Times';
    margin-right: 0.5em;
}

#copyright {
    order: 1;
    align-self: center;
    font-style: normal;
    color: #666666;
    font-weight: 100;
    margin-right: 50px;
}

/*                  トップへ戻るボタン                        */

.pagetop {
    position: fixed;
    bottom: 60px;
    right: 5px;
    display: none;
}

.pagetop a {
    display: block;
    background: #28a7e1;
    box-sizing: border-box;
    border: 1px solid #28a7e1;
    color: #fff;
    padding: 15px 10px;
    text-align: center;
    text-decoration: none;
    font-weight: 900;
}

/*              スマートフォン用                 */


@media screen and (max-width:750px) {

    /*          共通設定               */
    html {
        height: 100%;
        overflow: hidden;
    }

    body {
        height: 100%;
        position: relative;
        width: 100%;
        width: auto;
        /* for ie */
        overflow-x: hidden;
    }

    .header_inner,
    .footer_inner {
        width: 100%;
        width: auto;
        /* for ie */
        max-width: 100%;
        box-sizing: border-box;
    }

    #wrap {
        max-width: 100%;
        width: auto;
        text-align: center;
        box-sizing: border-box;
    }

    .SPhide {
        display: none;
    }

    .PClogo {
        height: 30px;
    }

    .SPlogo {
        height: 40px;
    }

    .br2::before {
        content: "\A";
        white-space: pre;
    }

    /*          header       */

    .header_inner {
        background-color: #fff;
        z-index: 10;
        width: 100%;
        padding-top: 5px;
        padding-bottom: 5px;
        padding-left: 0px;
        padding-right: 0px;
        position: fixed;
        top: 0;
        left: 0;
    }

    .header_inner h1 {
        order: 1;
        padding-top: 5px;
    }

    .header_inner h1 img {
        margin-left: 0.5em;
    }

    #nav-toggle {
        display: block;
        cursor: pointer;
    }

    #nav-toggle > div {
        position: relative;
        width: 30px;
        height: 30px;
        margin: 5px;
    }

    #nav-toggle span {
        width: 100%;
        height: 2px;
        left: 0;
        display: block;
        background: #999;
        position: absolute;
        transition: top 0.5s ease, -webkit-transform 0.6s ease-in-out;
        transition: transform 0.6s ease-in-out, top 0.5s ease;
        transition: transform 0.6s ease-in-out, top 0.5s ease, -webkit-transform 0.6s ease-in-out;
    }

    #nav-toggle span:nth-child(2) {
        top: 14px;
    }

    #nav-toggle span:nth-child(1) {
        top: 4px;
    }

    #nav-toggle span:nth-child(3) {
        top: 23px;
    }

    #sp_icon {
        order: 2;
        display: block;
        margin-right: 10px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #nav-toggle,
    #phonebtn {
        border: 2px solid #ccc;
        margin-left: 10px;
        padding: 0px;
        align-self: center;
    }

    #nav-toggle,
    #phonebtn {
        z-index: 1000;
    }

    #phonebtn img {
        height: auto;
        width: 30px;
        display: block;
        margin: 5px;
    }

    #SP_menu {
        display: block;
        background: rgb(255, 255, 255);
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        text-align: center;
        display: flex;
        justify-content: flex-start;
        flex-direction: column;
        width: 100vw;
        height: auto;
        min-height: 100vh;
        z-index: 999;
        padding-top: 80px;
        visibility: hidden;
        opacity: 0;
        opacity: 0;
        transition: opacity 0.2s ease, visibility 0.2s ease;
    }

    #SP_menu h2 {
        display: block;
        margin-top: 10px;
        order: 2;
        padding-bottom: 20px;
        align-self: flex-start;
        padding-left: 0.6em;
    }

    header p .br::before {
        content: "\A";
        white-space: pre;
    }

    #SP_menu p {
        color: #0f0f33;
        display: block;
        order: 1;
        align-self: flex-start;
        text-indent: 1em;
        padding-left: -1em;
        line-height: 1.25em;
        margin-top: 0.2em;
        font-size: 75%;
    }

    #gnavSP {
        display: block;
        order: 3;
        margin-top: 30px;
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#0f0f33+0,005b97+100 */
        background: rgb(15, 15, 51);
        /* Old browsers */
        background: -moz-linear-gradient(top, rgba(15, 15, 51, 1) 0%, rgba(0, 91, 151, 1) 100%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(top, rgba(15, 15, 51, 1) 0%, rgba(0, 91, 151, 1) 100%);
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, rgba(15, 15, 51, 1) 0%, rgba(0, 91, 151, 1) 100%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0f0f33', endColorstr='#005b97', GradientType=0);
        /* IE6-9 */
        padding-bottom: 500px;
    }

    #gnavSP ul li {
        border-top: 1px solid #ccc;
        background-image: url(../img/spnav_arrow.png);
        background-repeat: no-repeat;
        background-position: right 10px center;
    }

    #gnavSP ul {
        text-align: left;
    }

    #gnavSP ul li:first-child {
        border-top: none;
    }

    #gnavSP ul li:last-child {
        border-bottom: 1px solid #ccc;
    }

    #gnavSP ul li a {
        padding-top: 30px;
        padding-bottom: 30px;
        padding-left: 1em;
        color: #fff;
        font-size: 87.5%;
        display: block;
    }

    .open #SP_menu {
        visibility: visible;
        opacity: 1;
    }

    .open #nav-toggle span {
        background: #999;
    }

    .open #nav-toggle span:nth-child(1) {
        top: 15px;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    .open #nav-toggle span:nth-child(2) {
        top: 15px;
        width: 0;
        left: 50%;
    }

    .open #nav-toggle span:nth-child(3) {
        top: 15px;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

    /*             パンくずリスト                */
    #breadcrumb ol {
        font-size: 12px;
        margin-left: 5px;
    }

    /*           コンテンツ部分                */

    .pagetop a:active {
        background: transparent;
        color: #28a7e1;
    }

    #pdf_btn:active,
    .btn-flat-logo:active {
        color: #28a7e1;
        background-color: #fff;
        border: 2px solid #28a7e1;
    }

    #breadcrumb li a:active {
        text-decoration: underline;
    }

    .inner {
        min-width: inherit;
        margin-top: 0;
    }

    .inner_title {
        margin-bottom: 50px;
        font-size: 150%;
        letter-spacing: 0.5px;
    }

    #content_header {
        margin-top: 55px;
    }

    #content_header .PChide {
        display: block;
        width: 100%;
    }


    .price_title {
        margin-left: 5%;
    }

    #price_list {
        max-width: inherit;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
    }

    #PCtable {
        display: block;
        height: auto;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 10px;
        padding-left: 20px;
        border: none;
        width: unset;
    }

    #PCtable th,
    #PCtable td {
        border: 2px solid #CCC;
    }

    #PCtable th {
        line-height: 1.5;
    }

    #PCtable .room {
        font-size: 18px;
        padding: 15px 30px;
        background-color: #adddf4;
    }

    #PCtable .week {
        font-size: 24px;
        padding: 20px 30px;
        width: 50px;
        background-color: #98D5F1;
    }

    #PCtable .corner {
        background-color: #adddf4;
    }

    #PCtable .even td {
        background-color: #E5F4FB;
    }

    .note {
        padding-left: 35px;
    }

    #cost {
        max-width: inherit;
        width: 90%;
        font-size: 87.5%;
    }

    #cost > p {
        line-height: 2;
    }

    .mt {
        margin-top: 0px;
    }

    .mb {
        margin-bottom: 0px;
    }

    span.tab-reader-box2 {
        display: none;
    }

    .flex_parent,
    .flex {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: flex-start;
        white-space: nowrap;
        line-height: 1.5;
    }

    #pdf_btn {
        max-width: inherit;
        max-width: 350px;
        width: 90%;
        font-size: 100%;
        font-weight: normal;
    }

    #school_introduction #video {
        width: 90%;
    }

    .school_box {
        justify-content: center;
        flex-direction: column;
    }

    .school_txt {
        order: 1;
        /* margin-left: 5%; */
        /* margin-right: 5%; */
        margin: 0 auto;
        width: 90%;
    }

    .school_box img {
        order: -1;
        width: 100%;
        flex-basis: unset;
        /*        margin-left: 5%;*/
    }

    .school_box h2 {
        order: 0;
        margin-top: 20px;
    }

    .gallery {
        margin-top: 50px;
        width: 100%;
        flex-wrap: wrap;
        margin-left: auto;
        margin-right: auto;
        font-size: 0;
    }

    .gallery a {
        margin-left: 0px;
        margin-right: 0px;
        width: 50%;
        display: inline;
        box-sizing: border-box;
        flex-basis: 50%;
    }

    .gallery img {
        width: 40%;
        margin-right: 5px;
        margin-left: 5px;
    }

    /*         リンクエリア           */

    #link_btn {
        min-width: inherit;
        width: 100%;
        justify-content: center;
        flex-direction: column;
        display: flex;
        margin: 0 auto;
        align-items: center;
    }

    .btn-flat-logo {
        padding: 25px 15px;
        max-width: 300px;
        width: 80%;
        font-size: 100%;
        font-weight: normal;
        white-space: nowrap;
    }

    .btn-flat-logo:nth-child(2) {
        margin-top: 10%;
        margin-left: 0%;
    }

    /*       footer           */

    footer {
        padding-top: 50px;
        padding-bottom: 50px;
        box-sizing: border-box;
    }

    .footer_inner {
        display: flex;
        justify-content: flex-start;
        flex-direction: column;
        align-items: center;
        margin-top: 0;
        margin-bottom: 0;
    }

    footer p {
        padding-bottom: 15px;
    }

    footer h2 {
        padding-right: 0.3em;
        align-self: center;
        padding-bottom: 20px;
        margin-right: auto;
        margin-left: auto;
    }

    #footer_menu {
        width: inherit;
        flex-basis: inherit;
    }

    #footer_menu ul {
        align-items: center;
        flex-wrap: wrap;
        align-content: space-between;
        margin-left: 0px;
    }

    #footer_menu ul li:first-child ::after {
        padding-left: 0.5em;
        padding-right: 0.5em;
    }

    #footer_menu ul li:nth-child(2) ::after {
        display: none;
    }

    #footer_menu ul li {
        font-size: 14px;
        padding-right: 0px;
        padding-bottom: 10px;
    }

    #copyright {
        display: block;
        flex: 2;
        order: 3;
        font-size: 14px;
        font-style: normal;
        width: 100%;
        margin: 0 auto;
        align-items: center;
    }

    .pagetop {
        display: none;
    }
}

/*        タブレット（縦）用           */

@media screen and (min-width:751px) and (max-width: 1024px) {

    /*         コンテンツ部分            */

    #pdf_btn:active,
    .btn-flat-logo:active {
        color: #28a7e1;
        background-color: #fff;
        border: 2px solid #28a7e1;
    }

    #breadcrumb li a:active {
        text-decoration: underline;
    }

    .inner {
        min-width: inherit;
    }

    .inner_title_min {
        font-size: 150%;
    }

    .school_box {
        justify-content: center;
        flex-direction: column;
        margin-bottom: 70px;
    }

    .school_txt {
        order: 1;
        margin-right: 0px;
    }

    .school_box h2 {
        order: 0;
        margin-top: 20px;
    }

    .school_box img {
        order: -1;
        flex-basis: unset;
    }

    #price_list,
    #cost {
        width: 90%;
    }


    #cost {
        max-width: inherit;
        width: 90%;
        font-size: 87.5%;
    }

    #cost > p {
        line-height: 2;
    }

    /* .cost_list{
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: flex-start;
    }

    .cost_list dt,
    .cost_list dd {
        margin-top: 10px;
    }

    .cost_list dd::before {
        width: 70%;
        margin-left: 0px;
        margin-right: 0px;
    }

    .cost_list {
        white-space: nowrap;
    }
*/
    .price_title {
        width: 90%;
    }

    #price_list {
        max-width: inherit;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
    }


    #pdf_btn {
        font-size: 187.5%;
    }

    #link_btn {
        min-width: inherit;
        width: 100%;
        justify-content: center;
        flex-direction: column;
        display: flex;
        margin: 0 auto;
        align-items: center;
    }

    .btn-flat-logo {
        padding: 25px 15px;
        width: 80%;
        font-size: 100%;
        font-weight: normal;
        white-space: nowrap;
    }

    .btn-flat-logo:nth-child(2) {
        margin-top: 50px;
        margin-left: 0%;
        margin-bottom: 50px;
    }

    /*       footer           */
    .footer_inner {
        display: flex;
        justify-content: flex-start;
        flex-direction: column;
        align-items: center;
    }

    footer p {
        padding-bottom: 15px;
    }

    footer h2 {
        padding-right: 0.3em;
        align-self: center;
        padding-bottom: 20px;
        margin-right: auto;
        margin-left: auto;
    }

    #footer_menu {
        width: inherit;
        flex-basis: inherit;
    }

    #footer_menu ul {
        align-items: center;
        flex-wrap: wrap;
        align-content: space-between;
        margin-left: 0px;
    }

    #footer_menu ul li:first-child ::after {
        padding-left: 0.5em;
        padding-right: 0.5em;
    }

    #footer_menu ul li:nth-child(2) ::after {
        display: none;
    }

    #footer_menu ul li {
        font-size: 14px;
        padding-right: 0px;
        padding-bottom: 10px;
    }

    #copyright {
        display: block;
        text-align: center;
        flex: 2;
        order: 3;
        font-size: 14px;
        font-style: normal;
        margin: 0 auto;
        align-self: center;
    }

    #footer_menu {
        font-size: 87.5%;
    }

    footer img {
        padding-bottom: 0.5em;
    }

}

/*             PC用           */

@media screen and (min-width: 1025px) {

    #pdf_btn:hover,
    .btn-flat-logo:hover {
        color: #28a7e1;
        background-color: #fff;
        border: 2px solid #28a7e1;
    }

    #breadcrumb li a:hover {
        text-decoration: underline;
    }

    .pagetop a:hover {
        background: transparent;
        color: #28a7e1;
    }

    .gallery img {
        overflow: hidden;
    }

}