﻿

html {
    overflow-y: scroll;
    scroll-behavior: smooth;
}

body {
    font-size: 11pt;
    font-family: 'Noto Sans JP', 'メイリオ', 'Meiryo', sans-serif;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    min-height: 100vh;
    position: relative;
    box-sizing: border-box;
    padding-bottom: 200px;
}

A:link {
    color: #0000ff;
}

A:visited {
    color: #0000ff;
}

#topContent {
    padding: 0 15%;
}

.pnlLocal {
    background-image: url(../img/locallabel.png);
    background-repeat: repeat;
    height: 40px;
    position: fixed;
    top: 0;
    width: 100%;
    opacity: 0.7;
}

.pnlLocalButton {
    text-align: center;
    background-color: #C00000;
    width: 100vw;
    margin: 0 calc(50% - 50vw);
    opacity: 0.7;
    margin-bottom: 20px;
    padding-bottom: 10px;
}


.TopImage {
    margin: 10px 10px;
}

.AppTitolBar {
    background-color: #0D0B6E;
    height: 38px;
    padding-top: 10px;
    padding-right: 5px;
    text-align: left;
    width: 100vw;
    margin: 0 calc(50% - 50vw);
    padding-left: 20px;
}

.AppTitol {
    font-size: 15pt;
    color: White;
    font-weight: bold;
    vertical-align: middle;
    margin: 0px 15%;
}

.Header {
    height: 33px;
    padding-top: 5px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: left;
    vertical-align: middle;
    font-size: 10pt;
    display: flex;
    margin-bottom: 3px;
    box-shadow: 0px 10px 5px -10px #999999;
    margin: 0;
    justify-content: space-between;
}

.Header_Info {
    margin: 3px 15%;
    text-align: left;
}

.HeaderText1 {
    margin-right: 1em;
}


.Header_Button {
    margin: 0px 15%;
}

.LabelLoginID {
    font-size: 10pt;
    font-family: ＭＳ ゴシック;
    color: #000000;
    margin-right: 20px;
}

.LabelLoginName {
    font-size: 10pt;
    font-family: ＭＳ ゴシック;
    color: #000000;
    font-weight: bold;
    margin-right: 20px;
}

.ButtonBarTop {
    background-color: #ffffff;
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 5px;
    padding-top: 5px;
    text-align: right;
}

.ButtonBarBottom {
    background-color: #ffffff;
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 5px;
    padding-top: 5px;
    text-align: left;
}

.Main {
    background-color: #FFFFFF;
    margin: 20px auto;
    padding-left: 15%;
    padding-right: 15%;
    padding-bottom: 20px;
    vertical-align: text-top;
    /*
	border-top-color :#5dabdb;
	border-top-style :double;
	border-bottom-color :#5dabdb;
	border-bottom-style :double;
		*/
}

.Footer {
    background-color: #C9E4F5;
    height: 180px;
    padding-top: 35px;
    padding-bottom: 5px;
    padding-left: 5px;
    padding-right: 5px;
    width: 100vw;
    margin: 0px calc(50% - 50vw);
    display: flex;
    flex-direction: column;
    position: absolute;
    bottom: 0;
}

.FooterMes {
    text-align: center;
    font-size: 10pt;
    color: #000000;
}

.FooterTitol {
    text-align: center;
    margin-top: auto;
    font-size: 10pt;
    color: #000000;
}

.FooterLink {
    text-align: center;
    margin-top: 30px;
    font-size: 10pt;
}

.CmdBtnStd {
    font-size: 10pt;
    color: #ffffff;
    background-color: Blue;
}

.CmdBtnGreen {
    font-size: 10pt;
    color: #000000;
    background-color: #C9E4F5;
}

.CmdBtnYerrow {
    font-size: 10pt;
    color: #000000;
    background-color: #ffff00;
}

.BtnRollOver8 {
    background-color: #8a2be2;
    color: #ffffff;
    margin-top: 10px;
    float: left;
}

.TableHeaderStd {
    font-size: 11pt;
    color: #000000;
    background-color: #C9E4F5;
}

.MessageBoxStd {
    font-size: 10pt;
    color: #000000;
    padding: 10px;
    border-style: dashed;
    border-width: 1px;
    margin-top: 0px;
    background-color: #FFFF88;
}

.MessageBoxStartNotice {
    font-size: 12pt;
    color: #000000;
    padding: 10px;
    border-style: dashed;
    border-width: 2px;
    margin-top: 0px;
    background-color: #FF9999;
}

.MyMarkImage {
    margin-right: 20px;
    height: 40px;
    width: 40px;
}

.TodokeMarkImage {
    height: 40px;
    width: 40px;
}

.TodokeName {
    font-size: 18pt;
    font-weight: bold;
    color: #000000;
}

/*↓↓↓↓ここから阿川aspx用*/
/*-------------------------------------------*/
/* データ編集用テーブル
/*-------------------------------------------*/
.DataEditTable {
    border-collapse: collapse;
}
/*-----項目名のセル-----*/
.DataEditCell_Name {
    background-color: #CCCCCC;
    border-color: #999999;
    border: 1px;
    border-style: solid;
    padding: 5px;
}

/*-----入力用のセル-----*/
.DataEditCell_Data {
    border-color: #999999;
    border: 1px;
    border-style: solid;
    padding: 5px;
}

.YCEditText {
    padding: 5px;
}

.ContEdit {
    background-color: #99ff66;
}

.ContEditText {
    padding: 5px;
    background-color: #99ff66;
}

/*↑↑↑↑ここまで阿川aspx用*/

#ErrorList {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 5px 5px 5px 20px;
    width: 600px;
    border-color: #f00;
    border-style: solid;
    border-width: 1px;
    background-color: #fff;
    color: Red;
}

.CmdBtnSyounin {
    font-size: 9pt;
    text-align: center;
    font-weight: bold;
    color: #000080;
    background-color: #ffff00;
    Height: 50px;
    Width: 50px;
}

/*↓↓↓↓ここから笠松aspx用*/
.CmdBtnLogin_Wrap {
    margin: 0 auto;
    text-align: center;
    display: block;
}

.CmdBtnLogin {
    display: inline-block;
    line-height: 2.5rem;
    text-align: center;
    width: 280px !important;
    height: 2.5rem !important;
    margin: 20px 15px 0px 20px;
    vertical-align: middle;
    position: relative;
    border-radius: 30px;
    font-size: 1rem;
    cursor: pointer;
    border: 1px solid #006FBC;
    background: #006FBC;
    color: #fff;
    font-weight: bold;
}

    .CmdBtnLogin:hover {
        opacity: 0.7;
    }

.CmdBtnNewLogin {
    display: inline-block;
    line-height: 2.5rem;
    text-align: center;
    width: 280px !important;
    height: 2.5rem !important;
    margin: 20px 15px 25px 20px;
    vertical-align: middle;
    position: relative;
    border-radius: 30px;
    font-size: 0.9rem;
    cursor: pointer;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    font-weight: bold;
}

    .CmdBtnNewLogin:hover {
        background: #006FBC;
        color: #fff;
    }

.ContentsTitle {
    background: #006FBC;
    line-height: 2rem;
    color: #fff;
    font-weight: 700;
    font-size: 20px;
    padding-left: 37px;
    margin: 0 auto 19px;
    padding-top: 10px;
    padding-bottom: 10px;
}


.ContentsTitleChildA {
    color: #006FBC;
    font-weight: 700;
    font-size: 20px;
    border-left: solid 5px #006FBC;
    padding: 0.25em 0.5em;
}

.SmallTitle {
    color: #000;
    font-weight: 700;
    font-size: 18px;
    margin-top: 15px;
    text-align: left;
}

.ContentsMes {
    margin: 0 auto;
    text-align: center;
    font-size: 16px;
    margin: 50px 0;
}

.ContentsMesLeft {
    text-align: Left;
    font-size: 16px;
    margin: 50px 0;
}

.dlForm {
    display: block;
    margin: 0 auto 30px;
}

.dltitle {
    padding-left: 37px;
    padding-right: 37px;
    padding-top: 8px;
    padding-bottom: 8px;
    background-color: #E2F0FA;
    color: #006FBC;
    margin-bottom: 20px;
    font-weight: 700;
    font-size: 18px;
}

.ddMes {
    color: #006FBC;
    font-weight: bold;
    border-bottom: none;
}

.ddMesStr {
    color: #006FBC;
    font-weight: bold;
    background: linear-gradient(transparent 60%, #FFFF00 60%);
}

.dlForm_ErrMes {
    margin-bottom: 10px;
}

.Menu_News {
    width: 100%;
}

.Menu_NewsItem {
    border: 1px solid #575757;
    margin-bottom: 20px;
    padding: 14px 14px 10px 10px;
}

.Menu_NewsHeader {
    font-weight: bold;
    margin-bottom: 10px;
}

.Menu_NewsDetail {
    font-size: 14px;
    line-height: 1.42857;
    padding: 10px 10px 20px;
}

.Menu_MesDetail {
    font-weight: bold;
    font-size: 14px;
    line-height: 1.42857;
    padding: 10px 10px 20px;
}

.ListArea {
    padding: 0px 5px 15px 5px;
}

.ListAreaSubmit {
    text-align: center;
    background: #f3f3f3;
    padding: 15px 5px 15px 5px;
    margin-top: 20px;
}

.ListArea-labels {
    display: flex;
    justify-content: center;
    margin-bottom: 10px;
    align-items: center;
}

.ListArea-button {
    text-align: left;
    margin-left: 20px; /* お好みで調整 */
    margin-bottom: 10px;
}


.CmdBtnDateSubmit {
    text-align: left;
}


.CmdBtnLogOut {
    width: 100px !important;
    text-align: center;
    position: relative;
    border-radius: 5px;
    cursor: pointer;
    border: 1px solid #006FBC;
    background: #006FBC;
    color: #fff;
}

    .CmdBtnLogOut:hover {
        background: #E2F0FA;
        color: #006FBC;
    }


.CmdBtnUserInfo {
    width: 100px !important;
    text-align: center;
    position: relative;
    border-radius: 5px;
    cursor: pointer;
    border: 1px solid #cccccc;
    background: #cccccc;
    color: #000;
}

    .CmdBtnUserInfo:hover {
        background: #666;
        color: #fff;
    }

.UserInfo {
    margin-left: auto;
    margin-right: auto;
}

.UserInfoTable {
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid #000;
    margin-bottom: 26px;
}

    .UserInfoTable dt {
        text-align: left;
        padding: 12px 15px 12px 26px !important;
        border-bottom: 1px solid #000;
        background: #E2F0FA;
        color: #006FBC;
        width: 250px;
        font-weight: bold;
        box-sizing: border-box;
    }

    .UserInfoTable dd {
        text-align: left;
        width: calc(100% - 250px);
        border-bottom: 1px solid #000;
        padding: 12px 50px 12px 18px;
        display: flex;
        align-items: center;
        background: #fff;
        box-sizing: border-box;
        margin-left: 0;
    }

.UserInfoTable_Shiken {
    display: grid;
    grid-template-columns: 120px 1fr 120px 1fr;
    line-height: 1.2;
    border-top: 1px solid #000;
    margin-top: 26px;
    margin-bottom: 10px;
}

    .UserInfoTable_Shiken dt {
        text-align: left;
        font-weight: bold;
        padding: 2px 0;
        margin: 0;
        padding: 12px 10px 12px 10px !important;
        border-bottom: 1px solid #000;
        background: #E2F0FA;
        color: #006FBC;
        box-sizing: border-box;
    }

    .UserInfoTable_Shiken dd {
        margin: 0;
        padding: 2px 0;
        text-align: left;
        border-bottom: 1px solid #000;
        padding: 12px 10px 12px 18px;
        align-items: center;
        background: #fff;
        box-sizing: border-box;
    }


.UserInfoTable_Shiken_pnl {
    display: grid;
    grid-template-columns: 110px 1fr 110px 1fr 110px 1fr 110px 1fr;
    line-height: 1.0;
    border-top: 1px solid #000;
    margin-top: 26px;
    margin-bottom: 10px;
    font-size: 95%;
}

    .UserInfoTable_Shiken_pnl dt {
        text-align: left;
        font-weight: bold;
        padding: 2px 0;
        margin: 0;
        padding: 12px 10px 12px 10px !important;
        border-bottom: 1px solid #000;
        background: #E2F0FA;
        color: #006FBC;
        box-sizing: border-box;
    }

    .UserInfoTable_Shiken_pnl dd {
        margin: 0;
        padding: 2px 0;
        text-align: left;
        border-bottom: 1px solid #000;
        padding: 12px 10px 12px 18px;
        align-items: center;
        background: #fff;
        box-sizing: border-box;
    }

.MemberList th, .MemberList td {
    border: 1px solid #000;
    padding: 5px;
    text-align: center;
    background-color: #fff;
    font-size: 95%;
}

.MemberList th {
    background-color: #f2f2f2;
    font-weight: bold;
    font-size: 90%;
}

    .MemberList td:nth-child(4),
    .MemberList th:nth-child(4) {
        border-left: double 4px #666; /* 二重線に */
    }

    .MemberList td:nth-child(2),
    .MemberList td:nth-child(5),
    .MemberList th:nth-child(2),
    .MemberList th:nth-child(5) {
        text-align: left;
    }

.MailList {
    margin-top: 10px;
}

    .MailList th, .MailList td {
        border: 1px solid #808080;
        padding: 5px;
        text-align: center;
        background-color: #fff;
        font-size: 95%;
    }

    .MailList th {
        background-color: #f2f2f2;
        font-weight: bold;
        font-size: 90%;
    }


.EditBtn {
    font-size: 14px;
    padding: 4px 8px;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    border-radius: 5px;
    cursor: pointer;
}

    .EditBtn:hover {
        background: #006FBC;
        color: #fff;
    }

.btnlist {
    align-items: center;
    justify-content: center;
    display: flex;
    flex-flow: column;
    margin-top: 20px;
    margin-bottom: 20px;
}


.CmdBtnSubmit {
    width: 280px !important;
    height: 2.5rem !important;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    border-radius: 8px;
    margin: 10px 10px;
    cursor: pointer;
    font-size: 14px;
}

    .CmdBtnSubmit:hover {
        background: #006FBC;
        color: #fff;
    }

.CmdBtnGoback {
    width: 280px !important;
    height: 2.5rem !important;
    border: 1px solid #666;
    background: #f3f3f3;
    color: #333;
    border-radius: 8px;
    margin: 10px 10px;
    cursor: pointer;
    font-size: 14px;
}

    .CmdBtnGoback:hover {
        background: #666;
        color: #fff;
    }

.CmdBtnGoback-mini {
    width: 150px !important;
    height: 2.5rem !important;
    border: 1px solid #666;
    background: #f3f3f3;
    color: #333;
    border-radius: 8px;
    margin: 10px 10px;
    cursor: pointer;
    font-size: 14px;
}

    .CmdBtnGoback-mini:hover {
        background: #666;
        color: #fff;
    }

.CmdBtnTemp {
    width: 280px !important;
    height: 2.5rem !important;
    border: 1px solid #006FBC;
    background: #fff;
    color: #006fbc;
    border-radius: 8px;
    margin: 10px 10px;
    cursor: pointer;
    font-size: 14px;
}

    .CmdBtnTemp:hover {
        background: #E2F0FA;
        color: #006fbc;
    }

.required_span {
    display: inline-block;
    color: #fff;
    background: #E12800;
    padding: 0 12px;
    font-size: 1.125rem;
    font-weight: 700;
    border-radius: 5px;
    margin-bottom: 5px;
    margin-left: 8px;
    vertical-align: middle;
}

.required_span_small {
    display: inline-block;
    color: #fff;
    background: #E12800;
    padding: 0 8px;
    font-size: 0.8rem;
    font-weight: 500;
    border-radius: 5px;
    margin-bottom: 5px;
    margin-left: 5px;
    vertical-align: middle;
}

.any_span {
    display: inline-block;
    color: #fff;
    background: #888888;
    padding: 0 12px;
    font-size: 1.125rem;
    font-weight: 700;
    border-radius: 5px;
    margin-bottom: 5px;
    margin-left: 8px;
    vertical-align: middle;
}

.formno_span {
    color: #54413D;
    background: #EAD66E;
    padding: 0 8px;
    font-size: 70%;
    font-weight: 700;
    border-radius: 8px;
    margin-right: 8px;
    float: right;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.Contents_Gakka {
    margin-bottom: 10px;
    display: flex;
    flex-direction: column;
}

.Contents_Zitsugi {
    margin-bottom: 10px;
    display: flex;
    flex-direction: column;
}

.SerchArea_Box {
    border: 2px solid #006FBC;
    margin-bottom: 20px;
    padding: 5px 10px;
    background: #fff;
}

    .SerchArea_Box dl {
        display: flex;
        align-items: center;
        margin-bottom: 10px;
    }

    .SerchArea_Box dt {
        width: 110px; /* ラベルの幅を固定 */
    }

    .SerchArea_Box dl dt {
        font-weight: bold;
        margin: 5px 15px;
    }

    .SerchArea_Box dl dd {
        margin-left: 15px;
        margin-right: 15px;
    }

.ListPager table {
    text-align: center;
}

.LastTime {
    margin-top: 10px;
    margin-bottom: 15px;
    font-size: 14px;
}

.SortArea {
    display: flex;
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
}

.SortPattern {
    margin-right: 20px;
}


.ShikenList,
.ShikenList_pnl {
    margin-bottom: 20px;
    margin-top: 10px;
    background-color: #fff;
}

    .ShikenList tr {
        height: 40px;
    }

    .ShikenList_pnl tr {
        height: 25px;
        font-size: 95%;
    }

.DoctorList {
    width: 100%;
    margin-bottom: 20px;
    margin-top: 10px;
}

    .DoctorList tr {
        height: 40px;
    }


.Calendar {
    margin-top: 10px;
    width: 400px;
}

.CmdBtnShowCalendar {
    width: 200px !important;
    height: 2.5rem !important;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    border-radius: 8px;
    margin: 10px 10px;
    cursor: pointer;
    font-size: 14px;
}

.dlform_ddList dd {
    margin: 10px 0px;
}

.dlform_List {
    display: flex;
    flex-wrap: wrap;
    margin-top: 10px;
    margin-bottom: 5px;
}


    .dlform_List dt {
        width: 150px;
        box-sizing: border-box;
        padding-top: 10px;
    }

    .dlform_List dd {
        width: calc(100% - 250px);
        display: flex;
        margin-left: 0;
        align-items: center;
    }

.radioPlace {
    margin-bottom: 8px;
}

.PlaceInfoList {
    margin-top: 20px;
}

.ListbtnEdit {
    padding: 3px 20px;
    font-size: 14px;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    border-radius: 5px;
    cursor: pointer;
}


    .ListbtnEdit:hover {
        background: #006FBC;
        color: #fff;
    }

.ListbtnEdit_Zitsugi {
    padding: 3px 20px;
    font-size: 14px;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    border-radius: 5px;
    cursor: pointer;
    margin: 5px;
}


    .ListbtnEdit_Zitsugi:hover {
        background: #006FBC;
        color: #fff;
    }

.ListZitsugi_Ope {
    padding: 10px 5px 10px 5px;
}

.ListbtnEditDisable {
    padding: 3px 20px;
    font-size: 14px;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    border-radius: 5px;
    opacity: 0.3;
}

.CmdBtnShow {
    width: 300px !important;
    height: 2.5rem !important;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    border-radius: 8px;
    margin: 10px 10px;
    cursor: pointer;
    font-size: 14px;
}

.CmdBtnShowSelected {
    width: 300px !important;
    height: 2.5rem !important;
    border: 1px solid #666;
    background: #006FBC;
    color: #fff;
    border-radius: 8px;
    margin: 10px 10px;
    cursor: pointer;
    font-size: 14px;
}

.CmdBtndisable {
    width: 280px !important;
    height: 2.5rem !important;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    border-radius: 8px;
    margin: 10px 10px;
    font-size: 14px;
    opacity: 0.3;
}

.CmdBtnDoctorAdd {
    width: 200px !important;
    height: 2.5rem !important;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    border-radius: 8px;
    margin: 5px 5px;
    cursor: pointer;
    font-size: 14px;
}

    .CmdBtnDoctorAdd:hover {
        background: #006FBC;
        color: #fff !important;
    }

.CmdBtnDoctorAddDisable {
    width: 200px !important;
    height: 2.5rem !important;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    border-radius: 8px;
    margin: 5px 5px;
    font-size: 14px;
    opacity: 0.3;
}

.CmdBtnDoctorSubmit {
    width: 200px !important;
    height: 2.5rem !important;
    border: 1px solid #FF3A5E;
    background: #FF3A5E;
    color: #fff;
    font-weight: bold;
    border-radius: 8px;
    margin: 5px 5px;
    cursor: pointer;
    font-size: 14px;
}

    .CmdBtnDoctorSubmit:hover {
        opacity: 0.7;
    }

.CmdBtnDoctorSubmitDisable {
    width: 200px !important;
    height: 2.5rem !important;
    border: 1px solid #FF3A5E;
    background: #FF3A5E;
    color: #fff;
    font-weight: bold;
    border-radius: 8px;
    margin: 5px 5px;
    font-size: 14px;
    opacity: 0.3;
}


.CmdBtnDoctorAddlnk {
    text-decoration: none;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc !important;
    border-radius: 8px;
    margin: 5px 5px;
    padding: 9px 30px;
    cursor: pointer;
    font-size: 14px;
}

    .CmdBtnDoctorAddlnk:hover {
        background: #006FBC;
        color: #fff !important;
    }


.CmdBtnPassVisible {
    height: 2.5rem !important;
    border: 1px solid #006FBC;
    background: #006FBC;
    color: #fff;
    border-radius: 3px;
    cursor: pointer;
    font-size: 14px;
}

    .CmdBtnPassVisible:hover {
        opacity: 0.7;
    }


.ResumeTable {
    margin-top: 20px;
    background: #f3f3f3;
    padding: 20px;
}


.formTextbox {
    font-size: 16px;
    height: 36px;
    vertical-align: middle;
    margin: 0 10px;
}

.UserInfoTable dd .formTextbox {
    margin: 0; /* 紫斜線の原因になる左右10px marginを打ち消す */
    width: 100%; /* ddの残り幅いっぱいに広げる */
    box-sizing: border-box; /* padding含めて幅を計算 */
    padding: 0 10px; /* 元のmargin相当の余白をpaddingで確保 */
}


.NumberBox {
    font-size: 16px;
    height: 36px;
    vertical-align: middle;
    text-align: center;
    margin: 0 10px;
    ime-mode: inactive;
}

.NumberBoxLeft {
    font-size: 16px;
    height: 36px;
    vertical-align: middle;
    text-align: left;
    margin: 0 10px;
    ime-mode: inactive;
}


.flow {
    display: flex; /* flexboxで横並びにする */
    justify-content: space-between; /* 横並びにしたものを等間隔で並べる */
    padding-left: 0px;
}

    .flow li {
        color: #333; /* 文字色を黒に指定 */
        font-size: 14px; /* 文字サイズを指定 */
        width: calc(100% / 4); /* 横幅を三等分した1つの大きさに指定 */
        background: #eee; /* 背景色をグレーに指定 */
        line-height: 50px; /* 行間(高さの代わり)を指定 */
        text-align: center; /* 文字を中央寄せにする */
        position: relative; /* 基準位置とする */
        list-style: none;
    }

        .flow li:not(:first-child):not(:last-child) {
            padding: 0 0 0 10px; /* 最初と最後以外には左に適度な余白を指定 */
        }

        .flow li::before,
        .flow li::after {
            content: ""; /* 疑似要素では必須 */
            width: 0; /* 横幅を0に指定 */
            height: 0; /* 高さを0に指定 */
            display: block; /* ブロック要素にする */
            position: absolute; /* 相対位置に指定 */
        }

        .flow li::before {
            border: solid 32px transparent; /* 32pxのborderを指定 */
            border-right: solid 13px transparent; /* 幅を合わせるため右線は13pxにする */
            border-left: solid 13px #FFF; /* 白い三角形を作成して▷の形で上に重ねて削り取る */
            top: -7px; /* 重ねる位置(縦軸)を調整 */
            left: 0; /* 重ねる位置(横軸)を調整 */
            z-index: 1; /* 重なり順を指定 */
        }

        .flow li::after {
            border: solid 25px transparent; /* 25pxのborderを指定 */
            border-left: solid 10px #EDEDED; /* 左のborderで背景色と同じ▶の部分を作成する */
            border-right: solid 10px transparent; /* 幅を合わせるために右線は10pxにする */
            top: 0; /* 重ねる位置(縦軸)を調整 */
            right: -20px; /* 重ねる位置(横軸)を調整 */
            z-index: 2; /* 重なり順の優先度を他よりも上げる */
        }

        .flow li:first-child::before,
        .flow li:last-child::after {
            content: none; /* 最初のliの左と最後のliの右は作らない */
        }

        /* 以下.currentだけ色を変えるCSS */

        .flow li.current,
        .flow li.complete {
            color: #FFF;
            background: #006FBC;
        }

            .flow li.current::after,
            .flow li.complete::after {
                border-left: solid 10px #006FBC;
            }

.progressbar,
.progressbar_Doctor {
    position: relative;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    font-size: 13px;
    margin-bottom: 30px;
}

    .progressbar li {
        position: relative;
        list-style-type: none;
        text-align: center;
        text-transform: uppercase;
        width: calc(100% / 6);
        color: #999999;
        font-weight: bold;
        counter-increment: steps;
    }

    .progressbar_Doctor li {
        position: relative;
        list-style-type: none;
        text-align: center;
        text-transform: uppercase;
        width: calc(100% / 5);
        color: #999999;
        font-weight: bold;
        counter-increment: steps;
    }

        .progressbar li:before,
        .progressbar_Doctor li:before {
            display: block;
            width: 26px;
            height: 26px;
            margin: 7px auto 7px auto;
            content: '';
            line-height: 26px;
            font-size: 12px;
            text-align: center;
            border-radius: 50%;
            background-color: #F5F5F5;
            content: counter(steps);
        }

        .progressbar li:after,
        .progressbar_Doctor li:after {
            position: absolute;
            z-index: -1;
            top: 15px;
            left: -50%;
            width: 100%;
            height: 2px;
            content: '';
            background-color: #F5F5F5;
        }

        .progressbar li:first-child:after,
        .progressbar_Doctor li:first-child:after {
            content: none;
        }

        .progressbar li.active,
        .progressbar li.complete,
        .progressbar_Doctor li.active,
        .progressbar_Doctor li.complete {
            color: #0070BD;
        }

            .progressbar li.active:before,
            .progressbar li.complete:before,
            .progressbar_Doctor li.active:before,
            .progressbar_Doctor li.complete:before {
                background-color: #0070BD;
                color: #FFF;
            }

            .progressbar li.active:after,
            .progressbar li.complete:after,
            .progressbar_Doctor li.active:after,
            .progressbar_Doctor li.complete:after {
                background-color: #0070BD;
            }



.PersonalInfo {
    margin-bottom: 40px;
    font-size: 15px;
}

    .PersonalInfo li {
        margin-bottom: 20px;
    }

.AgreeMes {
    text-align: center;
}

.FormBreak {
    display: flex;
}


.FormBreak_all {
    flex-direction: column;
    align-items: flex-start;
}

.FormBreak_allcld {
    padding-left: 0px;
    margin-bottom: 10px;
}

.AddInput {
    display: flex;
    align-items: center; /* 縦位置を揃える */
    margin-bottom: 8px;
    width: 100%;
}

.AddInput_Span {
    flex: 0 0 155px; /* ラベルは20%固定 */
    text-align: left; /* 右寄せで揃える */
    padding-right: 3px;
}

.AddInput input {
    flex: 1; /* テキストボックスは残り幅 */
}

.doctorSelect {
    display: flex;
    margin-bottom: 20px;
}

.resumestatus_request {
    display: inline-block;
    border: solid 2px #FF8C00;
    color: #FF8C00;
    background: #fff;
    padding: 2px 8px;
    font-size: 90%;
    font-weight: 700;
    border-radius: 5px;
    margin-bottom: 5px;
}

.resumestatus_comp {
    display: inline-block;
    border: solid 2px #009D63;
    color: #009D63;
    padding: 2px 8px;
    font-size: 90%;
    font-weight: 700;
    border-radius: 5px;
    margin-bottom: 5px;
}

.resumestatus_reject {
    display: inline-block;
    border: solid 2px #004FA4;
    color: #004FA4;
    background: #fff;
    padding: 0 8px;
    font-size: 90%;
    font-weight: 700;
    border-radius: 5px;
    margin-bottom: 5px;
}

.resumestatus_substitute {
    display: inline-block;
    border: solid 2px #a20db5;
    color: #a20db5;
    background: #fff;
    padding: 0 8px;
    font-size: 90%;
    font-weight: 700;
    border-radius: 5px;
    margin-bottom: 5px;
}


.resumestatus_noaction {
    display: inline-block;
    border: solid 2px #B92E34;
    color: #B92E34;
    background: #fff;
    padding: 0 8px;
    font-size: 90%;
    font-weight: 700;
    border-radius: 5px;
    margin-bottom: 5px;
}

.ListDoctorRow {
    display: inline-block;
    justify-content: center; /*左右中央揃え*/
    align-items: center; /*上下中央揃え*/
    margin: 10px;
}

.ListDoctorName {
    margin-bottom: 3px;
}

.ChkBoxClass input {
    width: 15px;
    height: 15px;
    margin-right: 5px;
}

.menu-list {
    margin: 3.2rem;
    text-align: center; /* 中央寄せ */
}

.menu-item {
    height: 90px; /* 高さ指定 */
    display: inline-block; /* インラインブロックにする */
}

.CmdBtnMenuItem {
    width: 400px !important;
    height: 5rem !important;
    border: 1px solid #006FBC;
    background: #E2F0FA;
    color: #006fbc;
    border-radius: 8px;
    margin: 10px 10px;
    cursor: pointer;
    font-size: 24px;
    font-weight: 600;
}

    .CmdBtnMenuItem:hover {
        background: #006FBC;
        color: #fff;
    }

.submitstatus_comp {
    display: inline-block;
    border: solid 2px #009D63;
    color: #fff;
    background: #009D63;
    padding: 5px 15px;
    font-size: 150%;
    font-weight: 700;
    border-radius: 8px;
    margin-bottom: 3px;
    margin-right: 10px;
}


.status_new {
    font-size: 10px;
    font-weight: 700;
    background-color: #dc143c;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
    color: white;
    padding: 2px 3px;
    border-radius: 3px;
    width: 20px;
}

.status_pnd {
    font-size: 9.5px;
    font-weight: 500;
    background-color: #0040f5;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
    color: white;
    padding: 2px 3px;
    border-radius: 3px;
    width: 30px;
}

.status_check {
    font-size: 12px;
    font-weight: 700;
    background-color: #F56500;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
    color: white;
    padding: 2px 5px;
    border-radius: 50%;
    width: 12.5px;
}


.Nstatus_comp {
    font-size: 13px;
    background-color: #E5E5E5;
    box-shadow: 0 2px 0 #D9D9D9;
    color: #454545;
    padding: 5px 5px;
    border-radius: 3px;
    width: 40px;
}

.Nstatus_pndA {
    font-size: 13px;
    background-color: #C6E1C6;
    box-shadow: 0 2px 0 #BCD6BC;
    color: #2C4700;
    padding: 5px 5px;
    border-radius: 3px;
    width: 40px;
}

.Nstatus_pndB {
    font-size: 13px;
    background-color: #F8DDA7;
    box-shadow: 0 2px 0 #EBD29E;
    color: #573B00;
    padding: 5px 5px;
    border-radius: 3px;
    width: 40px;
}

.Status_pndB {
    font-size: 13px;
    background-color: #F8DDA7;
    box-shadow: 0 2px 0 #EBD29E;
    color: #573B00;
    padding: 5px 5px;
    border-radius: 3px;
    width: 52px;
}

.Nstatus_pndC,
.Status_pndC {
    font-size: 13px;
    background-color: #EBA3A3;
    box-shadow: 0 2px 0 #DF9B9B;
    color: #570000;
    padding: 5px 5px;
    border-radius: 3px;
    width: 52px;
}

.Loginbg {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
    height: 315px;
    background-image: url(../img/header-bg-1.png);
    background-size: cover;
    margin-bottom: 30px;
    padding-left: 20px;
}

.LoginMes {
    padding-top: 60px;
    vertical-align: middle;
}

.LoginMes_title {
    margin-top: 30px;
    margin-bottom: 35px;
    padding-bottom: 10px;
    font-size: 2.2rem;
    font-weight: bold;
    letter-spacing: .15em;
    border-bottom: 1px solid;
    margin: 0px 15%;
    color: #ffffff;
    text-shadow: 1px 1px 1px #003366, -1px 1px 1px #003366, 1px -1px 1px #003366, -1px -1px 1px #003366, 1px 0px 1px #003366, 0px 1px 1px #003366, -1px 0px 1px #003366, 0px -1px 1px #003366;
}

.LoginMes_contents {
    padding-top: 30px;
    margin-bottom: 35px;
    padding-bottom: 10px;
    font-size: 1.3rem;
    font-weight: bold;
    letter-spacing: .15em;
    margin: 0px 15%;
    color: #ffffff;
    line-height: 150%;
    text-shadow: 1px 1px 1px #003366, -1px 1px 1px #003366, 1px -1px 1px #003366, -1px -1px 1px #003366, 1px 0px 1px #003366, 0px 1px 1px #003366, -1px 0px 1px #003366, 0px -1px 1px #003366;
}

.iconlist {
    display: flex;
    flex-flow: column;
    margin-bottom: 20px;
}

.iconlistitem {
    display: flex;
    margin-bottom: 20px;
}

.flow_design04,
.flow_design04 * {
    box-sizing: border-box;
}


.flow04 {
    padding-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    margin-left: 0;
    margin-top: 0;
    box-sizing: border-box;
}

    .flow04 > .step,
    .flow04 > .stepB {
        list-style-type: none;
        padding: 0 10px;
        flex: 1 1 18%;
        max-width: calc(20%);
        display: flex;
        flex-direction: column;
        align-items: stretch;
        min-width: 150px;
        box-sizing: border-box;
    }

        .flow04 > .step:hover dl,
        .flow04 > .stepB:hover dl {
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
        }

        .flow04 > .step .icon04,
        .flow04 > .stepB .icon04 {
            line-height: 2;
            width: 2em;
            height: 2em;
            text-align: center;
            color: #fff;
            background: #E26B5D;
            margin: 0 auto 10px;
            display: block;
            border-radius: 100vh;
            position: relative;
        }

            .flow04 > .step .icon04::before,
            .flow04 > .stepB .icon04::before {
                content: "";
                border: solid transparent;
                border-width: 7px;
                border-top-color: #E26B5D;
                position: absolute;
                top: calc(100% - 2px);
                left: 50%;
                -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
            }

        .flow04 > .step .icon04nodone,
        .flow04 > .step .icon04done,
        .flow04 > .stepB .icon04nodone,
        .flow04 > .stepB .icon04done {
            width: 30px;
            height: 30px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-size: 18px;
            font-weight: bold;
            position: relative;
            margin: 0 auto 10px;
        }

            .flow04 > .step .icon04nodone::before,
            .flow04 > .step .icon04done::before,
            .flow04 > .stepB .icon04nodone::before,
            .flow04 > .stepB .icon04done::before {
                content: "✔";
            }

        .flow04 > .step .icon04done,
        .flow04 > .stepB .icon04done {
            background-color: #4CAF50; /* グリーン背景 */
        }

        .flow04 > .step .icon04nodone,
        .flow04 > .stepB .icon04nodone {
            background-color: #C0C0C0; /* グリーン背景 */
        }


        .flow04 > .step dl,
        .flow04 > .stepB dl {
            padding: 15px;
            margin: 0;
            position: relative;
            width: 100%;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            flex: 1;
            flex-grow: 1;
            box-shadow: 0 0 10px rgba(33, 150, 243, 0.4);
        }

        .flow04 > .step dl {
            border: 3px solid #E26B5D;
            min-height: 196px;
        }

        .flow04 > .stepB dl {
            border: 3px solid #006FBC;
            min-height: 150px;
        }

            .flow04 > .stepB dl.nopadding {
                padding: 15px 5px;
            }

        .flow04 > .step:not(:first-child) dl::before,
        .flow04 > .stepB:not(:first-child) dl::before {
            content: "";
            width: 10px;
            height: 10px;
            margin-right: 10px;
            display: inline-block;
            border-top: 4px solid #666;
            border-right: 4px solid #666;
            position: absolute;
            top: calc(50% - 14px);
            left: -22px;
            -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
        }

        .flow04 > .step dl dt,
        .flow04 > .stepB dl dt {
            font-size: 1.2em;
            font-weight: 600;
            -ms-flex-preferred-size: 20%;
            flex-basis: 20%;
            margin-bottom: 10px;
            text-align: center;
        }

        .flow04 > .step dl dt {
            color: #E26B5D;
        }

        .flow04 > .stepB dl dt {
            color: #006FBC;
        }

        .flow04 > .step dl dd,
        .flow04 > .stepB dl dd {
            margin-left: 0;
            text-align: center;
            color: #000;
        }

        .flow04 > .step dl dt.small-text,
        .flow04 > .stepB dl dt.small-text {
            font-size: 1.0em; /* 例：他より小さめに */
        }






.step-link {
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    background-color: #fff;
}

    .step-link:hover {
        background-color: #f3f3f3;
    }


.flow04 > .step .pnlDateStep {
    background-color: #E26B5D;
    border-radius: 10px;
    padding: 10px;
}

    .flow04 > .step .pnlDateStep dd {
        color: #fff;
    }


/* 未開始ステップ用 */
.flow04 > .step.pend dl,
.flow04 > .stepB.pend dl {
    opacity: 0.5;
}

.flow04 > .step.pend .icon04,
.flow04 > .stepB.pend .icon04 {
    opacity: 0.5;
}

    .flow04 > .step.pend .icon04::before,
    .flow04 > .stepB.pend .icon04::before {
        opacity: 0.5;
    }

.flow04 > .step.pend dl dt,
.flow04 > .step.pend dl dd,
.flow04 > .stepB.pend dl dt,
.flow04 > .stepB.pend dl dd {
    opacity: 0.5;
}

.step-link.pend:hover {
    background-color: #fff;
}

/* 完了ステップ用 */
.flow04 > .step.done dl,
.flow04 > .stepB.done dl {
    border: 3px solid #4CAF50;
}

.flow04 > .step.done .icon04,
.flow04 > .stepB.done .icon04 {
    background-color: #4CAF50;
}

    .flow04 > .step.done .icon04::before,
    .flow04 > .stepB.done .icon04::before {
        border-top-color: #4CAF50;
    }

.flow04 > .step.done dl dt,
.flow04 > .step.done dl dd,
.flow04 > .stepB.done dl dt,
.flow04 > .stepB.done dl dd {
    color: #4CAF50;
}


.flow04 > .step.done .pnlDateStep,
.flow04 > .stepB.done .pnlDateStep {
    background-color: #fff;
    border: 3px solid #4CAF50;
    border-radius: 10px;
    padding: 10px;
}

.ListPager a,
.ListPager span {
    display: inline-block;
    padding: 6px 12px;
    margin: 2px;
    border: 1px solid #ccc;
    border-radius: 4px;
    text-decoration: none;
    background-color: #f8f8f8;
    color: #333;
    font-size: 12px;
}

    .ListPager a:hover {
        background-color: #e0e0e0;
    }

.ListPager span { /* 現在のページ */
    background-color: #000;
    color: white;
    font-weight: bold;
    cursor: default;
}


.Mesbox {
    padding: 1em 1em;
    margin: 1.2em 0.8em;
    background: #f4f4f2; /*背景色*/
    border-top: solid 6px #4ec4d3;
    box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32); /*影*/
    font-size: 0.9em;
    text-align: left;
}

    .Mesbox p {
        margin: 0;
        padding: 0;
    }

.blue-box {
    /*background-color: #0073c0;*/
    background-color: #F7F4EF;
    color: #000;
    padding: 15px 20px;
    border-radius: 10px;
    max-width: 800px;
    margin: 0 auto;
    margin-top: 20px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
    text-align: center;
    margin-bottom: 20px;
}

.flow_Dantai-wrraper {
    background-color: #F1CFCB;
    border-radius: 15px;
    padding: 60px 10px 10px;
    margin-bottom: 20px;
    position: relative;
    margin: 0 auto 2em;
}

    .flow_Dantai-wrraper .vertical-label {
        background-color: #E26B5D; /* タイトルの背景色 */
        color: #fff; /* タイトルの文字色（白） */
        padding: 0.5em 1em; /* タイトルの内側余白（上下・左右） */
        position: absolute; /* 親要素（.box5-3）の左上に固定 */
        top: 0; /* 上端に配置 */
        left: 0; /* 左端に配置 */
        display: inline-block; /* タイトルの幅を内容に合わせる */
        font-size: 1.4em; /* タイトルのフォントサイズ */
        width: auto; /* タイトル幅を内容に応じて可変にする */
        max-width: calc(100% - 2em); /* 左右の余白を考慮して最大幅を調整 */
        white-space: nowrap; /* タイトルを1行に固定 */
        overflow: hidden; /* はみ出した部分を非表示 */
        border-radius: 15px 0 15px 0;
    }

.flow_Kyokai-wrapper {
    background-color: #D6E9F7;
    border-radius: 15px;
    padding: 60px 10px 10px;
    margin-bottom: 20px;
    position: relative;
    margin: 0 auto 2em;
}

    .flow_Kyokai-wrapper .vertical-label {
        background-color: #006FBC; /* タイトルの背景色 */
        color: #fff; /* タイトルの文字色（白） */
        padding: 0.5em 1em; /* タイトルの内側余白（上下・左右） */
        position: absolute; /* 親要素（.box5-3）の左上に固定 */
        top: 0; /* 上端に配置 */
        left: 0; /* 左端に配置 */
        display: inline-block; /* タイトルの幅を内容に合わせる */
        font-size: 1.4em; /* タイトルのフォントサイズ */
        width: auto; /* タイトル幅を内容に応じて可変にする */
        max-width: calc(100% - 2em); /* 左右の余白を考慮して最大幅を調整 */
        white-space: nowrap; /* タイトルを1行に固定 */
        overflow: hidden; /* はみ出した部分を非表示 */
        border-radius: 15px 0 15px 0;
    }

#sectionA,
#sectionB,
#sectionC,
#sectionD,
#sectionE,
#sectionF {
    background-color: #FFFBEA; /* 任意の色に変更可能 */
    padding: 20px; /* 必要に応じて余白も追加 */
    border-radius: 15px; /* 角を丸めたい場合 */
    margin-top: 40px;
}

}

#sectionA.done {
    background-color: #f3f3f3; /* 任意の色に変更可能 */
    padding: 20px; /* 必要に応じて余白も追加 */
    border-radius: 15px; /* 角を丸めたい場合 */
    margin-top: 40px;
}

.AreaTitle {
    display: flex;
    align-items: center; /* 上下中央揃え */
    gap: 20px; /* 各要素間の余白 */
    margin-bottom: 20px;
}

.steps {
    display: flex;
    gap: 35px;
}


.stepDate {
    display: flex;
    align-items: center;
    gap: 8px; /* アイコンとラベルの間隔 */
}

.stepDate-icon,
.stepDate-icondone {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 22px;
    height: 22px;
    border: 1px solid #ccc;
    border-radius: 50%;
    background-color: #ccc;
    color: #fff;
    flex-shrink: 0;
    line-height: 1;
}

/* 未完了アイコン（グレー） */
.stepDate-icon {
    background-color: #ccc;
}

    .stepDate-icon::before,
    .stepDate-icondone::before {
        content: "✔";
    }

/* 完了アイコン（グリーン） */
.stepDate-icondone {
    background-color: #4CAF50;
}

.external-link {
    margin: 10px;
    font-size: 14px;
    color: #333 !important;
    text-decoration: none;
}

    .external-link:hover {
        text-decoration: underline;
    }

    .external-link i {
        margin-left: 5px;
        font-size: 0.9em;
    }

.Mesbox02 {
    padding: 0.5em 1em;
    margin: 1.2em 1.5em 2em;
    color: #fff; /*文字色*/
    background: #349BA8;
    border: solid 2px #349BA8; /*線*/
    border-radius: 10px; /*角の丸み*/
    text-align: center;
    box-shadow: 0 3px 4px rgba(0, 0, 0, 0.2); /*影*/
}

    .Mesbox02 p {
        margin: 0;
        padding: 0;
    }

/* address-block の中だけに適用 */
.UserInfoTable dd.address-block .FormBreak_all,
.UserInfoTable dd.address-block .FormBreak_allcld,
.UserInfoTable dd.address-block .AddInput {
    width: 100%;
}

    .UserInfoTable dd.address-block .AddInput input.formTextbox {
        flex: 1 1 auto;
        width: 100%;
        min-width: 0;
        display: block;
        box-sizing: border-box;
        margin: 0 !important;
        padding: 0 10px;
    }


.balloon-date {
  position: relative;
  display: inline-block;
  padding: 10px 10px;
  min-width: 120px;
  max-width: 100%;
  color: #d34b46;
  font-size: 14px;
  font-weight: bold;
  background: #fff;
  border: solid 3px #d34b46;
  top: -10px;
  margin-bottom: 10px;
}

.balloon-date:before {
  content: "";
  position: absolute;
  top: -24px;
  left: 17%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-bottom: 12px solid #FFF;
  z-index: 2;
}

.balloon-date:after {
  content: "";
  position: absolute;
  top: -30px;
  left: 17%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-bottom: 14px solid #d34b46;
  z-index: 1;
}

.notice-box {
  border: 3px solid #ec3434; /* 外枠の赤線 */
  padding: 20px 30px;
  font-family: 'Noto Sans JP', sans-serif;
  margin-bottom: 20px;
}

.notice-title {
  color: #ec3434;
  font-weight: bold;
  text-align: center;
  margin-bottom: 10px;
  font-size: 105%;
}

.notice-content {
  border-top: 1px solid #ec3434; /* タイトル下の赤い横線 */
  padding-top: 15px;
}

.notice-content p {
  margin: 8px 0 0;
  font-size: 14px;
  color: #333;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.notice-icon {
  color: #e60000;
  margin-right: 6px;
  font-size: 16px;
}

.NoticeList {
    font-size: 14px;
}

.NoticeList td {
    padding-top: 10px;    /* 上の余白 */
    padding-bottom: 10px; /* 下の余白 */
}



@media only screen and (max-width: 1480px) {
    #topContent {
        padding: 0 5%;
    }

    .AppTitol {
        margin: 0px 5%;
    }

    .Header_Info {
        margin: 3px 5%;
        text-align: left;
    }

    .Header_Button {
        margin: 0px 5%;
    }

    .Main {
        padding-left: 5%;
        padding-right: 5%;
    }


    .SortPattern {
        margin-top: 10px;
    }

    .LoginMes_title {
        margin: 0px 5%;
    }

    .LoginMes_contents {
        margin: 0px 5%;
    }

.cb-enlarge{
  transform: scale(1.2);
  transform-origin: left center;
  vertical-align: middle;
  margin-right: 12px; /* ラベルとの間の調整 */
}
.cb-enlarge + label{ margin-left:6px; }



}

@media only screen and (min-width: 787px) and (max-width: 1279px) {
}


@media only screen and (max-width: 786px) {
    #topContent {
        padding: 0;
    }

    dd {
        margin-inline-start: 5px;
    }

    .AppTitol {
        margin: 0;
    }

    .Header_Info {
        margin: 1px 0;
        text-align: left;
    }

    .Main {
        padding-left: 2%;
        padding-right: 2%;
    }

    .ContentsTitle {
        font-size: 18px;
        padding-left: 15px;
    }

    .FormBreak {
        flex-direction: column;
        align-items: flex-start;
    }

    .FormBreak_first {
        margin-bottom: 10px;
    }

    .flow li {
        font-size: 10px; /* 文字サイズを指定 */
    }

    .dlForm {
        margin: 0 5px 30px;
    }

    .formTextbox {
        font-size: 14px;
        height: 32px;
    }

    .NumberBox {
        font-size: 14px;
        height: 32px;
    }

    .NumberBoxLeft {
        font-size: 14px;
        height: 32px;
    }


    .UserInfoTable {
        display: block;
        border-top: none;
    }

        .UserInfoTable dt {
            padding: 5px !important;
            width: 100%;
            border-bottom: none;
            background: White;
        }

        .UserInfoTable dd {
            width: 100%;
            padding: 5px 0px 12px 0px;
            align-items: flex-start;
            border-bottom: none;
        }


    .dltitle {
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 8px;
        padding-bottom: 8px;
        font-size: 16px;
    }
}
