/****************************************************************
                                      コンテンツ
****************************************************************/
#contents_wrap {

    background: -moz-linear-gradient(top, #f2f2ff, #f1f1fe);
    background: -webkit-linear-gradient(top, #f2f2ff, #f1f1fe);

    background: -o-linear-gradient(top, #f2f2ff, #e9f8ff);

    background: linear-gradient(to bottom, #f2f2ff, #e9f8ff);

}

#contents {
    padding: 10px 0 30px;
    background-color: #fff;
}

.content_area {
    background-color: #fff;
    padding: 0 5px;
}

/*ページタイトル*/
.page_title {
    margin: 0 0 15px;
    font-size: 1.4rem;
    color: #222;
    text-align: center;
    font-weight: normal;
}

.page_title3 {
    margin: 0 0 5px;
    font-size: 1.1rem;
    color: #222;
    text-align: center;
    font-weight: normal;
}

/*ページサブタイトル*/
.page_sub_title {
    margin: 0 0 5px;
    font-size: 1.3rem;
    color: #297dbc;
    text-align: center;
    padding: 10px 0px;
}

/*メッセージ*/
.message {
    display: table;
    table-layout: fixed;
    margin: 10px auto 10px auto;
    color: #333333;
    padding: 10px;
    border: 5px solid #b9dcff;
    /*角丸*/
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari and Chrome */
    border-radius: 3px;


}

.message .table_cell {
    display: table-cell;
    vertical-align: middle;
    padding: 5px;
}

.message .table_cell:nth-child(1) {
    width: 10%;
    text-align: center;
}

.message .table_cell:nth-child(2) {
    width: 90%;
}

.Closed_message {
    display: table;
    table-layout: fixed;
    margin: 10px auto 10px auto;
    color: #333333;
    padding: 10px;
}

.msg_redirect {
    padding: 15px 0px;

}

/*注意*/
.caution {
    display: table;
    table-layout: fixed;
    margin: 10px auto 20px auto;
    color: #333333;
    padding: 10px;
    border: 5px solid #ffa07a;
    /*角丸*/
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari and Chrome */
    border-radius: 3px;


}

.caution .table_cell {
    display: table-cell;
    vertical-align: middle;
    padding: 5px;
}

.caution .table_cell:nth-child(1) {
    width: 10%;
    text-align: center;
}

.caution .table_cell:nth-child(2) {
    width: 90%;
}

.caution_message {
    font-size: 1.1rem;
    color: #ea8867;
    font-weight: bold;
}

.caution_sub_msg_strong {
    font-weight: bold;
    color: #ff0000;
}

.message_red {
    color: #ff0000;
}

.required_msg {
    font-weight: bold;
    color: #ff0000;
    text-align: right;
}

.emphasis_msg {
    font-weight: bold;
}

.ff_item,
.ff_item_center {
    padding: 5px 5px 5px 5px;
    background-color: #f6f6f6;
    width: 100%;
    margin-bottom: 3px;
}

.ff_item.bgc_white,
.ff_item_center.bgc_white {
    background-color: #fff;
}

.form_group {
    padding: 15px 15px;
    border: 2px solid #c3d2e3;
    /*角丸*/
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari and Chrome */
    border-radius: 3px;
}

.ff_item [class*="pure-u"] {
    padding: 3px 0px;

}

.ff_item [class*="pure-u-md"] {
    padding: 0px;

}

.ff_item .ff_text {
    font-size: 0.9rem;
    word-wrap: break-word;
}

.ff_item_center {
    padding: 10px 5px 32px 5px;

    width: 95%;
    margin-right: auto;
    margin-left: auto;
}

.ff_label {
    padding: 3px 0px;
    display: table-cell;
    vertical-align: middle;
    font-size: 0.8rem;
    color: #444;
}

.ff_label span {
    vertical-align: middle;
}

.show_passwd label {

    font-size: 0.9rem;
}

.mLabel {
    font-weight: bold;
    font-size: 0.9rem;
    color: #193b81;
}

.required {
    font-weight: bold;
    background-color: #ff4952;
    color: #fff;
    padding: 1px 4px;
    font-size: 0.7rem;
    display: inline-block;
    /*角丸*/
    -moz-border-radius: 2px;
    /* Firefox */
    -webkit-border-radius: 2px;
    /* Safari and Chrome */
    border-radius: 2px;
}


#aa {
    border: none;
    width: 100%;
    background-color: #f6f6f6;

    margin: 10px auto 30px auto;
}

#aa .accordion-header {

    background-color: #f6f6f6;
}

.mnsdigital_plan .text_area {
    font-size: 0.9rem;

}

.button-base {
    color: white;
    border-radius: 4px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    background-color: #0000a0;
    /* this is a light blue */
    padding: 8px 20px;
    font-weight: bold;
    font-size: 1rem;
    margin: 10px auto;
}

.button-small {
    color: white;
    border-radius: 4px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    background-color: #0000a0;
    /* this is a light blue */
    padding: 5px 15px;
    font-weight: normal;
    font-size: 0.9rem;
}

.button-header-register {
    color: white;
    border-radius: 4px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    background-color: #f31e1f;
    /* this is a light blue */
    padding: 3px 10px;
    font-weight: normal;
    font-size: 0.9rem;
    width: 180px;
}

.button-header-login {
    color: white;
    border-radius: 4px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    background-color: #0000a0;
    /* this is a light blue */
    padding: 3px 10px;
    font-weight: normal;
    font-size: 0.9rem;
    width: 180px;
}

.button-paper {
    background-color: #f31e1f;
    /* this is a light blue */
    font-size: 1rem;
    padding: 7px 30px;
    margin-bottom: 0;

}

.index_login_button {
    padding: 3px 10px;
}

.index_button {
    padding: 3px 10px;
    background-color: #5b7abb;
}

.index_pass_get_button {
    background-color: #f31e1f;
    color: #fff;
}

.button-small_type2 {
    color: white;
    border-radius: 4px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    background-color: #5252ac;
    /* this is a light blue */
    padding: 5px 15px;
    font-weight: normal;
    font-size: 0.9rem;
}

/*ボタン*/
.easyui-linkbutton {
    color: white;
    border-radius: 4px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    background: rgb(66, 184, 221);
    /* this is a light blue */

}

.easyui-linkbutton span {
    font-size: 1.2rem;

}

div[id*="radiobutton_plan_"] {
    padding: 5px;


}

.plan_description {
    padding: 5px 5px 20px 30px;

}

.process_all_area {
    margin: 10px;
    padding: 0px;

}

.process_all_area .border_area {
    height: 4px;
    background: -moz-linear-gradient(left, #b0e0e6, #63a6ec);
    background: -webkit-linear-gradient(left, #b0e0e6, #63a6ec);

    background: -o-linear-gradient(left, #b0e0e6, #63a6ec);

    background: linear-gradient(to right, #b0e0e6, #63a6ec);
    transform: skewX(60deg);
}

.process_number {
    padding: 10px 0px 7px;
    text-align: center;
}

.process_text {
    font-size: 0.8rem;
    text-align: center;
    padding: 3px 0px 8px;
}

.process_number .p_num {
    display: inline-block;
    padding: 1px 9px;
    /*角丸*/
    -moz-border-radius: 4px;
    /* Firefox */
    -webkit-border-radius: 4px;
    /* Safari and Chrome */
    border-radius: 4px;
    background-color: #eee;
    color: #222;
}

.now .process_number .p_num {

    background-color: #3282fb;
    color: #fff;
}

.now .process_text {
    font-weight: bold;
    color: #000080;
}

.process_all_wrap {

    margin: 10px 0px;

}

.process_wrap {
    display: table-cell;

}

.process_wrap .arrow {
    display: table-cell;
    vertical-align: middle;

}

.process_wrap .process_area {
    display: table-cell;
    background-color: #eee;
    color: #666;
    padding: 3px;
    font-size: 0.8rem;
    /*角丸*/
    -moz-border-radius: 5px;
    /* Firefox */
    -webkit-border-radius: 5px;
    /* Safari and Chrome */
    border-radius: 5px;
}

.process_wrap .now {
    background-color: #51a8ff;
    color: #fff;
}

.confirmArea {
    padding: 20px 5px;

}

.confirmItem {
    font-size: 1.2rem;
    text-align: center;
    color: #3d97f2;
    word-wrap: break-word;
}

.confirmItem_notice {
    color: red;
    padding-left: 1em;
    text-indent: -0.5em;
}

.confirmItem_notice i {
    margin-right: 2px;
}

.confirmItem_notice-ad {
    text-align: center;
    padding: 10px;
}

.confirmItem_notice-ad a {
    display: inline-block;
    color: white;
    border-radius: 4px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    background-color: #0000a0;
    padding: 5px 15px;
    font-weight: normal;
    font-size: 0.9rem;
}

.show_border {
    height: 3px;
    border-width: 0;
    background-color: #bfbfff;
    background-image: -webkit-linear-gradient(135deg,
            #0000a0 0px, #0000a0 2px, transparent 2px, transparent 4px,
            #0000a0 4px, #0000a0 6px, transparent 6px, transparent);
    background-image: linear-gradient(-45deg,
            #0000a0 0px, #0000a0 2px, transparent 2px, transparent 4px,
            #0000a0 4px, #0000a0 6px, transparent 6px, transparent);
    background-size: 6px 6px;
    /*角丸*/
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    margin: 30px 0px 15px;
}

.show_border2,
.show_border3 {
    height: 2px;
    border-width: 0;
    background-color: #ececff;
    background-image: -webkit-linear-gradient(135deg,
            #8080c0 0px, #8080c0 2px, transparent 2px, transparent 4px,
            #8080c0 4px, #8080c0 6px, transparent 6px, transparent);
    background-image: linear-gradient(-45deg,
            #8080c0 0px, #8080c0 2px, transparent 2px, transparent 4px,
            #8080c0 4px, #8080c0 6px, transparent 6px, transparent);
    background-size: 6px 6px;
    /*角丸*/
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    margin: 30px auto 30px auto;
}

.show_border3 {
    width: 95%;
}


.quit_caution {
    font-weight: bold;
    color: red;

}

.msg_title {
    font-weight: bold;
    font-size: 1.1rem;
    line-height: 1.6em;
    color: #555;

}

.msg_title i {
    color: #9ed9ff;
    font-size: 1.2em;
    margin-right: 5px;
}

.msg_content {
    margin-top: 10px;
}

.msg_content img {
    width: 100%;
    border: 1px solid #a7a3a3;
}

.msg_content i {
    margin: 0 2px;
}


/* プロフィール*/

.prpfile_item_title {
    margin-top: 15px;
    margin-bottom: 8px;
    display: inline-block;
    padding: 4px 20px;
    color: #0000a0;
    font-weight: bold;
    font-size: 1rem;
    background-color: #f1f1ff;
    /*角丸*/
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}

.profile_info_area {
    padding: 5px 2px;

}

.profile_info_area div {
    padding: 8px;
    border-bottom: 1px solid #e5e5e5;
    background-color: #fffcf5;
}

.minamiPassWithdrawal div {

    background-color: #fff9fd;
}

.highlight {
    background-color: #e1f2ff !important;
    font-weight: bold;
}

.highlight2 {
    background-color: #ffe6f2 !important;
}



.profile_info_area div:last-child {
    border: none;
    background-color: #fff;
}

.profile_button {
    text-align: center;
    padding: 10px 0px;
}

.profile_button form {
    display: inline-block;

}


/*ssl*/
.ssl_wrap {
    padding: 10px;
    margin: 10px auto;
    /*width:95%;*/
    border: 4px solid #4169e1;
    /*角丸*/
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.ssl_wrap .fas {
    color: #4169e1;
}

.ssl_wrap div {
    display: table-cell;
    vertical-align: middle;
    padding: 5px;
}

.top_link {
    text-align: center;
    padding: 10px;

}

/*フォーム*/
.radiobutton_div {}

.radiobutton_div .textbox-label {
    font-weight: bold;
    color: #5a99ea;
    padding: 6px 6px 6px 10px;
    height: auto !important;
    margin-left: 5px;
    /*background-color: #fafad2;*/
    /*border-bottom:2px solid #4169e1;*/
    /*    border-right:2px solid #9ec6f5;
        border-left:2px solid #9ec6f5;

        角丸
        -moz-border-radius: 0px 4px 4px 0px;
        -webkit-border-radius: 0px 4px 4px 0px;
        border-radius: 0px 4px 4px 0px;

        background: -moz-linear-gradient(left, #eaf7ff, #d2e4fa);
        background: -webkit-linear-gradient(left, #eaf7ff, #d2e4fa);

        background: -o-linear-gradient(left,#eaf7ff,#d2e4fa);

        background: linear-gradient(to right, #eaf7ff, #d2e4fa);
        transform:skewX(-25deg);*/
}

.radiobutton_div .textbox-label:hover {
    cursor: pointer;

}

.radiobutton_div input[type="checkbox"]:checked+label {

    background-color: red;
}

.agreement .agree_checkbox,
.agreement .agree_checkbox2  {
    margin: 5px auto 10px auto;
    padding: 6px;
    border: 1px solid #00bfff;
    /*角丸*/
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    width: 240px;
    font-size: 1.1rem;
}
.agreement .agree_checkbox2 {
    width: 335px;
}
.check_agree_np_subscribed .textbox-label{
    height: 66px !important;
    font-size: 1.1rem;
}


/*プラン変更*/
.change_list {
    margin: 10px 0px 30px 0px;
    padding: 15px;
    border: 3px solid #e6f5fa;
    /*角丸*/
    -moz-border-radius: 2px;
    /* Firefox */
    -webkit-border-radius: 2px;
    /* Safari and Chrome */
    border-radius: 2px;
}


/*規約*/

.agreement_wrap {
    border: 1px solid #666666;
    font-size: 0.8rem;
    height: 400px;
    margin: 10px auto;
    overflow: scroll;
    padding: 20px;
    text-align: center;
    width: 95%;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.agreement_text {
    line-height: 1.2rem;
    text-align: left;
}

.agreement_text_area {
    border: 2px solid #aaa;
    /*角丸*/
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;

    padding: 5px;
    margin: 20px 5px;
}

.membership_agreement_links {
    padding-top: 30px;

}

.membership_agreement_links div {
    text-align: center;
}

.membership_agreement_links div a {
    display: block;
    text-align: center;
    width: 92%;
    margin: 5px auto;
    padding: 10px 0px;
    background-color: #f3f3ff;
    color: #00009b;

}

.membership_agreement_links div a .fas {

    padding: 0px 3px;
    color: #ff9c8c;
}

.agreement_pdf_link {
    padding: 10px 10px;

}

.system_err {
    margin-bottom: 20px;
    padding: 20px 20px;
    background-color: #fff8f0;
    border: 2px solid #f6d3cb;
    /*角丸*/
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

.err_item {
    margin: 10px;
    padding: 10px;
    background-color: #ffe4e1;


}

/*サービス同時選択のサービスラジオボタン*/
.service_radio_title {
    font-size: 1rem;
    padding: 10px;
    font-weight: bold;
    /*background-color: #ddd;*/
    /*border: 2px solid #ddd;*/
    width: 200px;
}

.service_radio_item {
    padding: 5px 5px;
    /*border: 2px solid #ddd;*/
}

.service_radio_item .textbox-label {
    font-weight: bold;
    color: #00008b;

    padding: 8px 6px 8px 10px;
    height: auto !important;
    margin-left: 10px;
    background-color: #f8f8f8;

    /*角丸*/
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;

    white-space: wrap;

}

.service_radio_item .textbox-label:hover {
    cursor: pointer;


}

.btn_dlg_service_info {
    background-color: #fff;
    color: #291483;
    font-weight: bold;
    border-color: #291483;
    font-size: 0.9rem;


}

.btn_dlg_service_info span {

    font-size: 0.9rem;


}

/* アコーディオンのスタイリング */
.easyui-accordion {
    position: relative;
}

/* アコーディオンパネルのスタイリング */
.easyui-accordion .panel {
    margin-bottom: 0;
}

/* アコーディオンタイトルのスタイリング */
.easyui-accordion .panel-header {
    cursor: pointer;
    position: relative;
}

/* アコーディオンのアイコンのスタイリング */
.easyui-accordion .panel-header .panel-icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

/* アコーディオンのコンテンツのスタイリング */
.easyui-accordion .panel-body {
    overflow: hidden;
}

/*クレジットカード情報入力*/
.credit_parts {
    width: 100%;
    margin: 10px auto;
}

.credit_parts .button_area {
    padding: 10px;
    text-align: center;

}

/*法人用*/
.ff_houjin_user {
    padding: 10px;
    border: 2px solid #afeeee;
    margin-bottom: 5px;

}

.ff_houjin_user .ff_item {
    padding: 5px 20px;

}

.houjin_coution {
    padding: 15px;
    background-color: #f8f8ff;
}

.footer_minamipass_jimukyoku {
    padding-top: 20px;

}

.footer_minamipass_jimukyoku img {
    max-width: 65%;

}

.maintenance_msg {
    float: right;
    width: 70%;
    text-align: left;
    font-size: 0.7rem;
    padding: 5px;
}

.cardnumber_msg {
    padding: 5px 2px;
    text-align: left;
    font-weight: bold;
    font-size: 0.9rem;
    color: #ff0000;
}


.etc_service_info_text {
    margin: 10px 0px;
    padding: 10px;
    background-color: #ffe4c4;
    border-radius: 10px;
    font-size: 0.9rem;

}

.frow_pass_link,
.frow_pass_link:visited {
    padding: 5px 20px;
    display: inline-block;
    border-radius: 10px;
    background-color: #374d7c;
    color: #fff;

}

.frow_pass_link:hover {
    background-color: #3282fb;

}


@media print,
screen and (min-width: 768px) {
    #contents {
        padding: 20px 0 0px;
    }

    #aa {
        border: 1px solid #d6e3f6;
        width: 95%;
        margin: 10px auto 20px auto;
    }

    #aa .accordion-header {

        background-color: #e2ecfe;
    }

    .ff_item,
    .ff_item_center {
        padding: 10px 15px 10px 15px;
        background-color: #fff;

    }

    /*ページタイトル*/
    .page_title {
        font-size: 1.6rem;
    }

    .msg_content img {
        width: 80%;
    }

    /*プロフィール用*/
    .profile_button {
        text-align: right;

    }

    .confirmItem {
        font-size: 1.2rem;
    }

    .ff_item_center {
        width: 80%;
    }

    /*規約*/

    .agreement_text_area {

        padding: 15px;
    }

    /*クレジットカード情報入力*/
    .credit_parts {
        width: 80%;
        margin: 10px auto;
    }

    .credit_parts .button_area {
        padding: 0px;
        text-align: center;

    }

    .agreement_pdf_link {
        padding: 10px 20px;

    }

    .maintenance_msg {
        width: 90%;
        text-align: right;

    }

    .cardnumber_msg {
        text-align: center;

    }

    .button-header-register,
    .button-header-login {
        padding: 10px 15px;
        font-weight: normal;
        font-size: 1.0rem;
        width: auto;
    }

    .service_radio_item .textbox-label {
        width: 92%;
    }
}




@media print,
screen and (min-width: 1024px) {
    #contents {
        width: 1024px;
        margin: 0px auto;
    }

    .content_area {
        width: 740px;
        margin: 0px auto;
        padding: 10px 10px;
    }

    /*メッセージ*/
    .message {
        width: 100%;

    }

}

/*Payどん*/
.paydon_info_div {
    margin: 20px 0;
}

@media print,
screen and (min-width: 768px) {
    .paydon_info_div {
        margin: 50px 20px;
    }
}
