@charset "utf-8";
/* -------------------------------------------
*
* Project : 웰빙클럽 
* File name : /css/mypage.css
* Version : 1.0.0
* SUMMARY : 
*
* 1) 서브메뉴
* 2) 
* 3) 
* 4) 
* 5) 
* 6) 
*
* -------------------------------------------*/

/* **************************************** *
 * 마이페이지 - 레이아웃
 * **************************************** */

#my-page{
    background: #fff;
}


/* 마이페이지 - 레이아웃 - 왼쪽,사이드 영역 */
#my-page aside{
    position: relative;
    padding: /*0px 30px*/ 0 15px;
}

#my-page aside .personal{
    padding: /*40px 15px 25px*/ 40px 0px 25px;
    background: #fff; 
}

#my-page aside .personal .list-personal{
    display: inline-block;
    width: 100%;
    margin-bottom: 10px;
}

#my-page aside .personal .list-personal li{
	overflow: hidden;
    padding-bottom: 6px;
    margin-bottom: 6px;
}

#my-page aside .personal .list-personal li a{
    display: inline-block;
}

#my-page aside .personal .list-personal li a.state{
	position: relative;
    float: right;
	padding-left: 23px;
    font-weight: 400;
    color: #51648a;
}

#my-page aside .personal .list-personal li a.state img{
	position: absolute;
	top: 2px;
	left: 0px;
}

#my-page aside .personal .list-personal li a.state .btn{
	padding: 3px 7px;
	font-size: 11px;
}


#my-page aside .personal h3 span{
    font-size: 16px;
    color: #515151;
}

#my-page aside .personal .btn{
    border-radius: 3px;
}

#my-page aside .personal h3{
    padding-bottom: 15px;
    margin-bottom: 20px;
    border-bottom: 1px dotted #ddd;
    font-size: 21px;
    letter-spacing: -1px;
    color: #333;
}

#my-page aside .barcode {
    display: none;
}

#my-page aside ul.mypage-menu{
    display: block;
}

#my-page aside ul.mypage-menu li{
    border-bottom: 1px solid rgba(222, 228, 239, 0.7);
    font-size: 18px;
    color: #515151;
}

#my-page aside ul.mypage-menu li:first-child{
    border-top: 1px solid #333;
}

#my-page aside ul.mypage-menu li a{
    display: block;
    padding: 10px 15px;
    font-size: 15px;
    letter-spacing: -.5px;
    color: #333;
}

#my-page aside ul.mypage-menu li a:hover, #my-page aside ul.mypage-menu li a.active{
    color: #1e65f3;
}

#my-page aside ul.mypage-menu li a i{
    width: 20px;
    margin-right: 5px;
}

#my-page aside .delete-id{
    display: block;
	padding: 20px;
	font-size: 14px;
	color: #666;
}


/* 마이페이지 - 레이아웃 - 가운데,메인 컨텐츠 영역 */
.col-main-contents{
    border-left: 1px solid #d7dce4;
}

#my-page .main-contents{
    padding: 0px 15px;
    margin: 0px;
}

/* 마이페이지 - 레이아웃 - 가운데,메인 컨텐츠 영역 - 그룹.타이틀 */
#my-page .main-contents .group{
    padding: 0px 0px 10px;
    margin: 0px 0px 10px;
}

#my-page .main-contents .group h3{
	padding-left: 5px;
    margin-bottom: 15px;
    font-size: 18px;
    letter-spacing: -1px;
    color: #515151;
}

#my-page .main-contents .group h3 i{
    margin-right: 5px;
}
#my-page .main-contents .group h3 button{
    color:#fff;
}

/* 마이페이지 - 레이아웃 - 가운데,메인 컨텐츠 영역 - 박스 */
#my-page .main-contents .group ul.box,#my-page .main-contents .group ul.all-menu{
    display: inline-block;
    width: 100%;
    padding: 30px 5px 30px 20px;
    border: 1px solid #d4d4d4;
    border-radius: 5px;
    background: #fff;
}

#my-page .main-contents .group ul.box li{
    overflow: hidden;
    position: relative;
    float: left;
    width: 50%;
    padding: 0px 20px;
}

#my-page .main-contents .group ul.box li::after{
    position: absolute;
    content: '';
    top: 0px;
    right: 0px;
    width: 1px;
    height: 100%;
    background: #d4d4d4;
}

#my-page .main-contents .group ul.box li:last-child::after{
    content: '';
    width: 0px;
}

#my-page .main-contents .group ul.box li p{
    margin-bottom: 0px;
    font-size: 14px;
    letter-spacing: -1px;
    color: #888;
}



#my-page .main-contents .group ul.box li a i{
    position: absolute;
    right: 20px;
    bottom: 6px;
    font-size: 20px;
}

#my-page .main-contents .group ul.box li .wrap-grdInfo{
	position: relative;
}

#my-page .main-contents .group ul.box li .wrap-grdInfo a{
	display: inline-block;
	/* width: auto; */
	width: 250px;
    margin-top: 36px;
    font-size: 33px;
    /* font-size: 36px; */
    letter-spacing: -1px;
    line-height: 1;
    color: #212529;
}

#my-page .main-contents .group ul.box li .wrap-grdInfo a i{
    position: absolute;
    right: 20px;
    bottom: 6px;
    font-size: 20px;
}
#my-page .main-contents .group ul.box li a.use{
	position: relative;
	display: inline-block;
	right: 0px;
	bottom: 0px;
	width: auto;
	padding: 5px 15px 5px 15px;
	margin-top: 10px;
	border: 1px solid #dedede;
	border-radius: 3px;
	background: #fff;
    font-size: 14px;
    letter-spacing: -1px;
    color: #212529;	
}

#my-page .main-contents .group ul.box li .wrap-grdInfo a .name{
	font-weight: 600;
}

#my-page .main-contents .group ul.box li .wrap-grdInfo button{
    position: absolute;
    right: 0px;
    bottom: 0px;
    padding: 5px 0px;
    margin-top: 10px;
    border: 0px;
    border-radius: 0px;
    border-bottom: 2px solid #ffc497;
    background: #fff;
    font-size: 25px;
    line-height: 1;
    color: #ff8a30;
}

#my-page .main-contents .group ul.box li .wrap-grdInfo button.nopay{
    padding-right: 30px;
    background: url('/images/icon/icon-arrow-mypage.png')no-repeat 95% 50%;
}

#my-page .main-contents .group ul.box li .wrap-grdInfo button.noreg{
    padding-right: 30px;
    background: url('/images/icon/icon-arrow-mypage02.png')no-repeat 95% 50%;
    border-bottom: 2px solid #4f7dff;
    color: #4f7dff;
}

#my-page .main-contents .group ul.box li .wrap-grdInfo button.used{
    border-bottom: 0px solid #ffc497;
    background: #fff;
    font-size: 25px;
    line-height: 1;
    color: #4f7dff;
}

#my-page .main-contents .group ul.box li a.use{
	position: relative;
	display: inline-block;
	right: 0px;
	bottom: 0px;
	width: auto;
	padding: 5px 15px 5px 15px;
	margin-top: 10px;
	border: 1px solid #dedede;
	border-radius: 3px;
	background: #fff;
    font-size: 14px;
    letter-spacing: -1px;
    color: #212529;	
}

#my-page .main-contents .group ul.box li a.stats{
	position: relative;
	display: inline-block;
	right: 0px;
	bottom: 0px;
	width: auto;
	padding: 5px 45px 5px 15px;
	margin-top: 10px;
	border-radius: 3px;
	background: #dedede;
    font-size: 14px;
    letter-spacing: -1px;
    color: #212529;	
}

#my-page .main-contents .group ul.box li a.stats i{
    position: absolute;
    top: 0;
    right: 0;
    padding: 6px 7px;
    margin: 3px;
    height: 80%;
    font-size: 14px;
    color: #4f8aff;
    background: #ffffff;
    border-radius: 4px;
}


/* 마이페이지 - 레이아웃 - 가운데,메인 컨텐츠 영역 - 그룹.박스 : 웰빙 포인트 */
#my-page .main-contents .group ul.box.point li a.pointValue{
    display: inline-block;
    margin-top: 10px;
    font-size: 24px;
    color: #212529;
}

#my-page .main-contents .group ul.box.point li a.pointValue span{
    font-weight: 600;
}

#my-page .main-contents .group ul.box.point li a.btn{
    margin-top: 13px;
}
#my-page .main-contents .alert .fund-alert li{
	width: 19%;
	display: inline-block;
	text-align: center;
}
#my-page .main-contents .alert .fund-alert {
	padding: 20px;
}
#my-page .main-contents .alert .fund-alert span{
	display: inline-block;
	padding-top: 6px;
}
#my-page .main-contents .alert .fund-alert .pay_point {
	font-size: 20px;
}
#my-page .main-contents .alert .fund-alert .bridge {
	font-weight: bold;
}
#my-page .main-contents .alert .fund-alert .keypoint {
	color: #4F7DFF;
}
/* 마이페이지 - 레이아웃 - 가운데,메인 컨텐츠 영역 - 그룹.박스 : 아이콘 33% */
#my-page .main-contents .group .icon-box{
    display: inline-block;
    width: 100%;
    border: 1px solid #d4d4d4;
    border-radius: 8px;
    background: #fff;
}

#my-page .main-contents .group .icon-box li{
    overflow: hidden;
    position: relative;
    float: left;
    width: 25%;
    padding: 0px 20px;
}

#my-page .main-contents .group .icon-box li img{
    margin-bottom: 8px;
}

#my-page .main-contents .group .icon-box ul.line li{
    padding: 20px 0px;
    text-align: center;
}

#my-page .main-contents .group .icon-box .line:nth-child(2n) li{
    border-top: 1px solid #d4d4d4;
}

#my-page .main-contents .group .icon-box ul.line li::after{
    position: absolute;
    content: '';
    top: 50%;
    transform : translate(0%, -50%);
    -webkit- transform : translate(0%, -50%);
    -moz-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    -o-transform: translate(0%, -50%);
    right: 0px;
    width: 1px;
    height: 50%;
    background: #d4d4d4;
}

#my-page .main-contents .group .icon-box ul.line li:last-child::after{
    content: '';
    width: 0px;
}

#my-page .main-contents .group .icon-box .line li a{
    display: block;
    font-size: 15px;
    letter-spacing: -1px;
    color: #3d4655;
}

#my-page .main-contents .group .icon-box .line li a span{
    display: block;
}

/* 마이페이지 - 레이아웃 - 가운데,메인 컨텐츠 영역 - 오른쪽 사이드.광고영역 */
#my-page .side-banner{
    padding: 55px 0px 30px;
}


/* **************************************** *
 * 마이페이지 - 아이디
 * **************************************** */
#my-page .container-fluid.wrap-myid{
    padding: 35px;
    border-top: 1px solid rgba(241, 241, 241, .3);
    background: #e0e0e0;
    background-image: linear-gradient(90deg, #3f7dff, #0c57f0);
    overflow-x: scroll;
}

#my-page .container-fluid.wrap-myid .wrap{
    width: 1140px;
    margin: 0 auto;
}

#my-page .container-fluid.wrap-myid .wrap .myid{
    display: inline-block;
    padding: 0px 20px;
}

#my-page .container-fluid.wrap-myid .wrap .myid p{
    font-size: 24px;
    color: #fff;
}

#my-page .container-fluid.wrap-myid .wrap .myid ul{
    display: inline-block;
}

#my-page .container-fluid.wrap-myid .wrap .myid ul li{
    float: left;
    margin-right: 0px;
}

#my-page .container-fluid.wrap-myid .wrap .myid ul li a{
    display: inline-block;
    padding: 5px 0px;
    margin-right: 10px;
    font-size: 16px;
    color: rgba(255, 255, 255, 1);
}

#my-page .container-fluid.wrap-myid .wrap .myid-info{
    float: right;
    padding: 10px;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 3px;
}

#my-page .container-fluid.wrap-myid .wrap .myid-info li{
    position: relative;
    float: left;
    padding-right: 10px;
    margin-right: 10px;
}

#my-page .container-fluid.wrap-myid .wrap .myid-info li span.sports{
    color: #6fd2ff;
}

#my-page .container-fluid.wrap-myid .wrap .myid-info li span.culture{
    color: #cddc39;
}

#my-page .container-fluid.wrap-myid .wrap .myid-info li:last-child{
    margin-right: 0px;
}

#my-page .container-fluid.wrap-myid .wrap .myid-info li::after{
    position: absolute;
    content: '';
    top: 7px;
    right: 0px;
    width: 1px;
    height: 20px;
    background: rgba(255, 255, 255, .3);
}

#my-page .container-fluid.wrap-myid .wrap .myid-info li:last-child::after{
    display: none;
}

#my-page .container-fluid.wrap-myid .wrap .myid-info li a{
    font-size: 15px;
    line-height: 30px;
    color: rgba(255, 255, 255, .7);
}

#my-page .container-fluid.wrap-myid .wrap .myid-info li a:hover{
    color: rgba(255, 255, 255, 1);
}


/* **************************************** *
 * 마이페이지 - 서브메뉴
 * **************************************** */

/* 제휴시설 - 메인 - 메뉴 */
#my-page .container-fluid.menu-2depth{
    margin-bottom: 0px;
    background: #fff;
    border-bottom: 0px solid rgba(221, 221, 221, 0.5);
    overflow-x: scroll;
}

#my-page .container-fluid.menu-2depth::-webkit-scrollbar{
    height: 0px;
}

#my-page .container-fluid.menu-2depth .wrap-menu{
    width: 1140px;
    padding: 0px 0px 0px;
    margin: 0px auto 0px;
    overflow: hidden;
}

#my-page .container-fluid.menu-2depth .wrap-menu ul li{
    position: relative;
    float: left;
    width: auto;
    padding: 0px 0px;
    text-align: center;
    background: transparent;
}

#my-page .container-fluid.menu-2depth .wrap-menu.width20 ul li{
    position: relative;
    float: left;
    width: 20%;
    padding: 15px 0px;
    text-align: center;
    background: transparent;
}

#my-page .container-fluid.menu-2depth .wrap-menu ul li::after{
    content: '';
    position: absolute;
    top: 22px;
    right: 0px;
    width: 0px;
    height: 16px;
    background: #d7dce4;
}

#my-page .container-fluid.menu-2depth .wrap-menu ul li:last-child::after{
    content: '';
    position: absolute;
    right: 0px;
    width: 0px;
    height: 30px;
    background: #ddd;
}

#my-page .container-fluid.menu-2depth .wrap-menu ul li a{
    position: relative;
    display: inline-block;
    padding: 20px 24px;
    font-size: 18px;
    letter-spacing: -1px;
    color: #666;
}

#my-page .container-fluid.menu-2depth .wrap-menu ul li a:hover{
    color: #007bff;
}

#my-page .container-fluid.menu-2depth .wrap-menu ul li a::after{
    content: '';
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 0%;
    height: 2px;
    background: #007bff;
    transition: all 300ms;
}

#my-page .container-fluid.menu-2depth .wrap-menu ul li a:hover::after{
    content: '';
    width: 100%;
    height: 2px;
    background: #007bff;
}

#my-page .container-fluid.menu-2depth .wrap-menu ul li a.active{
    color: #007bff;
}

#my-page .container-fluid.menu-2depth .wrap-menu ul li a.active::after{
    content: '';
    position: absolute;
    right: 0px;
    bottom: 0px;
    width: 100%;
    height: 2px;
    background: #007bff;
}


/* 마이페이지 - 3depth menu */
.col-3depth-menu{
    padding: 0px;
    border-left: 1px solid #d7dce4;
    border-bottom: 1px solid #d7dce4;
}

.container .menu-3depth{
	position: relative;
    margin-bottom: 25px;
    background: transparent;
    border-bottom: 0px solid rgba(221, 221, 221, 0.7);
    overflow-x: scroll;
}

.container .menu-3depth::after{
	content: '';
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: 100%;
	height: 1px;
	background: rgba(221, 221, 221, 0.7);
}

.container .menu-3depth::-webkit-scrollbar{
    height: 0px;
}

.container .menu-3depth .wrap-menu{
    width: 820px;
    border-bottom: 0px solid #d7dce4;
    padding: 0px 0px 0px;
    margin: 0px auto 0px;
}

.container .menu-3depth .wrap-menu ul li{
    position: relative;
    float: left;
    width: auto;
    padding: 0px 0px;
    border-bottom: 0px solid #d7dce4;
    text-align: center;
    background: transparent;
}

.container .menu-3depth .wrap-menu.width14 ul li{
    width: 14.2%;
}

.container .menu-3depth .wrap-menu.width20 ul li{
    position: relative;
    float: left;
    width: 20%;
    padding: 15px 0px;
    text-align: center;
    background: transparent;
}

.container .menu-3depth .wrap-menu ul li::after{
    content: '';
    position: absolute;
    top: 22px;
    right: 0px;
    width: 0px;
    height: 16px;
    background: #d7dce4;
}
.container .menu-3depth .wrap-menu ul li:last-child::after{
    content: '';
    position: absolute;
    right: 0px;
    width: 0px;
    height: 30px;
    background: #ddd;
}

.container .menu-3depth .wrap-menu ul li a{
    position: relative;
    display: inline-block;
    padding: 15px 15px;
    letter-spacing: -1px;
    color: #333;
}

.container .menu-3depth .wrap-menu ul li a:hover{
    color: #1f66f5;
}

.container .menu-3depth .wrap-menu ul li a::after{
    content: '';
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 0%;
    height: 1px;
    background: #333;
    transition: all 300ms;
}

.container .menu-3depth .wrap-menu ul li a:hover::after{
    content: '';
    width: 0%;
    height: 0px;
    background: transparent;
}

.container .menu-3depth .wrap-menu ul li a.active{
    font-weight: 400;
    color: #1f66f5;
}

.container .menu-3depth .wrap-menu ul li a.active::after{
    content: '';
    position: absolute;
    right: 0px;
    bottom: 0px;
    width: 100%;
    height: 1px;
    background: #1f66f5;
	z-index: 2;
}


#my-page .menu-4depth{
	position: relative;
    padding-top: 0px;
    padding-bottom: 0px;
	margin-bottom: 30px;
	border-bottom: 0px solid #e8ecf4;
    background: transparent;
}

#my-page .menu-4depth::after{
    content: '';
    position: absolute;
    left: 0px;
    bottom: 4px;
    width: 100%;
    height: 1px;
    background: #e8ecf4;
}

#my-page .menu-4depth .wrap-menu{    
	margin-bottom: -4px;	
}

#my-page .menu-4depth .wrap-menu ul{
    display: inline-block;
}

#my-page .menu-4depth .wrap-menu ul li{
    float: left;
    width: auto;
    padding: 0px 0px;
    margin-right: 0px;
    text-align: center;
    background: transparent;
}

#my-page .menu-4depth .wrap-menu ul li a{
    position: relative;
    display: inline-block;
    padding: 11px 20px;
    border-radius: 0px;
    background: transparent;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -.5px;
    color: #666;
    transition: all 150ms;
}

#my-page .menu-4depth .wrap-menu ul li a:after{
    position: absolute;
    content: '';
    top: 17px;
    right: 0px;
    width: 1px;
    height: 14px;
    background: #d2d2d2;
}

#my-page .menu-4depth .wrap-menu ul li:last-child a:after{
    display: none;
}


#my-page .menu-4depth .wrap-menu ul li:first-child a{
    border-radius: 0px 0px 0px 0px;
}

#my-page .menu-4depth .wrap-menu ul li:last-child a{
    border-radius: 0px 0px 0px 0px;
}

#my-page .menu-4depth .wrap-menu ul li{
	position: relative;
}

#my-page .menu-4depth .wrap-menu ul li a.active{
    border-bottom: 0px solid #333;
    background: transparent; 
    color: #1f66f5;
}

#my-page .menu-4depth .wrap-menu ul li a.active::before{
	content: '';
    position: absolute;
	left: 0px;
	bottom: 0px;
	width: 100%;
	height: 1px;
	background: #1f66f5;
	z-index: 90;
}


/* **************************************** *
 * 마이페이지 - 컨텐츠
 * **************************************** */
#my-page .col-main-contents{
    min-height: 90vh;
    border-left: 1px solid #f4f4f4;
    background: #fff;
}

#my-page .page-header {
    padding-bottom: 0px;
    margin: 45px 0 45px;
    border-bottom: 0px solid #eee;
}

#my-page .page-header .page-title{
    font-size: 36px;
	font-weight: 400;
    letter-spacing: -1px;
    text-align: center;
    color: #333;
}

p.title{
    margin-bottom: 10px;
    font-size: 19px;
    font-weight: 500;
    letter-spacing: -1px;
    color: #000;
}

p.title-radio{
	display: inline-block;
	margin-right: 10px;
	font-size: 15px;
	font-weight: 400;
	line-height: 21px;
}

/* 컨텐츠 - 정보박스 */
.box-info{
    overflow: hidden;
    padding: 0px;
    margin-bottom: 10px;
    border: 1px solid #e8e8e8;
    border-radius: 5px;
    background: #fbfbfb;
}

.box-info.no-border{
    overflow: hidden;
    padding: 0px;
    margin-bottom: 20px;
    border: 0px solid #e8e8e8;
    border-radius: 5px;
    background: #fff;
}

.box-info:last-child{
    margin-bottom: 0px;
}

.box-info .row-inner{
    overflow: hidden;
    padding: 25px 20px;
    margin-bottom: 0px;
    border-bottom: 1px dashed #d7dce4;
    word-break: keep-all;
}

.box-info .row-inner.no-border{
	padding-top: 20px;
    padding-bottom: 10px;	
    margin-bottom: 10px;
    border-bottom: 0px solid #d7dce4;
}

.box-info .row-inner.no-border.space-tiny{
	padding-top: 10px;
    padding-bottom: 5px;	
    margin-bottom: 5px;
    border-bottom: 0px solid #d7dce4;
}

.box-info .row-inner:last-child{
    margin-bottom: 0px;
    border-bottom: 0px solid #d7dce4;
}

.box-info .row-inner.no-pd{
    width: 100%;
    padding: 0px 0px;
    margin-bottom: 40px;
    border-bottom: 0px solid #d7dce4;
}

.box-info .row-inner.row-button{
    padding: 0px 20px 10px;
}

.box-info .row-inner.row-bottom{
    padding: 10px 5px 10px;
	margin-bottom: 0px
}

.box-info .row-inner p.title{
	padding-left: 0px;
    margin-bottom: 10px;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -1px;
    color: #000;
}

.box-info .row-inner p.title-small{
    margin-bottom: 20px;
    font-size: 17px;
    letter-spacing: -.5px;
    color: #222;
}

.box-info .row-inner.txt-center > p.title{
    margin-bottom: 30px;
    font-size: 20px;
}

.box-info .row-inner ul li .point{
    border-bottom: 0px dotted #1f66f5;
    font-weight: 400;
    color: #333;
}

.box-info .row-inner.myinfo{
	padding: 10px 0px;
    text-align: center;
	border-right: 0px;
    border-bottom: 0px solid #fff;
}

.box-info .row-inner.myinfo:first-child{
    border-right: 0px solid #ddd;
}

.box-info .row-inner.myinfo p.title{
    font-size: 17px;
    font-weight: 400;
    color: #333;
}

.box-info .row-inner.myinfo .desc{
    font-size: 30px;
    font-weight: 500;
    color: #4c6392;
}

.box-info .row-inner.row-caution {
	clear: both;
	padding: 7px 7px; 
    border-top: 0px solid #e8e8e8;
}

.box-info .row-inner.row-caution .alert.caution{
	margin-bottom: 0px;
}


/* 컨텐츠 - 정보박스 */
.list-check li{
    display: inline-block;
    position: relative;
    width: auto;
	padding-bottom: 7px;
    margin-bottom: 7px;
}

.list-check.switchs li{  
    border-bottom: 1px solid #ddd;
	font-size: 13px;
}

.list-check.switchs li::after{  
    position: absolute;
    content: '';
    top: 11px;
    left: 5px;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #9a9a9a;
}

.list-check.switchs li:last-child{  
	padding-bottom: 0px;
	margin-bottom: 0px;
    border-bottom: 0px;
}

.list-check li > span{    
	padding-left: 15px;
	font-weight: 300;
	line-height: 1.8;
}


.list-check.width100 li{
    width: 100%;
}

.list-check li label{
    padding-left: 28px;
    font-weight: 300;
    line-height: 1.4;
}

.list-check.third{
    display: inline-block;
    width: 100%;
}

.list-check.third li{
    float: left;
    width: 33.3%;
}

.list-check.third.mems li{
    margin-bottom: 5px;
}

.list-check.agree{
    float: right;
    display: inline-block;
}

.list-check.agree li{
    float: left;
    margin-right: 10px;
}


/* **************************************** *
 * 마이페이지 - 타이틀 박스
 * **************************************** */
.box-bg{
	position: relative;
	display: inline-block;
    width: 100%;
    min-height: auto;
    border-radius: 5px;
    padding: 35px 50px;
    margin-bottom: 15px;
	background-position: center;
}

.box-bg p {
    color: #666;
}

.box-bg .title{
    font-size: 28px;
    font-weight: 400;
    letter-spacing: -1px;
    color: #101010;
}

.box-bg .stepNbr{
    display: block;
	padding: 3px 5px;
    margin-bottom: 10px;
	border-bottom: 1px solid #ddd;
    border-radius: 0px;
    font-size: 15px;
    font-weight: 500;
    line-height: 25px;
    color: #1f66f5;    
}

.box-bg .subTitle{
    font-size: 16px;
    font-weight: 300;
    color: #101010;
    word-break: keep-all;
}

.box-bg.edit{
    /*  background: #f7f7f7 url('/images/mypage/img-edit-disable.jpg')no-repeat;
	background-size: cover;
	background-position: center;*/
	background: #f7f7f7;
    background-size: cover;
    background-position: center;
}
.box-bg .row-inner.width50{width:100%;}

.box-bg.stop{
    /*  background: url('/images/mypage/img-stop.jpg')no-repeat;
	background-size: cover;
	background-position: center;*/
	background: #f7f7f7;
    background-size: cover;
    background-position: center;
}

.box-bg.change{
    /*background: url('/images/mypage/img-change.jpg')no-repeat;
	background-size: cover;
	background-position: center;*/
	background: #f7f7f7;
    background-size: cover;
    background-position: center;
}

.box-bg.payedit{
    /*background: url('/images/mypage/img-payedit.jpg')no-repeat;
	background-size: cover;
	background-position: center;*/
	background: #f7f7f7;
    background-size: cover;
    background-position: center;
}

.box-bg.sportsEdit{
    background: #f7f7f7;
}

.box-bg.addDoc{
    /*background: url('/images/mypage/img-addDoc.jpg')no-repeat;
	background-size: cover;
	background-position: center;*/
	background: #f7f7f7;
    background-size: cover;
    background-position: center;
}

.box-bg.addPic{
    /*background: url('/images/mypage/img-addPic.jpg')no-repeat;
	background-size: cover;
	background-position: center;*/
	background: #f7f7f7;
    background-size: cover;
    background-position: center;
}

.box-bg.editStart{
    background: url('/images/mypage/img-addPic.jpg')no-repeat;
	background-size: cover;
	background-position: center;
}

.box-bg.oneday{
    background: url('/images/mypage/img-addPic.jpg')no-repeat;
	background-size: cover;
	background-position: center;
}

.box-bg.reStart{
    background: #f7f7f7;
}

.box-bg.regFamily{
    background: #f7f7f7;
}

.box-bg.addpoint{
    background: #f7f7f7;
}

.box-bg.delId{
    background: #f7f7f7;
	background-position: center;
}


/* **************************************** *
 * 마이페이지 - 메인화면
 * **************************************** */

.box-notice {
    overflow: hidden;
    padding: 0px;
    margin-bottom: 0px;
    border: 1px solid #e8e8e8;
    border-radius: 5px;
    background: #fbfbfb;
}

.box-notice .row-inner {
    overflow: hidden;
    padding: 0px 0px;
    margin-bottom: 0px;
    word-break: keep-all;
}

.box-notice .row-inner .tit {
    float: left;
	display: inline-block;
	width: 10%;
	padding: 7px 5px;
	border-right: 0px solid #ddd;
	background: #767e84;
	text-align: center;
}

.box-notice .row-inner .tit p{
    margin-bottom: 0px;
    font-weight: 400;
    color: #f7f7f7;
    font-size: 13px;
    line-height: 22px;
}

.box-notice .row-inner .item-notice{
	position: relative;
	float: left;	
	display: inline-block;
	width: 80%;
	height: 33px !important;
	padding: 0px 10px;
	border-right: 1px solid #ddd;
	overflow-y: hidden;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.box-notice .row-inner .item-notice ul {	
    display: block;
	padding-top: 7px;
}

.box-notice .row-inner .item-notice ul li{
	float: left;
	display: inline-block;
	width: 100%
}

.box-notice .row-inner .item-notice ul li a{
	line-height: 1.2;
}


.box-notice .row-inner .more {
    float: left;
	display: inline-block;
	width: 10%;
	padding: 7px 5px;
	text-align: center;
}

.box-notice .row-inner .more a{
	padding: 0px 9px;
    margin-bottom: 0px;
	font-size: 15px;
	text-align: center;
}


/* **************************************** *
 * 멤버십 조회변경
 * **************************************** */
/*
#direct, #bank{
	display: none;
}

#direct.show, #bank.show{
	display: block;
}
*/

/* **************************************** *
 * 멤버십 등급변경
 * **************************************** */
.wrap-prc .list-prc{
    overflow: hidden;
    width: 100%;
    margin-bottom: 20px;    
    margin-top: 20px;
    background: #fff;
}

.wrap-prc .list-prc li{
    float: left;
    width: 33%;
    padding: 0px;
    text-align: center;
    font-size: 17px;
    color: #adadad;
}

.wrap-prc .list-prc li:last-child{
    width: 34%;
}

.wrap-prc .list-prc li .nbr{
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-right: 10px;
    border-radius: 50%;
    background: #a3a7ac;
    font-size: 14px;
    font-weight: 500;
    line-height: 23px;
    color: #fff;
}

.wrap-prc .list-prc li.active{
    background: transparent;
    color: #1f66f5;
}

.wrap-prc .list-prc li.active .nbr{
    background: #1f66f5;
    color: #fff;
}


.wrap-prc .list-prc.wd20 li{
    width: 20%;
}

.wrap-prc .list-prc.wd50 li{
    width: 50%;
}


/* 멤버십 등급변경 - 스포츠 등급 - 등급전체보기 */
.wrap-gradeInfo{
    display: inline-block;
    float: left;
    width: 100%;
    border-bottom: 1px solid #ddd;
}

.wrap-gradeInfo:last-child{
    display: inline-block;
    float: left;
    width: 100%;
    margin-bottom: 0px;
    border-bottom: 0px solid #a5c1fd;
}

.wrap-gradeInfo p{
    font-size: 16px;
}

.wrap-gradeInfo p .point{
    color: #1f66f5;
}
.list-grade{
    display: inline-block;
    width: 100%;
}

.list-grade > li{
    float: left;
    display: inline-block;
    width: 50%;
    font-size: 15px;
}

.list-grade li.name{
    font-size: 23px;
    font-weight: 500;
    letter-spacing: -.5px;
    color: #333;
}

.list-grade li.name.plus{
    font-size: 23px;
    font-weight: 500;
    letter-spacing: -.5px;
    color: #333;
}

.list-grade > li:last-child{
    float: right;
    text-align: right;
}

.box-info.grade{
    overflow: hidden;
    float: left;
    width: 100%;    
    margin-bottom: 25px;
    border: 1px solid #9f9f9f;
    border-radius: 10px;
    background: #fff;
}

.box-info.grade .wrap-gradeInfo .wrap{
    padding: 25px 35px;
}

.box-info.grade .wrap-gradeInfo .wrap.desc{
    padding: 7px 30px;
	margin-bottom: 0px;
    background: #f5f5f5;
}

.box-info.grade .wrap-gradeInfo .wrap.desc ul{
    display: inline-block;
}

.box-info.grade .wrap-gradeInfo .wrap.desc ul li{
    float: left;
    margin-right: 15px;
    color: #7f8386;
}

.box-info.grade .wrap-gradeInfo .wrap.desc ul li .point{
    font-weight: 500;
    color: #666;
}

.box-info.grade .wrap-gradeInfo .modal-body .wrap{
	display: inline-block;
    width: 100%;
	padding: 0px 0px;
}

/* 멤버십 등급변경 - 컬처 등급 - 등급전체보기 */
.box-info.grade.culture .wrap-gradeInfo{
	position: relative;
    display: inline-block;
    float: left;
    width: 30%;
    height: 150px;
   /*  padding: 20px 20px; */
    border-right: 1px solid #d7dce4;
	border-bottom: 0px;
}
.box-info.grade.culture .wrap-gradeInfo.addition_1{
	padding: 55px 15px 53px 38px;
}

/******* 1471-1475 line 삭제요망 ******/
.box-info.grade.culture .wrap-gradeInfo.Sw_class_bg{
	background: url('/images/membership/Sw_class_bg.jpg') no-repeat;

}

.box-info.grade.culture .wrap-gradeInfo img.class-bg {
	z-index: -100;
	position: absolute;
	top: 0;
	height: 100%;
}
.box-info.grade.culture .wrap-gradeInfo:nth-child(2){
    width: 70%;
    border-right: 0px solid #d7dce4;
}

.icon{
	margin-right: 7px;
}


/* 멤버십 등급변경 - 스포츠 등급 - 등급변경 */
.wrap-slt-place{
    
}

.wrap-slt-place .slt-title{
    padding: 20px;
    text-align: center;
    background: #e1e7f7;
}

.wrap-slt-place .slt-title p{
    margin-bottom: 0px;
    font-size: 16px;
    font-weight: 400;
    color: #1f66f5;
}
.wrap-slt-place .col-md-12.slt-grade{
    padding: 20px 0px;
    border-top: 1px solid #d5d5d6;
    border-right: 1px solid #d5d5d6;
    background: #fff;
    text-align: center;
}
.wrap-slt-place .col-md-6.slt-grade{
    padding: 20px 0px;
    border-top: 1px solid #d5d5d6;
    border-right: 1px solid #d5d5d6;
    background: #fff;
    text-align: center;
}
.wrap-slt-place .col-md-2.slt-grade{
	
    padding: 20px 0px;
    border-top: 1px solid #d5d5d6;
    border-right: 1px solid #d5d5d6;
    background: #fff;
    text-align: center;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: stretch;
    align-items: center;
    justify-content: space-between;
    height: auto;
}
.wrap-slt-place .col-md-3.slt-grade{
    padding: 20px 0px;
    border-top: 1px solid #d5d5d6;
    border-right: 1px solid #d5d5d6;
    background: #fff;
    text-align: center;
}

.wrap-slt-place .col-md-4.slt-grade{
    padding: 20px 0px;
    border-top: 1px solid #d5d5d6;
    border-right: 1px solid #d5d5d6;
    border-bottom: 1px solid #d5d5d6;
    background: #fff;
    text-align: center;
}
.wrap-slt-place .col-md-12.slt-grade .slt-name{
    position: relative;
    font-size: 26px;
    font-weight: 400;
    letter-spacing: -.5px;
    color: #1f66f5;
}
.wrap-slt-place .col-md-6.slt-grade .slt-name{
    position: relative;
    font-size: 26px;
    font-weight: 400;
    letter-spacing: -.5px;
    color: #1f66f5;
}
.wrap-slt-place .col-md-2.slt-grade .slt-name{
    position: relative;
    font-size: 17px;
    font-weight: 400;
    letter-spacing: -.5px;
    color: #1f66f5;
}
.wrap-slt-place .col-md-3.slt-grade .slt-name{
    position: relative;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: -.5px;
    color: #1f66f5;
}

.wrap-slt-place .col-md-4.slt-grade .slt-name{
    position: relative;
    font-size: 26px;
    font-weight: 400;
    letter-spacing: -.5px;
    color: #1f66f5;
}

.wrap-slt-place .col-md-6.slt-grade .slt-name .plus{
    position: absolute;
    display: inline-block;
    top: 4px;
    padding: 5px 10px;
    margin-left: 5px;
    border-radius: 7px;
    background: #1f66f5;
    background-image: linear-gradient(90deg, #3f7dff, #0c57f0);
    font-size: 12px;
    font-weight: 500;
    color: #fff;
}
.wrap-slt-place .col-md-12.slt-grade .list-slt-price{
    display: inline-block;
    width: 100%;
    margin-bottom: 15px;
}
.wrap-slt-place .col-md-6.slt-grade .list-slt-price{
    display: inline-block;
    width: 100%;
    margin-bottom: 15px;
}

.wrap-slt-place .col-md-2.slt-grade .list-slt-price{
    display: inline-block;
    width: 100%;
    margin-bottom: 15px;
}

.wrap-slt-place .col-md-3.slt-grade .list-slt-price{
    display: inline-block;
    width: 100%;
    margin-bottom: 15px;
}

.wrap-slt-place .col-md-4.slt-grade .list-slt-price{
    display: inline-block;
    width: 100%;
    margin-bottom: 15px;
}

.wrap-slt-place .col-md-6.slt-grade ul li.pre{
    text-decoration: line-through;
    color: #666;
}

.wrap-slt-place .col-md-6.slt-grade ul li.after{
    font-size: 18px;
    color: #333;
}

.wrap-slt-place .col-md-3.slt-grade ul li.after{
    font-size: 18px;
    color: #333;
}

.wrap-slt-place .col-md-4.slt-grade ul li.after{
    font-size: 18px;
    color: #333;
}


/* 멤버십 등급변경 - 스포츠 등급 - 등급변경안내 */
#change-info {
	overflow: hidden;
	padding-bottom: 0px;
	margin-bottom: 50px;
    border: 0px solid #ddd;
    border-radius: 5px;
}

#change-info .wrap{
    overflow: hidden;
}

#change-info .box-info.before, #change-info  .box-info.after{
    overflow: visible;
    position: relative;
    float: left;
    width: 49%;
    padding: 35px 0px;
    margin-bottom: 0px;
    border: 1px solid #e7e7ea;
    border-radius: 5px;
    text-align: center;
    margin: 0px .5%;
}

#change-info  .box-info.after{
    background: #f7f7f7;
}

#change-info .box-info.before p, .box-info.after p{
    font-size: 32px;
	color: #c5c9ce;
}

#change-info .box-info.before .title, .box-info.after .title{
    font-size: 17px;
	color: #a3a7ac;
}

#change-info .box-info.after p{
    position: relative;
    font-weight: 500;
    color: #3a4354;
}

#change-info .box-info.after p span.plus {
    position: absolute;
    display: inline-block;
    top: 4px;
    padding: 5px 10px;
    margin-left: 5px;
    border-radius: 7px;
    background: #1f66f5;
    background-image: linear-gradient(90deg, #3f7dff, #0c57f0);
    font-size: 12px;
    font-weight: 500;
    color: #fff;
}


#change-info .box-info.before::after{
    position: absolute;
    content: '';
    top: 47px;
    right: -40px;
    width: 70px;
    height: 70px;
    border-radius: 25px;
    background: url('/images/mypage/bg-arrow.png')no-repeat center center;
    font-size: 35px;
    line-height: 50px;
    color: #333;
    z-index: 2;
}

#now{
    display: none;
}

#now.active{
    display: block;
}

#next{
    display: none;
}

#next.active{
    display: block;
}



#my-page .menu-imageLink{
    padding-top: 0px;
    padding-bottom: 0px;
	margin-bottom: 15px;
	border-bottom: 0px solid #e8ecf4;
    background: transparent;
    text-align:center;
}

#my-page .menu-imageLink .wrap-menu{    
	margin-bottom: -4px;	
}

#my-page .menu-imageLink .wrap-menu ul{
    display: block;
    width: 100%;
    overflow: hidden;
    font-size: 0;
}

#my-page .menu-imageLink .wrap-menu ul li{
    width: 49%;
    display: inline-block;
    color: #6c6f73;
}

#my-page .menu-imageLink .wrap-menu ul li a:hover,#my-page .menu-imageLink .wrap-menu ul li a.active{
    border: 2px solid #4f7dff; 
    color: #4f7dff; 
}
#my-page .menu-imageLink .wrap-menu ul li a:hover span,#my-page .menu-imageLink .wrap-menu ul li a.active span{
    padding-left: 20px;
    background: url(/images/join/btn_check.png)no-repeat 0px 11px;
    background-position-y: 50%;
}

#my-page .menu-imageLink .wrap-menu ul li a{
    position: relative;
    display: block;
    width: 100%;
    padding: 12px 16px 12px 16px;
    font-size: 18px;
    font-weight: 300;
    letter-spacing: -.5px;
    color: #6c6f73;
    transition: all 150ms;
    border: 1px solid #bebebe;
    border-radius: 3px;
}

#my-page .menu-imageLink .wrap-menu ul li a i{
    position: absolute;
	top: 10px;
	left: 21px;
    font-size: 21px;
    line-height: 35px;
}

#my-page .menu-imageLink .wrap-menu ul li a:after{
    position: absolute;
    content: '';
    top: 17px;
    right: 0px;
    width: 0px;
    height: 22px;
}

#my-page .menu-imageLink .wrap-menu ul li:last-child a:after{
    display: none;
}

#my-page .menu-imageLink .wrap-menu ul li:first-child{
	margin-right: 2%;
}
#my-page .menu-imageLink .wrap-menu ul li{
	position: relative;
}





/* 멤버십 등급변경 - 스포츠 등급 - 등급변경안내 -  자동출금신청서 */
.box-info .row-inner .wrap.privacy .title{
    float:left;
    padding-left: 25px;
    font-size: 17px;
    letter-spacing: -.5px;
    color: #222;
}

.box-info .row-inner .wrap.privacy .btn.more{
    font-size: 15px;
    letter-spacing: -.5px;
    text-align: right;
    color: #222;
    width:auto;
}

.box-info .row-inner .agree1_wrap, .box-info .row-inner .agree2_wrap, .box-info .row-inner .agree3_wrap, .box-info .row-inner .agree4_wrap{
    display: none;
}

.box-info .row-inner .agree1_wrap.on, .box-info .row-inner .agree2_wrap.on, .box-info .row-inner .agree3_wrap.on, .box-info .row-inner .agree4_wrap.on{
    display: block;
}


/* 멤버십 등급변경 - 결제정보 변경 */
.payment02{
	display: none;
}


/* **************************************** *
 * 로그인
 * **************************************** */
#login .login-form .page-header{
	text-align: left;
	border-bottom: 0px;
}

#login .login-form .page-header .page-title{
	margin-bottom: 15px;
    font-size: 36px;
    font-weight: 100;
	letter-spacing: -1px;
}
#login .login-form .page-header > p{
    font-size: 18px;
    color:#6C6F73;
}

#login .login-form {
	width: 560px;
	margin: 50px auto 70px;
}

#login .login-form fieldset{
	padding-bottom: 5px;
}

#login .login-form fieldset .row-inner{
    overflow: hidden;
}

#login .login-form fieldset .wrap.login{
	position: relative;
}

#login .login-form fieldset .wrap.login .box-input{
	float: left;
	width: 100%;
}

#login .login-form fieldset .wrap.login .box-input .row-inner{
	margin-bottom: 15px;
}

.login-form .box-button {
    margin-top: 30px;
    padding-bottom: 40px;
    border-bottom: 0px solid #efefef;
}

.login-form .box-button_2 {
    font-size: 15px;
    border-bottom: 0px solid #efefef;
    margin-bottom: 20px;
    position: relative;
    
}

.login-form .box-button_2 .ico-join-type {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 54px;
	height: 100%;	
	border: 1px solid #80A9FF;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}
.login-form .ico-join-phon {
	background: #E8F2FB url(/images/icon/icon_login_phon.png) center center no-repeat;
	background-size: 26px 34px;
}

.login-form .ico-join-id {
	background: #fff url(/images/icon/icon_login_id.png) center center no-repeat;
	background-size: 26px 34px;
}


#login .login-form fieldset .wrap.login .box-button{
	float: right;
	width: auto;
	padding-top: 0px;
	text-align: right;
}

#login .login-form fieldset .wrap.login .box-button .btn{
	font-size: 16px;
}

#login .login-form fieldset .wrap.login .box-button .btn.small{
	font-size: 13px;
    padding: 8px 17px;
    border-radius: 3px;
}

#login .login-form fieldset .wrap.login .box-button .btn.receive{
	font-size: 14px;
    padding: 10px 15px;
	margin-right: 5px;
    border-radius: 3px;
	color: #666;
}

#login .login-form fieldset .wrap.login .row-inner label{
	width: auto;
	margin-right: 10px;
}

#login .login-form fieldset .wrap.login .row-inner input{
	width: 100%;
}

#login .login-form fieldset .wrap.login.main .box-input{
	float: left;
	width: 100%;
}

#login .login-form fieldset .wrap.login.main .box-button{
	float: right;
	width: 18%;
	padding-top: 0px;
	text-align: right;
}

#login .login-form fieldset .wrap.login.main .box-button .btn{
	width: 100%;
	/*height: 113px;*/
	font-size: 16px;
    /*line-height: 88px;*/
	border-radius: 3px;
}

#login .login-form fieldset .wrap.login.main .row-inner label{
	width: auto;
	margin-right: 10px;
}

#login .login-form fieldset .wrap.login.main .row-inner input{
	width: 100%;
}

#login .login-form fieldset .row-inner .remember{
	float: left;
}

#login .login-form fieldset .row-inner .find{
	float: right;
}

#login .login-form fieldset .row-inner .find ul li{
	position: relative;
	float: left;
	padding-right: 10px;
	margin-right: 10px;
}

#login .login-form fieldset .row-inner .find ul li a{
	font-size: 13px;
	color: #888888;
}


#login .login-form fieldset .row-inner .find ul li:last-child{
	padding-right: 0px;
	margin-right: 0px;
}

#login .login-form fieldset .row-inner .find ul li::after{
	position: absolute;
	content: '';
	width: 2px;
	height: 2px;
	top: 50%;
	right: 0px;
	background: #8e8e8e;
}

#login .login-form fieldset .row-inner .find ul li:last-child::after{	
	width: 0px;
	height: 0px;
}

#login .login-form .wrap.regBanner{
	padding: 20px 0px 0px;
	border-top: 0px solid #ddd;
	margin-bottom: 0px;
	text-align: center;
}

#login .login-form .wrap.regInfo{
	padding: 0px 0px;
	border-top: 1px solid #ddd;
	margin: 60px 0;
	text-align: left;
}

#login .login-form .wrap.regInfo .wrap-text .title{ 
    margin-top:30px;
    margin-bottom: 10px;
    font-size: 16px;
    letter-spacing: 0;
    font-weight: 300;
    color:#6C6F73;
}

#login .login-form .row-inner .input_wrap{ 
	width: 100%;
}

#login .login-form fieldset .wrap.login .row-inner .input_wrap input{
	width: 100%;
	line-height: 22px;
}

#login .login-form fieldset .wrap.login .row-inner .input_wrap select{ 
	width: 10.5%;
}

.login-form-event{
    margin-bottom:40px;
}

.login-form-event img{
    width: 100%;
}



/* **************************************** *
 * 탈퇴
 * **************************************** */
.box-bg.delMem{
	position: relative;
	display: inline-block;
    width: 100%;
    min-height: auto;
    border-radius: 5px;
    padding: 35px 50px;
    margin-bottom: 0px;
	background: #FBFBFB;
	background-position: center;
	border: 1px solid #E8E8E8;
}

.box-bg.delMem .title {
    font-size: 24px;
    font-weight: 400;
    letter-spacing: -1px;
    color: #333;
}

.box-bg.delMem .desc ul li{
	margin-bottom: 5px;
    font-size: 16px;
    font-weight: 300;
    color: #666;
}

.box-bg.delMem .desc ul.normal li::after {
    top: 11px;
}


.box-info .row-inner.myPoint{
    text-align: center;
}

.box-info .row-inner.myPoint p{
    margin-bottom: 5px;
	font-size: 16px;
	line-height: 1.2;
}

.box-info .row-inner.myPoint .score{
    display: block;
	font-size: 36px;
	font-weight: 500;
	letter-spacing: -.5px;
	color: #384765;
}

.box-info .row-inner.myPoint .score img{
    margin-top: -7px;
	margin-right: 5px;
}

.box-info .row-inner.myPoint .score span{    
	font-size: 21px;
	font-weight: 500;
}

.aboutCulture {
    text-align:center;
}

.box-info .row-inner.aboutCulture p{
    margin-bottom: 15px;
	font-size: 16px;
	line-height: 1.2;
}

.subject_btn {
    width: 18%;
    display: inline-block;
    margin-right: 2%;
    border: 1px solid #ddd;
    height: 150px;
    padding: 15px;
    vertical-align:middle;
}

.subject_btn:last-child {
    margin: 0;
}

.subject_btn_group img {
    display: block;
    margin: 0 auto;
    margin-bottom: 15px;
    max-width: 70px;
    width: 65%;
}

.subject_btn_group {
    display: flex;
}

.secession_quiz {
    font-size: 16px;
}

.secession_quiz .nbr {
    display: inline-block;
    width: 22px;
    height: 22px;
    margin-right: 5px;
    border-radius: 50%;
    background: #a3a7ac;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #fff;
    text-align: center;
    vertical-align: text-bottom;
}

.quiz_answer {width: 30%;display: inline-block;}

.secession_quiz .quiz_answer:hover .nbr {
    background-color: #5494fe;
}

.quiz_btn_group {
    text-align: center;
}

.quiz_btn_group .btn {
    display: inline-block;
    width: 25%;
    margin-bottom: 15px;
}

.quiz_btn_group .btn:first-child {
    margin-right: 10%;
}

.why_secession li {
    width: 50%;
    float: left;
}

.why_secession input[name="MD_SAYU"] + label + input {
    width: 95%;
}

.secession_pw_label {
    margin-top: 15px;
    color: #1f66f5;
    font-weight: 500;
    font-size: 16px;
}

.secession_pw_label input {
    margin-top:5px;
}

.modal-body .box-info .row-inner .title label.title.ft17 {
    vertical-align: text-bottom;
    padding:0 0 0 25px;
}


/* 친구추천하기 */
.recommend_title {
    font-size: 22px;
}

.title_friend {
    font-weight: 500;
    color: #00CA95;
}

.title_action {
    font-weight: 500;
    color: #000;
}

.recommend_reward {
    font-size: 32px;
    line-height: 2;
    color: #000;
}

.recommend_point + .recommend_reward {
    line-height: 1.3;
    display: block;
}

.recommend_point {
    font-size: 16px;
    color: #333;
}

.row + .row .recommend_title {
    line-height: 4;
}

.recommend + section .row {
    padding: 15px 0 30px;
}

.recommend + section .row + .row {
    border-top: 1px solid #ddd;
    position: relative;
    padding:30px 0 5px;
}

.recommend + section .row + .row:before {
    content: '+';
    position: absolute;
    color: #fff;
    font-size: 60px;
    display: inline-block;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    left: 50%;
    margin-left: -30px;
    top: 0;
    margin-top: -30px;
    z-index: 10;
    background-color: #FFCF70;
    text-align: center;
    font-weight: 900;
    line-height: 0.9;
}

.recommend + section .row .col-md-6 + .col-md-6 {
    padding-left: 45px;
}


.recommend + section .box-info .row-inner p.title {
    font-size:22px;
}

.list-share {
    width:100%;
    margin:0 auto;
}

.wrap.share .list-share li{
	float: left;
	width: 50%;
	border-right: 1px solid #e2e2e2;
}

.wrap.share .list-share li:last-child{
	border-right: 0px solid #e2e2e2;
}

.wrap.share .list-share li a{
	display: inline-block;
	width: 100%;
	padding: 20px 0px;
	text-align: center;
}

.wrap.share .list-share li a img{
	margin-bottom: 5px;
}

.wrap.share .list-share li a span{
	display: block;
	font-size: 14px;
	font-weight: 400;
}
/* 쿠폰함 - 2020.02.24 */
.list-coupon{
    width: 90%;
}

.list-coupon li{
    float: left;
    width: 100%;
    margin-bottom: 20px;
	border: 1px #5783FF solid;
    border-radius: 10px;
}

.list-coupon li .coupon{
    display: flex;
    border: 0px solid #ddd;
    margin: 0px 0px;
}

.list-coupon li .coupon .info-title{
    float: left;
    display: inline-block;
    width: 80%;
    padding: 15px;
}

.list-coupon li .coupon .info-title .cate{
    font-size: 13px;
    color: #ddd;
}

.list-coupon li .coupon .info-title .name{
    display: inline-block;
    width: 90%;
    padding: 20px 0px 10px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -.5px;
    text-align: left;
    color: #4f7dff;
}

.list-coupon li .coupon .info-desc{
    float: right;
    display: inline-block;
    width: 30%;
    position:relative;
}

.list-coupon li .coupon .info-desc .status{
    margin-bottom: 0px;
    font-weight: 500;
    color: white;
    border: 1px #5783FF solid;
    border-radius: 55px;
    width: 70px;
    height: 70px;
    vertical-align: middle;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    position: relative;
    font-size: 34px;
    line-height: 66px;
    background-color: #5783FF;
}

.list-coupon li .coupon-date-status-txt{
	background-color: #E3EBFF;
    display: flex;
    margin: 0px 0px;
    align-items: center;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}

.list-coupon li .coupon-date-status-txt.off{
	background-color: #f7f7f7;
}

.list-coupon li .coupon-date-status-txt.off .date{
	color:	#cbcbcb;
}
.list-coupon li .coupon-date-status-txt.off .info-desc div{
	color:	#cbcbcb;
}

.list-coupon li .coupon-date-status-txt .date{
	width: 80%;
    padding: 10px;
}
.list-coupon li .coupon-date-status-txt .info-desc{
	float: right;
    display: inline-block;
    width: 30%;
    position: relative;
}

.list-coupon li .coupon.off .info-title .name{
    font-weight: 400;
    color: #cbcbcb;
}

.list-coupon li .coupon.off .info-title .date{
    color: #cacaca;
}
.list-coupon li .coupon.off .info-desc .status{
    background-color: #e1e1e1;
    border: 1px #e1e1e1 solid;
}

/* 쿠폰 디테일 */
.coupon-detail .thumb{
    float: left;
    width: 50%;
    padding: 30px 0px;
    text-align: center;
    background: #f7f7f7;
}

.coupon-detail .thumb img{
    width: 60%;
}

.coupon-detail .wrap-infomation{
    float: right;
    width: 50%;
    padding: 30px;
}

.coupon-detail .wrap-infomation .title{
    text-align: center;
}

.coupon-detail .wrap-infomation .title .brand{
    margin-bottom: 0px;
    color: #888;
}

.coupon-detail .wrap-infomation .title .pName{
    margin-bottom: 0px;
    font-size: 21px;
    font-weight: 600;
}

.coupon-detail .wrap-infomation .barcode{
    margin-top: 40px;
    text-align: center;
}

.coupon-detail .wrap-infomation .barcode img{
    width: 320px;
}

.coupon-detail .wrap-infomation .info{
    margin-top: 20px;
}

.coupon-detail .wrap-infomation .info ul{
    display: inline-block;
    width: 100%;
    border-top: 1px solid #ddd;
}

.coupon-detail .wrap-infomation .info ul li{
    position: relative;
    display: inline-block;
    width: 100%;
    padding: 10px;
    border-bottom: 1px solid #ddd;
}

.coupon-detail .wrap-infomation .caution{
   margin-top: 30px; 
}

.coupon-detail .wrap-infomation .caution ul li{
    position: relative;
    padding-left: 15px;
    margin-bottom: 5px;
    font-size: 14px;
    color: #888;
}

.coupon-detail .wrap-infomation .caution ul li::before{
    position: absolute;
    content: '';
    top: 10px;
    left: 5px;
    width: 3px;
    height: 3px;
    background: #333;
}

.coupon-detail .wrap-infomation .info ul li .tit{
    float: left;
    color: #888;
}

.coupon-detail .wrap-infomation .info ul li .desc{
    float: right;
}

@media (min-width: 992px){
	.wrap-slt-place .col-md-2.slt-grade {
	    width: 20%;
	    height: 229px;
	}
	.wrap-slt-place .col-md-3.slt-grade .slt-name{
	    font-size: 26px;
	}
	.wrap-slt-place .col-md-2.slt-grade .slt-name{
	    font-size: 26px;
	}
}



/*  멤버십 해지    */

.withdraw-step1-header { 
	display: inline-block; 
	margin-top: 10px; 
}
.withdraw-step1-header2 { 
	width: 100%; 
}
.withdraw-step1-header2__border-top { 
	border-top: 1px dotted #BEBEBE; 
	padding-top:24px; 
	margin-top: 20px; 
}
.withdraw-step1-header2 label { 
	margin-bottom: 0px; 
}

.withdraw-step2-header li { 
	display: inline-block; 
	vertical-align: top; 
}
.withdraw-step2-header__img { 
	width: 48px; 
	margin-right: 10px;
	
}
.withdraw-step2-header h4 {
	line-height: 1.5em;
}
.withdraw-step2-tip { 
	border: 1px solid #dedede; 
	border-radius: 5px; 
	padding: 12px 20px; 
	position: relative; 
	margin: 6px 0 42px 0; 
	background-color: #fff; 
}
.withdraw-step2-tip img, .withdraw-step2-benefit-tip img { 
	width: 16px; 
	text-align: center; 
	top: 2px; 
	position: absolute; 
	top: 15px; 
	left: 30px; 
}
.withdraw-step2-tip__img { 
	width: 35px; 
	height: 35px; 
	margin-right: 10px; 
}
.withdraw-step2-tip li:nth-child(2) span { 
	color: #888; 
	font-weight: 200; 
}
.withdraw-step2-tip li, .withdraw-step2-benefit-tip li { 
	display: inline-block; 
	vertical-align: middle; 
}
.withdraw-step2-tip li:last-child { 
	float: right;
}
.withdraw-step2-tip li:last-child a { 
	padding: 6px; 
}
.withdraw-step2-tip__margin-bottom { 
	margin: 6px 0 10px 0 ; 
}

.withdraw-step2-etc {  }
.withdraw-step2-etc li:nth-child(3) { 
	margin: 40px 0 5px 0; 
}
.withdraw-step2-etc li ::placeholder { 
	font-weight: 200; 
}

.withdraw-step2-point {
	width: 100%;
}
.withdraw-step2-point__score {
	background-color: #fff;
	padding: 20px;
	margin: 20px 0;
	border: 1px solid #dedede;
	border-radius: 5px;
}
.withdraw-step2-point__score li, .withdraw-step2-benefit-tip li:last-child{
	display: inline-block;
}
.withdraw-step2-point__score li:nth-child(2), .withdraw-step2-point__score li:nth-child(4) {
	width: 5%;
	font-size: 1.4em;	
	text-align: center;
}
.withdraw-step2-point__score-number {
	font-size: 1.4em;	
	
	width: 29%;
	text-align: center;
}	
.withdraw-step2-point__score-number span {
	font-size: 0.7em;
	font-weight: 200;
	color: #6C6F73;
}

.withdraw-step2-point-btn{
	text-align: center;
}
.withdraw-step2-point-btn a:first-child {
	margin-right: 14px;
}
.withdraw-step2-notify {
	margin-top: 50px;
}
.withdraw-step2-benefit-tip { 
	border: 1px solid #dedede; 
	border-radius: 5px; 
	padding: 12px 20px; 
	position: relative; 
	margin-top: 6px; 
	background-color: #fff; 
}

.withdraw-step2-benefit1 {
	position: relative;	
}

.withdraw-step2-benefit1 li:nth-child(2) img {
	width: 170px;
	position: absolute;
	right: 0;
	top: 0;
}

.withdraw-step2-benefit-btn {
	margin: 70px 0 60px 0;
}
.withdraw-step2-benefit-info li:nth-child(odd){
	padding-right: 5px;
}
.withdraw-step2-benefit-info li:nth-child(even){
	line-height: 1.8em;
	width:94%;
}
.withdraw-step2-benefit-info li:last-child {
	padding-bottom: 0px;
}
.withdraw-step2-turnover-tip {
	margin-top: 20px;
}

.withdraw-step2-turnover-info li, .withdraw-step2-turnover-tip-info li{
	display: inline-block;
	line-height: 1.6em;
	vertical-align: top;
}
.withdraw-step2-turnover-info li:first-child(1) {
	border-bottom: 1px dotted #888; 
	width: 5%;
	color: #666;
}	
.withdraw-step2-turnover-info li:nth-child(2) {
	border-bottom: 1px dotted #888; 
	width: 89%;
	color: #666;
}
.withdraw-step2-turnover-info li:nth-child(3) {
	margin-bottom: 30px;
	padding: 10px 0 0 33px; 
}

.withdraw-step2-turnover-tip li{
	color: #666;

}
.withdraw-step2-turnover-tip .withdraw-step2-tip{
	text-align: center;
	padding: 12px 20px;
	margin: 6px 0;
	font-size: 1.4em;
}


.withdraw-step2-turnover-tip-info li:last-child {
	width: 90%;
	font-weight: 200;
}