#page { min-height: 100vh; } 

.join span.tit { font-size: 1.6rem; } 
.join .input-box-wr { margin-bottom: 1rem; } 
.join .input-box-wr .grid-2 { grid-template-columns: 58% 42%; grid-gap: 0.5rem; } 
.join .input-box-wr .input-box { margin-top: .3rem; margin-bottom: 0; } 
.join .input-box-wr .btn-st04 { margin-bottom: 0; margin-top: .3rem; padding: 0.5em 0; font-size: 1.4rem; } 
.join .cont-box-wr { padding-top: 1rem; padding-bottom: 1rem; } 
.join .input-box input { width: 100%; padding: 0.875em 0.5em; } 

.input-box-agree { height: 14.2rem; padding: 1em; overflow-y: scroll; } 
.input-box-agree .box-agree { color: var(--color-g-tit); font-size: 1.6rem; line-height: 1.4; overflow: hidden; } 


.join .id-chk-wr { margin-top: .5em; } 
.join .deta-chk label { flex-direction: initial; } 
.join .deta-chk span { margin-top: 0; color: var(--color-g-tit); font-size: 1.6rem; } 
.join .deta-chk .checkmark { width: 2rem; height: 2rem; margin-right: .3em; } 

.join .tab-btn-wr { grid-gap: .5rem; } 
.join .tab-btn-wr .tab-button { background-color: #f2f4f5; } 
.join .tab-btn-wr .tab-button .icon { vertical-align: middle; margin-left: .5rem; mix-blend-mode: luminosity; } 
.join .tab-btn-wr .tab-button.on { border: 1px solid var(--color-point); background-color: #fff; color:var(--color-point) } 
.join .tab-btn-wr .tab-button.on .icon { mix-blend-mode: normal; } 

.input-box02[data-input='true'] { border: 1px solid #FF0000; } 

.modal .modal-content { position: relative; top: initial; left: initial; width: 100%; height: initial; border: 0; transform: initial; }