@charset "utf-8";

:root {
  --primary-brown: #663300;
  --primary-white: #FFFBF8;
}
.remodal.attention.remodal-is-initialized.remodal-is-opened {
  background: none;
}
.attention {
  position: fixed; z-index: 10000; top: 0; right: 0; bottom: 0; left: 0; 
}
.attention .modal_box {
  box-sizing: border-box; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);  display:flex; flex-direction: column; max-width: 700px; width: 100%; padding: 2em 3em; background-color: var(--primary-white); border-radius: 5px; overflow-y: auto;
}
.attention .modal_box.sp {
	max-height: 730px;
}
.attention .modal_box .remodal-close{
  position: relative; top: 0; left: -3%; overflow: visible; width: 20px; height: 20px; padding: 0; cursor: pointer; -webkit-transition: color 0.2s; transition: color 0.2s;  text-decoration: none;  color: rgb(158, 143, 127); border: 0; outline: 0;  background: transparent;
}
.attention .modal_box .remodal-close::before{
  font-size: 25px; line-height: 20px; position: absolute; top: -30%;  left: 0;  display: block; width: 20px; content: "\00d7"; text-align: center;
}
.attention .modal_box .attn_area h2 {
  margin: 10px 0 40px; color: var(--primary-brown); text-align: center; font-size: 1.6em; font-weight: 700;
}
.attention .modal_box .attn_area {
  font-size: 1.2em; line-height: 1.4; text-align: left;
}
.attention .modal_box .attn_area dt {
  margin: 1.4em 0 0.5em; color: #a17952; font-size: 1.4em; font-weight: 700;
}
.attention .modal_box .attn_area dd {
  margin-top: 10px; margin-inline-start: 20px;
}
.attention .modal_box .attn_area .dd_en {
  margin-top: 10px; 
}
.attention .modal_box .attn_area .t_red {
  margin-bottom: 0.5em; font-weight: 700; color: #c02828;
}
.attention .modal_box .attn_area table {
  border-collapse: collapse; width: 100%; margin-top: 20px;
}
.attention .modal_box .attn_area th ,td {
  border: 1px solid #555; padding: 8px; text-align: center;
}
.attention .modal_box .attn_area th {
  background: #e7e7e7; font-weight: 500;
}
.attention .modal_box .attn_area .warn {
  margin-top: 10px; font-size: 0.8em;
}
.attention .modal_box .attn_planBtn {
  display: block; align-items: center; border-radius: 2px; background: var(--primary-brown); padding: 1.5em; margin: 30px 0 40px; cursor: pointer; transition: .3s; font-size: 1.3em; color: var(--primary-white); font-weight: 700; letter-spacing: 0.05em; text-align: center; text-decoration: none;
}
.attention .modal_box .attn_planBtn:hover {
  background-color: #a17952;
}
.attention .modal_box .remodal-confirm {
  max-width: 100px; text-decoration: none; background: #fff; margin: 0 auto; padding: 10px 0; line-height: 1; color: var(--primary-brown); border-radius: 2px; border: var(--primary-brown) solid 1px;
}
.attention .modal_box .remodal-confirm:hover {
  background-color: var(--primary-brown); color: var(--primary-white); border-radius: 2px; border: var(--primary-brown) solid 1px;
}