@charset "UTF-8";
/* CSS Document */

/* --------------------------------------------------
    base
-------------------------------------------------- */
* {
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

html,
body {
    width: 100%;
}

body {
    position: relative;
    overflow-x: hidden;
    font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ",
        "Meiryo", "verdana", sans-serif;
    line-height: 1.5;
    color: #000000;
    font-size: 14px;
    background-color: #f8f8f8;
}

/*リンク */
a {
    color: #000000;
    text-decoration: none;
}

/* 画像幅 */
img {
    width: 100%;
    height: auto;
    vertical-align: middle;
}

/* clearfix */
.clearfix::after {
    content: ".";
    display: block;
    height: 0;
    font-size: 0;
    clear: both;
    visibility: hidden;
}

.container {
    max-width: 740px;
    margin: 0 auto;
    padding: 30px 10px 60px;
}

h1 {
    font-size: 18px;
    font-weight: bold;
}

/* ※ */
.note {
    position: relative;
    display: block;
    padding: 0 0 0 1.2em;
    text-align: left;
}

.note:before {
    content: '※';
    position: absolute;
    top: 0;
    left: 0;
}

/* --------------------------------------------------
    header
-------------------------------------------------- */
header {
    position: relative;
    padding: 9px 15px;
    border-bottom: 1px solid #D0D0D0;
    background: #ffffff;
}

header .login_079 {
    width: 120px;
}

header .header_item {
    position: absolute;
    top: 5px;
    right: 15px;
    display: flex;
    align-items: center;
}

header .inform_item {
    position: relative;
    margin: 0 25px 0 0;
    cursor: pointer;
}

header .inform_item .badge {
    position: absolute;
    top: -5px;
    right: -10px;
}

header .inform_item .badge p {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-width: 17px;
    min-height: 17px;
    padding: 2px 2px;
    font-size: 10px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    line-height: 1;
    border-radius: 50%;
    background: #3CB5AD;
}

header .inform_item .icon {
    width: 17px;
}

header .sp-menu {
    display: block;
    width: 30px;
    cursor: pointer;
}

header #mopen.hide {
    visibility: hidden;
    pointer-events: none;
}

header .overley {
    display: none;
    position: fixed;
    top: 49px;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    background: #ffffff;
}

header .overley.show {
    display: block;
}

header #mclose {
    position: absolute;
    top: -40px;
    right: 15px;
    width: 24px;
    cursor: pointer;
}
header nav {
    padding: 5px 10px 0;
}

header nav h1 {
    padding: 20px 15px 20px 0;
    font-size: 14px;
    cursor: pointer;
    border-bottom: 1px solid #EEEEEE;
    background: url("../images/mypage/icon_arrow_down@2x.png") right center no-repeat;
    background-size: 10px auto;
}

header nav h1.is-active {
    background: url("../images/mypage/icon_arrow_up@2x.png") right center no-repeat;
    background-size: 10px auto;
}

header nav h1 + * {
    overflow: hidden;
    height: 0;
    margin: 0;
    opacity: 0;
    transition-duration: 0.6s;
}

header nav h1 + *.is-open {
    height: auto;
    opacity: 1;
}

header nav .top_08 a,
header nav a {
    display: block;
    max-width: 100%;
    padding: 13px 15px 13px 0;
    border-bottom: 1px solid #EEEEEE;
    background: url("../images/mypage/icon_arrow_right@2x.png") right center no-repeat;
    background-size: 7px auto;
}

header nav .top_06 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: -8px 0 20px;
    padding: 15px 15px 0;
}

header nav .top_06 .top_062 {
    width: calc((100% / 2) - 3px);
    margin: 8px 0 0;
}

header nav .top_06 .top_062 button {
    font-size: 13px;
    border: 1px solid #3CB5AD;
}

header nav .top_06 .top_062 button br {
    display: block;
}

header nav #logout .btn {
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-weight: bold;
    border: none;
    background: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* --------------------------------------------------
    footer
-------------------------------------------------- */
footer .footer_00 {
    max-width: 360px;
    margin: 0 auto;
}

footer .footer_01 {
    padding: 15px 10px;
    font-size: 10px;
    text-align: center;
    background: #ffffff;
}

.footer {
    border-top: 1px solid #D0D0D0;
    background: #ffffff;
}

footer .footer_02 a {
    display: block;
    padding: 20px 15px;
    border-bottom: 1px solid #EEEEEE;
    background: url("../images/mypage/icon_arrow_right@2x.png") right 15px center no-repeat;
    background-size: 7px auto;
}

/* --------------------------------------------------
    Login
-------------------------------------------------- */
/*  タイトル部分
--------------------------------------*/
.login_title_box {
    padding: 30px 0;
    text-align: center;
}

.login_title_box + p {
    background: #FDF2F2;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    color: red;
    max-width: 440px;
    margin: 0 auto 30px;
    padding: 20px 15px;
}

.login_title_box .login_title {
    max-width: 200px;
    margin: 0 auto 10px;
}

.login_title_box .login_logo {
    max-width: 250px;
    margin: 0 auto 10px;
}

.login_title_box .login_txt p {
    display: inline-block;
}

.login_title_box .login_txt p:after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 13px;
    vertical-align: middle;
    background: url("../images/mypage/icon_paw@2x.png") no-repeat;
    background-size: 16px auto;
}

/*  ログインフォーム
--------------------------------------*/
.login_form_box {
    max-width: 440px;
    margin: 0 auto 40px;
    padding: 25px 15px 30px;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.login_form_box h1 {
    margin: 0 0 10px;
    font-size: 16px;
    font-weight: bold;
}

.login_form_box form > div + div {
    margin: 15px 0 0;
}

.login_form_box form > div span {
    display: block;
    margin: 0 0 5px;
}

.login_form_box .login_button {
    margin: 25px auto;
}

.login_form_box .login_password_link a {
    display: inline-block;
    padding: 0 0 0 15px;
    background: url("../images/mypage/icon_arrow_right@2x.png") left center
        no-repeat;
    background-size: 7px auto;
}

.login_form_box + p {
    max-width: 440px;
    margin: 0 auto;
}

/*  サービスの詳細はこちら
--------------------------------------*/
.login_servive_link {
    max-width: 440px;
    margin: 0 auto;
    padding: 25px 0 0;
}

.login_servive_link a {
    display: inline-block;
    padding: 0 15px;
    background: url("../images/mypage/icon_arrow_right@2x.png") left center
            no-repeat,
        url("../images/mypage/icon_newtab@2x.png") right top 4px no-repeat;
    background-size: 7px auto, 10px auto;
}

/* --------------------------------------------------
    form入力項目
-------------------------------------------------- */
/* テキストボックス・メール・電話・パスワード */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"] {
    width: 100%;
    height: 40px;
    padding-left: 10px;
    font-size: 16px;
    border-radius: 4px;
    border: 1px solid #cccccc;
    background: #fafafa;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
/*テキストエリア*/
textarea {
    width: 100%;
    height: 120px;
    padding: 10px;
    font-size: 16px;
    border-radius: 4px;
    border: 1px solid #cccccc;
    background: #fafafa;
    resize: none;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
textarea:focus {
    outline: 0;
    border: 2px solid #90cefd;
}

/* ボタン */
button {
    cursor: pointer;
}

.login_button {
    display: block;
    max-width: 320px;
    width: 100%;
    margin: 0 auto;
    height: 60px;
    font-size: 16px;
    font-weight: bold;
    color: #ffffff;
    text-align: center;
    border: none;
    border-radius: 4px;
    background: #3cb5ad;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

button.stop_button,
button.stop {
    display: block;
    width: 100%;
    max-width: 320px;
    height: 60px;
    margin: 0 auto;
    padding: 0;
    font-size: 16px;
    font-weight: bold;
    color: #D50000;
    text-align: center;
    border-radius: 4px;
    border: 2px solid #D50000;
    background: #ffffff;
    -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.link_button2 {
    display: block;
    max-width: 320px;
    margin: 0 auto;
    padding: 18px 10px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 6px;
    background: #EFEFEF;
}

/* チェックボックス */
.checkbox_list {

}

.checkbox_list li + li {
    margin: 10px 0 0;
}

.checkbox {
    position: relative;
    display: inline-block;
}

.checkbox input[type="checkbox"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    opacity: 0;
}

.checkbox label {
    display: block;
    padding: 4px 0 4px 30px;
    background: url("../images/mypage/icon_checkbox_off.png") left top 2px no-repeat;
    background-size: 24px auto;
}

.checkbox input[type="checkbox"]:checked + label {
    background: url("../images/mypage/icon_checkbox_on.png") left top 2px no-repeat;
    background-size: 24px auto;
}

/* エラー表示 */
input[type="text"].error,
input[type="email"].error,
input[type="tel"].error,
input[type="password"].error,
textarea.error {
    border: solid 1px #ED1B00;
    background-color: #FDE7E5;
}

label.error {
    color: #F03B2F;
}

/* --------------------------------------------------
    Top
-------------------------------------------------- */
.top_01 {
    margin: 0 0 40px;
    padding: 5px 15px 15px;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.top_01 .flex_02 {
    position: relative;
}

.top_01 .hide_list {
    display: none;
}

.top_01 .hide_list.is-open {
    display: block;
}

.top_01 .flex_02 + .flex_02 {
    border-top: 1px solid #eeeeee;
}

.top_01 .flex_02 > img, canvas {
    position: absolute;
    top: 10px;
    left: 0;
    width: 20px;
}

.top_01 .flex_02 .notice_open {
    display: block;
    padding: 10px 0 10px 30px;
    color: #F50000;
}

.top_01 .news_accrod {
    padding: 10px 0 0;
    text-align: right;
}

.top_01 .news_accrod_btn {
    display: inline-block;
    padding: 0 0 0 15px;
    cursor: pointer;
    background: url("../images/mypage/icon_arrow_down@2x.png") left center no-repeat;
    background-size: 10px auto;
}

.top_01 .news_accrod_btn.is-active {
    background: url("../images/mypage/icon_arrow_up@2x.png") left center no-repeat;
    background-size: 10px auto;
}

.top_01 .news_accrod_btn:before {
    content: 'すべて表示';
}

.top_01 .news_accrod_btn.is-active:before {
    content: '閉じる';
}

/* modal */
#mask,
#mask2 {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999;
    background: rgba(0, 0, 0, 0.4);
}

#mask.hidden,
#mask2.hidden {
    display: none;
}

#mask + section,
#mask + section + section,
#mask2 + section {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: calc(100% - 20px);
    max-width: 720px;
    margin: 20px auto;
    padding: 20px 15px;
    z-index: 999;
    border-radius: 6px;
    background: #ffffff;
    transition: transform 0.1s;
}

#mask + section.hidden,
#mask + section + section.hidden,
#mask2 + section.hidden {
    transform: translate(0, -150%);
}

.modal_title {
    margin: 0 0 20px;
    font-size: 18px;
    font-weight: bold;
}

.modal_close {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 15px;
    cursor: pointer;
}

#modal1 .modal_body {
    padding: 15px 20px 15px 0;
    border-top: 1px solid #EEEEEE;
    background: url("../images/mypage/icon_arrow_right@2x.png") right center no-repeat;
    background-size: 7px auto;
}

#modal2 .modal_body a {
    color: #00887B;
}

/* ご契約情報 */
.top_08 > li > * {
    max-width: 440px;
    margin: 0 auto;
}

.top_09 {
    margin: 15px 0 0;
    padding: 20px 15px 30px;
    background: #ffffff;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.top_09 + .top_09 {
    margin: 25px 0 0;
}

.top_09 .contract_detail_link {
    display: flex;
    justify-content: space-between;
    margin: 0 auto 5px;
}

.top_09 .contract_detail_link p {
    width: calc(100% - 40px);
    font-size: 12px;
}

.top_09 .contract_detail_link a {
    display: block;
    width: 24px;
}

.top_04 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 30px;
}

.top_08 .top_04,
.top_09 .top_04 {
    max-width: 440px;
    margin: 0 auto 30px;
}

.top_04 img, canvas {
    width: 85px;
}

.top_04 label {
    width: calc(100% - 100px);
}

.top_04 label em {
    font-size: 20px;
}

.top_10 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 5px;
    padding: 0 0 8px;
}

.top_08 .top_10{
     margin: 0 auto 5px;
}

.top_10 label:nth-child(1) {
    width: calc(100% - 120px);
    font-size: 16px;
    font-weight: bold;
}

.top_10 label:nth-child(2) {
    display: inline-block;
    width: 100px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 14px;
}

/* パートナープラスパック */
.service_type1 .top_10 {
    border-bottom: 2px solid #57C69A;
}

.service_type1 .top_10 label:nth-child(2) {
    color: #229568;
    background: #DDF4EB;
}

/* プラス安心保証セーフティ */
.service_type2 .top_10 {
    border-bottom: 1px solid #41ADCC;
}

.service_type2 .top_10 label:nth-child(2) {
    color: #0DA4CE;
    background: #E6F5F4;
}

/* 停止中 */
.top_10 label:nth-child(2).stop {
    color: #D50000;
    background: #FBE5E5;
}

/* 再開申請済 */
.top_10 label:nth-child(2).saikai {
    color: #000000;
    background: #d8d8d8;
}

.top_09 .contract {
    display: table;
    width: 100%;
    padding: 15px 0;
    border-bottom: 1px solid #EEEEEE;
}

.top_09 .contract label {
    display: table-cell;
}

.top_09 .contract label:nth-child(1) {
    width: 140px;
    font-weight: bold;
}

.top_09 .profile {
    margin: 30px auto 0;
}

.top_09 .profile h3 {
    margin: 0 0 30px;
    padding: 0 20px 5px 0;
    font-weight: bold;
    border-bottom: 1px solid #EEEEEE;
    background: url("../images/mypage/icon_arrow_right@2x.png") right top 5px no-repeat;
    background-size: 7px auto;
}

.top_09 .profile h3 span {
    display: block;
    padding: 0 0 0 25px;
}

/* パートナープラスパック */
.service_type1 .profile h3 span {
    background: url("../images/mypage/icon_paw_partner@2x.png") left center no-repeat;
    background-size: 18px auto;
}

/* プラス安心保証セーフティ */
.service_type2 .profile h3 span {
    background: url("../images/mypage/icon_paw_safety@2x.png") left center no-repeat;
    background-size: 18px auto;
}

/* プロフィールモーダル */
section[id^="prof_modal"] .top_04 {
    margin: 0;
    padding: 0 0 15px;
    border-bottom: 1px solid #EEEEEE;
}

section[id^="prof_modal"] .modal_body {
    display: table;
    width: 100%;
    padding: 15px 10px;
    border-bottom: 1px solid #EEEEEE;
}

section[id^="prof_modal"] .modal_body label {
    display: table-cell;
}

section[id^="prof_modal"] .modal_body label:nth-child(1) {
    width: 150px;
    font-weight: bold;
}

.top_061 .top_02 {
    padding: 10px;
    cursor: pointer;
    border-radius: 4px;
}

.top_061 .top_02 h2 {
    font-weight: bold;
    text-align: center;
}

.top_061 .top_02 h2 span {
    display: block;
    font-size: 12px;
}

.top_061 .top_02 h2 em {
    font-size: 16px;
}

/* パートナープラスパック */
.service_type1 .top_061 .top_02 {
    background: url("../images/mypage/icon_arrow_down@2x.png") right 15px center no-repeat #DDF4EB;
    background-size: 10px auto;
}

.service_type1 .top_061 .top_02.is-active {
    background: url("../images/mypage/icon_arrow_up@2x.png") right 15px center no-repeat #DDF4EB;
    background-size: 10px auto;
}

.service_type1 .top_061 .top_02 h2 {
    background: url("../images/mypage/icon_pet_partner@2x.png") left 15px center no-repeat;
    background-size: 38px auto;
}

/* プラス安心保証セーフティ */
.service_type2 .top_061 .top_02 {
    background: url("../images/mypage/icon_arrow_down@2x.png") right 15px center no-repeat #D8EEF4;
    background-size: 10px auto;
}

.service_type2 .top_061 .top_02.is-active {
    background: url("../images/mypage/icon_arrow_up@2x.png") right 15px center no-repeat #D8EEF4;
    background-size: 10px auto;
}

.service_type2 .top_061 .top_02 h2 {
    background: url("../images/mypage/icon_pet_safety@2x.png") left 15px center no-repeat;
    background-size: 40px auto;
}

/* サービスメニュー */
.top_06 {
    margin: 0 0 20px;
}

.top_062 + .top_062 {
    margin: 8px 0 0;
}

.top_062 button {
    display: block;
    width: 100%;
    height: 50px;
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    line-height: 1.2;
    border-radius: 4px;
    background: url("../images/mypage/icon_arrow_right@2x.png") right 15px center no-repeat #ffffff;
    background-size: 7px auto;
    -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.top_062 button br {
    display: none;
}

.top_062 button span {
    display: block;
    font-size: 10px;
}

/* パートナープラスパック */
.service_type1 .top_062 button {
    border: 1px solid #3CB5AD;
}

/* プラス安心保証セーフティ */
.service_type2 .top_062 button {
    border: 1px solid #41ADCC;
}

/* サービス停止中 */
.top_062.stop {
    width: 100%;
    margin: 0 0 15px;
}

.top_062.stop button {
    font-weight: bold;
    color: #D50000;
    border: 1px solid #D50000;
    background: url("../images/mypage/icon_arrow_right@2x.png") right 15px center no-repeat #ffffff;
    background-size: 7px auto;
}

.top_062.stop button span {
    font-size: 12px;
}

.top_062.stop button em {
    font-size: 16px;
}

.top_061 + .flex_02 a {
    display: inline-block;
    padding: 0 0 0 20px;
    background: url("../images/mypage/icon_paper@2x.png") left center no-repeat;
    background-size: 12px auto;
}

.top_061 .top_06 {
    overflow: hidden;
    height: 0;
    margin: 0;
    opacity: 0;
    transition-duration: 0.6s;
}

.top_061 .top_06.is-open {
    height: auto;
    padding: 15px 0 20px;
    opacity: 1;
}

.top_061 + .flex_02 {
    max-width: 440px;
    margin: 5px auto 0;
}

/* --------------------------------------------------
    Top編集
-------------------------------------------------- */
.top_09 {
    position: relative;
}

.top_09 > p {
    max-width: 440px;
    margin: 0 auto 10px;
    font-size: 12px;
}

.top_09 .top_15 {
    position: relative;
    width: 85px;
}

.top_09 .top_15 input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 1;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.top_09 .top_15 .initial_display {
    position: relative;
}

.top_09 .top_15 .initial_display:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
}

.top_09 .top_15 .initial_display:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 40px;
    height: 34px;
    margin: auto;
    background: url("../images/mypage/icon_upload_camera.png") no-repeat;
    background-size: 40px auto;
}

.top_09 .top_15 .edit_image_box.hide {
    display: none;
}

.top_09 .top_15 img {
    width: 100%;
}

.top_09 .top_13 {
    width: calc(100% - 100px);
}

.top_09 .top_13 form {
    position: relative;
}

.top_09 .top_13 .button {
    position: absolute;
    top: -30px;
    right: 0;
    width: 57px;
}

.top_09 .top_13 .button button {
    display: block;
    width: 100%;
    height: 24px;
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-weight: bold;
    color: #ffffff;
    text-align: center;
    border-radius: 4px;
    border: none;
    background: #3CB5AD;
    -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.top_09 .top_13 .top_14 {
    margin: 0 0 5px;
}

.top_09 .top_13 p {
    margin: 8px 0 0;
    font-size: 10px;
}

/* --------------------------------------------------
    ご契約内容変更手続き
-------------------------------------------------- */
.change_panel h1 {
    margin: 0 0 5px;
    padding: 6px 0 6px 50px;
    background: url("../images/mypage/icon_paper_large.png") left center no-repeat;
    background-size: 40px auto;
}

.change_panel .login_04 {
    padding: 25px 15px;
    background: #ffffff;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.change_panel .login_04 .link_button_div {
    margin: 0 0 15px;
}

.change_panel .login_04 .link_button_div a {
    display: block;
    max-width: 320px;
    margin: 0 auto;
    padding: 17px 10px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 4px;
    border: 1px solid #3CB5AD;
    background: url("../images/mypage/icon_newtab@2x.png") right 15px center no-repeat;
    background-size: 10px auto;
}

.change_panel .login_04 button {
    display: block;
    width: 100%;
    max-width: 320px;
    height: 60px;
    margin: 0 auto;
    padding: 0;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 4px;
    border: 1px solid #3CB5AD;
    background: #ffffff;
    -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.change_panel .login_04 .flex_02 a {
    display: inline-block;
    margin: 20px 0 0;
    padding: 0 0 0 15px;
    background: url("../images/mypage/icon_arrow_right@2x.png") left center no-repeat;
    background-size: 7px auto;
}

/* --------------------------------------------------
    戻る
-------------------------------------------------- */
.cus_04 {
    margin: 30px 0 0;
}

.cus_04 a {
    display: inline-block;
    padding: 0 0 0 15px;
    font-size: 16px;
    font-weight: bold;
    background: url("../images/mypage/icon_arrow_left@2x.png") left center no-repeat;
    background-size: 7px auto;
}

/* --------------------------------------------------
    サービス利用を停止する
-------------------------------------------------- */
.stop_panel h1 {
    margin: 0 0 5px;
    padding: 6px 0 6px 50px;
    background: url("../images/mypage/icon_paw_large.png") left center no-repeat;
    background-size: 40px auto;
}

.stop_panel .top_09 {
    text-align: center;
}

.stop_panel .top_09 em {
    display: block;
    padding: 0 0 10px;
    font-weight: bold;
}

.stop_panel .top_09 strong {
    display: block;
    padding: 0 0 20px;
    font-size: 24px;
    font-weight: bold;
}

.stop_panel .top_09 .cus_05 {
    text-align: left;
}

.stop_panel .top_09 .cus_05 + .cus_05 {
    margin: 10px 0 20px;
}

.stop_panel #modal .login_02 {
    padding: 35px 0 0;
}

.stop_panel #modal strong {
    font-size: 16px;
}

.stop_panel #modal .flex {
    display: flex;
    justify-content: space-between;
    max-width: 600px;
    margin: 0 auto;
    padding: 20px 0 30px;
}

.stop_panel #modal .flex > * {
    width: calc((100% / 2) - 20px);
}

.stop_panel #modal .close {
    max-width: 320px;
    margin: 0 auto;
    padding: 17px 10px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 4px;
    border: 1px solid #EFEFEF;
    background: #EFEFEF;
}

/* --------------------------------------------------
    サービス利用停止
-------------------------------------------------- */
.apply_panel .flex_02 {
    margin: 0 0 20px;
}

/* --------------------------------------------------
    サービス利用再開手続き
-------------------------------------------------- */
.restart_panel .flex_02 h1 {
    margin: 0 0 5px;
    padding: 6px 0 6px 50px;
    background: url("../images/mypage/icon_paper_large.png") left center no-repeat;
    background-size: 40px auto;
}

.restart_panel div + .top_09 {
    margin: 0 0 40px;
    text-align: center;
}

.restart_panel div + .top_09 em {
    display: block;
    padding: 0 0 10px;
    font-weight: bold;
}

.restart_panel div + .top_09 strong {
    display: block;
    padding: 0 0 20px;
    font-size: 24px;
    font-weight: bold;
}

.restart_panel div + .top_09 .cus_05 {
    text-align: left;
}

.restart_panel div + .top_09 .cus_05 + .cus_05 {
    margin: 10px 0 20px;
}

.restart_panel .top_10 .top_03 {
    width: 100%;
    padding: 0 0 5px;
    border-bottom: 1px solid #41ADCC;
}

.restart_panel .contract label:nth-child(1) {
    width: 145px;
}

.restart_panel .top_091 {
    margin: 40px 0 30px;
    padding: 20px 15px 30px;
    background: #ffffff;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.restart_panel h3 {
    margin: 0 0 10px;
    padding: 0 0 0 25px;
    font-size: 15px;
    font-weight: bold;
    background: url("../images/mypage/icon-warning@2x.png") left top no-repeat;
    background-size: 20px auto;
}

/* --------------------------------------------------
    サービス利用再開を申請
-------------------------------------------------- */
.apply_panel h1 {
    padding: 0 0 20px;
}

/* --------------------------------------------------
    契約者様情報
-------------------------------------------------- */
.customer_panel {
    padding: 0 0 10px;
}

.customer_panel .flex_02 h1 {
    padding: 6px 0 6px 50px;
    background: url("../images/mypage/icon_paw_large.png") left center no-repeat;
    background-size: 40px auto;
}

.customer_panel .top_09 .cus_01 {
    padding: 0 0 10px;
    border-bottom: 1px solid #EEEEEE;
}

.customer_panel .top_09 .cus_01 + .cus_01 {
    padding: 10px 0;
}

.customer_panel .top_09 .cus_02 + .cus_02 {
    margin: 5px 0 0;
}

.customer_panel .top_09 .cus_05 {
    margin: 30px 0 20px;
}

.customer_panel #cus_button a {
    display: block;
    max-width: 320px;
    margin: 0 auto;
    padding: 6px 10px;
    font-weight: bold;
    text-align: center;
    border-radius: 4px;
    border: 1px solid #3CB5AD;
    background: url("../images/mypage/icon_newtab@2x.png") right 15px center no-repeat;
    background-size: 10px auto;
}

.customer_panel #cus_button span {
    font-size: 12px;
}

.customer_panel #cus_button em {
    display: block;
    font-size: 16px;
}

.customer_panel .top_09 form div:nth-of-type(5) {
    margin: 20px 0;
}

.customer_panel .top_09 form div:nth-of-type(6) a {
    display: inline-block;
    padding: 0 0 0 15px;
    background: url("../images/mypage/icon_arrow_right@2x.png") left center
        no-repeat;
    background-size: 7px auto;
}

/* --------------------------------------------------
    パスワード変更
-------------------------------------------------- */
.passwoed_panel h1 {
    padding: 6px 0 6px 50px;
    background: url("../images/mypage/icon_paw_large.png") left center no-repeat;
    background-size: 40px auto;
}

.passwoed_panel .invalid-feedback {
    color: #F03B2F;
}

.passwoed_panel .top_09 .cus_01 {
    padding: 0 0 15px;
    border-bottom: 1px solid #EEEEEE;
}

.passwoed_panel .top_09 .cus_01 + .cus_01 {
    padding: 15px 0;
}

.passwoed_panel .top_09 .cus_02 + .cus_02 {
    margin: 5px 0 0;
}

.passwoed_panel .atten {
    margin: 4px 0 0;
    font-size: 10px;
}

.passwoed_panel .top_09 .cus_01 + .flex_02 {
    margin: 20px 0 15px;
}

/* --------------------------------------------------
    パスワード再設定
-------------------------------------------------- */
.reminder_panel h1 {
    margin: 0 0 10px;
    padding: 6px 0 6px 50px;
    background: url("../images/mypage/icon_paw_large.png") left center no-repeat;
    background-size: 40px auto;
}

.reminder_panel .top_09 form label {
    display: block;
    font-weight: bold;
}

.reminder_panel .top_09 form input {
    margin: 5px 0 0;
}

.reminder_panel .top_09 .center_obj button {
    display: block;
    max-width: 320px;
    width: 100%;
    margin: 40px auto 15px;
    height: 60px;
    font-size: 16px;
    font-weight: bold;
    color: #ffffff;
    text-align: center;
    border: none;
    border-radius: 4px;
    background: #3cb5ad;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* --------------------------------------------------
    解約手続き
-------------------------------------------------- */
.cancel_panel h1 {
    margin: 0 0 10px;
    padding: 6px 0 6px 50px;
    background: url("../images/mypage/icon_paw_large.png") left center no-repeat;
    background-size: 40px auto;
}

.cancel_panel h3 {
    margin: 0 0 10px;
    padding: 0 0 0 25px;
    font-size: 15px;
    font-weight: bold;
    background: url("../images/mypage/icon-warning@2x.png") left top no-repeat;
    background-size: 20px auto;
}

.cancel_panel .cus_01 form > div {
    margin: 20px 0 0;
}

.cancel_panel #modal .login_02 {
    margin: 0 0 20px;
    font-size: 16px;
    text-align: center;
}

.cancel_panel #modal .flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 20px auto 0;
}

.cancel_panel #modal .flex > * {
    width: calc((100% / 2) - 20px);
}

.cancel_panel #modal .close {
    padding: 18px 10px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 6px;
    background: #EFEFEF;
}

.cancel_panel .cancel_button,
.cancel_panel #modal .cancel {
    display: block;
    height: 60px;
    margin: 0;
    padding: 0;
    font-size: 16px;
    font-weight: bold;
    color: #ffffff;
    text-align: center;
    border-radius: 4px;
    border: 2px solid #D50000;
    background: #D50000;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.cancel_panel .cancel_button {
    width: 100%;
    max-width: 320px;
    margin: 0 auto;
}

.cancel_panel .form_box {
    margin: 25px 0 0;
    padding: 20px 0;
    border-top: 1px solid #EEEEEE;
}

.cancel_panel .form_box dl + dl{
    margin: 20px 0 0;
}

.cancel_panel .form_box dl dt {
    margin: 0 0 5px;
}

.cancel_panel .form_box dl + p {
    margin: 25px 0 10px;
}

/* --------------------------------------------------
    サービスご利用案内
-------------------------------------------------- */
.service_panel .service_title {
    display: flex;
    justify-content: space-between;
    margin: 0 0 20px;
}

.service_panel .service_title .service_title_img {
    width: 70px;
}

.service_panel .service_title img {
    width: 100%;
}

.service_panel .service_title h1 {
    width: calc(100% - 85px);
}

.service_panel .service_top_txt {
    margin: 0 0 40px;
}

.service_section + .service_section {
    margin: 40px 0 0;
}

.service_section h2 {
    margin: 0 0 15px;
    font-size: 18px;
    font-weight: bold;
}

.service_section .service_box {
    padding: 25px 15px 30px;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.service_section .service_box .service_box_inner {
    /*max-width: 440px;
    margin: 0 auto;*/
}

.service_section .service_box .service_list_01 {
    margin: 0 0 10px;

}

.service_section .service_box .service_list_01 li {
    position: relative;
    padding: 0 0 0 15px;
    background: url("../images/mypage/icon_list_circle.png") left top 5px no-repeat;
    background-size: 8px auto;
}

.service_section .service_box .service_list_01 li + li {
    margin: 15px 0 0;
}

.service_section .service_box .service_list_02 li {
    position: relative;
    padding: 0 0 0 25px;
    font-size: 12px;
}

.service_section .service_box .service_list_02 li span {
    position: absolute;
    top: 0;
    left: 0;
}

.service_section .service_box .service_list_02 li + li {
    margin: 5px 0 0;
}

.service_section .service_box .service_list_02 .note {
    padding: 0 0 0 15px;
}

.service_section .service_box .service_list_02 .shop_link_target {
    margin: 10px 0 0;
}

.service_section .service_box .service_list_02 .shop_link_target .shop_link {
    display: inline-block;
    padding: 0 15px 0 0;
    background: url("../images/mypage/icon_newtab@2x.png") right top 4px no-repeat;
    background-size: 10px auto;
}

.service_section .service_box .flow_list {
    counter-reset: item;
}

.service_section .service_box .flow_list > li {
    position: relative;
    padding: 25px 10px;
    border-radius: 4px;
    background: #F3F9F4;
}

.service_section .service_box .flow_list > li:before {
    counter-increment: item;
    content: counter(item);
    position: absolute;
    top: -12px;
    left: 0;
    width: 24px;
    height: 24px;
    padding: 4px 0 0;
    text-align: center;
    font-size: 12px;
    font-weight: bold;
    color: #ffffff;
    background: url("../images/mypage/icon_flow_list_counter_bg.png") no-repeat;
    background-size: 24px auto;
}

.service_section .service_box .flow_list > li + li {
    margin: 30px 0 0;
}

.service_section .service_box .flow_list dl dt {
    margin: 0 0 10px;
    font-weight: bold;
}

.service_section .service_box .flow_list dl dd + dd {
    margin: 10px 0 0;
}

.service_section .service_box .flow_list .shop_link_box .shop_link {
    display: inline-block;
    padding: 0 15px;
    background: url("../images/mypage/icon_arrow_right@2x.png") left center
            no-repeat,
        url("../images/mypage/icon_newtab@2x.png") right top 4px no-repeat;
    background-size: 7px auto, 10px auto;
}

.service_section .service_box .flow_list .service_list_01 {
    margin: 10px 0 0;
}

.service_section .service_box .flow_list .service_list_01 li + li {
    margin: 0;
}

.service_section .service_box .contact_link {
    max-width: 320px;
    margin: 0 auto 10px;
}

.service_section .service_box .contact_link a {
    display: block;
    padding: 7px 10px;
    font-weight: bold;
    text-align: center;
    border-radius: 4px;
    border: 1px solid #3CB5AD;
}

.service_section .service_box .contact_link a span {
    display: block;
    font-size: 12px;
}

.service_section .service_box .contact_link a em {
    display: inline-block;
    padding: 0 0 0 20px;
    font-size: 18px;
    background: url("../images/mypage/icon_tel@2x.png") left center no-repeat;
    background-size: 15px auto;
}

.service_section .service_box .contact_link + p {
    text-align: center;
}

/* --------------------------------------------------
    利用規約等
-------------------------------------------------- */
.terms_panel .service_title {
    margin: 0 0 20px;
}

.terms_section + .terms_section {
    margin: 40px 0 0;
}

.terms_section h2 {
    margin: 0 0 10px;
    font-size: 16px;
    font-weight: bold;
}

.terms_section .terms_box {
    padding: 20px 15px 30px;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}

.terms_section .terms_box .terms_box_inner {
    /*max-width: 440px;
    margin: 0 auto;*/
}

.terms_section .terms_box ul li + li {
    margin: 15px 0 0;
}

.terms_section .terms_box ul li  a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 60px;
    padding: 0 20px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 4px;
    border: 1px solid #3CB5AD;
    background: url("../images/mypage/icon_pdf.png") right 15px center no-repeat;
    background-size: 20px auto;
}

.passwordFrame{
    position: relative;
}

.passwordFrame .clearButton{
    width: 60px;
    position: absolute;
    right: 7px;
    top: 9px;
    background-color: #fff;
    border: none;
    cursor: pointer;
    border-radius: 3px;
}

/* --------------------------------------------------
    特定商取引画面
-------------------------------------------------- */
.commerce_panel {
    margin: 15px 0 0;
    padding: 20px 15px 30px;
    background: #ffffff;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
}
.commerce_title {
    padding: 6px 0 6px 50px;
    background: url("../images/mypage/icon_paw_large.png") left center no-repeat;
    background-size: 40px auto;
}
.commerce_section {

}
.commerce_box {

}
.commerce_box_inner {

}
.commerce_box_inner .commerce_line:first-child {
    border-top: 1px solid #eeeeee;
}
.commerce_line {
    padding: 10px 0;
    border-bottom: 1px solid #eeeeee;
}
.commerce_item_title {
    font-weight: 600;
    margin-top: 10px;
}
.commerce_item_data {

}

/* --------------------------------------------------
    エラー画面
-------------------------------------------------- */
.error_panel {
    text-align: center;
}

.error_panel h1 {
    font-size: 18px;
    font-weight: 600;
    margin-top: 12px;
}

.error_panel img {
    width: 183px;
    height: auto;
    margin-top: 24px;
}

.error_panel h2 {
    font-size: 32px;
    color: #8D97A8;
    margin-top: 16px;
}
.error_panel p {
    text-align: left;
    margin: 32px auto;
}

/* --------------------------------------------------
    メッセージ
-------------------------------------------------- */
.invalid-feedback {
    margin: 16px auto 8px;
    padding: 16px;
    background: #ffffff;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
    color: #F03B2F;
}
.invalid-feedback .icloud_notice_open {
    padding-left: 36px;
    background: url("../images/mypage/icon-warning@2x.png") left top no-repeat;
    background-size: 20px 20px;
}