@charset "UTF-8";
/* absolute-center */
/* transition */
@font-face {
  font-family: "NanumGothicEB";
  font-style: normal;
  font-weight: normal;
  src: url(//storage.ggad.co.kr/css/font/NanumGothic-ExtraBold.eot);
  src: url(//storage.ggad.co.kr/css/font/NanumGothic-ExtraBold.eot?#iefix) format("embedded-opentype"), url(//storage.ggad.co.kr/css/font/NanumGothic-Bold.woff2) format("woff2"), url(//storage.ggad.co.kr/css/font/NanumGothic-ExtraBold.woff) format("woff"), url(//storage.ggad.co.kr/css/font/NanumGothic-ExtraBold.ttf) format("truetype");
}
@font-face {
  font-family: "NanumGothicBold";
  font-style: normal;
  font-weight: normal;
  src: url(//storage.ggad.co.kr/css/font/NanumGothic-Bold.eot);
  src: url(//storage.ggad.co.kr/css/font/NanumGothic-Bold.eot?#iefix) format("embedded-opentype"), url(//storage.ggad.co.kr/css/font/NanumGothic-Bold.woff2) format("woff2"), url(//storage.ggad.co.kr/css/font/NanumGothic-Bold.woff) format("woff"), url(//storage.ggad.co.kr/css/font/NanumGothic-Bold.ttf) format("truetype");
}
@font-face {
  font-family: "NanumGothic";
  font-style: normal;
  font-weight: normal;
  src: url(//storage.ggad.co.kr/css/font/NanumGothic-Regular.eot);
  src: url(//storage.ggad.co.kr/css/font/NanumGothic-Regular.eot?#iefix) format("embedded-opentype"), url(//storage.ggad.co.kr/css/font/NanumGothic-Regular.woff2) format("woff2"), url(//storage.ggad.co.kr/css/font/NanumGothic-Regular.woff) format("woff"), url(//storage.ggad.co.kr/css/font/NanumGothic-Regular.ttf) format("truetype");
}
@font-face {
  font-family: "NanumGL";
  src: url(//storage.ggad.co.kr/css/font/NanumGothicLight.eot);
  src: url(//storage.ggad.co.kr/css/font/NanumGothicLight.eot?#iefix) format("embedded-opentype"), url(//storage.ggad.co.kr/css/font/NanumGothicLight.woff) format("woff"), url(//storage.ggad.co.kr/css/font/font/NanumGothicLight.ttf) format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "NanumGothicLight";
  src: url(//storage.ggad.co.kr/css/font/NanumGothicLight.eot);
  src: url(//storage.ggad.co.kr/css/font/NanumGothicLight.eot?#iefix) format(embedded-opentype), url(//storage.ggad.co.kr/css/font/NanumGothicLight.woff) format(woff), url(//storage.ggad.co.kr/css/font/NanumGothicLight.ttf) format(truetype), url(//storage.ggad.co.kr/css/font/NanumGothicLight.svg#NanumGothicLight) format(svg);
  src: local(※), url(//storage.ggad.co.kr/css/font/NanumGothicLight.woff) format(woff);
}
@font-face {
  font-family: "NanumMyeongjo";
  font-style: normal;
  font-weight: normal;
  src: url(//storage.ggad.co.kr/css/font/NanumMyeongjo-Regular.eot);
  src: url(//storage.ggad.co.kr/css/font/NanumMyeongjo-Regular.eot?#iefix) format("embedded-opentype"), url(//storage.ggad.co.kr/css/font/NanumMyeongjo-Regular.woff2) format("woff2"), url(//storage.ggad.co.kr/css/font/NanumMyeongjo-Regular.woff) format("woff"), url(//storage.ggad.co.kr/css/font/NanumMyeongjo-Regular.ttf) format("truetype");
}
/************************************************************************************/
/************************************* Varibles *************************************/
/************************************************************************************/
:root {
  /* header */
  --h1-padding-width:1vw;
  --h1-padding-height:3vw;
  /* input */
  --input-padding-width:10px;
  --input-padding-height:5px;
  /* margin */
  --content-space:3.5vw;
}

@media screen and (max-width: 767px) {
  :root {
    /* header */
    --h1-padding-height: 8vw;
  }
}
/************************************************************************************/
/************************************* Colors *************************************/
/************************************************************************************/
:root {
  --white:#fff;
  --black:#000;
  --border-color:#cecfcf;
  --bg-color:#fafbfd;
  --point-color:#313c90;
  --point-over-color: #293369;
  --point-sub-color:#af0030;
  --text-color:#566685;
  --bg-color:#fafbfd;
  --table-header:#f2f2f2;
  --top-navigation-bg-color:#2d3134;
  --left-menu-bg-color:#f0f3f8;
  --prev-menu-bg-color:#72809d;
  --depth1-bg-color:#d7e1ea;
  --percent-color: #77ea3b;
  --gray-e5:#e5e5e5;
  --gray-fa:#fafafa;
  --gray-cc:#ccc;
  /* btn color */
  --btn-white-over-color: #f1edef;
  --btn-secondary-color:#673fe9;
  --btn-secondary-over-color: #3d278d;
  --btn-third-color:#75777e;
  --btn-third-over-color: #5d5e64;
}

html {
  font-size: 62.5%;
}

body, pre {
  font-family: "Pretendard", "malgun gothic", "맑은고딕", "Apple SD Gothic Neo", "Dotum", "돋움", "Arial", sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  word-break: keep-all;
  letter-spacing: 0;
  line-height: 140%;
  color: var(--black);
  /* navigation */
}
body > header.user-header, pre > header.user-header {
  border-bottom: 1px solid var(--gray-e5);
  background: var(--black);
  padding: 2rem;
}
body > header.user-header .logo, pre > header.user-header .logo {
  width: 267px;
  height: 41px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
body > header.user-header .logo a, pre > header.user-header .logo a {
  display: block;
  width: 100%;
  height: 100%;
  background: url("/images/btfa/common/logo.png") no-repeat center/100%;
}

input {
  width: 100%;
  height: 50px;
  border: 1px solid var(--border-color);
  border-radius: 50px;
  padding: var(--input-padding-height) var(--input-padding-width);
}

input[type=checkbox] + label,
input[type=radio] + label {
  font-size: 1.8rem;
  font-weight: 600;
}
input[type=checkbox] + label::before,
input[type=radio] + label::before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  border: 1px solid var(--border-color);
  border-radius: 50%;
  background: var(--white) url("/images/common/unchecked.png") no-repeat center;
  top: 0;
}

input[type=checkbox]:checked + label::before,
input[type=radio]:checked + label::before {
  content: "";
  display: block;
  border: 1px solid var(--point-color);
  background: var(--point-color) url("/images/common/checked.png") no-repeat center;
}
input[type=checkbox]:checked + label::after,
input[type=radio]:checked + label::after {
  display: none;
}

input[type=file] {
  border-radius: 1rem;
  padding-top: 1rem;
}

input::-webkit-input-placeholder {
  opacity: 0.4;
}

input::-moz-placeholder {
  opacity: 0.4;
}

input:-ms-input-placeholder {
  opacity: 0.4;
}

input::-ms-input-placeholder {
  opacity: 0.4;
}

input::placeholder {
  opacity: 0.4;
}

label.error {
  width: 100%;
  font-weight: 400 !important;
  color: var(--point-sub-color);
  padding: 0 1rem;
  margin-top: 1rem;
}

/* disabled */
*:disabled {
  opacity: 0.4;
}

div:has(> input:disabled) label,
div:has(> select:disabled) label,
div:has(> testarea:disabled) label {
  opacity: 0.4;
  cursor: default;
}

/* 주소입력창 */
.adderss-wrap > input {
  border-radius: 10px 0 0 10px;
}
.adderss-wrap > button {
  color: var(--white);
  border-radius: 0 10px 10px 0;
  background: var(--point-color);
  padding: 0 2rem;
}

/* 버튼 */
.btn-set {
  text-align: center;
  border-top: 1px solid var(--border-color);
  padding-top: var(--content-space);
  margin-top: var(--content-space);
}

button {
  height: 50px;
}

.btn {
  min-width: 10em;
  font-size: 1.8rem;
  color: var(--white) !important;
  border: none;
  border-radius: 50px;
}

.btn-primary {
  background: var(--point-color);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
  background: var(--black) !important;
}

.contents-wrap {
  max-width: 1440px;
  padding: 0 1rem;
  padding-bottom: var(--content-space);
  margin: 0 auto;
}

.ml-auto {
  margin-left: auto;
}

/* table */
table {
  width: 100%;
  border-top: 2px solid var(--black);
}
table th, table td {
  border-bottom: 1px solid var(--border-color);
  padding: 2rem 1rem;
}
table thead {
  background: var(--table-header);
}

/* header */
.page-headline h1 {
  font-size: 4rem;
  font-weight: 700;
}
.page-headline span {
  font-weight: 600;
  color: var(--point-color);
  margin-top: 1rem;
}

/* footer */
.footer-wrap {
  border-top: 1px solid var(--border-color);
  padding: 3rem 0;
}
.footer-wrap ul {
  margin-bottom: 3rem;
}
.footer-wrap ul li {
  margin: 0 1rem;
}
.footer-wrap ul li a {
  color: var(--black);
  text-decoration: none;
}
.footer-wrap ul li a:hover {
  text-decoration: underline;
}
.footer-wrap footer {
  font-size: 0.8em;
  text-align: center;
}

.join-discription {
  font-size: 1.8rem;
  font-weight: 200;
  border: 1px solid var(--border-color);
  border-radius: 1rem;
  padding: 2rem;
  margin-bottom: var(--content-space);
}
.join-discription > div {
  width: calc(100% - 103px);
  padding-right: 4rem;
}
.join-discription span {
  font-size: 2rem;
  font-weight: 600;
  color: var(--point-color);
}
.join-discription figure {
  width: 103px;
}

.join-wrap > div {
  width: calc(25% - 15px);
  margin-right: 20px;
  text-align: center;
  border: 1px solid var(--border-color);
  border-top: 2px solid var(--point-color);
  padding: 3rem 1rem;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.join-wrap > div:last-child {
  margin-right: 0;
}
.join-wrap > div:hover {
  background: var(--gray-fa);
}
.join-wrap > div dl dt {
  font-size: 2rem;
}
.join-wrap > div dl dt::before {
  content: "";
  display: block;
  width: 125px;
  height: 128px;
  border: 1px solid var(--border-color);
  border-radius: 50%;
  background-color: var(--white);
  background-repeat: no-repeat;
  background-position: center;
  margin: 0 auto 2rem auto;
}
.join-wrap > div dl dd {
  min-height: 70px;
}
.join-wrap .individual dl dt::before {
  background-image: url("/images/user/individual_icon.png");
}
.join-wrap .practician dl dt::before {
  background-image: url("/images/user/practician_icon.png");
}
.join-wrap .school dl dt::before {
  background-image: url("/images/user/school_icon.png");
}
.join-wrap .organization dl dt::before {
  background-image: url("/images/user/organization_icon.png");
}

@media screen and (max-width: 1024px) {
  .join-wrap > div {
    width: calc(50% - 10px);
    margin-bottom: 2rem;
  }
  .join-wrap > div:nth-child(even) {
    margin-right: 0;
  }
}
@media screen and (max-width: 480px) {
  .join-wrap > div {
    width: 100%;
    margin-right: 0;
  }
}
/* 비밀번호 */
.psw-wrap {
  position: relative;
}
.psw-wrap .btn-psw {
  color: var(--gray-cc);
  position: absolute;
  right: 15px;
}
.psw-wrap .btn-psw.show {
  color: var(--black);
}
.psw-wrap .material-symbols-outlined {
  font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24;
}

.col.psw-wrap .btn-psw {
  right: 25px;
}

/* //비밀번호 */
.member-info .input-col input {
  text-align: right;
}
.member-info .input-col span {
  font-weight: 600;
  margin-left: 1rem;
  display: block;
}
.member-info .input-col label {
  margin-right: 1rem;
  margin-bottom: 0 !important;
  margin-left: 3rem;
}
.member-info .input-col label:first-child {
  margin-left: 0;
}
.member-info .page-headline {
  border-bottom: 0;
  margin-bottom: 0;
}
.member-info .border-box {
  border: 1px solid var(--border-color);
  border-top: 2px solid var(--black);
  margin-bottom: var(--content-space);
}
.member-info .checkbox-wrap {
  padding: 3rem 2rem;
}
.member-info h2.checkbox-wrap {
  border-bottom: 1px solid var(--border-color);
  background: var(--gray-fa);
}
.member-info .textarea-wrap {
  height: 20rem;
  padding: 2rem;
  overflow-y: auto;
}
.member-info .textarea-wrap::-webkit-scrollbar {
  width: 5px;
  background: var(--white);
}
.member-info .textarea-wrap::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: var(--gray-cc);
}
.member-info .textarea-wrap pre {
  width: 100%;
  white-space: pre-wrap;
  border: none;
}
.member-info .info-wrap header {
  border-bottom: 2px solid var(--black);
  padding: 2rem 1rem;
}
.member-info .info-wrap header h2 {
  font-weight: 600;
}
.member-info .info-wrap header div {
  font-size: 0.8em;
  color: var(--point-sub-color);
}
.member-info .info-wrap .info {
  padding: 2rem;
}
.member-info .info-wrap .info label {
  font-weight: 600;
  margin-bottom: 1rem;
}
.member-info .info-wrap .info label span {
  color: var(--point-sub-color);
}
.member-info .info-wrap .info .col {
  padding: 1em;
}
.member-info .info-wrap .radio-wrap label {
  font-size: 1.6rem;
  font-weight: 400;
  margin-right: 2rem;
}

.result-wrap {
  max-width: 450px;
  text-align: center;
  margin: 0 auto;
}
.result-wrap header {
  border-bottom: 2px solid var(--point-color);
  padding-bottom: var(--content-space);
  margin-bottom: var(--content-space);
}
.result-wrap header::before {
  content: "";
  display: block;
  width: 120px;
  height: 120px;
  border: 1px solid var(--border-color);
  border-radius: 50%;
  background-image: url("/images/user/result_icon.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 50%;
  margin: 0 auto 2rem auto;
}
.result-wrap header h2 {
  font-size: 2.4em;
}
.result-wrap header h2 span {
  color: var(--point-color);
}
.result-wrap p span {
  font-weight: 600;
  color: var(--point-color);
}
.result-wrap .btn-set {
  margin-top: 5rem;
}
.result-wrap .btn-set a {
  padding: 1rem;
}

@media screen and (max-width: 640px) {
  .member-info .info-wrap .info {
    padding: 2rem 0;
  }
}
.mypage-wrap {
  padding-top: var(--content-space);
  position: relative;
}
.mypage-wrap .btn {
  min-width: auto;
  height: auto;
  font-size: 0.85em;
  padding: 0.5rem 1rem;
}
.mypage-wrap .left-menu-wrap {
  padding-right: 2vw;
}
.mypage-wrap .left-menu-wrap > div header h1 {
  font-size: 1.8rem;
  color: var(--white);
  border-radius: 2rem 2rem 0 0;
  background: var(--black);
  padding: 2rem 1rem;
}
.mypage-wrap .left-menu-wrap > div ul li a {
  text-decoration: none;
  color: var(--black);
  padding-left: 1rem;
  display: block;
  position: relative;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.mypage-wrap .left-menu-wrap > div ul li a::before {
  content: "";
  display: block;
  width: 3px;
  height: 3px;
  background: var(--black);
  position: absolute;
  top: 10px;
  left: 0;
}
.mypage-wrap .left-menu-wrap > div ul li a:hover {
  text-decoration: underline;
}
.mypage-wrap .left-menu-wrap > div ul[depth="1"] {
  border: 1px solid var(--border-color);
  border-radius: 0 0 2rem 2rem;
  background: var(--gray-fa);
}
.mypage-wrap .left-menu-wrap > div ul[depth="1"] > li {
  padding: 2rem 1rem;
}
.mypage-wrap .left-menu-wrap > div ul[depth="1"] > li:last-child {
  border-radius: 0 0 2rem 2rem;
}
.mypage-wrap .left-menu-wrap > div ul[depth="1"] > li.--open {
  background: var(--white);
}
.mypage-wrap .left-menu-wrap > div ul[depth="1"] > li > a {
  font-weight: 600;
}
.mypage-wrap .left-menu-wrap > div ul[depth="2"] {
  margin-top: 1rem;
  margin-left: 1rem;
}
.mypage-wrap .left-menu-wrap > div ul[depth="2"] li {
  margin-bottom: 1rem;
}
.mypage-wrap .left-menu-wrap > div ul[depth="2"] li:last-child {
  margin-bottom: 0;
}
.mypage-wrap .mypage-content .content-header {
  border: 1px solid var(--border-color);
  border-radius: 1rem;
  padding: 2rem 1rem;
  margin-bottom: 3rem;
}
.mypage-wrap .mypage-content .content-header .member-info {
  font-weight: 600;
}
.mypage-wrap .mypage-content .content-header .member-info span {
  font-size: 0.8em;
  font-weight: 400;
  border: 1px solid var(--border-color);
  border-radius: 1.5rem;
  padding: 5px 8px;
  margin-left: 1rem;
  display: inline-block;
}
.mypage-wrap .mypage-content .content-header ul {
  font-size: 0.9em;
}
.mypage-wrap .mypage-content .content-header ul li {
  padding-right: 1rem;
  margin-right: 1rem;
  display: block;
  position: relative;
}
.mypage-wrap .mypage-content .content-header ul li::after {
  content: "";
  display: block;
  width: 1px;
  height: 10px;
  border-right: 1px solid var(--black);
  position: absolute;
  top: 5px;
  right: 0;
}
.mypage-wrap .mypage-content .content-header ul li:last-child {
  padding-right: 1rem;
}
.mypage-wrap .mypage-content .content-header ul li:last-child::after {
  display: none;
}
.mypage-wrap .mypage-content h2 {
  font-size: 1.2em;
  font-weight: 600;
  margin-bottom: 2rem;
}
.mypage-wrap .mypage-content .table-wrap {
  overflow-x: auto;
}
.mypage-wrap .mypage-content .table-wrap table {
  min-width: 950px;
}
.mypage-wrap .mypage-content .table-wrap table td.state span {
  font-size: 0.8em;
  color: var(--white);
  border-radius: 20px;
  background: var(--black);
  padding: 5px 10px;
  display: inline-block;
}

/* 회원탈퇴 */
.header_box.unregister p {
  font-size: 1.5em;
  font-weight: 600;
  color: var(--point-color);
  line-height: 140%;
}

.unregister_box {
  border: 1px solid var(--border-color);
  padding: 1em;
  margin: 1em 0;
}
.unregister_box p {
  font-size: 1.2em;
  font-weight: 600;
  margin-bottom: 0.5em;
}
.unregister_box ul {
  margin-bottom: 2em;
  margin-left: 1rem;
}
.unregister_box ul:last-child {
  margin-bottom: 0;
}

@media screen and (max-width: 1200px) {
  .mypage-wrap {
    padding-top: calc(var(--content-space) + 10rem);
    margin: 0;
  }
  .mypage-wrap > div {
    padding: 0;
  }
  .mypage-wrap .left-menu-wrap {
    padding-right: 0;
    margin-bottom: 2rem;
  }
  .mypage-wrap .mypage-content {
    position: static;
  }
  .mypage-wrap .mypage-content .content-header {
    width: 100%;
    position: absolute;
    top: var(--content-space);
  }
}
@media screen and (max-width: 720px) {
  .mypage-wrap .mypage-content .table-wrap table {
    min-width: auto;
  }
  .mypage-wrap .mypage-content .table-wrap table colgroup col {
    width: auto !important;
  }
  .mypage-wrap .mypage-content .table-wrap table thead {
    display: none;
  }
  .mypage-wrap .mypage-content .table-wrap table tbody td {
    width: 100% !important;
    border-bottom: none;
    text-align: left !important;
    padding: 5px 10px;
    display: block;
  }
  .mypage-wrap .mypage-content .table-wrap table tbody td::before {
    vertical-align: middle;
    content: "";
    margin-top: -2px;
    display: inline-block;
    content: attr(data-th) " :";
    font-weight: 600;
    margin-right: 5px;
  }
  .mypage-wrap .mypage-content .table-wrap table tbody td:first-child {
    padding-top: 2rem;
  }
  .mypage-wrap .mypage-content .table-wrap table tbody td:first-child::before {
    display: none;
  }
  .mypage-wrap .mypage-content .table-wrap table tbody td:last-child {
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 2rem;
  }
  .mypage-wrap .mypage-content .table-wrap table tbody td:last-child::before {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .mypage-wrap {
    padding-top: calc(var(--content-space) + 13rem);
  }
  .mypage-wrap .mypage-content .content-header .member-info {
    margin-bottom: 2rem;
  }
}
/* 작성자 : 디자인글꼴 2023-09 */
.login-contents-wrap {
  max-width: 768px;
}

.page-headline {
  border-bottom: 2px solid var(--black);
  padding: var(--h1-padding-height) var(--h1-padding-width);
  margin-bottom: var(--content-space);
}

.login-discription {
  font-size: 2rem;
  font-weight: 200;
  border: 1px solid var(--border-color);
  border-left: 2px solid var(--point-color);
  padding: 1vw 3vw;
  margin-bottom: var(--content-space);
}
.login-discription span {
  font-weight: 600;
  color: var(--point-color);
}
.login-discription figure {
  width: 103px;
}

.login-box-wrap .login-box {
  background: #f4f4f4;
  padding: 4vw 3vw;
  margin: 0 auto;
}
.login-box-wrap .login-box .login-text-box {
  text-align: center;
  margin-bottom: var(--content-space);
}
.login-box-wrap .login-box .login-text-box p {
  font-size: 2rem;
}
.login-box-wrap .login-box .login-text-box p span {
  color: var(--point-color);
  font-weight: 600;
}

.login-btn-wrap {
  margin: 1.6rem 0;
}
.login-btn-wrap button {
  width: 100%;
}

.login-assist-wrap a {
  color: var(--text-color);
  text-decoration: none;
  display: block;
}
.login-assist-wrap a:after {
  content: "";
  display: block;
  width: 1px;
  height: 60%;
  border-right: 1px solid var(--black);
  margin: 0 1rem;
}
.login-assist-wrap a:last-child::after {
  display: none;
}
