/* 메일문의 */
.onlineContactArea {width: 100%; margin: 0; padding: 1rem; background: #f2f2f2; box-sizing: border-box;}
.onlineContactArea * {box-sizing: border-box;}

.contactList {position: relative; margin: 1.33rem 0 4.66rem;}
.contactList li {position: relative; min-height: 2rem; margin-top: 1rem; font-size: 1.065rem; line-height:1.6;}
.contactList li > strong {position: absolute; top: 0; left: 0; color: #000; font-weight: bold;}
.contactList li > p,
.contactList li > div {display: block; padding-left: 7rem; color: #5a5a5a;}
.contactList li:nth-child(3) > div {display: flex;}
.contactList li .contactInput {display: block; width: 100%; margin-bottom: 0.66rem; padding: 0.12rem 0.534rem; border: px solid #cbcbcb; color: #5a5a5a; line-height: 1.6;}
.contactList li > div .uploaded_file_list {width: 85%; padding: 0.5rem; background:#fff;}
.contactList li > div .uploaded_file_list .file_item {margin-right: 1rem;}
.contactList li > div .btn.fileBtn {width: 15%; margin: 0; border-radius: 0; background: #ddd; text-align: center;}
.contactList li > div .btn.fileBtn span {color: #fff;}
.mail_send {display: inline-block; width: 25%; min-width: 10rem; padding: 0.5rem 1rem; background: #ddd; color: #fff; font-size: 1rem; border-radius: 5px;}

/*  */
.contactList .quantityLine input {width:70%;}
.contactList .quantityLine select {width:28.5%;}

/* 로딩 */
.fair_online  #content.sub_content {position:relative;} /* 이부분 문제있을수도 있음.. */
.onlineEhLoading {position:absolute; width:100%; height:100%; top:0; bottom:0; left:0; right:0; background:#fff; z-index:1;}
.onlineEhLoading:after {content:'\f3f4'; position:absolute; top:calc(50% - 1rem); left:calc(50% - 1rem); color:#0055a2; font-size:2rem; font-family:'FontAwesome'; animation: onlineEhLoadingAni 1s linear infinite;}
@keyframes onlineEhLoadingAni {
  0%   {transform:rotate(0deg)}
  100% {transform:rotate(360deg)}
}

.loading-spinner {display:flex; min-height:25rem; justify-content:center; align-items:center;}

/* 페이징 */
.page {}
.page > * {display:inline-flex; align-items:center; justify-content:center; width:2rem; line-height:2rem; vertical-align: baseline}
.page a {cursor:pointer; font-size: 11px;}
.page b {border-bottom:1px solid #ccc; font-size: 11px;}


/* 로그인 분기 */
.onlineLoginTit {display:block; margin-top:10%; font-size:3.5rem; color:#fff; text-align:center;}
.onlineLoginArea .select_type {text-align:center;}
.onlineLoginArea .select_type strong {display:block; font-size:3.2rem; font-weight:600; color:#000;}
.onlineLoginArea .select_type span {display:inline-block; margin-left:0.5rem; font-weight:300;}
.onlineLoginLink {margin-top:4.5rem; font-size:0; color:#000;}
.onlineLoginLink a {position:relative; display:inline-block; width:33%; margin:0.5rem; padding:3rem 2rem; border:1px solid #000; box-sizing:border-box; text-align:left; vertical-align:middle; transition:all .3s;}
.onlineLoginLink a .loginIcon svg {height:3.2rem; fill:#000;}
.onlineLoginLink a b {display:block; margin-top:1rem; font-size:2.4rem;}
.onlineLoginLink a span {display:block; margin-top:0.8rem; font-size:1.33rem;}
.onlineLoginLink a i {position:absolute; bottom:1.5rem; right:2rem; font-size:2.2rem;}
.onlineLoginLink a:hover {border:1px solid #121e5b; color:#fff; background-color:#121e5b;}
.onlineLoginLink a:hover .loginIcon svg {fill:#fff;}

@media only screen and (max-width:760px){
	.onlineLoginLink a {width:80%; max-width:400px;}
}

@media only screen and (max-width:580px){
	.contactList li > strong {position: static;}
	.contactList li > p,
	.contactList li > div {padding: 0;}
	.contactList li > div .btn.fileBtn {width: 35%;}
}