/***********************
** BASE
***********************/
.wrapper .content-wrapper {
  min-height: 100vh;
  margin: 0 auto;
  max-width: 1024px;
  position: relative;
}
.content .tabletArea {
  width: 100%;
  padding: 100px 0;
}

img { max-width: 100%; width: 100%; }

.modal_sys .modal-header {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
h3.modal-title {
  font-size: 1.1em;
}
h3.modal-title i {
  color: #76945a;
  padding-right: .2em;
  font-size: 1.1em;
}
.modaladd_table { width: 100%; }
.modaladd_table tr th { width: 25%; }

.modal_vislist tr th:first-child,
.modal_vislist tr th:nth-child(4) { width: 25%; }
.modal_vislist tr th:nth-child(2),
.modal_vislist tr th:nth-child(3) { width: 20%; line-height: 1.1; }
.modal_vislist tr th:last-child { width: 10%; }

.btn-modalcancel {
  background: #e8e4db;
  border: 1px solid #d5d1c8;
  color: #311400;
}

.flex_col {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.btnArea { margin: 50px 0 30px; }
.btnArea .btn-group { max-width: 240px; width: 100%;}
.btnArea .btn-group a { padding: .65rem .75rem; }
.new_type { background: #e79d0e;  color: #fff;}
.new_type:hover { background: #db9000;  color: #fff;}
.rep_type { background: #00102e;  color: #fff;}
.rep_type:hover { background: #0f244a;  color: #fff;}
.comp { background: #76945a;  color: #fff;}
.comp:hover { background: #698451;  color: #fff;}

/***********************
** HEADER
***********************/
.main-header {
  max-width: 1024px;
  margin: auto;
}

/***********************
** TOP
***********************/
.tablet_topbox .logo_img { 
  max-width: 400px;
  margin: 0 auto 50px;
}
.tablet_topbox .card .card-header {  
  background: #00102e;
  text-align: center;
}
.tablet_topbox .card .card-header h4 {
  color: #fff;
  font-size: 1.3em;
  margin: 0;
  font-weight: 500;
}
.tablet_topbox h5 {
  text-align: center;
  font-weight: bold;
  font-size: 1.25em;
  color: #333;
  margin-bottom: 1.2em;
}
.tablet_topbox .tabl_toptable { width: 100%;  } 
.tabl_toptable tr th,
.tabl_toptable tr td { font-size: 1em; padding: .35rem .5rem;}
.tabl_toptable th { width: 30%; }
.tabl_toptable td { width: 70%; }
.tabl_toptable .custom-select,
.tabl_toptable .form-control { height: calc(2.25rem + 2px) }

.btnArea .btnC {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.btnArea .btn-group + .btn-group { margin-left: 15px; }

/** ↓アラート文言非表示 **/
.office_al_text_none{
  display:none;
}


/***********************
** アンケート
***********************/
.queArea {
  padding: 30px 0;
  max-width: 800px;
  margin: 0 auto;
}
.queArea h2 { 
  text-align: center;
  font-size: 1.25em;
  font-weight: bold;
  margin: 1.5em auto;
  color: #333;
}
.queArea .quebox { padding: 10px; }
.quebox .quebox_dl dt {
  margin-bottom: .3em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.quebox .quebox_dl dt .flex_col {
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
}
.quebox_dl dt .que_tit {
  line-height: 1.1;
  border-left: 10px solid #76945a;
  font-size: 1em;
  font-weight: bold;
  padding-left: .5em;
}
.quebox .quebox_dl dd { margin-bottom: 1em; }
span.req { 
  background: #e60000;
  color: #fff;
  font-size: .8em;
  padding: .1em .5em .2em;
  line-height: 1;
  border-radius: 4px;
  margin-left: .8em;
  font-weight: normal;
  margin-right: .8em;
  display: inline-block;
  min-width: 40px;
}
.quebox .flex_col {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.quebox .zipbtn {
  font-size: .8em;
  background: #515b3a;
  padding: .25em .6em;
  line-height: 1;
  color: #fff;
  border-radius: 4px;
  font-weight: normal;
}
.residencebtn {
  font-size: .8em;
  background: #515b3a;
  padding: .25em .6em;
  line-height: 1;
  color: #fff;
  border-radius: 4px;
  font-weight: normal;
}
.residencebtn:hover {
  color: #fff;
}

.table_radiobtnArea,
.table_sidecheckArea {padding: 0 1em;}
.table_radiobtnArea .form-check-inline {margin: .25em 1em .25em 0;}
.table_sidecheckArea .custom-checkbox { padding-left: 1.25rem; margin: .25em 1.2em .25em 0; }
.custom-control-label::before, .custom-control-label::after {
  left: -1.25rem;
}
.custom-checkbox label:not(.form-check-label):not(.custom-file-label) {
  font-weight: normal;
  padding-top: .15em;
  line-height: 1.1;
}
.custom-checkbox {
  padding-left: 1.25rem;
}
.form-control::placeholder {
  color: #b5b5b5;
  font-size: .95em;
}

.flex_col.birth_dateArea {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.birth_dateArea .back_att_set_tab { width: calc((100% - 1em) / 3); }
.back_att_set_tab .back_att { margin-left: .3em; }


/* 個人情報の取り扱いについて */
.personal-informations {
  margin-top: 40px;
}
.personal-informations .personal-information {
  border: 1px solid #000000;
  height: 250px;
  width: 100%;
  margin: 0 auto;
  overflow-y: scroll;
  padding: 10px;
}
.personal-informations .agree {
  text-align: center;
  margin-top: 25px;
}
.personal-informations .agree .custom-control-label {
  font-size: 18px;
}
.personal-informations .agree .custom-control-label::before {
  top: 3px;
}
.personal-informations .agree .custom-control-label::after {
  top: 3px;
}

.personal-informations .personal-information h2 {
  margin-top: 0;
  margin-bottom: 0;
}
.personal-informations .personal-information .section {
  display: flex;
  margin-bottom: 20px;
}
.personal-informations .personal-information .number {
  min-width: 40px;
}
.personal-informations .personal-information .section {
  flex-grow: 1;
}
.personal-informations .personal-information .content .number{
  min-width: 20px;
}
.personal-informations .personal-information .mt {
  margin-top: 20px;
}
.personal-informations .personal-information .text-end {
  text-align: right;
}
.enqueteBtnArea {
  margin-top: 30px;
}

/***********************
** 完了
***********************/
.compArea {
  width: 100%;
  height: 100%;
  min-height: 100vh;
  padding: 20px 0;
  display: flex;
}
.compArea .comp_cont {
  width: 100%;
  background: #fff;
  padding: 30px;
  display: flex;
}
.comp_cont .comp_inner {
  width: 100%;
  margin: auto;
  border: 8px solid #00102e;
  padding: 50px 30px;
}
.comp_inner h2 {
  text-align: center;
  font-size: 1.5em;
  font-weight: bold;
  margin: 20px auto 80px;
}
.comp_inner .logo_img {
  max-width: 400px;
  margin: 0 auto;
  padding: 10px;
}