@charset "utf-8";

*{margin:0;padding:0}

body{position:relative; padding:0; line-height:1.5; -webkit-text-size-adjust:none;}
body.bgBlue{background-color:#2364a6;}

a{text-decoration:none}
li{list-style:none}
img{vertical-align:top}
img,fieldset,iframe{border:0 none}
.tbl caption, .tbl legend{width:0;height:0;font-size:0;color:transparent;line-height:0}
.loginWrap caption, .loginWrap legend{width:0;height:0;font-size:0;color:transparent;line-height:0}

/* IE9 이하를 위한 css */
.placeholder {color:#a5a5a5 !important}
 /* IE10 이상을 위한 css */
 input::placeholder{color:#a5a5a5 !important;opacity:1 /* 파이어폭스에서 뿌옇게 나오는 현상을 방지하기 위한 css */}
 input::-webkit-input-placeholder{color:#a5a5a5}
 /* IE */
 input:-ms-input-placeholder{color:#a5a5a5 !important} 
 /* Firefox */
 input:-moz-input-placeholder{color:#a5a5a5 !important}

button{cursor:pointer;border:none;background:none;font-family:'Noto Sans KR R', MalgunGothic, 'Malgun Gothic', 맑은고딕, '맑은 고딕', dotum,'돋움', Arial, sans-serif;}
input[type="submit"]{cursor:pointer}

#wrap_otp{font-family:'Malgun Gothic', 맑은고딕, '맑은 고딕', dotum,'돋움', Arial, sans-serif;}

.headerOtp{text-align:center; padding:45px 0; background-color:#fff;}
.headerOtp h1{margin-bottom:10px;}
.headerOtp p{color:#5c5c5c; font-weight:bold; font-size:14px;}

.formOtp{text-align:center; background-color:#fff; padding-bottom:80px;}
.formOtp a{display:inline-block; border:solid 1px #c32361; border-radius:25px; padding:4px 20px; box-shadow:0px 5px rgba(0,0,0,0.15); margin-bottom:20px;}
.formOtp a span{display:inline-block; color:#c32361; background:url("../image/login/icon_appGuide.png") left center no-repeat; padding:7px 0 0 40px; min-height:30px; font-size:14px;}

.formOtp .loginWrap{width:320px; margin:0 auto;}
.formOtp .loginWrap form{}
.formOtp .loginWrap form fieldset{}
.formOtp .loginWrap form fieldset legend{}
.formOtp .loginWrap label{overflow:hidden; visibility:hidden; position:absolute; left:-9999px; top:-9999px; width:0; height:0; line-height:0;}
.formOtp .loginWrap input{width:100%; border:solid 1px #bbbbbb; background-color:#f6f6f6; padding:15px 20px; box-sizing:border-box;}
.formOtp .loginWrap ul{}
.formOtp .loginWrap ul li{text-align:left; margin-bottom:10px;}
.formOtp .loginWrap button.btnLogin{background-color:#006ecd; margin-top:10px; width:100%; padding:15px 0; border-radius:5px; box-shadow:0px 5px rgba(65,166,242,0.39);}
.formOtp .loginWrap button.btnLogin span{font-size:16px; font-weight:bold; color:#fff;}
p.erField{font-size:14px; color:#ff3d3d; text-align:left; margin:20px 0 0 10px; font-weight:bold;}

.infoText{position:relative; background-color:#2364a6; text-align:center; padding:50px 0;}
.infoText .infoTitle{position:absolute; left:50%; transform:translateX(-50%); padding:15px 65px; background-color:#fff; box-shadow:0px 0px 11px 0px rgba(0,0,0,0.3); border-radius:50px; top:-30px; font-size:16px; font-weight:bold; color:#0076cc;}
.infoText .textwrap01{font-size:14px; font-weight:bold; color:#fff; text-align:left; width:450px; margin:0 auto;}
.infoText .textwrap01 li{margin:5px 0;}
.infoText .textwrap02{font-size:13px; font-weight:bold; color:#00ffe4; text-align:left; width:620px; margin:0 auto; padding-top:25px;}
.infoText .textwrap02 li{margin:5px 0;}

.otpRecord{display:inline-block; margin-right:5px;}
.otpRecord a{display:block; background-color:#006d82; color:#fff !important; padding:2px 18px; border-radius:3px; font-size:12px; font-weight:bold; box-shadow:2px 2px rgba(0,70,83,0.3);}

.tbl{width:100%; table-layout:fixed; border-collapse:collapse; line-height:20px; text-align:center}
.tbl th{height:11px; padding:8px 3px; color:#5b5b5b; background:#ffffff -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#f3f3f3)); background:#ffffff -moz-linear-gradient(top, #ffffff, #f3f3f3); background:#ffffff -o-linear-gradient(top, #ffffff, #f3f3f3); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f3f3f3'); background-color:#f3f3f3; border-right:2px solid #7faeb0 !important;}
.tbl td{text-align:left;}
.tbl th, .tbl td{padding:12px 15px; border:1px solid #e6e6e6;}
.tbl td:last-child{border:1px solid #e6e6e6;}
.tbl thead th{background:#f6f7fb; color:#222}
.tbl thead th[rowspan]{border-left-width:1px}
.tbl thead th[rowspan]:first-child{border-left-width:0}
.tbl .tblBox{padding:4px 10px;}
/* .tbl .tblBtn{padding:3px 7px;} 2023 CMS UI/UX 백업 */
.tblBtn{margin-right: 10px; font-size: 13px; line-height: 1px; border: 1px solid #BCBCBC; padding: 12px 15px; border-radius: 3px; background-color: #F0F0F0; cursor: pointer; min-height: 38px;} /* 2023 CMS UI/UX 수정 */
.tbl label{overflow:hidden; visibility:hidden; position:absolute; left:-9999px; top:-9999px; width:0; height:0; line-height:0;}

/* .btn_guide{display:inline-block; overflow:hidden; padding:4px 22px; font-weight:bold; vertical-align:middle; background-color:#fff; color:#006d82 !important; border-radius:3px; box-shadow:2px 2px rgba(0,109,130,0.3); border:solid 1px #006d82;} 2023 CMS UI/UX 백업 */
.btn_guide{margin-right: 10px; font-size: 13px; line-height: 1px; padding: 12px 15px; border-radius: 3px; border: solid 1px #f3a5c3 !important; color: #c02462 !important; background-color: #FFF9FB; cursor: pointer; min-height: 38px;} /* 2023 CMS UI/UX 수정 */



@media screen and (max-width: 630px){
    
    .infoText .textwrap02{width:100%; padding-left:10px; padding-right:10px; box-sizing:border-box;}

}


@media screen and (max-width: 385px){
    
    .infoText .textwrap01{width:100%; padding-left:10px; padding-right:10px; box-sizing:border-box;}

}