/* formリセットCSS */
.container input,
.container button,
.container select,
.container textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  border-radius: 0;
  font: inherit;
  outline: none;
}
.container textarea {
  resize: vertical;
}
.container input[type='checkbox'],
.container input[type='radio'] {
  /* display: none; */
}
.container input[type='submit'],
.container input[type='button'],
/* .container label, */
.container button,
.container select {
  cursor: pointer;
}
.container select::-ms-expand {
  display: none;
}
/*  */
.container {
    padding: 20px;
    margin: 20px;
    background-color: #fff;
    font-size: 18px;
    font-family: Meiryo,メイリオ,游ゴシック体,Yu Gothic,YuGothic,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,Osaka,ＭＳ Ｐゴシック,MS PGothic,yu-mincho-pr6,Times New Roman,serif;
}
@media(min-width:768px) {
    .container {
        padding: 50px;
        margin: 50px;
    }
}
.container form {
    /* background: #DCD2CE; */
}
.container dt {
    padding: 0px;
    color: #999;
    font-size: 16px;
    text-align: left;
}
.container dd {
    border-bottom: 1px solid #333;
}
.container dl,dt,dd {
    display: block;
    width: 100%;
    margin-bottom: 10px;
}
.date_489ban dd,.date_489ban select {
    display: flex; 
    flex-wrap: wrap;
    justify-content: space-between;
    /* background-color: aqua; */
    padding-bottom: 20px;
    padding-left: 5%;
}
@media(min-width:768px) {
    .date_489ban dd,.date_489ban select {
        padding-left: 0%;
    }
}
.date_489ban select {
    width : calc(100% / 2);
}
.date_489ban label {
    margin: 0 auto;
}
/* チェックボックスデザイン */
.date_489ban input[type="checkbox"] {
cursor: pointer;
    /* padding-left: 30px;label手前にチェックボックス用の余白を開ける */
    vertical-align: bottom;
    /* vertical-align: middle; */
    position: relative;
    left: -45px;
}
.date_489ban input[type="checkbox"]::before,
.date_489ban input[type="checkbox"]::after {
    content: "";
    display: block; 
    position: absolute;
}
.date_489ban input[type="checkbox"]::before {
    background-color: #fff;
    border-radius: 0%;
    border: 1px solid #666464;
    width: 20px;/*チェックボックスの横幅*/
    height: 20px;/*チェックボックスの縦幅*/
    transform: translateY(45%);/*チェックボックスの縦位置調整*/
    top: 50%;
    left: 5px;
}
@media(min-width:768px) {
    .date_489ban input[type="checkbox"]::before {
        transform: translateY(0%);/*チェックボックスの縦位置調整*/
    }
}
.date_489ban input[type="checkbox"]::after {
    border-bottom: 3px solid #666464;/*チェックの太さ*/
    border-left: 3px solid #666464;/*チェックの太さ*/
    opacity: 0;/*チェック前は非表示*/
    height: 6px;/*チェックの高さ*/
    width: 11px;/*チェックの横幅*/
    transform: rotate(-45deg);
    top: 24px;/*チェック時の位置調整*/
    left: 10px;/*チェック時の位置調整*/
}
@media(min-width:768px) {
    .date_489ban input[type="checkbox"]::after {
        top: 5px;/*チェック時の位置調整*/
    }
}
    .date_489ban input[type="checkbox"]:checked::after {
    opacity: 1;/*チェック後表示*/
}
.inbox_489ban dd,.inbox_489ban select {
    display: flex; 
    flex-wrap: wrap;
    justify-content: space-between;
    /* background-color: aqua; */
    padding-left: 28%;
}
.inbox_489ban select {
    width : calc(100% / 2);
}
@media(min-width:768px) {
    .inbox_489ban dd,.inbox_489ban select {
        padding-left: 24%;
    }
}
.container button {
    width: 100%;
    padding: 20px 0;
    margin-top: 15px;
    color: #fff;
    background-color: #78A73D;
    border: none;
    font-size: 16px;
    text-align: center;
    cursor: pointer;
}
.container button:hover {
    background-color: #245F33;
}