@charset "utf-8";
.fl {float:left}
.fr {float:right}
.tl {text-align:left !important;}
.tr {text-align:right !important;}
.tc {text-align:center !important;}
.vt {position:relative; top:-2px;}
.p20 {padding:0 20px;}
.pb0 {padding-bottom:0;}
.mt20v {padding-top:20vmin;}
.mt10v {padding-top:10vmin;}
.mt5v {padding-top:5vmin;}
.mb20v {padding-bottom:20vmin;}
.mb10v {padding-bottom:10vmin;}
.mb5v {padding-bottom:5vmin;}
.red {font-size:12px; color:#e56565;}
.pink {color:#33A0FF !important;}
.grey {color:#777 !important;}
.black {color:#222 !important;}
.orange {color:#fa640f !important;}
.green {color:#33A0FF !important;}
.blue {color:#45a5f1 !important;}
.bold {font-weight:bold}
.vbar {display:inline-block; margin:0 5px; height:10px; width:1px; background:#b2b9bc;}
/* 경고문구:계약탈퇴에 사용됨*/
.warning {
	font-size:16px;
	font-weight:bold;
	color:#e02117;
}
/* 비밀번호:비밀번호 입력 */
.password-rule {display:inline-block; margin:0 0 0 8px; font-weight:bold}
@media (max-width:786px) {.password-rule {display:block; margin:8px 0px 0px;}}
/*라이브러리 아이콘*/
.fa-info-circle:before {margin-left:8px}
/*앱다운로드 아이콘*/
.googlePlay {
    display: inline-block;
    width: 169px;
    height: 50px;
    margin: 0 10px 0 0;
    font-size: 0;
    transition: all ease 0.2s 0s;
    background: url(/images/btn_googleplay.png) no-repeat center/100%;
    border-radius: 6px
}
.appStore {
    display: inline-block;
    width: 169px;
    height: 50px;
    font-size: 0;
    transition: all ease 0.2s 0s;
    background: url(/images/btn_appstore.png) no-repeat center/100%;
    border-radius: 6px
}
.appStore:hover, 
.googlePlay:hover {
    transform: scale(1.05) translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}

.gray_box {
	padding:20px;
	background:#f2f3f4;
	border-radius:10px;
}
.gray_box .txt1 {
	text-align:center;
	font-size:14px;
	line-height:24px;
	padding:0 0 45px;
	color:#474849;
}
.gray_box .txt1 strong {
	display:block;
	padding:45px 0 30px;
	font-size:22px;
	color:#33A0FF;
	font-weight:normal;
}
.gray_box .tb {
	padding-top:0 !important;
}
.gray_box .chk_bar {
	padding-bottom:0;
	border-top-color:#ededed;
}

.term_box {
    margin:8px 0 0;
}
.term_box > div.tr {
    margin-top:8px;
}

.w-50 {
	width:50%;
}
.tab_con {
	padding: 0 20px;
}
ul.tab_type1 {
	display:flex;
	height:48px;
}
ul.tab_type1 li {
	flex:1;
	width:20px;
	height:52px;
	text-align:center;
}
ul.tab_type1 li a {
	display:block;
	height:48px;
	font-size:16px;
	line-height:48px;
	border:1px solid #33A0FF;
}
ul.tab_type1 li.on a,ul.tab_type1 li.ui-state-active a {
	color:#fff;
	background:#33A0FF;
}
ul.tab_type1 li.on:after a:after,ul.tab_type1 li.ui-state-active a:after {
	content:"";
	display:block;
	position:absolute;
	left:-2px;
	top:-2px;
	width:2px;
	height:48px;
	background:#474849;
}
ul.tab_type1:after {
	content:"";
	display:block;
	clear: both;
}

.both {}
.both:after {content:""; display:block; clear:both}
.both > *:first-child {float:left}
.both > *:last-child {float:right}
.both .txt {
	position:relative;
	display:block;
	width:100%;
	max-height:40px;
	text-align:right;
}
.both .btn {margin:0 0 0 4px;}
.both .btn.fr {margin-left:8px}
.both .btn.fl {margin-right:8px}
.both + table {margin:8px auto 24px;}

.both.date>div:first-child {
	font-size:0;
}
.both.date>div:first-child label {
	margin:0 0 0 -1px;
	padding:0 !important;
	width:69px;
	height:29px;
	border:1px solid #ececec;
	background:#f2f3f4;
	text-align:center;
	line-height:29px;
	font-size:13px;
}
.both.date>div:first-child label:last-of-type {
	margin-right:10px;
}
.both.date>div:first-child input:checked+label {
	background:#ececec;
}
.both label {
	padding-left:20px !important;
	margin-right: 20px;
}

@media (max-width:786px) {    
    .both .txt {
        max-height:80px;
    }
}

.btns {padding:32px 0 0 0;}
.btns.p0 {padding:0 0 15px;}
.btns:after {content:""; display:block; clear:both;}
.btns.center li {text-align:center;}
.btns.center li a {margin:0 22px;}
.btns.center li span a {margin:0 10px;}
.btns.left a {margin-right:44px;} 
.btns.right li {float:right;}
.btns.right a {margin-left:44px;} 
.btns.both li {float:right;}
.btns.both li a {margin:0 0 0 44px;}
.btns.both li:first-child {float:left;}
.btns.both li:first-child a {margin:0 44px 0 0;}
.btns .btn {min-width:150px}

.btnInfo {padding:32px 0 0 0;}
.btnInfo.p0 {padding:0 0 15px;}
.btnInfo:after {content:""; display:block; clear:both;}
.btnInfo.center li {text-align:center;}
.btnInfo.center li a {margin:0 22px;}
.btnInfo.center li span a {margin:0 10px;}
.btnInfo.left a {margin-right:44px;} 
.btnInfo.right li {float:right;}
.btnInfo.right a {margin-left:44px;} 
.btnInfo.both li {float:right;}
.btnInfo.both li a {margin:0 0 0 44px;}
.btnInfo.both li:first-child {float:left;}
.btnInfo.both li:first-child a {margin:0 44px 0 0;}

.btnsUT {padding:24px 0 ;}
.btnsUT.p0 {padding:0 0 15px;}
.btnsUT:after {content:""; display:block; clear:both;}
.btnsUT.center li {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.btnsUT.center li a {
    flex: 1;
    max-width: 130px;
    margin:0;
}
.btnsUT.left a {margin-right:44px;} 
.btnsUT.right li {float:right;}
.btnsUT.right a {margin-left:44px;} 
.btnsUT.both li {float:right;}
.btnsUT.both li a {margin:0 0 0 44px;}
.btnsUT.both li:first-child {float:left;}
.btnsUT.both li:first-child a {margin:0 44px 0 0;}

@media (max-width:786px){
    .btnsUT.center li {
        display:flex;
        flex-wrap:wrap;
        flex-grow:1;
        justify-content:space-between;
    }
    .btnsUT.center li a {
        width:auto !important;
        margin:0 0 8px;
    }
}

.btnjqwidget {
	display:inline-block;
	position:relative;
	top:2px;
	padding:0 14px;
	margin:0 4.5px;
	text-align:center;
	border-radius:10px;
	box-sizing:border-box;
}
.btnjqwidget.h30 {
	height:30px;
	line-height:30px;
}
.btnjqwidget.m {
	min-width:100px;
	text-align:center;
	font-size:13px;
}
.btnjqwidget.type1 {
	background:#efefef;
	color:#474849;
	border:1px solid #CCCCCC;
}
.btnjqwidget.type1:active {
	background:#e3e1e2;
}


.btn {
	display:inline-block;
	position:relative;
	height:40px;
	padding:0 14px;
	margin:0 8px 0 0;
	text-align:center;
	line-height:40px;
	border-radius:10px;
	box-sizing:border-box;
	vertical-align:middle;
    transition:0.1s;
}
.btn-close {
    padding:8px;
    position:absolute;
    top:12px;
    display:block;
    right:20px;
    color:#979899;
    font-weight:bold;
}

.btnBreakoutGroup {
	display:inline-block;
    background:#33A0FF;
    color:#ffffff;
    border:1px solid #33A0FF;
	padding:0 14px;
	margin:0 8px 0 0;
	text-align:center;
	line-height:30px;
	border-radius:40px;
	box-sizing:border-box;
	vertical-align:middle;

}

/*
.btn.h20 {height:24px; line-height:22px;}
.btn.h30 {height:33px; line-height:31px;}
.btn.h37 {height:37px; line-height:35px;}
.btn.h40 {height:40px; line-height:38px;}
.btn.h50 {height:50px; line-height:48px;}
.btn.m {min-width:100px; text-align:center;}
.btn.m2 {min-width:70px; text-align:center;}
*/
.btn.type1 {background:#33A0FF; color:#ffffff; border:1px solid #33A0FF;}
.btn.type2 {background:#ffffff; color:#33A0FF; border:1px solid #33A0FF;}
.btn.type3 {background:#f2f3f4; color:#444444; border:1px solid #e0e0e0}
.btn.type4 {background:#e56565; color:#ffffff;}
.btn.type5 {background:#f2f3f4; color:#474849; border:1px solid #e3e1e2;}
.btn.type6 {background:#33A0FF; color:#fff; }

.btn.type1:hover {background:#0073ff; color:#fff;}
.btn.type1:active {background:#0073ff; color:#fff;}
.btn.type2:hover {background:#33A0FF; color:#fff;}
.btn.type2:active {background:#0073ff; color:#fff;}
.btn.type3:hover {background:#E9E9E9;}
.btn.type3:active {background:#E0E0E0;}
.btn.type4:hover {background:#33A0FF; color:#fff;}
.btn.type4:active {background:#0073ff; color:#fff;}
.btn.type5:hover {background:#0073ff; color:#fff;}
.btn.type5:active {background:#0073ff; color:#fff;}

input + .btn {margin:0 !important;}

.btn.h100 {height:40px; width:100px;line-height:40px;}
.btn.h150 {height:40px; width:150px;line-height:40px;}
.btn.h200 {height:40px; width:200px;line-height:40px;}

.btn.ico1:before {content:url(/images/ico_btn1.png); position:relative; top:3px; margin:0 5px 0 0;}
.btn.ico2:before {content:url(/images/ico_btn2.png); position:relative; top:4px; margin:0 5px 0 0;}
.btn.ico3:after {content:url(/images/ico_btn3.png); position:relative; top:1px; margin:0 0 0 5px;}
.btn.ico4:before {content:url(/images/ico_btn4.png); position:relative; top:2px; margin:0 5px 0 0;}
.btn.ico5:after {content:url(/images/ico_btn5.png); position:relative; top:1px; margin:0 0 0 5px;}

input[type="radio"] {
	position:absolute;
	left:0%;
	width:0px;
	height:0px;
	border:0px
}
input[type="radio"]+label {
	display:inline-block;
	height:16px;
	padding:0 0 0 22px;
	text-align:left;
	line-height:15px;
	background:url(/images/bg_radio_off.png) no-repeat left top;
	color:#474849;
}
input[type="radio"]:checked+label {
	background:url(/images/bg_radio_on.png) no-repeat left top;
}
input[type="radio"].checkbox+label {
	display:inline-block;
	height:16px;
	padding:0 0 0 22px;
	text-align:left;
	line-height:15px;
	background:url(/images/ico_checkbox_off.png) no-repeat left top;
	color:#474849;
}
input[type="radio"].checkbox:checked+label {
	background:url(/images/ico_checkbox_on.png) no-repeat left top;
}
input[type="checkbox"] {
	position:absolute;
	left:0%;
	width:0px;
	height:0px;
	border:0px
}
input[type="checkbox"]+label {
	display:inline-block;
	height:16px;
	padding:0 0 0 22px;
	text-align:left;
	line-height:14px;
	background:url(/images/ico_checkbox_off.png)no-repeat left top;
}
input[type="checkbox"]:checked+label {
	background:url(/images/ico_checkbox_on.png)no-repeat left top;
}

input[type="radio"]+label + input[type="radio"]+label,
input[type="checkbox"]+label + input[type="checkbox"]+label {
    margin-left:12px;
}

input.cal::-ms-clear {display:none;}

.ui-datepicker {
	display:none;
	border:1px solid #e3e1e2;
	padding:5px;
	z-index:990 !important;
	background:#fff;
}
.ui-datepicker-header {
	position:relative;
	margin:0 auto;
	padding:5px 25px 10px;
	width:280px;
	box-sizing:border-box;
	text-align:center;
	background:#fff;
/*	color:#33A0FF;*/
	font-weight:bold;
}
.ui-datepicker-header .ui-datepicker-next {
	display:block;
	overflow:hidden;
	position:absolute;
	right:5px;
	top:3px;
	top:13px;
	width:19px;
	height:19px;
	text-align:center;
	line-height:19px;
	text-indent:-100px;
}
.ui-datepicker-header .ui-datepicker-next:after {
	position:absolute;
	content:">>";
	content:"";
	width:19px;
	height:19px;
	left:0;
	text-indent:0;
	color:#33A0FF;
    background: url(/images/btn_next.png) no-repeat center/24px;
}
.ui-datepicker-header .ui-datepicker-prev {
	display:block;
	overflow:hidden;
	position:absolute;
	left:5px;
	top:3px;
	top:13px;
	width:19px;
	height:19px;
	text-align:center;
	line-height:19px;
	text-indent:-100px;
}
.ui-datepicker-header .ui-datepicker-prev:after {
	position:absolute;
	content:"<<";
	content:"";
	width:19px;
	height:19px;
	right:0;
	text-indent:0;
	color:#33A0FF;
    background: url(/images/btn_prev.png) no-repeat center/24px;
}
.ui-datepicker-year {
    display: block;
    color: #33A0FF;
}
.ui-datepicker-month {
    font-size: 18px;
    font-weight: 700;
}
.ui-datepicker-calendar thead th {
	padding:2px;
	background:#33A0FF;
	color:#FFFFFF;
	text-align:center;
	font-size:12px;
	font-weight:normal;
	height:25px;
}
.ui-datepicker-calendar thead th span {
	color:#FFFFFF;
}
.ui-datepicker-calendar thead th:first-child {
	background:#33A0FF;
	border:none;
}
.ui-datepicker-calendar tbody td {
	width:40px;
	padding:2px;
	border:1px solid #ddd;
	text-align:center;
	font-size:13px;
	background:#fff;
	height:30px;
	box-sizing:border-box
}
.ui-datepicker-calendar tbody td a {
	display:block;
}
.ui-datepicker-calendar tbody td:first-child a {
	color:#e91e63;
}
.ui-datepicker-calendar tbody td:last-child a {
	color:#5397c6;
}
.ui-datepicker-calendar tbody td a.ui-state-active {
	background:#33A0FF;
	color:#fff;
	height:30px;
	line-height: 30px;
}
.cal.hasDatepicker {
    width: 120px;
    text-align: left;
}
.ui-datepicker-trigger {
	display:inline-block;
	width:40px;
	height:40px;
	margin:0 0 0 -8px;
	vertical-align:top;
}
@media (max-width:786px) {
    #frm > * {
        margin:0;
    }
    .search-bar input#kwd.m100 {
        width:100% !important;
    }
    .search-bar + .date-picker > * {
        margin:0;
    }
    .search-bar + .date-picker .btn {
        width:auto;
        float:right;
    }
    .hasDatepicker {
        width:calc((100% - 33px - 33px - 60px - 14px)/2) !important; 
    }
    #kwd {
        width:100% !important;
        margin:0 0 8px 0;
    }
}

.ui-dialog {
	position:absolute !important;
	z-index:101;
	z-index:50000;
}
.ui-dialog.type1 {
	padding:40px;
	background:#fff;
	border-radius:6px;
	box-shadow:0 0 30px #d4d4d4;
}
.ui-dialog.type1 .ui-dialog-titlebar {
	position:relative;
	margin:0 0 30px;
}
.ui-dialog.type1 .ui-dialog-titlebar:after {
	content:"";
	display:block;
	position:absolute;
	left:0;
	top:50%;
	z-index:-1;
	margin-top:-0.5px;
	width:100%;
	height:1px;
	background:#c0c0c0;
}
.ui-dialog.type1 .ui-dialog-titlebar>span {
	display:inline-block;
	padding:0 20px 0 25px;
	background:url(/images/bu_check.png) no-repeat left #fff;
	font-size:16px;
	color:#474849;
	font-weight:normal;
}
.ui-dialog.type1 .ui-dialog-titlebar .ui-dialog-titlebar-close {
	position:absolute;
	right:-25px;
	top:-25px;
}
.ui-dialog.type1 .ui-dialog-titlebar .ui-dialog-titlebar-close .ui-button-text {
	display:block;
	overflow:hidden;
	width:15px;
	height:15px;
	background:url(/images/btn_close.png) no-repeat #fff;
	color:transparent;
	cursor:pointer;
}
.ui-widget-overlay {
	position:fixed;
	left:0;
	top:0;
	z-index:100;
	width:100%;
	height:100%;
	background: rgba(0,0,0,0.5);
}

.alert {padding:20px 0 0; font-size:14px; color:#474849; text-align:center; line-height:30px;}
.ui-dialog .content {padding:0;}

.flex {display:flex;}
.flex > * {flex:1;}

header {
    background:#F8F8F8;
}
header.basic > div {
	margin:0 auto;
	width:1200px;
	height:40px;
}
header.basic > div h1 {
	float:left;
	padding:53px 0 0;
}
@media (max-width:786px) {
	header.basic > div {
		width:100%;
	}
}
header.basic nav {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    align-content:center;
    height:40px;
}
header.basic nav li a:hover {
	color:#FFFFFF;
}
header.basic nav li:last-child {
	padding-right:0;
}
header.basic nav span {
	float:left;
	height:30px;
	font-size:14px;
	line-height:30px;
	padding-right:16px;
}
header.basic nav span .btn {
	margin:0;
}
header.basic nav select {
	width:100px !important;
    height:30px;
}
header.basic span a {
	color:#727272
}
header.basic span:nth-child(4) a {
	color:#fb6c6c
}
header.basic span a:hover {
	text-decoration:underline
}
hmenu.menu > div {
	width:1200px;
    margin:0 auto;
	height:80px;
	box-sizing:border-box;
}
hmenu.menu nav {
	float:right;
}
hmenu.menu nav li {
	float:left;
}
hmenu.menu nav li a {
	display:block;
	padding:0 20px;
	line-height:80px;
	font-size:15px;
    font-weight:700;
	color:#33A0FF;
    transition:0.3s;
}
hmenu.menu nav li a:hover {
	font-size:15px;
	color:#0073ff;
}
hmenu.menu nav li:last-child {
	padding-right:0;
}
header.basic nav div.menu-btn {
	display:none;
}

@media (max-width:786px) {    
    header.basic {
        position:fixed;
        top:0;
        left:0;
        width:100%;
        height:56px;
        border-bottom:1px solid #e3e1e2;
        background:white;
        z-index:900;
    }    
    header.basic > div {
        height:56px;
    }
    header.basic > div h1 {
        position:absolute;
        top:0px;
        left:50%;
        transform:translateX(-50%);
        padding:13px 0 0;
        z-index:900;
    }        
    header.basic > div h1 img {
        width:140px;
    }
    /*===================*/  
    header.basic nav {
        position:absolute;
        top:0px;
        left:0px;
        width:56px;
        height:56px;
        padding:0;
        background:transparent;
        z-index:900;
    }
    header.basic nav div.menu-btn {
        display:block;
        position:absolute;
        top:0px;
        left:0px;
        width:56px;
        height:56px;
        padding:0;
        background:transparent url(/images/icon_userInfo.svg) no-repeat center/28px;
        border:none;
        z-index:901;
    }
    header.basic nav div {
        display:none;
        position:absolute;
        top:56px;
        left:0;
        width:100vw;
        height:calc(100vh - 57px);
        background:white;
        border-top:1px solid #e3e1e2;
    }
    header.basic nav div span {
        display:block;
        width:100vw;
        height:48px;
        padding:5px 20px;
        box-sizing:border-box;
        border-bottom:1px solid #e3e1e2;
    }
    header.basic nav div span:first-child {
        text-align:center;
        font-size:16px;
        font-weight:bold;
        background:#f7f8f9;
    }
    header.basic nav div span:first-child img {display:none}
    header.basic nav div span:hover {
        background:#f7f8f9;
    }
    header.basic nav div span .btn {
        display:block !important;
        text-align:left;
        color:#333;
        border:none;
    }
    header.basic nav div span:hover .btn {
        background:#f7f8f9;
    }
    header.basic nav div span .btn:hover {
        background:#f7f8f9;
        color:#333;
    }
    header.basic nav div select {
        float:right;
        margin:8px 20px;
    }
    /*===================*/
    hmenu.menu {
        position:fixed;
        top:0px;
        right:0px;
        width:56px;
        height:56px;
        z-index:900;
    }
    hmenu.menu > div {
        position:relative;
        background:transparent url(/images/icon_menu.svg) no-repeat center/28px;
        width:100%;
        height:100%;
    }
    hmenu.menu nav ul {
        display:none;
        position:absolute;
        top:56px;
        right:0;
        width:80vw;
        height:100vh;
        background:white;
        border-top:1px solid #e3e1e2;
        box-shadow:-2px 2px 2px rgba(0, 0, 0, 0.2);
    }
    hmenu.menu nav ul::after {
        position:fixed;
        top:56px;
        left:0;
        width:20vw;
        height:calc(100vh - 56px);
        content:"";
        background:#000;
        opacity:0.2;
    }
    hmenu.menu nav ul li {
        display:block;
        float:none;
    }
    hmenu.menu nav ul li:hover {
        background:#f7f8f9;
    }
    hmenu.menu nav li a {
        display:block;
        padding:0 20px;
        color:#333;
    }
    hmenu.menu nav li a:hover {color:#333; font-weight:bold;}
}

/* Footer */
footer {
	position:fixed;
	display:block;
	bottom:0;
	width:100%;
	padding:30px 0;
	font-size:14px;
	text-align:left;
	line-height:24px;
	background:rgba(255,255,255,0.1);
	backdrop-filter:blur(5px);
}
#homeIndex footer {
	position:relative;
}
footer * {
	color:#dddddd;
}
footer .container {
	display:flex;
	align-items:center;
	justify-content:center;
	gap:16px;
	width:100%;
	max-width:1200px;
	margin:0 auto;
	padding:8px 0 0;
	box-sizing:border-box;
}
footer>div>div {
	flex-grow:1;
}
footer span {
	display:inline-block;
	line-height:1;
	padding-right:16px;
	border-right:1px solid #ccc;
}
footer span:last-child {
	display:inline-block;
	line-height:1;
	padding-right:0px;
	margin-right:0px;
	border-right:none;
}
footer span strong {
	font-weight:700;
}
footer img {
	-webkit-filter:grayscale(100%);
	filter:grayscale(100%);
	margin-right:10%;
}
@media (max-width:786px) {    
    footer .container {
        width:100vw;
        flex-direction:column;
    }
    footer > div > div {
        padding-bottom:32px;
    }
    footer span {
        font-size:12px;
    }
}

#snb {float:left; padding:20px; width:77px; border-radius:8px; background:#f2f3f4;}
#snb li {border-top:1px solid #e6e6e6;}
#snb li:first-child {border:none;}
#snb a {display:block; padding:73px 0 0; height:105px; box-sizing:border-box; text-align:center; font-size:13px; background:url(/images/bg_snb.png) no-repeat;}
#snb .ico1 a {background-position:0px 0px;}
#snb .ico2 a {background-position:0px -100px;}
#snb .ico3 a {background-position:0px -200px;}
#snb .ico4 a {background-position:0px -300px;}
#snb .ico5 a {background-position:0px -401px;}
#snb .ico1 a:hover,
#snb .ico1.on a {background-position:right 0px;}
#snb .ico2 a:hover,
#snb .ico2.on a {background-position:right -100px;}
#snb .ico3 a:hover,
#snb .ico3.on a {background-position:right -200px;}
#snb .ico4 a:hover,
#snb .ico4.on a {background-position:right -300px;}
#snb .ico5 a:hover,
#snb .ico5.on a {background-position:right -401px;}
#snb.type2 {padding:0; width:115px; border-radius:0; background:none;}
#snb.type2 li {border:none; padding:0 0 15px;}
#snb.type2 li a {padding:0; height:35px; background:#bcbcbc; line-height:35px; border-radius:5px; color:#fff;}
#snb.type2 li a:hover,
#snb.type2 li a.on {background:#33A0FF;}

/* main======================================================================== */
main {
	position:relative;
	display:block;
	width:1200px;
    min-height:calc(100vh - 462px);
	margin:60px auto 0;
	padding:0 0 40px;
}
.content {}
.content > section {background:#FFFFFF}
.content > section .top {
	position:relative;
	display:inline-block;
	float:left;
}
.content > section .top h3,
.content > section .top h4 {
	display:inline-block;
	line-height:1;
    color:#33A0FF;
}
.content > section .top p {padding:7px 0 20px; font-size:14px;}
.content > section .top.img {position:relative; padding:0 0 20px 100px; height:80px;}
.content > section .top.img > img {position:absolute; left:0; top:0; width:80px; height:80px;}
.content > section .top.img h3 {padding:0 0 8px; font-size:24px; color:#474849;}
.content > section .top.img p {font-size:18px; line-height:22px;}
.content > section .top .ico4 {position:absolute; right:0; top:0;}
.content > section .join_theme {padding:0;}
.content > section .join_theme .red {padding:8px 0 0 0;}

.content > jsection {float:left; padding-left:150px; width:860px;}
.content > jsection .top {position:relative; margin:0 0 0px; padding-top:40px; color:#7b7b7b;}
.content > jsection .top h3 {font-size:25px; font-weight:normal;}
.content > jsection .top p {padding:7px 0 20px; font-size:14px;}
.content > jsection .top.img {position:relative; padding:0 0 20px 100px; height:80px;}
.content > jsection .top.img > img {position:absolute; left:0; top:0; width:80px; height:80px;}
.content > jsection .top.img h3 {padding:0 0 8px; font-size:24px; color:#474849;}
.content > jsection .top.img p {font-size:18px; line-height:22px;}
.content > jsection .top .ico4 {position:absolute; right:0; top:0;}
.content > jsection .join_theme {padding:0;}
.content > jsection .join_theme .red {padding:8px 0 0 0;}

form + .top {margin-top:20px}

@media (max-width:786px) { 
    main {
        position:relative;
        display:block;
        width:100%;
	    margin:88px auto 0;
        padding:0 0 40px;
    }
    .content {
        padding:0px 16px;
    }
    .content section {
        width:100% !important;
        float:none !important;
    }
    .content > section .top h3 {
        display:block;
        margin-right:0;
        margin-bottom:16px;
        padding-left:0px;
    }
}


.maindoc {
	width:800px;
}
.h2 {
	padding:0 0 7px;
	border-bottom:2px solid #c6c6c6;
	font-size:19px;
	font-weight:normal;
}
.h2_2 {
	display:table;
	width:100%;
	box-sizing:border-box;
	margin:0 0 40px;
	padding:33px 20px;
	background:#33A0FF;
	border-radius:5px;
	color:#fff;
}
.h2_2>* {
	display:table-cell;
	vertical-align:middle;
	padding:0 20px;
}
.h2_2 h2 {
	font-size:22px;
	line-height:30px;
	width:auto;
	text-align:center;
}
.h2_2 p {
	line-height:21px;
	border-left:1px solid #fff;
	vertical-align:middle;
}
.h2_3 {
	position:relative;
	margin:0 0 30px;
}
.h2_3:after {
	content:"";
	display:block;
	position:absolute;
	left:0;
	top:50%;
	z-index:-1;
	margin-top:-0.5px;
	width:100%;
	height:1px;
	background:#c0c0c0;
}
.h2_3 span {
	display:inline-block;
	padding:0 20px 0 25px;
	background:url(/images/bu_check.png) no-repeat left #fff;
	font-size:16px;
	color:#474849;
	font-weight:normal;
}
.h3 {
	padding:0 0 20px;
	font-size:17px;
	color:#474849;
	font-weight:normal;
}
.form_box_type1 {
	padding:50px 0 0 0;
}
.form_box_type1>h3 {
	padding:50px 0 10px;
	font-size:16px;
	font-weight:normal;
}
.form_box_type1>h3:first-of-type {
	padding-top:0;
}
.form_box_type1>p {
	padding:0 0 15px;
	font-size:13px;
}
.form_box_type1>ul li {
	padding:8px 0 0;
}
.form_box_type1>ul li .red {
	padding:12px 0 0 0;
}
.form_box_type1>ul li:first-child {
	padding:0;
}
.info_txt {
	padding:30px 50px;
	margin:100px 0 0;
	border-radius:10px;
	background:#f2f3f4;
}
.info_txt h3 {
	padding:0 0 18px;
	font-size:16px;
	font-weight:normal;
}
.info_txt li {
	padding:10px 0 0 0;
}
.info_txt li:first-child {
	padding:0;
}
.info_txt li .tip {
	padding:0 0 0 10px;
	font-size:12px;
	color:#aaa;
}
.info_txt li p.red {
	padding: 12px 0 0 0;
}

#faq {
    margin:8px auto 24px;
}
.faq_list {
	margin:0;
}
.faq_list h2 {
	position:relative;
	margin-top:15px;
	cursor:pointer;
}
.faq_list h2:first-child {
	margin:0;
}
.faq_list h2 a {
	display:block;
	padding:0 0 0 40px;
	height:47px;
	line-height:47px;
	border:1px solid #e5e5e5;
	background:#f2f3f4;
	font-size:14px;
	color:#474849;
	font-weight:normal;
}
.faq_list h2 .ui-icon {
	position:absolute;
	right:40px;
	top:11px;
	width:26px;
	height:25px;
	background:url(/images/ico_open.png) no-repeat;
}
.faq_list h2.ui-state-active .ui-icon {
	background:url(/images/ico_close.png) no-repeat;
}
.faq_list div {
	padding:25px 40px;
	border-right:1px solid #e3e1e2;
	border-left:1px solid #e3e1e2;
	border-top:none;
	margin-top:-3px;
	line-height:1.6em;
}
.faq_list:last-child div {
	border-bottom:1px solid #e3e1e2
}
@media (max-width:786px){
    
    .faq_list h2 a {
        padding:0 0 0 20px;
    }
    .faq_list div {
	    padding:20px 16px;
    }
}

.btn_box1 h2 {padding:0 0 12px; font-size:22px; color:#474849;}
.btn_box1 p {}
.btn_box1 a {position:absolute; right:47px; top:33px; width:191px; height:74px; line-height:74px; background:#33A0FF; font-size:22px; color:#fff; text-align:center; border-radius:5px;}
.btn_box1 a:after {content:url(/images/bu_arrow.png); padding:0 0 0 px;}

.qna_box {padding:0 20px;}
.qna_box textarea {height:310px; width:800px;}
.qna_box input[type="text"] {width:800px;}
.qna_box > div {padding:20px 0;}
.qna_box > div dt,
.qna_box > div dd {float:left;}
.qna_box > div dt {padding:0 15px 0 32px;  color:#6b6b6b; line-height:30px;}
.qna_box > div dd {width:340px;}

.join_box {padding:60px 0 0 0;}
.join_box > h2 {padding:0 0 35px; font-size:34px; color:#474849; font-weight:normal;}
.join_box > p {padding:0 0 20px; }
.join_box .agree_box {overflow:auto; height:210px; border:1px solid #e3e1e2;}
.join_box .agree_box + .btns {padding:10px 0 60px ;}
.join_box + .btns {padding-top:15px;}

.join_box_form {padding:60px 0 0 0;}
.join_box_form h2 {padding:0 0 50px; font-size:36px; color:#474849;}
.join_box_form .sel1 {padding:0 0 0 20px; }
.join_box_form .sel1 li {padding:10px 0 0 0;}
.join_box_form .sel1 li:first-child {padding:0;}
.join_box_form .tb {padding:45px 0 25px 20px;}
.join_box_form .tb th {padding:14px 0 0; width:120px; font-weight:normal;text-align:left; vertical-align:top;}
.join_box_form .tb td {padding:5px 0; height:30px;}
.join_box_form .tb th span{color:#474849;}
.join_box_form .tb p.red {padding:9px 0 0 0;}
.join_box_form .tb td .txt{color:#b4b4b4;}

.chk_bar {padding:20px 0 65px; border-top:1px solid #ededed;}
.agree_box2 {overflow:auto; padding:40px; height:880px; border:1px solid #e3e1e2; border-radius:13px;}

.join_theme {padding:60px 0 0 0;}
.join_theme h2 {padding:0 0 50px; font-size:36px; color:#474849;}
.join_theme h3 {padding:48px 0 12px; font-size:18px; color:#474849; font-weight:normal;}
.join_theme h3 span {color:#474849;}
.join_theme .p20 {padding:20px;}
.join_theme .top {padding:0 0 35px; border-bottom:1px solid #e9e9e9;}
.join_theme .top h3 {padding:0 0 18px;}
.join_theme .top li {line-height:20px; color:#474849;}
.join_theme .top li a {color:#33A0FF; text-decoration:underline;}
.join_theme .no2 > div:first-child {padding:0 30px 0 0;}
.join_theme .no1 > * {display:inline-block;}

.flex.img_box > div div {position:relative; padding:0 0 0 123px; height:105px;}
.flex.img_box > div div span {position:absolute; left:0; top:0; width:100px; height:100px; border:1px solid #e3e1e2; border-radius:4px; background:url(/images/ico_pic.png) no-repeat center;}
.flex.img_box > div div ul {padding:14px 0 14px;}
.flex.img_box > div div ul li {padding:0 0 9px; font-size:11px; color:#474849;}
.flex.img_box > div p {clear:both; padding:15px 0 0 8px; text-indent:-8px;}
.flex.img_box.view > div h3 {padding:0 0 18px;  color:#474849; font-weight:normal;}
.flex.img_box.view > div div {padding:0;}
.flex.img_box.view > div div span {width:150px; height:102px; background:#f2f3f4; border:none;}

.form_box_type2 h3 {padding:48px 0 12px; font-size:18px; color:#474849; font-weight:normal;}
.form_box_type2 h3:first-child {padding-top:0;}
.pay_list .sel {font-size:0;}
.pay_list .sel a {font-size:13px;}
.pay_list .sel a:first-child {margin-left:0;}
.pay_list > div {padding:0 0 20px;}
.pay_list > div span {padding:0 0 0 10px; font-size:19px; color:#4c4c4c; vertical-align:middle;}
.list1 {}
.list1 li {padding:9px 0 0 0;}
.list1 li:first-child {padding:0;}
.list1 li strong {color:#33A0FF; font-weight:normal;}
.list2 {font-size:14px; color:#474849;}
.list2 li {padding:20px 0 0 0;}
.list2 li:first-child {padding:0;}

.txt_time {padding:50px 0 0 0; font-size:14px; color:#a5a5a5; text-align:center;}

.pay_box:after {content:""; display:block; clear:both;}
.pay_box .left {float:left; width:400px;}
.pay_box .left .top {padding:0 0 17px; border-bottom:1px solid #f2f2f2;}
.pay_box .left .top {content:""; display:block; clear:both;}
.pay_box .left h3 {float:left;  color:#474849; font-weight:normal;}
.pay_box .left ul {float:left;}
.pay_box .left ul li {float:left;}
.pay_box .left ul li label {margin:0 0 0 20px;}
.pay_box .right {float:right; padding:10px; width:292px; border:1px solid #f3f3f3; border-radius:5px; box-sizing:border-box;}
.pay_box .right dl {margin:20px; padding:0 10px 25px; border-bottom:1px solid #e56565;}
.pay_box .right dt,
.pay_box .right dd {float:left; width:50%; font-size:16px; color:#474849; line-height:28px;}
.pay_box .right dt {font-weight:bold;}
.pay_box .right dd {text-align:right;}
.pay_box .right .result {padding:0 24px 55px; text-align:right; font-size:20px; color:#474849;}
.pay_box .right .result h3 {padding:0 0 13px; font-weight:normal; line-height:100%;}
.pay_box .right .result div strong {font-size:32px; color:#e56565;}
.pay_box .right p {}
.pay_box .right .info {padding:5px 0 15px;}
.pay_box .right a.type1 {display:block; margin:0 0 4px; height:64px; line-height:64px; text-align:center; font-size:28px; color:#fff; background:#33A0FF; border-radius:4px;}
.pay_box .right a.type2 {display:block; height:36px; line-height:36px; text-align:center;  color:#fff; background:#b2b2b2; border-radius:4px;}
.pay_box .right + * {clear:both; padding-top:8px;}

.form_box h3 {padding:0 0 20px;  color:#474849; font-weight:normal;}
.form_box .row {padding:0 0 15px;}
.form_box .row h3 {display:inline-block; padding:0 25px 0 0;}
.form_box .row > div {display:inline-block;}


table.view {
	border-top:2px solid #33A0FF;
	text-align:left;
}
table.view tr {border-bottom:1px solid #e3e1e2}
table.view th {
	padding:9px 0;
	
	color:#474849;
	height:32px;
}
table.view td {
	height:52px;
}
table.view th {
	text-align:left;
	font-weight:normal;
}
table.view td .textarea_view {
	margin:0 0 25px;
	height:160px;
	padding:15px;
	overflow:auto;
	background:#f2f3f4;
	border-radius:7px;
	box-sizing:border-box;
	line-height:18px;
}

table.list {
	border-top:2px solid #33A0FF;
	text-align:center;
}
table.list tr {border-bottom:1px solid #e3e1e2}
table.list th {
	height:48px;
	background:#f2f3f4;
	
	color:#474849;
	font-weight:normal;
	border-top:2px solid #33A0FF;
	border-bottom:1px solid #e3e1e2;
}
table.list td {
	height:48px;
}
table.list th.subject {
	text-align:left;
	padding-left:10px;
}
table.list td.subject {
	text-align:left;
	padding-left:10px;
}
table.list td.subject a {
	color:#333333;
}
table.list tbody tr:hover {box-shadow:1px 1px 5px 5px #eee;}

table.list.session-list tr .btn {
    position:relative;
    font-size:0;
    margin-right:0;
    border:none;
    background-color:none;
    height:33px;
}
table.list.session-list tr .btn_join {background:url(/images/sessionList_join.png) no-repeat center/20px;}
table.list.session-list tr .btn_join_web {background:url(/images/sessionList_web.png) no-repeat center/20px;}
table.list.session-list tr .btn_modify {background:url(/images/sessionList_modify.png) no-repeat center/20px;}
table.list.session-list tr .btn_delete {background:url(/images/sessionList_delete.png) no-repeat center/20px;}

table.list.session-list tr .btn:hover{background-color:#f2f3f4;}
table.list.session-list tr .btn b {
    position:absolute;
    display:none;
    top:0%;
    left:50%;
    width:auto;
    padding:10px 8px;
    font-size:12px;
    line-height:1;
    white-space:nowrap;
    word-wrap:normal;
    word-break:keep-all;
    word-spacing:-1;
    color:#FFF;
    background:#333;
    border-radius:4px;
    transform:translateX(-50%) translateY(-100%);
    z-index:999;
}
table.list.session-list tr .btn:hover b{display:block;}
table.list.session-list tr:hover td {background:#FFFFFF}

/**/
table.list.session-list tbody td:nth-child(1){width:100px}
table.list.session-list tbody td:nth-child(2){width:calc(100% - 400px)}
table.list.session-list tbody td:nth-child(3){width:140px}
table.list.session-list tbody td:nth-child(4){width:40px}
table.list.session-list tbody td:nth-child(5){width:40px}
table.list.session-list tbody td:nth-child(6){width:40px}
table.list.session-list tbody td:nth-child(7){width:40px}
@media (max-width:786px){
    table.list.session-list tbody tr {
        position:sticky;
        position:relative;
        height:70px;
    }
    table.list.session-list tbody td {
        position:absolute;
        text-align:left;
        box-sizing:border-box;
        height:40px;
        padding:12px 8px 4px;
    }
    table.list.session-list tbody td:nth-child(1){
        top:40px;
        left:0;
        width:20%;
        height:30px;
        padding-top:0px;
        font-size:0.9em;
        color:#999;
    }
    table.list.session-list tbody td:nth-child(3){
        top:40px;
        left:20%;
        width:calc(80%);
        height:30px;
        padding-top:0px;
        font-size:0.9em;
        color:#999;
    }
    table.list.session-list tbody td:nth-child(2){
        top:0;
        left:0;
        width:100%;
        font-weight:bold;
    }
    table.list.session-list tbody td:nth-child(4){
        top:0;
        right:0px;
    }
    table.list.session-list tbody td:nth-child(5){
        top:0;
        right:40px;
    }
    table.list.session-list tbody td:nth-child(6){
        top:0;
        right:80px;
    }
    table.list.session-list tbody td:nth-child(7){
        top:0;
        right:120px;
    }
    table.list.session-list tbody td:nth-child(8){
        top:0;
        right:160px;
    }
    table.list.session-list tr .btn {
        width:24px;
        height:24px;
        padding:0;
    }
    
    table.list.session-list thead {display:none}
    
    table.list #kwdr{
        width:calc(100% - 26px - 18px) !important;
        margin:0 0 0 8px;
    }
}

table.listuser {
	border-top:2px solid #33A0FF;
	text-align:left;
}
table.listuser tr {border-bottom:1px solid #e3e1e2}
table.listuser th {
	height:48px;
	background:#f2f3f4;
	
	color:#474849;
	font-weight:normal;
	border-top:2px solid #33A0FF;
	border-bottom:1px solid #e3e1e2;
}
table.listuser td {
	height:48px;
	padding:0 0 0 20px;
}
table.listuser th.subject {
	text-align:center;
	padding-left:10px;
}
table.listuser td.subject {
	text-align:left;
}
table.listuser td.subject a {
	color:#333333;
}
/*table.listuser tr:hover td {background:#ffffcc;}*/
@media (max-width:786px){    
    table.listuser td {
        display:block;
        height:auto;
        padding:4px 8px 8px;
    }    
    table.listuser td input,
    table.listuser td select {
        width:100% !important;
        margin:0;
    }
    table.listuser th.subject,
    table.listuser td.subject {
        padding:8px 8px 4px;
        text-align:left;
    }
    /*계약정보*/
    #planAliasName:read-only {
        width:100% !important;
    }
    #planAliasName {
        width:calc(100% - 158px) !important;
        margin:0 4px 0 0;
    }
    #planAliasName + .btn {width:120px}
}

/**/
table.listjoin {
	text-align:left;
}
table.listjoin th {
	height:48px;
	background:#f2f3f4;
	
	color:#474849;
	font-weight:normal;
}
table.listjoin td {
	padding:4px 0;	
}
table.listjoin th.subject {
	text-align:center;
	padding-left:10px;
}
table.listjoin td.subject {
	text-align:center;
}
@media (max-width:786px){    
    table.listjoin td.subject h1 {
        box-sizing:border-box;
    }
    table.listjoin td.subject h1:first-child {
        width:65% !important;
    }
    table.listjoin td.subject h1 img {
        width:100% !important;
    }
    table.listjoin td.subject h1:last-child {
        width:30% !important;
        font-size:6vw;
    }
}

/**/
table.listjoin td img {
    vertical-align: bottom;
}
table.listjoin td h1 {
	display:inline-block;
	height:53px;
	margin:0;
	padding:0;
	font-size:51px;
	line-height:53px;
	color:#33A0FF;
}
table.listjoin td input {
	width:100% !important;
	height:52px;
	margin:0;
}
table.listjoin td input[type="radio"],
table.listjoin td input[type="checkbox"] {
	width:0px;
	height:0px;
	border:0px;
}
table.listjoin td input+label{
    margin:12px 0 0;
}
table.listjoin td .btn {
	width:100% !important;
	margin:0;
}

/**/
table.listdownload {
	border-top:2px solid #33A0FF;
	text-align:center;
}
table.listdownload tr {border-bottom:1px solid #e3e1e2}
table.listdownload th {
	height:60px;
	background:#f2f3f4;	
}
table.listdownload td {height:48px;}
table.listdownload th.subject {
	text-align:left;
	padding-left:10px;
}
table.listdownload td.subject {
	text-align:left;
	padding-left:0px;
	color:#635b5b
}
table.listdownload th.ico {}
table.listdownload td.ico {}

/**/
table.listInfo {	
	border-top:2px solid #33A0FF;
	text-align:left;
}
table.listInfo tr {border-bottom:1px solid #e3e1e2}
table.listInfo th {
	height:48px;
	padding:0 20px;
	font-weight:normal;
	background:#f2f3f4;
}
table.listInfo tbody th {border-right:1px solid #e3e1e2;}
table.listInfo tbody tr td {
	height:48px;
	padding-left:20px;
	padding-right:20px;
	border-right:1px solid #e3e1e2;
}
table.listInfo tbody tr td:last-child {border-right:none}
table.listInfo th.subject {
	text-align:left;
	padding-left:10px;
}
table.listInfo td.subject {
	text-align:left;
	padding-left:10px;
}
table.listInfo td.subject a {
	color:#727272;
}

table.listInfo td .btn {
    margin:0 0 0 8px;
}

table.listInfo table.etcconfig {	
	text-align:left;
}
table.listInfo table.etcconfig tr {border-bottom:none !important}
table.listInfo table.etcconfig td {
	height:48px;
	padding-left:0px;
    border-right:none;
}
table.listInfo table.etcconfig td input[type="checkbox"]+label{
	background-image:url(/images/ico_checkbox_disable_off.png);
}
table.listInfo table.etcconfig td input[type="checkbox"]:checked+label{
	background-image:url(/images/ico_checkbox_disable_on.png);
}

@media (max-width:786px){ 
    table.listInfo td:first-child {
        padding:8px 8px 4px !important;
        font-size:13px;
        font-weight:bold;
        color:#999;
    }
    table.listInfo td {
        display:block;
        height:auto !important;
        padding:4px 8px 8px !important;
        border-right:none;
    }    
    table.listInfo td input,
    table.listInfo td select {
        width:100% !important;
        margin:0;
    }
    table.listInfo th.subject,
    table.listInfo td.subject {
        padding:8px 8px 4px;
        text-align:left;
    } 
    table.listInfo>tbody>tr>td {
        border-right:none;
    }
    
    table.listInfo td .btn {
        width:40px !important;
        height:40px !important;
        margin:0 0 0 8px;
        font-size:0;
        background:white url(/images/icon_copyLink.png) no-repeat center/24px;
        border:1px solid #e3e1e2;
    }
    table.listInfo td .btn:hover {
        background:#f7f8f9 url(/images/icon_copyLink.png) no-repeat center/24px;
    }
    
    table.listInfo td table.etcconfig td {
        padding:8px 0px !important;
    }
    table.listInfo td table.etcconfig td label {
        font-weight:normal;
        color:#474849;
    }
    
    table.listParticipants tr {
        position:relative;
    }
    table.listParticipants td:nth-child(1) {
        font-size:1em; color:#474849
    }
    table.listParticipants td:nth-child(2) {
        font-size:0.9em; color:#999
    }
    table.listParticipants td:nth-child(3) {
        position:absolute;
        top:32px;
        right:8px;
    }
}

/**/
table.listinput {	
	border-top:2px solid #33A0FF;
	text-align:left;
}
table.listinput {border-bottom:1px solid #e3e1e2}
table.listinput th {
	height:0px;
	background:#f2f3f4;
	
	color:#474849;
	font-weight:normal;
	border-top:2px solid #33A0FF;
}
table.listinput td {
	height:48px;
	padding-left:20px;
}
table.listinput th.subject {
	text-align:left;
	padding-left:10px;
}
table.listinput td.subject {
	text-align:left;
	padding-left:10px;
	color:#474849;
}

table.setsession {	
	border-top:2px solid #33A0FF;
	border-bottom:2px solid #33A0FF;
	text-align:left;
}
table.setsession th {
	height:0px;
	background:#f2f3f4;	
	color:#474849;
	font-weight:normal;
	border-top:2px solid #33A0FF;
}
table.setsession td {
	height:56px;
	padding-left:20px;
}
table.setsession th.subject {
	text-align:left;
	padding-left:10px;
	padding-top:20px;
	background:#ffffff;
}
table.setsession td.subject {
	text-align:left;
	padding-left:10px;
}
table.setsession td.subject a {
	color:#727272;
}
table.setsession tr.etcc input[type="checkbox"] + label {margin-left:20px}

table.setsession table.etcconfig tr {border-bottom:none}

table.setsession input[type="radio"] + label {
    width: 126px;
    height: 40px;
    margin: 0 -1px 0 0px !important;
	padding: 0;
    line-height: 40px;
    text-align: center;
	color:#373737;
	border:1px solid #C8C8C8;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
    background: none;
    float: left;
}
table.setsession input[type="radio"] + label:last-child { 
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}
table.setsession input[type="radio"]:checked + label {
    font-weight: bold;
    color: #33A0FF;
    border: 1px solid #33A0FF;
}
table.setsession input[type="radio"]+label + input[type="radio"]+label {
    border-left: 1px solid #33A0FF;
}

/**/
table.paymenthistory {
	border-top:2px solid #33A0FF;
	text-align:center;
}
table.paymenthistory tr {border-bottom:1px solid #e3e1e2}
table.paymenthistory th {
	height:48px;
	background:#f2f3f4;	
	color:#474849;
	font-weight:normal;
}
table.paymenthistory td {
	height:48px;
	padding:0 10px;
}

/*단순입력레이아웃*/
table.paymentinput {
	border-top:2px solid #33A0FF;
	text-align:left;    
}
table.paymentinput tr{
	border-bottom:1px solid #e3e1e2;
}
table.paymentinput td {    
	height:56px;
	padding:12px 8px;
    font-weight:bold;
    color:#777;
}
table.paymentinput td input {    
	height:40px;
}
table.paymentinput td input,   
table.paymentinput td textarea {    
	padding:12px;
}
table.paymentinput td label {    
	display:block;
    margin:0 0 8px;
}

@media (max-width:786px){
    .table-scroll {
        width:calc(100vw - 32px);
        overflow-x:scroll;
    }
    .table-scroll::-webkit-scrollbar,
    .table-scroll::-webkit-scrollbar:vertical,
    .table-scroll::-webkit-scrollbar:horizontal {
        width:6px;
        height:6px;
    }
    .table-scroll::-webkit-scrollbar-thumb,
    .table-scroll::-webkit-scrollbar-thumb:vertical,
    .table-scroll::-webkit-scrollbar-thumb:horizontal {
        background-color:#c0c0c0a6;
        border-radius:10px;
    }
    .table-scroll::-webkit-scrollbar-track,
    .table-scroll::-webkit-scrollbar-track:vertical,
    .table-scroll::-webkit-scrollbar-track:horizontal {
        background-color:transparent;
        border-radius:10px;
        opacity:0;
    }
    table.paymenthistory {
        width:1160px;
    }    
}

/*closed session list*/
@media (max-width:786px) {
    .search-bar.csList input#kwd {width:100% !important}
    
    table.csList thead tr th:nth-child(1) {
        display:table-cell;
        width:100%;
    }
    table.csList thead tr th:nth-child(2),
    table.csList thead tr th:nth-child(3) {
        display:none;
    }
    table.csList tbody tr {
        position:sticky;
        position:relative;
        height:80px;
    }
    
    table.csList td.subject {
        text-align:left;
        padding-left:0px;
    }
    table.csList tbody td {
        position:absolute;
        height:auto;
    }
    table.csList tbody tr td:nth-child(1){top:15px; left:20px;}
    table.csList tbody tr td:nth-child(2){top:48px; left:150px; font-size:0.9em; color:#999}
    table.csList tbody tr td:nth-child(3){top:48px; left:20px; font-size:0.9em; color:#999}
    
}

/* Find Pwd */
.tab_type1 + table.setsession tr {border-bottom:none;}
.tab_type1 + table.setsession th {background:#f7f8f9}
.tab_type1 + table.setsession td{background:#f7f8f9}
.tab_type1 + table.setsession td:first-child {padding-left:200px}
.tab_type1 + table.setsession td input {height:42px;}
.tab_type1 + table.setsession td .btn.h30 {width:150px; height:42px; line-height:38px}


@media (max-width:786px){
    table.setsession td {
        display:block;
        padding:0 16px;
    }
    table.setsession td:first-child {
        height:40px;
        line-height:40px;
        font-size:13px;
        font-weight:bold;
        color:#999;
    }
    table.setsession td:last-child {
        height:auto;
        padding-bottom:16px;
    }
    table.setsession td #subject {
        width:100% !important;
    }
    table.setsession table.etcconfig td {
        display:block;
        width:100%;
        height:32px;
        line-height:32px;
        padding:0;
        margin:0;
    }
    
    table.setsession td #startTime {
        width:calc(100% - 68px) !important;
        margin:0 8px 8px 0;
    }
    table.setsession td #hh {
        width:calc(100% - 68px) !important;
        margin:0 8px 8px 0;
    }
    table.setsession td #mm {
        width:calc(100% - 68px) !important;
        margin:0 8px 8px 0;
    }
    table.setsession td #duration {
        width:calc(100% - 86px) !important;
        margin:0 ;
    }
    table.setsession td #templateID {
        width:calc(100%) !important;
        margin:0 0 8px 0;
    }
    table.setsession td #videoCount4NormalMode {
        width:calc(100%) !important;
        margin:8px 0 0 0;
    }
    table.setsession td #secreteKey {
        width:calc(100% - 30px) !important;
        margin:0 8px 0 0;
    }
    table.setsession td #enableAutoVideoOn {
        width:calc(100%) !important;
        margin:0;
    }
}

table.list.ov tr:hover td {
	background:#ffffcc;
}
table.list.faq tr.q a.on {
	background:#33A0FF;
	color:#fff;
}
table.list.faq tr.a {
	display:none;
}
table.list.faq tr.a td {
	text-align:left;
	padding:10px;
	line-height:20px;
}
table.list.faq tr.a.on {
	display:table-row;
}




.tdcontent{text-align:left;padding-left:20px;}

.ico_type1 {display:inline-block; width:54px; height:20px; line-height:20px; text-align:center; border-radius:2px; background:#1791bc; color:#fff; font-size:10px;}
.ico_type2 {display:inline-block; width:54px; height:20px; line-height:20px; text-align:center; border-radius:2px; background:#33A0FF; color:#fff; font-size:10px;}
.ico_type3 {display:inline-block; width:54px; height:20px; line-height:20px; text-align:center; border-radius:2px; background:#b2b2b2; color:#fff; font-size:10px;}
.ico_type4 {display:inline-block; width:54px; height:20px; line-height:20px; text-align:center; border-radius:2px; background:#f2c716; color:#fff; font-size:10px;}
.ico_type5 {display:inline-block; width:54px; height:20px; line-height:20px; text-align:center; border-radius:2px; background:#ed7656; color:#fff; font-size:10px;}


.hr {margin:25px 0 0 0; border-top:2px solid #bddc94; padding:25px 30px 0;}
.hr2 {margin:25px 0 0 0; border-top:2px solid #bddc94; padding:25px 0 0;}
.hr3 {margin:25px 0 0 0; border-top:1px solid #e3e1e2; padding:25px 0 0;}

.theme_list {overflow:auto; height:350px;}
.theme_list li {line-height:30px;}
.theme_list a {font-size:13px; color:#474849;}

.complete {
	display:table;
	width:100%;
	line-height:25px;
}
.complete > div {
	display:table-cell;
	height:330px;
	font-size:14px;
	text-align:center;
	vertical-align:middle;
	color:#474849;
	border-top:2px solid #33A0FF;
	border-bottom:2px solid #33A0FF;
	background:#f7f8f9;
}
.complete > div strong {
	display:block;
	padding:0 0 22px;
	font-size:30px;
	color:#33A0FF;
}

.list3 {padding:0 50px;}
.list3:after {content:""; display:block; clear:both;}
.list3 li {float:left; position:relative; margin:0 18px 20px; padding:17px; width:170px; height:250px; background:#f4f4f4; box-sizing:border-box;}
.list3 li > img {display:block; margin:10px auto 15px; border-radius:60px;}
.list3 li > a {position:absolute; left:50%; top:inherit; bottom:20px; margin-left:-25px;}
.list3 li dt {padding:0 0 10px; border-bottom:2px solid #e3e1e2; font-size:14px; text-align:center;}
.list3 li dd {padding:10px; font-size:10px; line-height:14px;}
.list3 li.more a {display:block; left:50%; top:50%; margin:-31px 0 0 -31px; width:62px; height:62px; background:#fff; border-radius:70px; text-align:center;}
.list3 li.more a img {padding:20px 0 0 0;}
.list3 li span {position:absolute; background:#33A0FF;}
.list3 li span:nth-of-type(1) {left:0; bottom:0; width:1px; height:0;}
.list3 li:hover span:nth-of-type(1) {height:100%;}
.list3 li span:nth-of-type(2) {left:0; top:0; width:0; height:1px;}
.list3 li:hover span:nth-of-type(2) {width:100%;}
.list3 li span:nth-of-type(3) {right:0; top:0; width:1px; height:0;}
.list3 li:hover span:nth-of-type(3) {height:100%;}
.list3 li span:nth-of-type(4) {right:0; bottom:0; width:0; height:1px;}
.list3 li:hover span:nth-of-type(4) {width:100%;}
.list4 {display:table; width:100%;}
.list4 > div {display:table-cell;}
.list4 > div:nth-child(1) {width:40%;}
.list4 > div:nth-child(2) {width:20%; position:relative;}
.list4 > div:nth-child(3) {width:40%;}
.list4 > div:nth-child(1) div,
.list4 > div:nth-child(3) div {overflow:auto; width:310px; height:238px; border:1px solid #e3e1e2;}
.list4 > div:nth-child(1) div li,
.list4 > div:nth-child(3) div li {position:relative; padding:0 7px; height:30px; line-height:30px;}
.list4 > div:nth-child(1) div li:nth-child(odd),
.list4 > div:nth-child(3) div li:nth-child(odd) {background:#f2f3f4;}
.list4 > div:nth-child(3) div li a {position:absolute; right:20px; top:-2px;}
.list4 > div:nth-child(3) div li a img {width:10px;}
.list4 > div:nth-child(2) a {position:absolute; left:50%; top:50%; margin:15px 0 0 -32.5px;}

.paging {clear:both; text-align:center; padding:20px 0 0 0;}
.paging li {display:inline-block;}
.paging li a {display:block; margin:0 6px; width:30px; height:30px; background:#f2f3f4; text-align:center; line-height:30px; font-size:12px; color:#474849; border-radius:10px; vertical-align:middle;}
.paging li a:hover,
.paging li a.on {background:#33A0FF; color:#fff;}
.paging li:first-child a,
.paging li:last-child a {background:none; position:relative; top:-2px;}
.paging li:first-child a:hover,
.paging li:last-child a:hover {background:none;}

.paging + .btns {margin-top:-35px; padding:0;}

.con_type1 h4 {padding:30px 0 0;  color:#474849; font-weight:normal;}
.con_type1 h4:firts-child {padding:0;}
.con_type1 p {padding:15px 0 20px; font-size:13px;}
.sns_list {padding:25px; background:#f2f3f4; border-radius:10px;}
.sns_list ul {display:flex;}
.sns_list li {flex:1;}
.sns_list li a {display:block; text-align:center;}
.sns_list li a img {display:block; margin:0 auto 7px;}
.sns_list li a:hover img { animation:icos ease 0.8s infinite;}
.sns_list li a span {display:inline-block; padding:0 10px; height:21px; line-height:21px; background:#fff; border-radius:30px; border:1px solid #efefef; font-size:11px;}

@keyframes icos {
	0% { transform:translateY(0);}
	50% { transform:translateY(-8px);}
	100% { transform:translateY(0px);}
}

.pr {position:relative; margin:10px 0;}
.pr > *:last-child {position:absolute; right:0; top:0;}
.both .pr > *:last-child {top:0 !important;}



.more_txt {position:relative;}
.more_pop {display:none; position:absolute; top:30px; z-index:100; padding:40px; width:115px; background:#fff; border-radius:10px; box-shadow:0 0 30px #d4d4d4;}
.more_pop h3 {padding:0 0 25px;  color:#474849; font-weight:normal;}
.more_pop dl {margin:0 0 10px; border-bottom:2px solid #b9b9b9;}
.more_pop dl:after {content:""; display:block; clear:both;}
.more_pop dl dt,
.more_pop dl dd{padding:0 0 15px; float:left; width:50%; font-size:14px; text-align:right;}
.more_pop dl dt {text-align:left;}
.more_pop strong {float:left;}
.more_pop span {float:right;}
.more_pop > a {position:absolute; right:10px; top:10px;}
.more_pop:after {content:""; display:block; position:absolute; left:39px; top:-20px; border-style:solid; border-width:10px; border-color:transparent transparent #fff transparent;}
.more_pop.type2 {width:210px;}
.more_pop.type2 h3 {text-align:left;}
.more_pop.type2 dl dd {text-align:left;}
.more_pop.type2 .btns {padding:20px 0 0;}

/*============================================================*/
#calList {
    margin-bottom: 60px;
    border-radius:10px;
    box-shadow:0px 0px 0px 1px #33A0FF;
}
/*tHead*/
.slist {
	height:48px;
	text-align:center;
}
.clist {
	width:150px;
	height:150px;
	padding:10px 10px 15px 10px;
	vertical-align:top; 
	font-size:14px;
	border-top:1px solid #e3e1e2;
	box-sizing:border-box;
	cursor:hand;	
}
.today {
  	width:150px;
	height:150px;
	padding:10px 10px 15px 10px;
	vertical-align:top;
	border-top:1px solid #e3e1e2;
	box-sizing:border-box;
	background-color:#eef7ff;
	cursor:hand;
}
.today span {
    font-weight:bold;
    color:#33A0FF;
}
.clistpast {
	width:150px;
	height:150px;
	padding:10px 10px 15px 10px;
	vertical-align:top;
	border-top:1px solid #e3e1e2;
	box-sizing:border-box;
	background:#f9f9f9; 
	cursor:hand;
}
/*time*/
.closed {
  height:20px;
  margin-top:5px;
  font-size:14px;
  text-align:center;
  line-height:20px;
  color:#fff;
  border-radius:10px;
  background:#b2b8c5;
}
.ongoing {
  height:20px;
  margin-top:5px;
  font-size:14px;
  line-height:20px;
  color:#fff;
  text-align:center;
  border-radius:10px;
  background:#33A0FF;
}
@media (max-width:786px) {
    table#calList td {
        width:calc(100% / 7);
        padding:4px;
    }
    table#calList td span {    
        display:block;
        width:36px;
        overflow:hidden;
        height:17px;
        text-indent:-28px;
        font-size:11px;
        word-break:keep-all; 
        color:#727272;
    }
    /*tHead*/
    .slist {
        height:32px;
        text-align:center;
        border-top:3px solid #33A0FF;
        border-bottom:1px solid #e3e1e2;
        background:#ffffff;
    }
    .clist {
        height:120px;
        padding:10px 10px 15px 10px;
        vertical-align:top; 
        font-size:14px;
        border-bottom:1px solid #e3e1e2;
        box-sizing:border-box;
        cursor:hand;	
    }
    /*day*/
    .today {
        height:120px;
        padding:10px 10px 15px 10px;
        vertical-align:top;
        border-bottom:1px solid #e3e1e2;
        box-sizing:border-box;
        background-color:#fffad7;
        cursor:hand;
    }
    .clistpast {
        height:120px;
        padding:10px 10px 15px 10px;
        vertical-align:top;
        border-bottom:1px solid #e3e1e2;
        box-sizing:border-box;
        background:#f9f9f9; 
        cursor:hand;
    }
    /*time*/
    .list-schedule li {
        width:100%;
        font-size:7px;
        word-break:keep-all;
        white-space:nowrap;
        overflow:hidden;
    }
    .closed {
        height:20px;
        margin-top:5px;
        font-size:14px;
        text-align:center;
        line-height:20px;
        color:#fff;
        border-radius:10px;
    }
    .ongoing {
        height:20px;
        margin-top:5px;
        font-size:14px;
        line-height:20px;
        color:#fff;
        text-align:center;
        border-radius:10px;
        background:#33A0FF;
    }
}

.breakoutList0 {
  height:20px;
  margin-top:5px;
  font-size:14px;
  line-height:20px;
  color:#fff;
  text-align:center;
  border-radius:10px;
  background:#F27596;
}

.breakoutList1 {
  height:20px;
  margin-top:5px;
  font-size:14px;
  line-height:20px;
  color:#fff;
  text-align:center;
  border-radius:10px;
  background:#EFCF48;
}

.breakoutList2 {
  height:20px;
  margin-top:5px;
  font-size:14px;
  line-height:20px;
  color:#fff;
  text-align:center;
  border-radius:10px;
  background:#69C98C;
}

.breakoutList3 {
  height:20px;
  margin-top:5px;
  font-size:14px;
  line-height:20px;
  color:#fff;
  text-align:center;
  border-radius:10px;
  background:#468CC1;
}

.breakoutList4 {
  height:20px;
  margin-top:5px;
  font-size:14px;
  line-height:20px;
  color:#fff;
  text-align:center;
  border-radius:10px;
  background:#3F4F5E;
}
.reserved {
  height:20px;
  margin-top:5px;
  font-size:14px;
  line-height:20px;
  color:#fff;
  text-align:center;
  border-radius:10px;
  background:#FFce00;
}
sessions {
  width:100%;
}
.sessiondate {
    font-size:24px;
    vertical-align:bottom;
}
@media (max-width:786px) {    
    table + .both {
        margin-bottom:40px;
    }
    .sessiondate {
        display:block;
        width:100%;
        padding-left:0px;
        padding-top:00px;
        font-size:18px;
        font-weight:bold;
        line-height:38px;
    }
}

/* pm */
.content > section .top + .no1 {margin-top:-30px;}
.content > section .no1 + p {padding:3px 0 0;}
.h2_3 + .join_box_form {padding:0;}
.join_theme .top +  h3 {padding-top:10px;}

/* 2017.03.03. */
.ui-datepicker-group-first,
.ui-datepicker-group-last {float:left; width:50%; padding:0 5px; box-sizing:border-box;}

/*singlebackground*/
.bg-co {
    position:relative;
    padding:4px 0 4px 20px !important;
}
.bg-co div {
    height:56px;
    overflow:hidden;
    -webkit-transition:3s;
    transition:3s;
}
.bg-co .more, .bg-co .less {
    position:absolute;
    top:16px;
    left:450px;
    width:32px;
    height:32px;
    font-size:20px;
    font-weight:bold;
    text-align:center;
    color:#ccc;
    line-height:26px;
    border:1px solid #e3e1e2;
    border-radius:50px;
    background:#f2f3f4;
}
.bg-co input[type="checkbox"] {
    position:absolute !important;
    width:0px !important;
    height:0px !important;
    left:0 !important;
}
.bg-co input[type="checkbox"] + label {
    position:relative;
    display:inline-block;
    width:60px;
    height:48px;
    margin:4px 0px;
    padding:0px !important;
    border:1px solid #e3e1e2;
    border-radius:10px;
    box-sizing:border-box;
    background:none !important;
    overflow:hidden;
}
.bg-co input[type="checkbox"]:checked + label {
    border:1px solid #33A0FF;
}
.bg-co input[type="checkbox"]:checked + label:after {
    display:block;
    position:absolute;
    content:"\2713"; 
    top:14px;
    left:20px;
    width:18px;
    height:18px;
    font-size:10px !important;
    font-weight:bold;
    line-height:18px;
    text-indent:5px;
    color:#fff;
    border-radius:10px;
    background:#333;
} 
.bg-co input[type="checkbox"] + label img {
    width:60px !important;
    height:48px !important;
    margin:0px !important;
}

/*plan&price*/
.plan {
    display:flex;
    width:100%;
    justify-content:center;
    flex-grow:1;
    flex-wrap:wrap;
    justify-content:center;
}
.plan .price {
    position:relative;
    width:276px;
    margin-left:12px;
    padding:30px 20px 96px 20px;
    border:1px solid #e3e2e1;
    border-radius:6px;
    box-shadow:0 0 5px #d4d4d4;
    box-sizing:border-box;
}
.plan .price:first-child {
    margin-left:0px;
}
.plan .price div {
    display:block;
    width:100%;
    height:auto;
    text-align:center;
}
.plan .price div h4 {margin-bottom:16px;}
.plan .price div h1 + p,
.plan .price div h1 + span {
    display:block;
    height:24px;
    margin-top:8px;
    color:#777777;
}
.plan .price div ul {
    margin:32px 0;
}
.plan .price div ul li {
    padding:4px 0 8px 24px;
    text-align:left;
    word-break:keep-all;
    line-height:150%;
    background:url(/images/bu_check.png) no-repeat left 8px/14px;
}
.plan .price div .btn {
    position:absolute;
    bottom:18px;
    left:50%;
    width:88%;
    margin:0;
    transform:translateX(-50%);
}

.plan .price.option div {
    position:relative;
    display:block;
    width:100%;
    height:160px;
    text-align:center;
}
.plan .price.option ul {
    margin:16px 0 0;
}

#premium {border:1px solid #33A0FF}

@media (max-width:786px){    
    .plan {
        flex-direction:column;
        margin-top:32px !important;
    }
    .plan .price {
        width:100%;
        margin:0 0 16px !important;
        padding:30px 20px 40px 20px !important;
        transform:scale(1) !important;
    }
    .plan .price div {
        height:auto;
    }    
    .plan .price div ul {
        margin:32px 0;
    }
    .plan .price div .btn {
        position:relative;
        bottom:0px !important;
        display:block;
        width:100%;
        margin-top:16px;
    }
}

/*환불규정*/
ul.policy {
    padding:16px;
}
ul.policy li {
    list-style:decimal;
    padding:0 0 12px;
}
ul.policy li ul {
    padding:12px 0 12px 12px;
}
ul.policy li li {
    list-style:disc;
}
ul.policy li li li {
    list-style:lower-alpha;
}
/*약관*/
.policy {
    margin:0px;
    padding:20px;
    box-sizing: border-box;
}
.policy * {
    font-size:14px;
    line-height:1.8;
    color:#272727; 
    word-break: keep-all;
}
.policy div {text-align:left}
.policy .container {
    width: 100%;
    max-width:960px;
    margin: 0 auto;
    padding: 30px 0px;
}
.policy .box {
    border-radius: 3px;
    box-sizing: border-box;
}
.policy strong {
    display: block;
    font-size: 16px;
    font-weight: bold;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed #999;
}
.policy h1 {font-size:24px; margin:0px 0px 20px;}
.policy h4 {margin:16px 0 0 0;}
.policy h4 + p {margin:8px 0px;}
.policy table {
    margin-top: 16px;
}
.policy th,
.policy td {
    height: 32px;
    padding: 8px;
    border: 1px solid #e3e1e2;
}
.policy th {
    width: 120px;
    font-weight: bold;
    color: #33A0FF;
}

ol.circle * {
	margin-top:4px;
    margin-left:20px;
}
ol.circle>li {
	position:relative;    
	list-style:none;
}
ol.circle>li:after {
	position:absolute;
	top:0;
	left:-20px;
	width:14px;
	height:14px
}
ol.circle>li:first-child:after {content:"①"}
ol.circle>li:nth-child(2):after {content:"②"}
ol.circle>li:nth-child(3):after {content:"③"}
ol.circle>li:nth-child(4):after {content:"④"}
ol.circle>li:nth-child(5):after {content:"⑤"}
ol.circle>li:nth-child(6):after {content:"⑥"}
ol.circle>li:nth-child(7):after {content:"⑦"}
ol.circle>li:nth-child(8):after {content:"⑧"}
ol.circle>li:nth-child(9):after {content:"⑨"}
ol.circle>li:nth-child(10):after {content:"⑩"}
ol.circle>li:nth-child(11):after {content:"⑪"}
ol.circle>li:nth-child(12):after {content:"⑫"}
ol.circle>li:nth-child(13):after {content:"⑬"}
ol.circle>li:nth-child(14):after {content:"⑭"}
ol.circle>li:nth-child(15):after {content:"⑮"}
ol.circle>li:nth-child(16):after {content:"⑯"}
ol.circle>li:nth-child(17):after {content:"⑰"}
ol.circle>li:nth-child(18):after {content:"⑱"}
ol.circle>li:nth-child(19):after {content:"⑲"}
ol.circle>li:nth-child(20):after {content:"⑳"}
ol.circle>li ul li {
	content:"";
	margin-left:0
}
ol.circle>li>ol {
    margin:8px 0 8px 0;
}
ol.circle>li>ol>li {
	list-style:decimal
}
ol.circle>li>ol li:after {
	content:""
}

/*장바구니*/
.purchase h4 {margin-bottom:16px}
.purchase .purchase-info {
    margin-bottom:40px;
    border-top:2px solid #e3e1e2;
}
.purchase .purchase-info-title {
    display:flex;
    flex-grow:1;
    padding:8px 0;
    border-bottom:1px solid #e3e1e2;
    background:#f7f7f7;
}
.purchase .purchase-info-title div {
    padding:4px;
    box-sizing:border-box;
    text-align:center;
    color:#777777;
}
.purchase .purchase-info-title div:nth-child(1){width:50%}
.purchase .purchase-info-title div:nth-child(2){width:50%}
.purchase .purchase-info-content {
    display:flex;
    flex-grow:1;
    padding:12px 0;
    border-bottom:1px solid #e3e1e2;
}
.purchase .purchase-info-content div {
    padding:8px;
    box-sizing:border-box;
    text-align:right;
    color:#777777;
}
.purchase .purchase-info-content div:nth-child(1){width:50%}
.purchase .purchase-info-content div:nth-child(2){width:50%}

.purchase .purchase-info-content div a {
    cursor:pointer;
}
.purchase .purchase-info-content div .btn {
    display:block;
    margin:8px 0 0;
}
.purchase .purchase-info-content .option-item {
    margin:8px 0 0;
    padding:0;
}
.purchase .purchase-info-content div:nth-child(3){margin-right:40px}
.purchase .purchase-info-content .option-item p {
    display:block;
    width:200px;
    margin-bottom:8px;
    padding:8px;
    border-radius:10px;
    background:#f2f3f4;
}

.purchase .purchase-info input[type="number"] {
    width:80px;
    margin:-6px 0;
    padding:0px 4px;
    text-align:center;
    text-indent:12px;
    border:1px solid #e3e1e2;
}
/*상품삭제*/
.purchase .purchase-info-delete {    
    margin:24px 0;
}
/*구매하기*/
.purchase .purchase-price {
    margin-bottom:40px;
    border-top:2px solid #33A0FF;
    border-bottom:1px solid #e3e1e2
}
.purchase .purchase-price-title {
    padding:8px 0;
    border-top:1px solid #e3e1e2;
    border-bottom:1px solid #e3e1e2;
    background:#f7f7f7;
}
.purchase .purchase-price-title div {
    padding:4px;
    box-sizing:border-box;
    text-align:left;
    color:#777777;
}
.purchase .purchase-price-content {
    padding:12px 0;
}
.purchase .purchase-price-content div {
    padding:8px;
    box-sizing:border-box;
    text-align:center;
    color:#777777;
}
.purchase .purchase-price-content div p {
    position:relative;
    display:inline-block;
    margin:-8px 0 16px;
    padding:12px 16px;
    font-size:20px;
    font-weight:bold;
}
.purchase .purchase-price-content div p strong {
    font-size:20px;
}
.purchase .purchase-price-content div p span {
    position:absolute;
    display:block;
    top:40px;
    left:50%;
    transform:translateX(-50%);
    width:60px;
    font-size:14px;
    font-weight:normal;
    color:#999;
}
/*결제하기*/
.payment h4 {font-size:18px; margin-bottom:16px}
.payment-way {
    display:flex;
    justify-content:flex-start;
}
.payment-way .btn {
    width:200px;
    margin:0 16px 16px 0;
}
.payment-way .btn:last-child {margin:0}
/*현금영수증*/
.payment-bill div {
    display:flex;
    justify-content:flex-start;
}
.payment-bill div div {
    display:block;
    margin:0px 32px 40px 0;
}
.payment-bill div div input + label {
    display:block;
    margin-bottom:16px;    
}
.payment-bill div div select {
    display:inline-block;
    width:160px;
    margin:0 8px 0 0;
    
}
.payment-bill div div input {
    display:inline-block;
    width:200px;
    margin:0;
}
.payment-bill div div p {
    display:inline-block;
    margin:0 16px 16px 0;
}

/*sns로그인*/
.btn.sns-login {
    width:400px;
    height:48px;
    border-radius:4px;
    font-size:14px;
    font-weight:bold;
    line-height:48px;
    text-align:center;
    text-indent:10px;
    cursor:pointer;
}
.btn.sns-login img {width:48px; vertical-align:bottom}
#google {
    border:1px solid #e3e1e2;
    background:#ffffff url(/images/icon_sns_google.svg) no-repeat 10px center/48px;
}
#naver {
    border:1px solid #03cf5d;
    color:#ffffff;
    background:#03cf5d url(/images/icon_sns_naver.svg) no-repeat 10px center/48px;
}
#kakao {
    border:1px solid #ffe600;
    color:#381e1f;
    background:#ffe600 url(/images/icon_sns_kakao.svg) no-repeat 10px center/48px;
}
#facebook {
    border:1px solid #37589A;
    color:#ffffff;
    background:#37589A url(/images/icon_sns_facebook.svg) no-repeat 10px center/48px;
}

/*sns 로그인*/
.hr-sect {
	display:flex;
	flex-basis:100%;
	align-items:center;
	font-size:12px;
    color:#999;
	margin:15px 0px;
}
.hr-sect::before,
.hr-sect::after {
  content:"";
  flex-grow:1;
  background:#d4d4d4;
  height:1px;
  font-size:0px;
  line-height:0px;
}
.hr-sect::before {
  margin:0 16px 0 0;
}
.hr-sect::after {
  margin:0 0 0 16px;
}
.sns-login-google,
.sns-login-kakao {
    width:48%;
    max-width:220px;
    height:48px;
    padding:0px 8px 0px 36px;
    margin:0px;
    font-size:13px;
    border-radius:6px;
    line-height:48px;
}
.sns-login-google {
    margin-bottom:8px;
    float:left;
    border:1px solid #e3e1e2;
    background:white url(/images/icon_sns_google.svg) no-repeat left / 48px;
}
.sns-login-kakao {
    float:right;
    border:1px solid #FFE600;
    background:#FFE600 url(/images/icon_sns_kakao.svg) no-repeat left / 48px;
}
.tc .sns-login-google,
.tc .sns-login-kakao {
    margin:0px 0px;
    float:none;
}

/*내 정보에 연동 해제용*/
#tList .sns-login-google + .btn,
#tList .sns-login-kakao + .btn {
    width:88px;
    padding:8px 0;
    font-size:13px;
}

.sns-login-google.badge {
    width:48px;
    height:48px;
    padding:8px;
    margin:0px 8px;
    float:none;
    font-size:0;
    border-radius:60px;
    border:1px solid #e3e1e2;
    background:white url(/images/icon_sns_google.svg) no-repeat left / 48px;
}
.sns-login-kakao.badge {
    width:48px;
    height:48px;
    padding:8px;
    margin:0px 8px;
    float:none;
    font-size:0;
    border-radius:60px;
    border:1px solid #FFE600;
    background:#FFE600 url(/images/icon_sns_kakao.svg) no-repeat left / 48px;
}
@media (max-width:786px){
    .sns-login-google {
        width:40px !important;
        height:40px !important;
        padding:8px;
        margin:0px 8px;
        float:none;
        font-size:0;
        border-radius:60px;
        border:1px solid #e3e1e2;
        background:white url(/images/icon_sns_google.svg) no-repeat center / 40px;
    }
    .sns-login-kakao {
        width:40px !important;
        height:40px !important;
        padding:8px;
        margin:0px 8px;
        float:none;
        font-size:0;
        border-radius:60px;
        border:1px solid #FFE600;
        background:#FFE600 url(/images/icon_sns_kakao.svg) no-repeat center / 40px;
    }
    .sns-login-google.badge {
        background-position:center;
    }
    .sns-login-kakao.badge {
        background-position:center;
    }
}

.sns-button {
    height:36px;
    padding:4px 0;
}
.sns-button .btn {
    float:none;
    margin:0 8px 0 0;
    max-width:200px;
    height:36px;
    line-height:36px;
    background-size:36px;
    cursor:pointer;
}
table .sns-button {height:40px; padding:2px 0;}
table .sns-button .btn {height:40px; line-height:40px;}

/*계정가입페이지*/
@media (max-width:786px) {
    .sns-box p {
        display:block !important;
        margin-bottom:8px !important;
    }
    .sns-box + form table.listuser #userid,
    .sns-box + form table.listuser #vNum,
    .sns-box + form table.listuser #customername {
        width:calc(100% - 118px) !important;
    }
    .sns-box + form table.listuser .btn {
        width:114px !important;
    }
    input#pwd + span {
        margin:-14px 0 0;
    }
}
.account-delete a {
    margin-left:16px;
    font-size:13px;
    color:#aaa;
    border-bottom:1px dotted #aaa;
}

/*모바일대응*/
body.mobile {padding-bottom:0;}
.mobile main {
    position:relative;
    display:block;
    width:100%;
    margin:0 auto;
    padding:0;
    box-sizing:border-box;
}
.mobile .content {padding:10px;}
.mobile section {
    width:100% !important;
    min-height:calc(100vh - 20px) !important;
    margin:0 !important;
    padding:10px;
    box-sizing:border-box;
}
.mobile section * {
    box-sizing:border-box;
}
.mobile section table {
    width:100% !important;
}
.mobile section table td.subject h1 {
    width:50%;
    margin:0 !important;
    padding:0 20px !important;
    box-sizing:border-box;
    height:30px;
    line-height:30px;
}
.mobile section table td.subject h1 img {
    height:30px;
}
.mobile section input[type="text"] {
    width:100% !important;
}
.mobile section .btn {
    width:100% !important;
    margin:0 auto 10px !important;
}

/*조직도*/
@media (max-width:786px) {
    #orgTree {
        width:calc(100vw - 32px);
        height:240px;
    }
    #orgTree > div {
        width:100%;
    }
    #addArea {
        margin:20px 0;
    }
    #wrap1 {
        float:none;
        margin:0;
    }
    
    /*숨기기*/
    #wrap {
        width:0px;
        height:0px;
        overflow:hidden;
    }
    #wrap:after {
        display:block;
        content:"조직도 기능은 PC환경에서 조작해주세요.";
        position:fixed;
        top:140px;
        left:20px;
        width:calc(100% - 40px);
        padding:200px 20px;
        border-radius:20px;
        border:1px solid #e3e1e2;
        text-align:center;
        font-size:20px;
        font-weight:bold;
        color:#777879;
        background:#f7f8f9;  
        box-sizing:border-box;
        word-break:keep-all;
    }
}
/*멤버*/
.search-bar {display:inline-block}
.search-bar + div {display:inline-block}
table.list.member-list .btn_modify {background:url(/images/sessionList_modify.png) no-repeat center/20px;}
table.list.member-list .btn_delete {background:url(/images/sessionList_delete.png) no-repeat center/20px;}

table.list.member-list .btn:hover{background-color:#f2f3f4;}
table.list.member-list .btn b {
    position:absolute;
    display:none;
    top:0%;
    left:50%;
    width:auto;
    padding:10px 8px;
    font-size:12px;
    line-height:1;
    white-space:nowrap;
    word-wrap:normal;
    word-break:keep-all;
    word-spacing:-1;
    color:#FFF;
    background:#333;
    border-radius:4px;
    transform:translateX(-50%) translateY(-100%);
    z-index:999;
}
table.list.member-list .btn:hover b{display:block;}
table.list.member-list tr:hover td {background:#FFFFFF}


@media (max-width:786px){
    .search-bar {
        display:block;
        margin-bottom:8px;
    }
    .search-bar input#kwd {
        width:calc(100% - 90px) !important;
        float:left;
    }
    .search-bar .btn {
        width:80px !important;
    }
    .search-bar + div {width:100%;}
    .search-bar + div .btn {
        float:left;
        width:calc(50% - 4px);
        margin:0;
    }
    .search-bar + div .btn:nth-child(1) {margin-right:8px}
    .search-bar + div .btn:nth-child(2) {display:none;}
    
    .member-list thead {display:none}
    .member-list tr {
        position:relative;
        height:80px;
    }
    .member-list tr td {
        position:absolute;
        height:auto;
    }
    .member-list tr td:nth-child(1){top:15px; left:20px;}
    .member-list tr td:nth-child(2){top:48px; left:80px; font-size:0.9em; color:#999}
    .member-list tr td:nth-child(3){top:48px; left:20px; font-size:0.9em; color:#999}
    .member-list tr td:nth-child(4){top:40px; right:56px;}
    .member-list tr td:nth-child(5){top:40px; right:20px;}    
}

/*임시 safari대응 =====================================*/
@media (max-width:786px){   
    table.list.session-list tbody tr {
        position:static;
        height:56px;
    }
    table.list.session-list tbody td {
        position:static;
        height:auto;
        padding:0 4px;
        text-align:left;
    }
    table.list.session-list tbody td:nth-child(1){
        width:40px;
    }
    table.list.session-list tbody td:nth-child(2){
        width:180px;
        text-overflow:ellipsis;
        overflow:hidden;
        white-space:nowrap;
        display:block;
        text-align:left;
        line-height:56px;
    }
    table.list.session-list tbody td:nth-child(3),
    table.list.session-list tbody td:nth-child(4){
        display:none;
    }
    
    .member-list tr {
        position:static;
        height:40px;
    }
    .member-list tr td {
        position:static;
        height:auto;
    }  
    .member-list tr td:nth-child(1){
        width:180px;
        text-overflow:ellipsis;
        overflow:hidden;
        white-space:nowrap;
        display:block;
        text-align:left;
        line-height:40px;
    }    
    
    table.list #kwdr{
        width:calc(170%) !important;
        position:absolute;
        top:8px;
    }
    table.csList thead tr th:nth-child(1) {
        position:relative;
        display:table-cell;
        width:50%;
    }
    table.csList thead tr th:nth-child(2),
    table.csList thead tr th:nth-child(3) {
        display:table-cell;
        font-size:0px;
    }
    table.csList tbody tr {
        position:static;
        height:48px;
    }
    
    table.csList td.subject {
        text-align:left;
        padding-left:0px;
    }
    table.csList tbody td {
        position:static;
        height:auto;
    }
}
/*-----------------------------------------------------------*/
/*팝업*/
#popLayer{
  1display:none;  
}
.popup {
    position:fixed;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    
    max-width:640px;
    width:calc(100vw - 20px);
    padding:64px;
    
    background:white;
    border:8px solid #33A0FF;
    box-shadow:0 10px 30px rgba(0, 0, 0, 0.3);    
    border-radius:14px;
    box-sizing:border-box;
}
.popup h1 {
    display:block;
    margin:0 auto 48px;
}
.popup .btn-close {    
    position:absolute;
    top:-16px;
    right:-16px;
    
    width:32px;
    height:32px;
    border-radius:50%;
    background:white url(/images/btn_close.png) no-repeat center/12px;
    box-shadow:0 0 10px rgba(0, 0, 0, 0.3);
    
    cursor:pointer;
}

@media (max-width:560px) {
  .popup {
        position:fixed;
        top:50%;
        left:50%;
        transform:translate(-50%, -50%);

        width:calc(100vw - 40px);
        padding:24px;
    }  
}