/* #join_box {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);} */

#join_box {background-color:#EDE6DD;padding:10px;border-radius:20px;max-width:687px;margin:0 auto}
#join_box > .inner{padding:90px;border-radius:20px;border:1px solid #B1B1B1}
#join_box > .inner.narrow{padding: 40px 50px 60px;}
#join_box > .inner.result{padding: 90px 50px;}
#join_box > .inner.userinfo{padding: 70px 60px 90px;}

#join_box > .inner > .tit{text-align:center;}
#join_box > .inner > .tit h2{font-size:34px;color:#000;font-weight:600;line-height:1.2}
#join_box > .inner > .tit h3{font-size:20px;font-weight:700;color:#666;margin:20px 0;line-height:1.2;}
#join_box > .inner > .tit:after {content:'';background:url('/img/arrow_2.png') no-repeat center;width:28px;height:24px;margin:40px auto;display:block;}
#join_box > .inner > .tit .line{margin-top:-15px}

#join_box .input_wrap {min-width:490px;text-align:left;}
#join_box .input_wrap li {border-top:2px solid #c5ab7d;padding:15px 0;}
#join_box .input_wrap li:last-child {border-bottom:2px solid #c5ab7d;}
#join_box .input_wrap label {width:93px;font-size:18px;font-weight:700;color:#392f1f;letter-spacing:-0.9px;}
#join_box .input_wrap label span {text-align: left;color: #df5a1e;font-size: 32px;font-weight: 700;margin-left:7px;position:absolute;margin-top:4px;}
#join_box .input_wrap span {text-align: left;color: #392f1f;font-size: 16px;font-weight: 400;vertical-align:middle;display:inline-block;line-height:1}
#join_box .input_wrap input[type="text"] {width:290px;height:44px;border-radius:6px;border:solid 1px #707070;background-color:#fff;padding:10px;font-size: 16px;text-align: left;color: #392f1f;}
#join_box .input_wrap input[type="text"]::placeholder {font-size:16px;text-align:left;color:#392f1f;}
#join_box .input_wrap select {width:110px;height:44px;font-size: 16px;text-align: left;color: #392f1f;border-radius: 6px;}
#join_box .input_wrap .innerinput{position:relative;}
#join_box .input_wrap .innertext{position:absolute;right:470px;font-size:14px;text-align:left;color:#392f1f;}
#join_box .input_wrap .send_code {width:100px;height:45px;border-radius:6px;border:solid 1px #4a5366;background-color:#4a5366;color:#fff;font-size:16px;margin-left:6px;}
#join_box .input_wrap .resend {font-size:14px;font-weight:400;color:#392f1f;border-bottom:1px solid #392f1f;margin-left:6px;cursor:pointer;display:none;}
#join_box .input_wrap .message {margin:10px 0 0 93px;font-family:'Welcome';display:none;}
#join_box .input_wrap .message.on {display:block;}
#join_box .input_wrap .message .state {text-align:left;color:#9a5700;font-size:14px;}
#join_box .input_wrap .message .text {font-size:14px;text-align:left;color:#000;}
#join_box .input_wrap .message .time_t {margin-bottom:6px;}
#join_box .input_wrap .message .item {font-size: 16px;text-align: left;color: #392f1f;}
#join_box .input_wrap .tooltip {font-size: 14px;text-align: left;color: #392f1f;margin-top:9px;}
#join_box .input_wrap .mt_5{margin-top:5px;}
#join_box .input_wrap .input_short {width:175px !important;}
#join_box .input_wrap .item_wrap > div {display: inline-block;}
#join_box .input_wrap .item_wrap > div + div {margin-left: 13px;}

/* 필수정보입력 - narrow 버전 */
#join_box > .inner.narrow .input_wrap li {display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;}
#join_box > .inner.narrow .input_wrap li > div {width: calc(100% - 93px);}
#join_box .input_wrap input[type="text"]::placeholder {font-size:16px;text-align:left;color:#999;}


#join_box .desc p{font-size: 18px;font-weight:400;text-align: center;color: #392f1f;}

#join_box .quiz_result {}
#join_box .quiz_result .answer {font-size: 21px;font-weight: 700;color: #00081a;}
#join_box .quiz_result .date {font-size: 16px;font-weight: 700;color: #00081a;}
#join_box .quiz_result .correct {font-size: 26px;font-weight: 700;color: #df5a1e;}

#join_box .info {opacity: 0.74;border-radius: 20px;border: solid 2px #c5ab7d;padding: 40px 60px;margin-top:50px;text-align: left;}
#join_box .info p:not(:first-child) {margin-top:15px;}
#join_box .info .title {width:70px;display:inline-block;font-size: 16px;font-weight: 700;letter-spacing: -0.8px;color: #392f1f;}
#join_box .info .content {width:calc(100% - 70px);font-size: 16px;font-weight: 400;letter-spacing: -0.8px;color: #392f1f;}
#join_box > .inner .oneline {display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;}

#quiz_box .tit {margin-top:0 }
#quiz_box > .inner .agree_tit {font-size: 18px;font-weight: bold;color: #392f1f;text-align:left;}
#quiz_box > .inner .agree_wrap {border-top:2px solid #c5ab7d;border-bottom:2px solid #c5ab7d;margin:12px 0 20px;padding:20px 0;}
#quiz_box > .inner .agree_wrap .name {font-size: 16px;text-align: left;color: #392f1f;cursor: pointer;border-bottom: 1px solid #392f1f;}
#quiz_box > .inner .agree_wrap section {display:flex;flex-flow:row nowrap;justify-content:space-between;align-items:center;}
#quiz_box > .inner .agree_wrap .mt_14 {margin-top: 14px;}

#quiz_box > .inner .chk_all {display:flex;flex-flow:row nowrap;justify-content:space-between;align-items:center;}
#quiz_box > .inner .chk_all label {font-size: 16px;font-weight: 700;text-align: left;color: #392f1f;}

