@charset "UTF-8";
/* 초기화 */
ol, ul, li { list-style: none; }

img, fieldset { border: 0 none; }

input[type=text], input[type=password], input[type=submit], input[type=search], textarea { -webkit-appearance: none; outline: 0; border: 0; }

input:focus, select:focus { outline: 0 none; }

input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { /* WebKit browsers */ color: transparent; }

input:focus:-moz-placeholder, textarea:focus:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: transparent; }

input:focus::-moz-placeholder, textarea:focus::-moz-placeholder { /* Mozilla Firefox 19+ */ color: transparent; }

input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder { /* Internet Explorer 10+ */ color: transparent; }

button { border: 0 none; background: transparent; cursor: pointer; }

table caption { width: 0; height: 0; visibility: hidden; font-size: 0; line-height: 0; }

table { border-collapse: collapse; border-spacing: 0; }

header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption { display: block; }

a { text-decoration: none; color: #000; }

body { background: transparent; line-height: 1.15; letter-spacing: -0.3px; font-family: Helvetica,AppleSDGothicNeo,Arial,sans-serif; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; word-break: break-all; /*-webkit-user-select:none;*/ }

* { margin: 0; padding: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

/* select */
select, input { border-style: none; background-color: transparent; border-radius: 0; appearance: none; -moz-appearance: none; -webkit-appearance: none; }

/* 공통 */
.flex_center { display: flex; align-items: center; justify-content: center; }

.flex_column { display: flex; flex-direction: column; align-items: center; }

.flex_between { display: flex; justify-content: space-between; align-items: center; }

.bg_cover { background-repeat: no-repeat; background-size: cover; }

/* style */
.container { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #0068BF; }

.top { width: 100%; height: 12.6875rem; background-image: url("../images/login_bg.png"); }

.logo { justify-content: center; height: 4rem; }
.logo img { width: 6.765625rem; max-height: 1.4375rem; }
.logo p { margin-top: -0.109375rem; font-size: 0.375rem; color: #fff; }

form { width: 100%; }
form .login { justify-content: space-between; height: 2.546875rem; margin: 0.859375rem 0 0.65625rem; }
form .login input { width: 5.875rem; height: 1.25rem; padding: 0 0.46875rem; background-color: #2E2E2E; font-size: 0.375rem; color: #fff; }

.btn_agree { width: 100%; padding: 0 1.0625rem; }
.btn_agree li { transition: all .4s; }
.btn_agree li .h4 { margin-bottom: 0.15625rem; line-height: 0.375rem; font-size: 0.34375rem; color: #606060; }
.btn_agree li a { justify-content: center; width: 2rem; height: 2rem; border-radius: 50%; border: 2px solid #4D4D4D; }
.btn_agree li a img { width: 0.390625rem; max-height: 0.25rem; }
.btn_agree li a p { margin-top: 0.15625rem; font-size: 0.34375rem; color: #AFAFAF; }
.btn_agree li.on a { border-color: #FF8800; }
.btn_agree li.on a p { color: #FF8800; }

.btn_login { opacity: .37; width: 5.9375rem; height: 1.484375rem; margin-top: 1.25rem; background-color: #fff; font-size: 0.4375rem; color: #0068BF; transition: opacity .4s; }
.btn_login.on { opacity: 1; }

.modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; }
.modal .bg_shadow { justify-content: center; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); }
.modal .modal_box { width: 9.0625rem; max-height: 70%; overflow: auto; padding: 0.625rem 0.625rem 0; background-color: #fff; }
.modal .modal_box .title { width: 100%; padding-bottom: 0.46875rem; border-bottom: 1px solid #C2C2C2; text-align: center; font-weight: bold; font-size: 24px; color: #393939; }
.modal .modal_box .content { padding: 0.3125rem 0.515625rem 0 0; line-height: 0.4375rem; font-size: 0.34375rem; color: #606060; }
.modal .btn_box { width: 9.0625rem; height: 2.8125rem; background-color: #fff; }
.modal .modal_btn { width: 7.8125rem; height: 1.40625rem; background-color: #EA5504; font-size: 0.40625rem; color: #fff; }

.toast { display: none; position: fixed; top: 2.90625rem; left: 17%; width: 66%; padding: 0.3125rem; border-radius: 0.109375rem; background-color: rgba(255, 255, 255, 0.7); line-height: 0.40625rem; text-align: center; font-size: 0.34375rem; color: #EA5504; }