* { -webkit-appearance: none;}
html, body, main, header, footer, section, article, nav, h1, h2, h3, h4, h5, div, p, dl, dt, dd, ol, ul, li, table, th, td, a, form, input, select, textarea, label {
    padding:0; margin:0; text-decoration:none; font-weight: normal;
    font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
    line-height:180%;
    /*border-collapse: collapse;*/
    list-style:none;
    /*letter-spacing: 0.2vw;*/
    color:#003;
}
html, body, main, header, footer, section, article, nav, h1, h2, h3, h4, h5, div, p, dl, dt, dd, ol, ul, li, table, th, td, a, form, input, select, textarea, label {
    font-size: 14px;
}
@media screen and (max-device-width : 480px) {
    html, body, main, header, footer, section, article, nav, h1, h2, h3, h4, h5, div, p, dl, dt, dd, ol, ul, li, table, th, td, a, form, input, select, textarea, label {
        font-size:3vw;
    }
}
a:link {color:#09f;} a:visited {color:#09f;} a:hover {color:#09f;}
.center {text-align:center;} .left {text-align:left;} .right {text-align:right;} .top {vertical-align:top;} .middle {vertical-align:middle;} .bottom {vertical-align:bottom;}
.floatl {float:left;} .floatr {float:right;} .clearfix:after {content: ""; clear: both; display: block;}
.none {display:none;} .block {display:block;} .flex {display: flex;}
.positionr{position:relative;} .positiona{position:absolute;}
.bold {font-weight:bold;}

.s {width:33%;} .m {width:66%;} .l {width:95%;}
@media screen and (max-device-width : 480px) {
    .m {width:95%;}
}

input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="file"], input[type="tel"], input[type="checkbox"], input[type="radio"] {
    padding:2px 5px;
    border:2px solid #ccc;
    border-radius:2px;
    background-color:#fff;
    letter-spacing: 0;
}
input[type=radio] {
    display: none;
}
input[type=checkbox] {
    display: none;
}
input + label.radio {
    position:relative;
    background-color:#fff;
    border-radius:2px;
    padding:5px 2px;
    border:2px solid #ccc;
    display:block;
    text-align:center;
    cursor: pointer;
    color:#333;
    margin-right:5px;
    margin-bottom:5px;
}
input:checked + label.radio {
    color:#09f;
    background-color:#f0fff0;
    border:2px solid #09f;
}
textarea {
    padding:2px 5px;
    border:2px solid #ccc;
    border-radius:2px;
    letter-spacing: 0;
}
select {
    vertical-align:bottom;
    padding:2px 5px;
    border:2px solid #ccc;
    border-radius:2px;
    letter-spacing: 0;
}
input[type="file"]{padding:10px; font-size:12px;}
input[type="button"]{padding:8px 10px; cursor: pointer; background-color:#fff; color:#09f; border:2px solid #09f; border-radius:2px; outline:none;}
input[type="submit"]{padding:8px 10px; cursor: pointer; background-color:#fff; color:#09f; border:2px solid #09f; border-radius:2px; outline:none;}
.button {padding:10px; cursor: pointer; background-color:#fff; color:#00f; border:2px solid #00f; border-radius:2px;}
input[type="button"].sub_button {
    padding:2px 5px;
    margin:0;
}

.ng_message_box {padding:10px; border:1px dashed #f00; color:#f00;}
.ok_message_box {padding:10px; border:1px dashed #060; color:#060;}
.red {color:#f00;} .green {color:#060;}

.guidespace {max-width:1200px; margin:0 auto;}
article.guidespace {max-width:1160px; padding:20px;}
article.guidespace section {width:calc(100% - 65px); float:right;}
@media screen and (max-width:1200px) {
    .guidespace {width:100%;}
    article.guidespace {width:calc(100% - 40px); }
    article.guidespace section {width:calc(100% - 65px); float:right;}
}
@media screen and (max-device-width : 480px) {
    .guidespace {width:calc(100vw - 10px);}
    article.guidespace {width:calc(100vw - 20px); margin:0;padding:20px 10px;}
    article.guidespace section {width:calc(100vw - 85px); float:right;}
}

table {border-collapse: collapse; border:2px solid #09f; width:100%;}
th {border:1px solid #f5f5f5; background-color:#9cf; white-space: nowrap; padding:5px 10px;}
td {border:1px solid #f5f5f5; padding-left:5px; vertical-align:top; padding:5px 10px;}

dl {}
dt {margin-top:10px;}
dd {}

dl.propaty-list {display: flex; flex-wrap: wrap; width: 100%;}
dl.propaty-list>dt {width: 30%; padding: 8px 10px; margin: 5px;}
dl.propaty-list>dd {width: 60%; padding: 8px 10px; margin: 5px; border: 2px solid #09f;}
dl.propaty-list>dd.immutable {background-color: #999;}

body {background-color:#f5f5f5;}
header {background-color:#09f; height:50px;}
article {
    min-height: calc(100vh - 121px);
    background-color:#fff;
}
footer {
    height: 30px;
    background-color:#9cf;
    border-top:1px solid #09f;
}
footer p {color:#fff; letter-spacing: 0.2vw; margin-top:5px; width:100%; text-align:center;}
h1 {
    font-size:20px;
    font-weight:bold;
    color:#000;
}
.logo {
    width:60px;
    border:2px solid #9cf;
    border-radius:3px;
    text-align:center;
    padding:5px;
    float:left;
    margin-top:5px;
    color:#9cf;
}
.logo a:link, .logo a:visited, .logo a:hover {color:#9cf; letter-spacing: 0.2vw;}
.menu {
    float:left;
    width:calc(100% - 150px);
}
.menu:after {content: ""; clear: both; display: block;} /* clearfix */
.menu a {display:block; float:right; margin-top:14px; margin-left:25px; border-bottom:1px dashed #9cf;position:relative;}
.menu a:link, .menu a:visited, .menu a:hover {color:#9cf; letter-spacing: 0.2vw;}

.menu a span.comment_alert {position:absolute; background-color:#fff; border-radius:50%; color:#f00; padding:0 8px; top:-10px; left:-15px; font-weight:bold; opacity:0.8;}
.menu a span.comment_alert:after { border:solid 4px transparent; border-left:solid 4px #fff; border-top:solid 4px #fff; content:""; height:0; top:18px; left:15px; position:absolute; transform:skew(50deg); width:0; opacity:0.8;}

.logo {position:relative;}
.logo a span.comment_alert {position:absolute; background-color:#fff; border-radius:50%; color:#f00; padding:0 8px; top:-5px; right:-15px; font-weight:bold; opacity:0.8;}
.logo a span.comment_alert:after { border:solid 4px transparent; border-left:solid 4px #fff; border-top:solid 4px #fff; content:""; height:0; top:18px; left:5px; position:absolute; transform:skew(160deg); width:0; opacity:0.8;}

#memberIcon div {position:relative;}
#memberIcon span a span.comment_alert {position:absolute; background-color:#B0E0E6; border-radius:50%; color:#f00; padding:0 8px; top:-5px; right:10px; font-weight:bold; opacity:0.8;}
#memberIcon span a span.comment_alert:after { border:solid 4px transparent; border-left:solid 4px #B0E0E6; border-top:solid 4px #B0E0E6; content:""; height:0; top:18px; left:5px; position:absolute; transform:skew(160deg); width:0; opacity:0.8;}


@media screen and (max-device-width : 480px) {
    /*.menu {display:none;}*/
}
header .icon {
    float:right;
}
.icon img {
    width:50px;
    border-radius:50%;
}

#memberIcon {
	/*margin-top:50px;*/
    float:left;
	width:60px;
}

.year, .month, .day, .week, .eday, .screen {float:left; position:relative; margin-right:5px;}
.year input {width:70px;} .month input {width:50px;} .day input {width:50px;} .week input {width:50px;} .screen input {width:85px;} .eday input {width:60px;}
.year_str, .month_str, .day_str, .week_str, .eday_str {color:#999; position:absolute; top:5px; right:5px;}
#year_select_area, #month_select_area, #day_select_area, #flag_select_area, #start_select_area, #end_select_area, #week_select_area, #screen_select_area, #eday_select_area {margin-top:10px; display:none;}

.next_day,.back_day,.next_week,.back_week,.next_month,.back_month{margin-right:5px;width:20px;height:35px;padding-right: 15px;cursor: pointer; background-color:#fff; border:2px solid #ccc; outline:none;}
.next_day p,.back_day p,.next_week p,.back_week p,.next_month p,.back_month p{color:#09f; transform: scale(0.5,1);}

.start_year_str, .start_month_str, .start_day_str, .end_year_str, .end_month_str, .end_day_str {color:#999; position:absolute; top:5px; right:5px;}
#start_year_select_area, #start_month_select_area, #start_day_select_area, #end_year_select_area, #end_month_select_area, #end_day_select_area {margin-top:10px; display:none;}

#usually_select_area {margin-top:10px; display:none;}

.hour, .minutes {float:left; position:relative; margin-right:5px;}
.hour input, .minutes input {width:55px;}
.start_h_str, .start_m_str, .end_h_str, .end_m_str {color:#999; position:absolute; top:5px; right:5px;}
@media screen and (max-device-width : 480px) {
    .hour input, .minutes input {width:50px;}
}

/* .account_select {margin-top:5px;} */
.account_select input {width:115px;}
#account_select_area {margin-top:5px;}

input[type=button].dummy_text {
    color:#000;
    border:2px solid #ccc;
    padding:3px 5px;
}

/**
 * シゴイン
 * <div class="sigoin"><div class="si">シ</div><div class="ni01">ll</div><div class="ni02">ll</div></div>
 */
.sigoin {
    position:relative;
    background-color:#FFD700;
    /*background-image: linear-gradient(to top right, #F7DE05, #B67B03, #EDAC06, #F7DE05, #ECB802, #DAAF08, #B67B03, #ffffff);*/
    width:50px;
    height:50px;
    border-radius:50%;
    border-top: 1px solid #EDAC06;
    border-left: 1px solid #EDAC06;
    border-right: 2px solid #EDAC06;
    border-bottom: 2px solid #EDAC06;
    /*margin:auto;*/
}
.sigoin .si {
    position:absolute;
    display:table-cell;
    font-weight: bold;
    font-size:40px;
    padding-top:8px;
    padding-left:5px;
    color:#fff;
    line-height:100%;
}
.sigoin .ni01 {
    position:absolute;
    display:table-cell;
    font-weight: bold;
    font-size:12px;
    color:#fff;
    line-height:100%;
    top:6px;
    left:20px;
}
.sigoin .ni02 {
    position:absolute;
    display:table-cell;
    font-weight: bold;
    font-size:12px;
    color:#fff;
    line-height:100%;
    bottom:3px;
    left:20px;
}
.sigoin_str {
    color:#FFD700;
    font-weight:bold;
    font-size:30px;
    text-shadow:
        1px 1px 1px #fff,
        1px -1px 1px #fff,
        -1px 1px 1px #fff,
        -1px -1px 1px #fff,
        0 0 22px #fff;
}
.sigoin_center {
    background-color:#f5f5f5;
    position:relative;
    width:calc(100% / 2);
    padding:5px 10px;
    margin:auto;
}
@media screen and (max-device-width : 480px) {
    .sigoin_center {
        width:calc(100% - 20px);
    }
}

#popup_alert {
    position:absolute;
    display:block;
    border:10px solid #FFD700;
    background-color:#fff;
    height:calc((100vh / 5) * 3);
    width:calc((100vw / 5) * 3);
    top:0;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
    padding:10px;
}
@media screen and (max-device-width : 480px) {
    #popup_alert {
        width:calc(100vw - 60px);
    }
}
#popup_alert .title {
    font-size:15px;
}
#popup_alert .message {
    padding:20px 0;
}
#popup_alert .close {
    position:absolute;
    bottom:5px;
    right:5px;
}
.open_icon {position:absolute; /*height:calc(100% - 40px);*/ width:100%; border-top:20px solid rgba(255,255,255,0.5); border-bottom:calc((100vh - 256px) - 73px) solid rgba(255,255,255,0.5); background-clip: padding-box; background-color: #fff; text-align:center;}
.open_name {background-color:#09f; padding:10px; color:#fff; font-size:14px;}