@charset "UTF-8";

html, body { width:100%; height: 100%; }
body { font-size: 14px; font-family: "Noto Sans KR", Dotum, Arial, Helvetica, sans-serif; color: #252525; }
a {text-decoration: none;}
input {box-sizing: border-box;}
button {font-family: "Noto Sans KR", Dotum, Arial, Helvetica, sans-serif; border: 0; background: none;}

/* 폰트 */
.noto-sans-kr-400 { font-family: "Noto Sans KR", serif; font-optical-sizing: auto; font-weight: 400; font-style: normal;}

/* 공통 */
.clear::after {content: ""; display: block; clear: both;}
.fl-l {float: left;}
.fl-r {float: right;}
.blind { display: block; padding: 0; margin: 0; position: absolute; z-index: -1; width: 1px; height: 1px; overflow: hidden; font-size: 1px; line-height: 1px; color: transparent; border: 0; opacity: 0; filter: alpha(opacity=0); background: none;}
.mt0 {margin-top: 0px !important;}
.mt5 {margin-top: 5px !important;}
.mt10 {margin-top: 10px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px !important;}
.mt40 {margin-top: 40px !important;}
.mt50 {margin-top: 50px !important;}
.mb0 {margin-bottom: 0px !important;}
.mb5 {margin-bottom: 5px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px !important;}
.pd30 {padding: 30px !important;}
.text-center {text-align: center;}
.text-left {text-align: left;}
.text-right {text-align: right;}
.point-color {color:#1a73e8;}
.font-red { color: red !important; }
.font-12 { font-size: 12px !important; }

input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"] {
	width: 100%; height: 36px; padding: 0 12px; vertical-align: middle;
	line-height: 24px; font-size: 14px; color: #252525;
	letter-spacing: -0.7px; border: 1px solid #d9d9d9; border-radius: 6px; 
	-webkit-appearance: none; appearance: none;
}
input[type="text"]:hover, input[type="password"]:hover, input[type="email"]:hover,
input[type="tel"]:hover, textarea:hover { border-color: #aeaeae; }
input::placeholder, input:-ms-input-placeholder,
input:-mos-input-placeholder { color: #727272; opacity: 1; }
input[type="password"] { letter-spacing: 3px; }
input[type="password"]::placeholder{ letter-spacing: -0.7px; } /* 속성을 각각 써줘야 css 적용됨.. */
input[type="password"]:-ms-input-placeholder { letter-spacing: -0.7px; }
input[type="password"]:-mos-input-placeholder { letter-spacing: -0.7px; }
.input { /* border: 1px solid rgb(210, 214, 218); */ }
.input:active { font-weight: normal; }
.input.error { font-weight: normal; border-color: #e2004d;}
.input:focus { border: 1px solid rgb(73, 163, 241) !important;}

/* 체크박스 */
.checkbox-basic { position: relative; display: inline-block; }
.checkbox-basic input { display: block; position: absolute; left: 0; top: 0; opacity: 0; cursor: pointer; }
.checkbox-basic label { display: inline-block; padding-left: 26px; vertical-align: top;
	position: relative; z-index: 2; line-height: 20px; color: #252525; letter-spacing: -0.8px; }
.checkbox-basic label:before { content: ""; position: absolute; left: 0; top: 0;
	width: 20px; height: 20px; vertical-align: middle;
	background: url('../images/common/btn_check_off.png') no-repeat 0 0;
	-webkit-background-size: 100% auto; background-size: 100% auto; }
.checkbox-basic input:checked+label:before { background-image: url('../images/common/btn_check_on.png'); }

.checkbox-black { position: relative; }
.checkbox-black input { display: block; position: absolute; left: 0; top: 0; opacity: 0; cursor: pointer; }
.checkbox-black label { display: inline-block; padding-left: 26px; vertical-align: top;
	position: relative; z-index: 2; line-height: 20px; color: #252525; letter-spacing: -0.8px; }
.checkbox-black label:before { content: ""; position: absolute; left: 0; top: 3px; width: 15px; height: 15px;
	border-radius: 2px;	border: 1px solid #acacac; background-color: #fff; }
.checkbox-black input:checked+label:before { background: #222 url(../images/common/ico_check.png) 50% / 60% no-repeat; }

/* 라디오버튼 */
.radio-black { position: relative;  }
.radio-black input { display: block; position: absolute; left: 0; top: 0; opacity: 0; cursor: pointer; }
.radio-black label { display: inline-block; padding-left: 26px; vertical-align: top;
	position: relative; z-index: 2; line-height: 20px; color: #252525; letter-spacing: -0.8px; }
.radio-black label:before { content: ""; position: absolute; left: 0; top: 3px; width: 15px; height: 15px;
	border-radius: 2px;	border: 1px solid #acacac; background-color: #fff; }
.radio-black input:checked+label:before { background: #222 url(../images/common/ico_check.png) 50% / 60% no-repeat; }
.radio-black label:hover { cursor: pointer; }

.btn-lg { width: 100%; height: 50px; font-size: 16px; border-radius: 6px; text-align: center;
	display: inline-flex; justify-content: center; align-items: center; border: 0px; vertical-align: middle; }
.btn-md { width: 100%; height: 44px; font-size: 14px; border-radius: 6px; text-align: center;
	display: inline-flex; justify-content: center; align-items: center; border: 0px; vertical-align: middle; }
.btn-sm { height: 30px; font-size: 13px; border-radius: 4px; text-align: center;
	display: inline-flex; justify-content: center; align-items: center; border: 0px; vertical-align: middle; }

.btn-blue { position: relative; padding: 6px 24px; color: #fff; font-weight: 700; background-color: #1a73e8;    
	box-shadow: rgba(26, 115, 232, 0.15) 0rem 0.1875rem 0.1875rem 0rem, rgba(26, 115, 232, 0.2) 0rem 0.1875rem 0.0625rem -0.125rem, rgba(26, 115, 232, 0.15) 0rem 0.0625rem 0.3125rem 0rem;  
	transition: color 0.1s, background-color 0.1s, border-color 0.1s;
}
.btn-blue:active { background-color: #1e7ffd; }

.btn-skyblue { position: relative; padding: 6px 24px; color: #fff; font-weight: 700; background-color: #35c5f0;  
	box-shadow: rgba(26, 115, 232, 0.15) 0rem 0.1875rem 0.1875rem 0rem, rgba(26, 115, 232, 0.2) 0rem 0.1875rem 0.0625rem -0.125rem, rgba(26, 115, 232, 0.15) 0rem 0.0625rem 0.3125rem 0rem;  
	transition: color 0.1s, background-color 0.1s, border-color 0.1s; }
.btn-skyblue:active { background-color: #35c5f0; }

.btn-gray { position: relative; padding: 6px 24px; color: #343434; font-weight: 700; background-color: #ebebeb;  
	box-shadow: rgba(171, 171, 171, 0.15) 0rem 0.1875rem 0.1875rem 0rem, rgba(171, 171, 171, 0.2) 0rem 0.1875rem 0.0625rem -0.125rem, rgba(171, 171, 171, 0.15) 0rem 0.0625rem 0.3125rem 0rem;  
	transition: color 0.1s, background-color 0.1s, border-color 0.1s; }
.btn-gray:active { background-color: #ebebeb; }

.btn-line { position: relative; padding: 6px 24px; color: #121212; font-weight: 700; background-color: transparent; border: 1px solid #121212;
	box-shadow: rgba(197, 209, 223, 0.15) 0rem 0.1875rem 0.1875rem 0rem, rgba(197, 209, 223, 0.2) 0rem 0.1875rem 0.0625rem -0.125rem, rgba(197, 209, 223, 0.15) 0rem 0.0625rem 0.3125rem 0rem;  
	transition: color 0.1s, background-color 0.1s, border-color 0.1s; }
.btn-line:active { background-color: rgba(0, 0, 0, .1); }

.btn-dark { padding: 6px 22px; font-weight: 600; font-size: 12px; line-height: 1em;
	border: none; border-radius: 4px; background-color: #66615b; color: #fff;
	-webkit-transition: all .15s linear; transition: all .15s linear; }

/* 레이아웃 */
.wrap { max-width: 100%; min-height: 100vh; }
.header { position: sticky; left: 0; top: 0; z-index: 10; background-color: #fff; }
.header-wrap { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between;
	padding: 15px 20px; border-bottom: 1px solid #EAEDEF; }
.header-wrap .logo { display: inline-block; height:20px; }
.header-wrap .logo img { max-height: 100%; }
.header-icon {display: flex; }
.header-icon a.btn-login { color: #252525; }
.header-icon .btn-login .fa-user { margin-left: 4px; font-size: 18px; }
.gnb-wrap {  }
.nav-gnb { display: flex; align-items: center; overflow: auto; scrollbar-width: none;
	height:50px; padding: 0 20px; border-bottom: 1px solid #EAEDEF; }
.gnb-list { display: flex; gap: 20px; height: 100%; letter-spacing: -0.14px; }
.gnb-list li { position: relative; display: flex; align-items: center; flex-direction: column; }
.gnb-list li a { position: relative; display: flex; height: 100%; padding: 15px 0; white-space: nowrap;
color: #666; font-size: 15px; font-weight: 400; }
.gnb-list li.active a { font-weight: 600; color: #121212; }
.gnb-list li.active a::after { content: ""; position: absolute; left: 0; bottom: -0.4px;
	width: 100%; height: 2px; background: #1e7ffd; }
.container { margin: 0 auto; }
.container .inner { padding: 20px 20px 40px; margin: 0 auto; }
.page-login { max-width: 768px; }

.container .nav-gnb { }
.gnb-depth3 { border-bottom: 5px solid #ededed; }
.page-tit { margin-bottom: 15px; font-size: 16px; font-weight: 600; line-height:1.4; color: #454545; }
.contract-tit { margin: 0 0 20px; padding: 0 0 10px; font-size: 17px; font-weight: 500;	border-bottom: 1px solid #222; }

/* 로그인 */
.logo-box { margin: 30px 0 30px; text-align: center; }
.login-form input[type="text"], .login-form input[type="password"],
.login-form input[type="email"], .login-form input[type="tel"] { height: 46px; }
.input-form { margin-bottom: 13px; }
.login-btn { margin-top: 20px; text-align: center; }
.login-msg { margin-top:10px; color: #757575; }
.login-msg .fa-circle-info { color: #b9b9b9; }

/* 가입 상품 검색 */
.toggle-btn {border-top: 2px solid #666; border-bottom: 1px solid #eee;}
#toggleSearchBtn { width: 100%; padding: 10px; text-align: center; color: #1a73e8; font-size: 14px; font-weight: 600; }
#toggleSearchBtn::after {content: ""; display: block; clear: both;}
.toggle-btn .icon-toggle {float: right; margin-top:2px; font-size: 18px; transition:0.3s; color: #666;}
.search-form { display: none;}
.form-wrap { padding: 15px 10px; background-color: #f4f4f4; }
.form-wrap .column {  }
.form-label {display: block; margin-bottom: 8px; font-weight: 500; color: #666; }
.foot-btn { display:flex; margin: 20px -5px 0 -5px; justify-content: flex-end; }
.foot-btn .btn-md { width: 50%; margin: 0 5px; }
.select-basic { width: 100%; height: 36px; padding: 0 10px; border: 1px solid #d9d9d9; border-radius: 6px; font-size: 14px; color: #252525; }

.product-list-wrap {}
.product-list-wrap + .product-list-wrap { margin-top: 20px; }
.product-list { display: flex; flex-wrap:wrap; width: 100%; line-height: 1.5;
	border: 1px solid #35c5f0; border-radius: 10px; overflow: hidden; }
.product-list .list-cell { width:50%; border-left: 1px solid #ccc; border-right: 1px solid #ccc; }
.product-list .list-tit { padding: 2px 4px; font-weight: 500;
	border-bottom: 1px solid #ededed; background-color:#f5f5f5; }
.product-list .list-cont { padding: 2px 4px; color: #777; }
.product-list .list-cont a { color: #777; }
.product-list .list-cont .fa-square-plus,
.product-list .list-cont .fa-square-minus { margin-left: 4px; color: #1a73e8; }

.toggle-info { width: 100%; padding: 15px 15px 30px; }
.toggle-info .info-box {  }
.toggle-info .info-box > .info-cell:first-child { border-top: 2px solid #111; }
.toggle-info .info-cell { display: flex; border-bottom: 1px solid #ccc; }
.toggle-info .info-label { display: inline-block; width: 98px; padding: 4px; text-align: center; color:#666; background-color: #f5f5f5; }
.toggle-info .info-label em { display: inline-block; font-size: 13px; color: #666; padding: 1px 4px; border-radius: 2px; }
.toggle-info .info-cont { display: inline-block; padding: 4px 10px; width: calc(100% - 98px); }

.select-box {  }
.tab-cont { display: flex; gap: 20px; height: 50px; margin-bottom: 20px; border-bottom: 1px solid #EAEDEF;  }
.tab-cont a { position: relative; display: block; width: 50%; padding: 15px 0; text-align: center; font-weight: 600; color: #666; }
.tab-cont a.active { font-weight: 600; color: #121212; }
.tab-cont a.active::after { content: ""; position: absolute; left: 0; bottom: -0.4px;	width: 100%; height: 2px; background: #1e7ffd; }
.talk-info-tit { margin-bottom: 10px; padding: 10px 5px; font-weight: 600; color: #121212; border-bottom: 1px solid #EAEDEF;  }

/* 페이지 정보, 페이지네이션 */
.page-wrap {  }
.page-info1 { font-weight:600; color: #666; }
.page-info1 .point-color { font-size: 15px;
	font-family: Arial, Helvetica, "Noto Sans KR", Dotum, sans-serif; color: #1a73e8; }
.page-info2 { display: flex; justify-content: space-between; font-weight:600; color: #888; }
.page-info2 .current { font-family: Arial, Helvetica, "Noto Sans KR", Dotum, sans-serif; }
.page-info2 .btn-page-list { font-weight: 600; color: #222; }
.page-wrap .pagination { padding: 15px 0; }
.page-wrap .page-list { display: flex; gap:10px; justify-content: center; }
.page-wrap .pagination li {  }
.page-wrap .pagination li a { display: block; width: 24px; height: 30px; line-height:30px;
	text-align: center; font-family: Arial, Helvetica, "Noto Sans KR", Dotum, sans-serif; color: #999; }
.page-wrap .pagination li a.btn-page { color: #b6b6b6; }
.page-wrap .pagination li a.active { position: relative; color: #454545; }
.page-wrap .pagination li a.active::after { content:''; display: inline-block; background-color: #1a73e8;
	width: 20px; height: 3px; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }

/* modal select */
.modal-wrap { display: none; position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 19; overflow: hidden; }
.modal-wrap.active { display: block; }
.modal-container { position: absolute; left: 0; top: auto; right: 0; bottom: 0; z-index: 1;
	display: flex; flex-direction: column; max-height: 50.5rem; max-width: none; background-color: #fff;
	animation-duration: .25s; animation-name: show_up; border-top-left-radius: 12px; border-top-right-radius: 12px;
	transform: none; overflow: hidden; }
.modal-head { position: relative; width: 100%; height: 20px; padding: 0; border-bottom: 0; }
.modal-head .btn-close-bar { width: 61px; height: 5px; position: absolute; left: 50%; top: 16px; right: auto; bottom: 0; z-index: 2;
	background-color: #ddd; border-radius: 5px; transform: translate(-50%); font-size: 0; }
.modal-tit { font-size:15px; font-weight:700; color: #121212; letter-spacing: -0.14px;; }
.modal-cont { flex: 1; padding: 30px 20px; max-height: 100%; overflow: auto; }

/* modal info */
.modal-wrap.info .modal-head { display: flex; justify-content: space-between; height: auto; padding: 15px 15px 5px; }
.modal-head .btn-close { width: 20px; height: 20px; padding: 0; font-size: 18px; line-height: 20px; }
.modal-head .btn-close em { line-height: 0; font-size: 0; }
.modal-head .btn-close [class|='fa'] { color: #666; }
.modal-wrap.info .modal-container { max-height: 80vh; height: 660px; max-width: calc(100% - 30px); width: 350px; left: 50%; top: 50%; transform: translate(-50%, -50%);
	border-radius: 12px; }
.modal-wrap.info .modal-cont { flex: 1; padding: 0; max-height: 100%; overflow: auto; }
.overlay { position: fixed; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, .8); }

.select-tit { margin-bottom: 10px; }
.select-list { font-size: 15px; }
.select-list li { padding: 10px 20px; border-bottom: 1px solid #e1e1e1; }
.select-list li:last-child { border-bottom-color: transparent; }
.select-list li a { color: #666; }
.select-list li a.active { font-weight: 700; color: #1a73e8; }
.select-list li.active { display: flex; align-items: center; justify-content: space-between; }
.select-list li.active::after {content:''; display: inline-block; width: 22px; height: 20px;
	background: url('../images/common/select_check.png') 0 0 no-repeat; background-size: contain; }

.btn-top { position: fixed; right: 14px; bottom: 18px; width: 40px; height: 40px;
	background-color: #fffffff2; border-radius: 2px; border: 1px solid #cfcfcf; }
.btn-top a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 20px; color: #656565; }

.table-wrap { }
.table-wrap .select-basic { height: 30px; }
.table caption { font-size: 0; line-height: 0; }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { padding: 1em .8em; border: 1px solid #dbdfe6; }
.table thead th {font-weight:bold; color:#484848; background-color: rgb(214, 235, 255); }
.table tbody th {font-weight:bold; color:#484848; background-color: rgba(37, 43, 54, 0.03); }
.table tbody td {background-color: #fff;}

/* 상품 정보 */
.table2 caption { font-size: 0; line-height: 0; }
.table2 { width: 100%; border-collapse: collapse; }
.table2 .col1 { width:120px; }
.table2 .col2 { width:calc(100% - 110px); }
.table2 th, .table2 td { padding: 6px 10px; border: 1px solid #dbdfe6; font-size: 13px; }
.table2 tbody th {letter-spacing: -0.7px; font-weight:bold; color:#484848; background-color: #f8f8f9; word-break: keep-all;}
.table2 tbody td {background-color: #fff; color: #666; word-break: keep-all;}

/* 납부 정보 */
.table-line { border: 1px solid #b9b9b9; }
.table3 { width: 100%; border-collapse: collapse; }
.table3 caption { font-size: 0; line-height: 0; }
.table3 .col1 { width:16% }
.table3 .col2 { width:20% }
.table3 .col3 { width:24% }
.table3 .col4 { width:20% }
.table3 .col5 { width:20% }
.table3 th, .table3 td { padding: 6px; border: 1px solid #dbdfe6; font-size: 13px; }
.table3 tbody th {letter-spacing: -0.7px; font-weight:bold; color:#484848; background-color: rgba(37, 43, 54, 0.03);
	vertical-align: middle; word-break: keep-all; }
.table3 tbody td {background-color: #fff; color: #666; text-align: center; word-break: break-all;}
.table3 tbody tr > td:first-child,
.table3 tbody tr > td:last-child { text-align:right;}

/* 회원가입신청서 */
.step-list-box { }
.step-list { display: flex; justify-content: flex-end; padding-bottom: 30px; }
.step-list li { position: relative; padding: 0 5px; text-align: center; }
.step-list li .number { display: block; margin: 0 auto; width: 28px; height: 28px;
	color: #666; text-align: center; font-size: 12px; line-height: 24px;
	font-weight: 600;	border: 1px solid #999; border-radius: 50%;}
.step-list li.active .number { color: #121212; border-color: #1a73e8; }
.step-list .step-name { display: none; font-size: 11px; }
.step-list .active .step-name { display: inline; position: absolute; left:50%; bottom: -18px; 
	min-width:80px; transform: translateX(-50%); }
.step-list .active:last-child .step-name { left: 0; right: 0; }
.step-box {display: none;}
.step-box.active {display:block;}
.contract-info { margin: -10px 0 10px; font-size: 13px; line-height:1.2; }
.input-form.d-flex { display: flex; align-items: center; }
.input-form .half { width: 50%; }
.input-form .half-flex { display: flex; align-items: center; width: 50%; }

.contract-form {  }
.service-name { margin-bottom: 8px; font-weight: 500;	color: #666; }
.service-name em { margin-left: 10px; color: #121212; }
.select-info { font-size: 12px; text-align:right; }
.contract-box { max-height: 80px; margin-bottom: 10px; padding: 8px; font-size: 12px; overflow-y: auto;
	border: 1px solid #dfdfdf; background-color: #f9f9f9; color: #666; }
.contract-box-long { margin-bottom: 10px; padding: 8px; font-size: 12px; overflow-y: auto;
		border: 1px solid #dfdfdf; background-color: #f9f9f9; color: #666; }
.contract-list { max-height: 80px; margin-bottom: 10px; padding: 8px 5px; font-size: 12px; overflow-y: auto; border: 1px solid #dfdfdf; background-color: #f9f9f9; }
.contract-list li { position: relative; padding: 0 0 0 10px; color: #666; }
.contract-list li:before { content: ''; display: block; position: absolute; left: 3px; top: 8px; width: 2px; height: 2px; background-color: #777; }
.caret { position: relative; margin: 20px 0 5px; }
.caret::before { content:''; display: inline-block; width: 3px; height: 10px; margin-right: 5px; background-color: #666; }
.caret.font-red::before { background-color: red; }
.step-box .foot-btn .btn-sm { margin: 0 5px; }
input[type='text'].input-zip { width: 100px; }
.tel-type { display:flex; flex-wrap:wrap; margin-top: 5px; }
.tel-type .radio-black { width: 33.3%; }
.yes-box { display: flex; justify-content: flex-end; margin-top: 10px; }
.yes-box .radio-black + .radio-black { margin-left: 15px; }
.contract-text { margin: 10px 0 0; font-size: 13px; line-height:1.3; color: #666; }
.contract-text2 { font-size: 13px; line-height:1.3; }
.input-date { display:flex; align-items: center; justify-content: center; margin-top: 30px; }
.input-date input[type="number"] { width: 60px; height: 30px; margin-left: 5px; padding:0 4px; text-align: center; border-radius: 4px; }
.sign-box { text-align:right; margin-top: 30px; }
.sign-box .sign { display: inline-block; width:120px; height:28px; vertical-align: bottom; border-bottom: 1px solid #ccc; }
.contract-footer { padding: 30px 0 0; text-align: center;}
.contract-footer .footer-logo {margin-bottom: 20px;}
.contract-footer .footer-logo img { width:200px; }
.contract-footer .hp-addr { margin-bottom: 5px; font-size: 13px; font-weight: 600; color: #777; }
.contract-footer .hp-addr a { margin-left: 5px; color: #777; font-weight: normal; }
.contract-footer .tel { font-size: 16px; color: #504fa1; }
.contract-footer .tel a { color: #f0593e; }

.qr-info { display: flex; }
.qr-img { padding-right: 10px; }
.form-style1 {  }
.form-style1 .service-name { margin-bottom: 20px; }
.form-style1 .service-info-msg { margin-bottom:5px; font-size: 12px; }
.form-style1 strong { font-weight: 600; }
.hr-gray { margin-top: 20px; margin-bottom: 20px; border-bottom: 1px solid #d9d9d9; border-top-color: transparent; }
.info-list-wrap { font-size: 11px; margin-bottom: 13px; color: #565656; }
.info-list li { padding-left: 5px; }
.info-list .dot::before { content:'•'; display: inline; margin-right: 4px; }
.remind-box { margin-top: 10px; }
.remind-box .form-inline { width: 114px; height: 24px; font-size: 12px; line-height: 24px; padding: 0 6px; vertical-align: middle; 
	border-radius: 4px;}
.remind-box .form-inline::placeholder { font-size: 12px; color: red; }
.remind-box .form-inline.w80 { width: 80px; }
.hcare-list { list-style-type: decimal; list-style-position: inside; }
.hcare-list li + li { margin-top: 5px; }
.tb-style1 { font-size: 11px; border-collapse: collapse; color: #565656; }
.tb-style1 th, .tb-style1 td { padding: 4px 2px; border: 1px solid #dfdfdf; vertical-align: middle; }
.tb-style1 th { background-color: #f9f9f9; }
.tb-style1 td { font-size: 10px; }
.tb-style1 thead th { font-weight: bold; }
.tb-style1 tbody th { font-size: 10px; }
.info-tit { position: relative; margin: 50px 0 10px; font-size: 16px; font-weight: 600; line-height: 1.4; color: #454545;	}
.info-tit::before { content:''; display: block; width: calc(100% + 20px + 20px);
	position: absolute; top: -20px; left: -20px; border-top: 5px solid #ededed; }
.info-tit2 { font-size: 14px; font-weight: 600; line-height: 1.4; color: #454545; }

.info-detail { padding-top: 10px; font-size: 12px; color: #666; }
.info-detail .list-mark { font-size: 11px; }
.cscall-box { margin-top: 30px; padding: 10px; text-align: center; font-weight: bold;
	border: 1px solid #707070; border-radius: 4px; }
.cscall-box .cscall-info { color: #484848; }
.cscall-box a.tel { color: #1a73e8; }


/* 헬스케어서비스 이용 신청서 */
.tb-wrap-health { margin-top: 20px;}
.tb-style2 { width: 100%; border-collapse: collapse; border-top: 2px solid #434343; }
.tb-style2 caption { font-size: 0; line-height: 0; }
.tb-style2 .col1 { width:16% }
.tb-style2 .col2 { width:20% }
.tb-style2 .col3 { width:24% }
.tb-style2 .col4 { width:20% }
.tb-style2 .col5 { width:20% }
.tb-style2 th, .tb-style2 td { padding: 6px; border: 1px solid #dbdfe6; font-size: 12px; }
.tb-style2 thead th { background-color: #f4f4f4; color: #121212; border-bottom: 1px solid #b0b0b0; }
.tb-style2 tbody th {letter-spacing: -0.7px; font-weight:bold; color:#505050; background-color: rgba(37, 43, 54, 0.03);
	vertical-align: middle; word-break: keep-all; }
.tb-style2 tbody td {padding: 10px; background-color: #fff; color: #484848; word-break: break-all; font-size: 11px; }
.tb-style2 th.no-border-l,
.tb-style2 td.no-border-l { border-left-color: transparent; }
.tb-style2 th.no-border-r,
.tb-style2 td.no-border-r { border-right-color: transparent; }

.healthcare-user { max-width: 768px; margin: 0 auto; }
.user-tit { display: flex; text-align: center; }
.user-tit .tit-cont1, 
.user-tit .tit-cont2 { padding: 6px 10px; border: 1px solid #dfdfdf; border-top: 2px solid #35c5f0;
	font-size: 13px; letter-spacing: -0.7px; font-weight:bold; color:#484848; background-color: #f8f8f9; word-break: keep-all; }
.user-tit .tit-cont1 { width: 30%; }
.user-tit .tit-cont2 { position: relative; width: 70%; text-align: left; }
.user-tit .user-toggle { position: absolute; top: 0; right: 0; width: 50px !important; height: 33px; padding: 6px !important; }
.user-tit .user-toggle i { height: 10px; font-size: 16px; margin-top: -2px; }
.user-info-form { display: none; }
.user-info-form.show { display: block; }

.tb-user { width: 100%; color: #565656; }
.tb-user caption { font-size: 0; line-height: 0; }
.tb-user .height-lg { height: 52px; }
.tb-user th, .tb-user td { padding: 6px 10px; min-height: 44px;
	border: 1px solid #dbdfe6; border-top-color: transparent; font-size: 13px; }
.tb-user .thead th { width: 20%; }
.tb-user th { letter-spacing: -0.7px; font-weight:bold; color:#484848;
	background-color: #f8f8f9; word-break: keep-all; }
.tb-user td {  }
.tb-user .input-form { margin-bottom: 0; }
.tb-user .input-form.d-flex { flex-grow: 1; }
.tb-user .input-text { height: 30px; }

.standard-terms { height: 600px; max-height: 50vh; padding: 10px; overflow-y: auto; border: 1px solid #d9d9d9; }
.standard-terms .terms-tit { font-size: 13px; font-weight: bold; color: #434343; }
.standard-terms .terms-text + .terms-tit { margin-top: 20px; }
.standard-terms .terms-text { font-size: 12px; color: #666; }
.standard-terms .toggle-wrap { position: relative; }
.user-toggle { position: absolute; top: 0; right: 0;
	padding: 10px; text-align: center; color: #1a73e8; font-size: 14px; font-weight: 600; }
.user-toggle::after { content: ""; display: block; clear: both; }
.user-toggle .icon-toggle {float: right; margin-top:2px; font-size: 18px; transition:0.3s; color: #1a73e8;}
.standard-terms .box-line { margin: 6px 0; padding: 3px 8px 6px; border: 1px solid #707070; }

.terms-logo-wrap { display: flex; }
.terms-logo-wrap .terms-logo { padding: 20px 0; width: 50%; text-align: center; }
.terms-logo-wrap .terms-logo img { max-width: 100%; }

.tb-refund { margin-bottom: 10px; width:100%; font-size: 11px; border-collapse: collapse; color: #565656; }
.tb-refund th, .tb-refund td { padding: 4px 2px; border: 1px solid #dfdfdf; vertical-align: middle; }
.tb-refund th { background-color: #f9f9f9; }
.tb-refund td { font-size: 10px; text-align: center; }
.tb-refund thead th { font-weight: bold; }
.tb-refund tbody th { font-size: 10px; }

/* list style */
.list-disc li::before { content: ''; display: inline-block; width: 2px; height: 2px; border: 1px solid #434343; 
	border-radius: 50%; vertical-align: middle; margin: -3px 4px 0 0;}
.list-disc li strong { font-weight: bold; }
.list-mark li::before { content: '※'; display: inline-block; vertical-align: middle; margin: -4px 2px 0 0;}

.input-form .input-id1 { width:100px; }
.input-form .input-id2 { width:40px; }
.input-form .dash { padding: 0 10px; }
.input-form .input-num2 { width:76px; }

/* 모바일 사이즈 */
@media only all and (max-width: 767px) {	
	.user-tit .tit-cont2 { text-align: center; }
	.tb-user { display: flex; }
	.tb-user .thead { display: block; width: 30%; }
	.tb-user .tbody { display: block; width: 70%; }
	.tb-user tr { display: flex; flex-wrap: wrap; font-weight: bold; }
	.tb-user th, .tb-user td { display: flex; flex-grow: 1; align-items: center; justify-content: center; }
	.tb-user .thead th { width: 100%; }
	.tb-user .tbody td { width: 100%; }
	.tb-user .input-form { width: 100%; margin-bottom: 0; }
	.tb-user .input-form.d-flex { flex-grow: 1; }
	.tb-user .input-text { height: 30px; }
}

@media only all and (min-width: 768px) {
	.page-login { max-width: 520px; }
	.product-list .list-cell { width:25%; }
	.table-line { border: 1px solid #dbdfe6; }
	.table2 tbody { display: flex; flex-wrap:wrap; }
	.table2 tr { display: flex; width: 50%; }
	.table2 th, .table2 td { border: none; box-shadow: 0 0 0 1px #dbdfe6; }	 
	.table2 tbody th { width: 100px; flex-shrink: 0; }
	.table2 tbody td {flex-grow: 1; word-break: break-all;}  
	.table3 th, .table3 td { padding: 6px 10px; }
	.foot-btn .btn-md, .foot-btn .btn-lg { max-width: 200px; }
	.tel-type { justify-content: flex-end; }
	.tel-type .radio-black { width: auto; margin-right: 10px; }
	.ds-mobile, .none-pc { display: none; }

	.user-tit .tit-cont1 { display: none; }
	.user-tit .tit-cont2 { width: 100%; }
}

@media only all and (min-width: 960px) {
	.table2 tr { width: 25%; }
}

@media only all and (min-width: 1200px) {
	.product-list .list-cell { width:10%; }
	.table2 tbody th { width: 120px; }
}