@charset "utf-8";
/*-------------------------------------------------
Popup Style Sheet / myeong-hee park / 2014. 9. 20.
-------------------------------------------------*/
/*
<link rel="stylesheet" href="${contextPath}/resources/js/lib/jquery/jquery-ui-1.10.4/css/redmond/jquery-ui-1.10.4.custom.min.css?date='${TODAY_CSSJS}'">
<link rel="stylesheet" href="${contextPath}/resources/css/common/general.css?date='${TODAY_CSSJS}'">
<link rel="stylesheet" href="${contextPath}/resources/css/common/bbs.css?date='${TODAY_CSSJS}'">
<link rel="stylesheet" href="${contextPath}/resources/css/ips/dsite.css?date='${TODAY_CSSJS}'">
*/

body {
	background: #f0f2f5 url(../../images/common/popup/mail_popBg.gif) no-repeat right 0; 
	overflow: auto;
	}
#popup_wrap {	
	position: relative; 
	margin: 0 auto; 
	padding: 25px 30px;
	overflow: hidden;
	}
#popup_wrap:before {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 50%;
	height: 5px;
	background: #f8be1c;
	content: '';
	}
#popup_wrap .logo {
	letter-spacing: -0.1em;
	color: #000;
	font-size: 1.1em;
	}
#popup_wrap .logo img {
	vertical-align: middle;
	}	
#popup_body {
	margin-top: 20px;
	padding: 35px;
	background-color: #fff;
	}	
/* 탭메뉴 STYLE */	
.first_tabMenu,
.tab_menu	 {
	position: relative;
	top: 1px;
	width: 100%;
	}
.tab_menu {
	margin-bottom: 30px;
	}	
.first_tabMenu:before,		
.first_tabMenu:after,
.tab_menu:before,		
.tab_menu:after {	
	display: table;
	content: " ";
	}		
.first_tabMenu:after,
.tab_menu:after {
	clear: both;
	}	
.first_tabMenu > li,
.tab_menu > li	 {
	position: relative;
	float: left;
	width: 195px;
	text-align: center;
	line-height: 1.5;
	font-weight: bold;
	}
.first_tabMenu > li > a,
.tab_menu > li > a {
	display: block;
	margin-right: -1px;
	padding: 10px 0;
	border: solid 1px #d9dadb;
	border-right: solid 1px #c9cacc;
	color: #6c6d70;
	}
.first_tabMenu > li.on > a {
	background: #fff;
	border-bottom-color: transparent;
	color: #000;
	}	
.tab_menu {
	margin-left: -4px;
	}
.tab_menu > li {
	width: 179px;
	margin-left: 4px;
	text-align: left;
	} 
.tab_menu > li > a {
	padding: 12px 0 13px 40px;
	background: url(../../images/kps/common/icon_strip.png) no-repeat -67px -282px;
	border-color: #e3e4e8;
	}
.tab_menu > li.on > a {
	background-color: #037bc1;
	border-color: #037bc1;
	color: #fff;
	}	
/* 본문 STYLE */
#content {
	/*margin-top: 10px;*/
	padding: 30px 27px; 
	background: #fff; 
	border: solid 1px #dddedf;
	}
.join_idStep {
	width: 100%;
	height: 64px;
	margin-bottom: 40px;
	background: url(../../images/kps/popup/joinId_step.gif) no-repeat 0 0;	
	text-indent: -9999px;
	overflow: hidden;
	}
.join_idStep.step02 {
	background-position: 0 -66px; 
	}
.join_idStep.step03 {
	background-position: 0 -132px; 
	}
.join_idStep.step04 {
	background-position: 0 -198px; 
	}
.join_idStep.step05 {
	background-position: 0 -264px; 
	}
/* 타이틀 STYLE */	
.depth2_title,
.depth2_title02,
.depth2_bbsTitle,
.depth2_bbsTitle02 {
	margin-bottom: 14px;
	padding-left: 24px;
	background: url(../../images/common/content/depth2_arrow_blue.gif) no-repeat 0 4px;
	color: #000;
	}	
.depth2_title02,
.depth2_bbsTitle02 {
	margin-top: 33px;
	}
h3.depth2_title,
h3.depth2_title02,		
h3.depth2_bbsTitle,
h3.depth2_bbsTitle {
	font-size: 1.2em;
	padding-bottom: 6px;
	}
.depth3_title,
.depth3_title02,
.depth3_bbsTitle,
.depth3_bbsTitle02 {
	margin: 0 0 11px 23px;
	padding-left: 16px;
	background: url(../../images/common/content/depth3_arrow_blue.gif) no-repeat 0 7px;
	color: #037bc1;
	}
.depth3_title_txt {
	margin: 20px 0 11px 0; 
	padding-left: 19px; 
	font-weight: bold; 
	letter-spacing: -0.1em; 
	background: url(../../images/common/content/depth3_arrow_blue.gif) no-repeat 0 7px;
	color: #000;
	}
.depth3_title02,
.depth3_bbsTitle02 {
	margin-top: 20px;
	}
.depth4_title,
.depth4_title02 {
	margin: 0 0 11px 41px;
	padding-left: 8px;
	background: url(../../images/common/content/depth4_arrow.gif) no-repeat 0 8px;
	color: #45474d;
	font-size: 1em;
	}	
.depth4_title02	 {
	margin-top: 12px;
	}	
[class*="noraml_title"] {
	margin-bottom: 5px;
	letter-spacing: -0.05em;
	font-size: 1.1em;
	}	
.noraml_title02 {
	margin-top: 20px;
	} 	
[class*="noraml_title"] a {
	letter-spacing: 0;
	}
	
/* 콘텐츠 txt 오른쪽 여백 STYLE */
.depth2_txt,
.depth2_multiple {
	margin-left: 23px;
	}
.depth3_txt,
.depth3_multiple {
	margin-left: 40px;
	}	
.depth4_txt {
	margin-left: 50px;
	}
.tstyle_info {
	float: right;
	color: #6c6d70;
	}	
.txt_info {
	margin-bottom: 10px;
	}	
.txt_topInfo {
	margin-top: 10px;
	}	
/* 콘텐츠 */			
.mailInfo_area {
	letter-spacing: -1px;
	}
.mailInfo_area span {
	display: block;
	margin: 18px 0;
	}		
.first_txt {
	margin-bottom: 23px; 
	color: #252525;
	font-size: 1.1em; 
	font-weight: bold;
	}	
.box_info {
	margin: 30px 0; 
	padding: 24px; 
	background: #fdfdfd; 
	border: solid 1px #d9dadb;
	}	
.number_title {
	margin: 20px 0 5px;
	color: #252525;
	}
.number_title span.number {
	display: inline-block;
	width: 31px;
	height: 26px;
	padding: 4px 7px 0 0;
	background: url(../../images/kps/popup/number_bg.png) no-repeat 0 0;
	color: #fff;
	text-align: center;
	font-size: 0.85em;
	}
.box_info .number_title:first-child {
	margin-top: 0;
	} 	
.arrow_lstyle {
	}	
.arrow_lstyle > li,
.arrow_lstyle > dt,
p.arrow_lstyle {
	margin-top: 7px;
	padding-left: 8px;
	background: url(../../images/common/content/depth4_arrow.gif) no-repeat 0 8px;
	color: #45474d;
	font-weight: bold; 
	}	
.arrow_lstyle > li:first-child,	
.arrow_lstyle > dt:first-child {
	margin-top: 0;
	}	
.arrow_lstyle > li table td {
	font-weight: normal;
	}	
.dot_lstyle {	
	}
.dot_lstyle > li,
.arrow_lstyle > li > ul > li,
.arrow_lstyle > li > p,
.arrow_lstyle > dd li,
p.dot_lstyle  {
	margin-top: 2px;
	padding-left: 8px;
	background: url(../../images/common/content/gray_dot.gif) no-repeat 0 9px;
	font-weight: normal;
	}
.arrow_lstyle > dd {
	margin-left: 8px;
	}	
.dot_lstyle > li:first-child {
	margin-top: 0;
	}	
.arrow_lstyle .point03 > li {
	margin-top: 8px;
	}			
.arrow_lstyle .point03 > li > ul {
	color: #757577;	
	}
.dot_lstyle > li > ul,	
.line_lstyle {
	margin-bottom: 10px;
	}
.dot_lstyle > li > ul > li,
.line_lstyle > li {
	margin-top: 5px;
	padding-left: 10px;
	background: url(../../images/common/content/depth5_arrow.gif) no-repeat 0 9px;
	}
.number_list {
	overflow: hidden;
	}
.number_list > li {
	margin-left: 20px;
	list-style: decimal;
	}
		
.check_lstyle {
	letter-spacing: -0.1em;
	}	
.check_lstyle > li {
	padding-left: 18px;
	background: url(../../images/common/content/check_arrow.gif) no-repeat 0 7px;
	}	
.second_txt {
	margin-left: 42px;
	color: #0071c1;
	font-weight: bold;
	}	
/* 기존 ID통합, 통합회원 로그인, 통합회원 가입 */	
.combine_login {
	overflow: hidden;
	}
.combine_login li {
	float: left;
	width: 222px;
	height: 205px;
	margin-left: 30px;
	padding: 20px 0;
	background: #fbfbfc;
	border: solid 1px #c9cacc;
	border-radius: 15px;
	text-align: center;
	letter-spacing: -0.1em;
	}
.depth2_txt .combine_login {
	margin: 30px 0 15px;
	}
.depth2_txt .combine_login li {
	width: 30%;
	}	
.combine_login li:first-child {
	margin-left: 0;
	}
.combine_login li strong,
.combine_login li span,
.combine_login li a {
	display: inline-block;
	}	
.combine_login li strong {
	height: 32px;
	color: #252525;
	font-size: 1.2em;
	}
.combine_login li > span {
	margin: 12px 0 16px; 
	}	
.combine_login strong {
	padding: 4px 0 0 43px;
	background: url(../../images/kps/popup/combine_login01.gif) no-repeat 0 0;
	}
.combine_login .link02 strong {
	background: url(../../images/kps/popup/combine_login02.gif) no-repeat 0 0;
	}
.combine_login .link03 strong {
	background: url(../../images/kps/popup/combine_login03.gif) no-repeat 0 0;
	}	
.btn_colorType01 {
	background: #0d4c99;
	border-bottom-color: #07317a;
	}
.btn_colorType02 {
	background: #434a54;
	border-bottom-color: #12151c;
	}
.btn_colorType01,
.btn_colorType02,		
.btn_colorType01:hover,
.btn_colorType02:hover {	
	min-width: 55px;
	color: #fff;
	}	
 [class*="btn_colorType"]::after {display: none;}
.txt_bottomBbs {/* 설명 아래 table 여백 */
	margin-bottom: 10px;
	}	
.joinform .check {
	text-align: right;
	}
/* 약관동의 */	
.agreement  {
	width: 688px;
	margin-bottom: 5px;
	padding: 20px;	
	background: #fdfdfd;
	border: solid 1px #eee;
	line-height: 1.6;
	}
.agreement .dot_lstyle > li {
	margin-top: 3px;
	background: url(../../images/common/content/gray_dot02.gif) no-repeat 0 9px;
	}
.agreement .dot_lstyle > li:first-child {
	margin-top: 0;
	}
.agreement h3 {
	margin-left: 0;
	}
.agreement h4,
.agreement .depth3_txt  {
	margin-left: 18px;
	}
.agreement .depth4_txt  {
	margin-left: 25px;
	}
.if_txt {
	overflow: hidden;
	}	
.if_txt ul {
	margin: 10px 0 0 10px;
	}	
.if_txt > li {
	margin-top: 7px;
	padding-left: 8px;
	background: url(../../images/common/content/depth4_arrow.gif) no-repeat 0 8px;
	color: #45474d;
	}
.if_txt > li:first-child {
	margin-top: 0;
	}
.check {
	margin: 10px 0 20px;
	text-align: right;
	}		
/* 하단 STYLE */	
.copyright {
	margin-top: 20px;
	text-align: center;
	}	
.copyright address {
	font-style: normal;
	letter-spacing: -0.1em;
	}		
.oem_step {
	width: 730px;
	height: 159px;
	background: url(../../images/kps/oem/oem_step.gif) no-repeat 0 0;
	text-indent: -9999px;
	}	
.telEmail {
	margin-bottom: 50px;
	}	
.telEmail span {
	display: inline-block;
	margin-left: 30px;
	padding: 8px 0 8px 43px;	
	}	
.telEmail .icon_tel {
	background: url(../../images/kps/oem/icon_tel.gif) no-repeat 0 0;
	}	
.telEmail .icon_email {
	background: url(../../images/kps/oem/icon_email.gif) no-repeat 0 0;
	}	
/* 포틀릿 */
.multiCont_area {
	width: 97.8%;
	height: 100px;
	padding: 5px 10px 5px 5px;
	background: #eeeff3;
	}
.multiCont_area:hover, 	
.multiCont_area > div:hover {
	cursor: move;
	}	
.multiCont_area > div {
	background: #fff url(../../images/kps/mypage/portlet_txtBg.gif) repeat-x 0 43px;
	}
.multiCont_area > div:before,
.multiCont_area > div:after {
	display: block;
	position: absolute;
	top: 0;
	width: 10px;
	height: 100%;
	background: #fff;
	content: '';
	}
.multiCont_area > div:before {
	left:0;
	}	
.multiCont_area > div:after {
	right: 0;
	}	
.contype_small,
.contype_long {
	width: 128px;
	height: 78px;
	padding: 10px;
	}
.contype_long {
	width: 288px;
	}	
.portletLine_add {
	margin: 10px 0 40px;
    padding: 28px 0;
    background: #f8fafd;
    border: dashed 2px #c6ceda;
    text-align: center;
	}	
.portletLine_add button {
	color: #687287;
    font-size: 1.385em;
    font-weight: bold;
	}
.portlet_control,
.potletMove_control {
	display: block;
	position: absolute;
	bottom: 10px;	
	}	
.portlet_control {
	left: 10px;
	width: auto;
	border: solid 1px #eeeff3;
	font-size: 0.95em;
	}	
.portlet_control a {
	padding: 0 6px 0 15px;
	background: url(../../images/common/icon/icon_modif_delete.gif) no-repeat 4px -12px;
	}
.portlet_control a:first-child {
	background-position: 4px 2px;
	border-right: solid 1px #eeeff3;
	} 	
.portlet_control .addContent {
	}
.potletMove_control {
	right: 10px;
	width: auto;
	height: 21px;
	}	
.potletMove_control a {
	float: left;
	display: block;
	width: 15px;
	height: 21px;
	background: url(../../images/common/icon/potletMove_control.gif) no-repeat right center;
	text-indent: -9999px;
	overflow: hidden;
	}
.potletMove_control a:first-child {
	width: 16px;
	background-position: 0 center;
	}	
.portletLine_control {
	position: relative;
	display: block;
	float: right;
	width: 28px;
	height: 100px;
    letter-spacing: -0.1em;
    text-align: center;
	}
.portletLine_control a {
	display: block;
	width: 100%;
	}	
.portletLine_control a.move {
	height: 20px;
	margin-top: 5px;
	background: url(../../images/kps/mypage/btn_move.gif) no-repeat center 0;
	text-indent: -9999px;
	overflow: hidden;
	}		
.portletLine_control a.after {
	background-position: center bottom;
	} 	
.portletLine_control a.delete {
	position: absolute;
	bottom: 10px;
	}
.portletLine_control .hide {
	display: block;
	width: 1px;
	height: 1px;
	text-indent: -9999px;
	overflow: hidden;
	}	
/* 포틀릿 설정 */
#tblPortletCnt > li {
	height: 108px;
	margin-top: 10px;
	background: url(../../images/kps/mypage/portlet_type.gif) no-repeat 30px 0;
	overflow: hidden;
	}
#tblPortletCnt > li:nth-child(2) {
	background-position: 30px -118px;
	}
#tblPortletCnt > li:nth-child(3) {
	background-position: 30px bottom;
	}
#tblPortletCnt > li input {
	display: block;
	}
/* MY 메뉴 설정 */
.mymenu_setting {
	position: relative;
	margin-top: 10px;
	padding: 15px;
	background: #eeeff3;
	border: solid 1px #d4ddec;
	box-sizing: border-box;
	}
.mymenu_setting .btn_whitesmall {
	position: absolute;
	top: 12px;
	right: 15px;
	padding: 3px 10px;
	border-radius: 0;
    letter-spacing: 0;	
	}
.mymenu_setting .black_txt {
	margin-bottom: 13px;
	letter-spacing: -0.05em;
	font-size: 1em;
	}
.mymenu_setting .mCustomScrollbar {
	height: 160px;
	overflow: hidden;
	}
.mypage_title {
	position: relative;
	margin: 20px 0 10px;
	}	
.mypage_title .black_txt {
	color: #333;
	font-size: 1.071em;
	}
.mypage_title .btn_whitesmall {	
	padding: 3px 10px;
	border-radius: 0;
    letter-spacing: 0;
	}
.mymenu_settingAdd {
	border: solid 1px #e3e4e5;
	border-bottom-color: #c9cacc;
	box-sizing: border-box;
	overflow: hidden;
	}	
.mymenu_settingAdd > div {
	width: 50%;
	}
.mymenu_settingAdd > div:first-child {	
	border-right: solid 1px #c9cacc;
	box-sizing: border-box;
	}
.mymenu_settingAdd .black_txt,
.mymenu_settingAdd .black_txt02 {	
	padding: 10px 15px;
	background: #f8fafd;
	font-size: 1em;
	font-weight: normal;
	}
.mymenu_settingAdd .black_txt02 {
	border-top: solid 1px #dedfe0;
	}
.mymenu_settingAdd ul {
	margin: 15px;
	}	
.icheckbox li {
	position: relative;
	margin-top: 6px;
	line-height: 1.2;
	font-size: 0.929em;
	overflow: hidden;
	}	
.icheckbox li:first-child {
	margin-top: 0;
	}
.icheckbox input[type="checkbox"] {
	position: absolute;
	top: 0;
	left: 0;
	width: 22px;
	height: 18px;
	margin: 0;
	opacity: 0;
	filter: alpha(opacity=0);
	z-index: 10
	}
.custom-check {
	display: block;
	float: left;
	width: 22px;
	height: 18px;
	background: url(../../images/mps/content/input_check.png) no-repeat 0 2px;
	background-size: 17px auto;
	overflow: hidden;
	}
.custom-check.checked {
	background-position: 0 -19px
	}
.icheckbox input[type="checkbox"]:focus + .custom-check:after {
	position: absolute;
	width: 14px;
    height: 14px;
	border: 2px solid #a4c6fd;
	content: '';
	}		
.icheckbox label {
	display: block;
	position: relative;
	padding-left: 22px;
	cursor: pointer;
	z-index: 10;
	}
/*관심정보 설정*/
.matrix_setting {
	/* padding: 10px 10px 15px; */
	}	
.matrix_setting .tstyle_list {
	background: #fff;
	}	
.matrix_setting .tstyle_list th, 
.matrix_setting .tstyle_list td {
	width: 81px;
	height: 50px; 
	padding: 0;
	line-height: 1.2; 	
	text-align: center;
	letter-spacing: -0.05em;
    white-space: normal;
    font-size: 0.85em;
	}
.matrix_setting .tstyle_list td > span:first-child {
	display: block;
	position: relative;
	width: 22px;
    margin: auto;
    overflow: hidden;
	}	
.matrix_setting .icheckbox input[type="checkbox"] {
	width: 22px;
	height: 23px;
	}
.matrix_setting .custom-check {
    width: 100%;
    height: 24px;
    background-size: 23px auto;
	}	
.matrix_setting .custom-check.checked {
    background-position: 0 -24px;
	}
.disabled .custom-check {
	background-position: 0 -49px;
	}	
.disabled input[type="checkbox"] {
	cursor: auto;
	}	
.newsLetterAgree {
	font-size: 87.5%;
	}	
.newsLetterAgree .depth2_title, 
.newsLetterAgree .depth2_title02,
.newsLetterAgree .depth2_bbsTitle02 {
	padding-left: 0;
	background: none;
	color: #da3d00;
	font-size: 1.125em;
	}	
.newsLetterAgree .depth2_title02,
.newsLetterAgree .depth2_bbsTitle02 {
	margin-top: 25px;
	}	
.agreement_line {
	margin-top: 30px;
	padding-top: 10px;
	border-top: solid 1px #d9dadb;
	}	
.newsLetter_send {
	margin-top: 8px;
	color: #333;
	font-weight: bold;
	}

.khidi_family {
	font-size: 15px;
	}	
.khidi_family .depth2_title {
	background-position: 0 7px;
	}