@charset "utf-8";
/*@import url('http://fonts.googleapis.com/earlyaccess/nanumgothic.css');*/  

/* 웹폰트 CSS */
@font-face {
	font-family:'Nanum Gothic';
	font-style:normal;
	font-weight:400;
	src:url(/assets/font/NanumGothic.eot);
	src:url(/assets/font/NanumGothic.eot?#iefix) format('embedded-opentype'),
		url(/assets/font/NanumGothic.woff) format('woff'),
		url(/assets/font/NanumGothic.ttf) format('truetype');
}
@font-face {
	font-family:'Nanum Gothic';
	font-style:normal;
	font-weight:700;
	src:url(/assets/font/NanumGothicBold.eot);
	src:url(/assets/font/NanumGothicBold.eot?#iefix) format('embedded-opentype'),
		url(/assets/font/NanumGothicBold.woff) format('woff'),
		url(/assets/font/NanumGothicBold.ttf) format('truetype');
}
@font-face {
	font-family:'Nanum Gothic';
	font-style:normal;
	font-weight:800;
	src:url(/assets/font/NanumGothicExtraBold.eot);
	src:url(/assets/font/NanumGothicExtraBold.eot?#iefix) format('embedded-opentype'),
		url(/assets/font/NanumGothicExtraBold.woff) format('woff'),
		url(/assets/font/NanumGothicExtraBold.ttf) format('truetype');
}
*, body {
    font-family: 'Nanum Gothic','dotum', serif, arial;
}

a {
    margin: 0;
    padding: 0;
    color: #292f37;
    font-size: 100%;
    text-decoration: none;
    vertical-align: middle;
    background: transparent;
}
a:hover {
    color: #292f37;
}

.hidden {
	display: none;	
}

/*h*/
h3 {
	display: block;
	margin: 30px 0 30px;
	line-height: 1;
	font-size: 2.3em;/* 30/13 */
	letter-spacing: -0.5px;
}
h4 {
	display: block;
	margin: 30px 0 10px;
	line-height: 1.1em;
	font-size: 1.54em;/* 20/13 */
	letter-spacing: -0.25px;
}
h5 {
	display: block;
	margin: 35px 0 10px;
	line-height: 22px;
	font-size: 1.23em;/* 16/13 */
}

h6 {
	display: block;
	margin: 35px 0 10px;
	line-height: 25px;
	font-size: 1.15em;
}
h6 > em {
	display: inline-block;
	margin: -4px 0 0 5px;	
	color: #f2444a;
}
h6 > em:before {
	content: '[';
}
h6 > em:after {
	content: ']';
}

/* 정렬 */
.alignLeft {
    text-align: left !important;
}
.alignRight {
    text-align: right !important;
}
.alignCenter {
    text-align: center !important;
    width: 100%;
    height: 100%;
    margin: 2% 0 2%;
    line-height: 22px;
    font-size: 16px;
}
.alignCenter >p {
    font-size: 14px;
    font-weight: 100;
}
.alignCenter > ul {
    width: 100%;
    height: 270px;
}
.alignCenter > ul > li {
    width: 30%;
    height: 100%;
    border: 1px solid #cacaca;
    float: left;
    background-color: #f5f6fa;
    margin-left: 2%;
    padding-top: 2%;
}
.alignCenter > ul > li > div > strong {
    font-size: 15px;
    font-weight: bold;
}
.alignCenter > ul > li > div > p {
    font-size: 90%;
    font-weight: 100;
    color: #646464;
    margin: 4% 0% 5%;
}
.bubble {
    width: 93%;
    position: relative;
    background-color: white;
    margin: 2%;
    color: #000000;
    border: 1px solid #dbdbdb;
    margin-top: 4%;
    padding: 3%;
}
.bubble ul {
    width: 90%;
    float: right;
}
.bubble ul li {
    width: 70%;
    float: left;
    line-height: 20px;
    font-size: 90%;
}
.bubble ul li strong {
    font-size: 140%;
}
.tail {
    width: 100%;
    height: 100%;
    background: url(/images/common/button/box.png) no-repeat center;
    position: absolute;
    right: 0;
    top: -50%;
}
button#bnt {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    font-size: 80%;
    border: 1px solid #cacaca;
}
button#bnt:hover {
    background-color: #0c50a1;
    color: white;
}
button#bnt2 {
    display: none;
}

.floatLeft {
	float: left !important;
}
.floatRight {
	float: right !important;
}
.bubble ul{width:90%; float:right;}
.bubble ul li{width:70%; float:left; line-height:20px; font-size:90%;}
.bubble ul li strong{font-size:140%;}
#ipin{width:25%; height:40px; border:1px solid #dbdbdb; padding:1%; text-align:center; background-color:white; color:#0a4081; font-size:115%; cursor:pointer;}
#ipin:hover {
    background-color: #0c50a1;
    color: white;
}

/* text */
em {
/*     vertical-align: top;*/
	font-style: normal; 
	font-weight: 700;
}

input + .error, 
input + .warning, 
input + .success {
	padding: 0 4px;
	display: inline-block;
    line-height: 25px;
    margin: 0 !important; 
}

.alltext {
	display: block;
	margin-bottom: 5px;
	text-align: right;
}
.alltext > a {
	text-decoration: underline;
    font-size: 1.15em;
    font-weight: 700;
}

.bult {
	position: relative;
	padding-left: 17px;
	line-height: 25px;
}
.bult:before {
	content: " ";
	position: absolute;
	top: 11px;
	left: 5px;
	width: 3px;
	height: 3px;
	background: #292f37;
	
}


/* 폼 요소 */
input[type="text"], 
input[type="password"], 
input[type="search"], 
input[type="file"], 
input[type="number"] {
	height: 34px;
	line-height: 22px;
	padding: 5px 10px 5px 10px;
	box-sizing: border-box;
	border: 1px solid #d9dddf;
	vertical-align: middle;
	-webkit-appearance: none; 
	-moz-appearance: none;
	-ms-appearance: none;
	-o-appearance:none;
	appearance:none;
	background: #ffffff;
}

input[type="checkbox"], 
input[type="radio"] {
	display: none;
}
input[type="checkbox"] + label {
	display: inline-block;
	min-height: 18px;
	line-height: 18px;
	padding-left: 18px;
	background: url('/images/template2/resp/default/usr/bg_input_checkbox.png') 0 center no-repeat;
	background-size: 16px 16px;
	width: 50%;
    float: left;
}
input[id="sameAbove"] + label {
	display: inline-block;
	min-height: 18px;
	line-height: 18px;
	padding-left: 18px;
	background: url('/images/template2/resp/default/usr/bg_input_checkbox.png') 0 center no-repeat;
	background-size: 16px 16px;
	width: 125px;
	float: none;
}
label.id100 {
    min-width: 100%;
    float: left;
    display: inline-block;
    margin-top: -18px;
}
input[type="checkbox"]:checked + label {
	background: url('/images/template2/resp/default/usr/bg_input_checkbox_checked.png') 0 center no-repeat;
	background-size: 16px 16px;
	width:50%;
	float:left;
}
input[id="sameAbove"]:checked + label {
	background: url('/images/template2/resp/default/usr/bg_input_checkbox.png') 0 center no-repeat;
	background-size: 16px 16px;
	width: 125px;
	float: none;
}
input[type="radio"] + label {
	display: inline-block;
	min-height: 18px;
	line-height: 18px;
	padding-left: 18px;
	background: url('/images/template2/resp/default/usr/bg_input_radio.png') 0 center no-repeat;
	background-size: 16px 16px;
}
input[type="radio"]:checked + label {
	background: url('/images/template2/resp/default/usr/bg_input_radio_checked.png') 0 center no-repeat;
	background-size: 16px 16px;
}
.radioncheckbox > label {
	padding-left: 23px !important;
	margin-right: 20px;
}


.corprtNum input {
	width: 45px;
	text-align: center;
}
.corprtNum input+input+input {
	width: 65px;
}
input.large {
	width: 100%;	
}
input.medium {
	width: 60%;	
}
input.small {
	width: 40%;	
}
input.mini {
	width: 20%;	
}
input[type="text"].number {
	width: 70px;
}
input[type="text"].tel {
	width: 56px;
}
input[type="text"].zipCode {
    width: 70px;
} 
/* 한글입력 */
/* input[type="text"], textarea { */
/* 	-webkit-ime-mode: active;  */
/* 	-moz-ime-mode: active;  */
/* 	-ms-ime-mode: active;  */
/* 	ime-mode: active;  */
/* } */


::-webkit-input-placeholder { /* WebKit browsers */
    color: #8e9599;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #8e9599;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #8e9599;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #8e9599;
}

.selectBox {
	display: inline-block;
	height: 34px;
	border: 1px solid #d9dddf;
	background: #ffffff url('/images/template2/resp/default/usr/bg_select.png') right center no-repeat;
}
.selectBox select {
	height: 32px;
	padding: 0px 30px 0 10px;
    border: none;
	vertical-align: middle;
	background: transparent;
	-webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
}
select::-ms-expand { 
 	display: none;
}
textarea {
    width: 100%;
	padding: 8px 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
	line-height: 18px;
}

/* search */
.search label { 
    display: none;
}
.contentsBox .search {
    margin-bottom: 15px;
    text-align: right;
}
@media screen and (min-width: 801px) {
	.search input {
		width: 460px;
	}
}
.boxGray + .search {
	margin-top: 15px;
}
.searchBox .search label { 
    display: none;
}
.searchBox {
	padding: 30px 30px 20px;
	margin-bottom: 30px;
}
.searchBox li { 
	display: inline-block;
	margin-right: 10px;
	margin-bottom: 10px;
}
.searchBox li label:first-child {
	display: inline-block;
/* 	min-width: 70px; */
    height: 34px;
    line-height: 34px;
	padding: 0 10px;
	text-align: right;
	vertical-align: top;
	font-weight: 700;
}
.searchBox .search {
	display: inline-block;
	margin-bottom: 0;
}
.searchBox .btnArea {
	margin-top: 0;
}
.boxGray + .searchBox {
	margin-top: 20px;
}

/* box */
.box {
	position: relative;
}
.contentsWrap .boxGray {
	line-height: 25px;
	padding: 30px 40px;
}
.textBox {
	line-height: 22px;
}
.contentsBox > .textBox+.textBox {
    margin-top: 10px;
}
.textBox ul li ul li {
	padding-left: 15px;
}
.textBox ol > li {
	position: relative;
	padding-left: 20px;
	
}
.textBox ol > li > span:first-child {
	position: absolute;
	top: 0;
	left: 0;
	displahy: inline-block;
	line-height: 25px;
}
.contentBox > .textBox+.textBox {
	margin-top: 20px;
}
.textBox, 
.textBox .boxGray,
.textBox ol {
	margin-bottom: 5px;
}
.scrollBox {
	overflow-y: auto;
	height: 200px;
	padding: 30px;
}
.scrollBox+input+label {
    display: block;
	margin-top: 15px;
}
.msgBox.success {
	height: 60px;
	padding-top: 15px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	text-align: center;
	font-size: 1.85em;  /* 24 */
	/* font-size: 1.23em; 16/13 */
	font-weight: 700;
}
.msgBox.success strong {
	display: inline-block;
	height: 28px;
	padding-left: 40px;
	line-height: 28px;
}

.borderBox {
	padding: 30px;
}

/* icon */
.iconBox {
/* 	overflow: hidden; */
	display: block;
	margin-top: 10px;
}
/* .iconBox .icon:first-child { */
/* 	margin-left: 0px; */
/* } */
.iconBox .icon {
	display: inline-block;
	height: 21px;
	line-height: 21px;
	margin-right: 4px;
	padding: 0px 3px 0px 3px;
	font-size: 12px;	
	text-align: center;
	font-family: '돋움','dotum';
	vertical-align: middle;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;	
}
.iconBox .icon:last-child {
	margin-right: 0px;
}
.icon.smart {
	letter-spacing: -0.5px;
}
.device {
	display: inline-block;
	margin: 0px 0px 0 6px;
}
.thumbnList.type2 .device, .register .device {
	margin: 0px 6px 0 6px;
}
.device .icon {
	width: 21px;
	padding: 0;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	text-indent: -99999px;
}
.icon.new,
.icon.hot {
	padding: 0 2px;
    line-height: 26px;
    font-weight: 400;
}
.icon.lock {
	padding: 0;
	text-indent: -99999px;
	vertical-align: middle;
}
.icon.progress,
.icon.standby {
	border-radius: 0;
	font-weight: 400;
}
.icon.end {
	border-radius: 0;
	font-weight: 400;
}
.icon.member,
.icon.feed {
    padding-left: 25px;
	font-size: 1em;
}

/* 별점 */
.grade span {
	display: inline-block;
	width: 16px;
	height: 14px;
	font-size: 0;
}
.grade span.num {
    width: auto;
    height: auto;
    margin-left: 5px;
    font-size: 1em;
    font-weight: 700;
}

/* paging */
.paging {
	clear: both;
	margin-top: 20px;
    text-align: center;
}
.paging a {
    display: inline-block;
    width: 35px;
    height: 35px;
    line-height: 33px;
    border: none;
    text-align: center;
    vertical-align: middle;
    font-weight: 700;
}
.paging a:hover,
.paging a.active {
	line-height: 31px;
}
.paging .btnFirst, .paging .btnPrev, .paging .btnNext, .paging .btnLast {
	font-size: 0;
}
.paging .mobile {
	display: none;
}

/* button */
.btnArea {
	margin-top: 30px;
	text-align: right;
}
/* .contentsBox > .btnArea {
	margin-top: 30px;
} */
button {
	display: inline-block;
	min-width: 100px;
	height: 42px;
	padding: 0 30px;
	text-align: center;
	vertical-align: middle;
	font-size: 1.15em;

	cursor: pointer;
}
button.inside.btnSearch.a2 {
    width: 24%;
    float: right;
}
.inside,
button.inside,
.popup button,
.headingBox button,
.inclub .btnArea button {
	min-width: 80px;
	height: 34px;
	padding: 0 10px;
	font-size: 1em;
}
button.red,
button.green,
button.yellow,
button.blue,
.thumbnList.type2 .inside.btnDelete {
	min-width: 70px;
	width: 70px;
	height: 34px;
	padding: 0 0px;
	font-size: 1em;
}

/* .thumbnList.type2 li div.btnArea .btnSelect,
.thumbnList.type2 li div.btnArea .btnRegister {
	min-width: inherit;
	width: 72px;
    height: 26px;
    padding: 0 8px;
	font-size: 1em;
} */
button+button {
	margin-left: 4px;
}
.toolBar button+button {
    margin-left: 0px;
}
button.inside+button.inside,
input+button, 
.selectBox+input,
.selectBox+.search,
.boardWrite td button.inside+input {
	margin-left: 2px;
}
.selectBox+.selectBox,
.boardWrite td input+button.inside {
	margin-left: 5px;
}

h5.headingBox > button {
	font-size: 0.81em; /* 13/16 */
}
.headingBox button {
	float: right;
    margin-top: -7px;
}
.btnCertificate, .feed .btnCommentWrite, .thumbnList li .btnArea .btnBook {
	height: 23px;
	line-height: 21px;
	padding: 0 10px;
	text-align: left;
	font-size: 0.92em;
}
.btnCertificate {
	width: 96px;
	min-width: 96px;
}
.popup .certificate1 .btnCertificate {
	width: auto;
	min-width: inherit;
}
.feed .btnCommentWrite {
	min-width: 80px;
}
.btnInclub {
	height: 23px;
	padding: 0 15px;
	font-size: 0.92em;
}
.btnShortcut {
	display: block;
	width: 74px;
	height: 23px;
    line-height: 21px;
	text-align: center;
	font-size: 0.92em;
	font-weight: 700;
}
/* fileAttach */
.fileAttach {
	position: relative;
}
.fileAttach input[type="file"] {
	position: absolute;
    top: 0;
    left: 0;
    border: none;
    opacity: 0;
    filter: alpha(opacity=0);
    cursor: pointer;
}

/* listAttach */
.listAttach {
	padding: 10px 0;
}
.listAttach li {
	margin-top: 7px;
}
.listAttach li:first-child {
	margin-top: 0;
}
.listAttach .btnDownload, .softwareDown .btnDownload {
	width: 82px;
	min-width: 82px;
	height: 23px;
	line-height: 21px;
	padding: 0 10px;
	margin-left: 5px;
	text-align: left;
	font-size: 0.92em;
}
.listAttach .btnDelete, .listAttach .btnDelete:hover {
	min-width: 0;
	width: 14px;
	height: 14px;
	padding: 0;
	font-size: 0;
}
/* tab */
.contentsBox .tab {
	height: 50px;
	margin-bottom: 0px;
}
.contentsBox .tab ul {
	overflow: auto;
	overflow-y: hidden;
}
.contentsBox .tab ul li {
	float: left;
	min-width: 170px;
	height: 50px;
	line-height: 50px;
	padding: 0 15px;
	margin-left: -1px;
	text-align: center;
}
.contentsBox .tab ul li a {
	display: block;
	font-size: 1.23em; /* 18/13 */
	font-weight: 700;
}
.contentsBox .tab ul li:first-child {
	margin-left: 0;
}
.contentsBox .tab ul li.active {
	position: relative;
	z-index: 99;
}
.contentsBox .tab.type2 ul li {
	min-width: 189px;
}
.tab.type2 {
	position: relative;
    padding: 0 30px 0 30px;
}
.tab.type2 > div {
    width: 940px;
    height: 50px;
    overflow: hidden;
}
.tab.type2 ul {
	width: 2000px;
}
.tab.type2 .btnPrev, .tab.type2 .btnNext {
	position: absolute;
	top: 0;
	display: block;
	width: 30px;
	height: 49px;
	z-index: 999;
}
.tab.type2 .btnPrev {
	left: 0;
}
.tab.type2 .btnNext {
	right: 0;
}

/* step */
.step {
	overflow: hidden;
	width: 100%;
	/* margin-bottom: 40px; */
}
.step li {
	position: relative;
	float: left;
/* 	width: 245px; */
	width: 24.625%;
	height: 110px;
	margin-left: 0.5%;
	text-align: center;
}
.step li > div {	
	width: 90%;
	margin-left: 10%;
	padding-top: 82px;
}
.step li:first-child {
/* 	width: 235px; */
	margin-left: 0px;
	border-top-left-radius: 7px;
	border-bottom-left-radius: 7px;
	z-index: 90;
}
.step li+li {
	z-index: 80;
}
.step li+li+li {
	z-index: 70;
}
.step li+li+li+li {
/* 	width: 257px; */
	border-top-right-radius: 7px;
	border-bottom-right-radius: 7px;
	z-index: 60;
}
.step li:before {
	content: " ";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
}
.step li:after {
	content: " ";
	position: absolute;
	top: 0;
	right: -27px;
	display: block;
}
/* .step li .step01 {
	padding-left: 17px;
}
.step li .step02 {
	padding-left: 22px;
}
.step li .step03 {
	padding-left: 26px;
}
.step li .step04 {
	padding-left: 11px;
} */
.step li > div > p {
	font-size: 1.15em; 
	font-weight: 700;
}
.step li > div > p > span {
	display: inline-block;
	margin-top: -4px;
	font-weight: 700;
}
.register .step li {
	width: 458px;
	height: 60px;
	line-height: 60px;
	border-radius: 0;
	text-align: center;
	font-size: 1.15em;
	font-weight: 700;
	z-index: -1;
}
.register .step li:first-child {
	width: 456px;
	z-index: 999;
}
.register .step li:before {
	content: " ";
	position: absolute;
	top: 0;
	left: 0;
	display: inline-block;
}
.register .step li:after {
	display: none;
}
.register .step li:first-child:before {
	content: " ";
    position: absolute;
    top: 0;
    left: inherit;
    right: -16px;
    display: inline-block;
    height: 0px;
    z-index: 999;
}
.register .step li span {
	line-height: 16px;
    display: inline-block;
    margin-top: -3px;
    margin-right: 10px;
    font-size: 0.86em; /* 13/15 */
}

/*####내일배움카드 과정정보페이지####*/
.share a {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 30px;
    padding: 0;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    font-size: 0;
}
.share .btnSelect {
    border-color: #f2444a;
    background: #ffffff url(/images/template2/resp/default/button/btn_share_select.png) center 5px no-repeat;
}
.share .btnLike {
    border-color: #61696f;
    background: #ffffff url(/images/template2/resp/default/button/btn_share_like.png) center 5px no-repeat;
}


@media screen and (max-width: 1023px) {
	.step {
    display: none;
	}
	.contentsBox .tab {
		margin: 20px 2% 20px 2%;
	}
	.searchBox {
		margin: 0px 2% 20px 2%;
		padding: 30px 30px 20px;
	}
}

@media screen and (max-width: 767px) {
.w700 {
    width: 20%;
}
	button#mid_ctgry_{
	display:none;
	}
	.s_w30 label{
	text-align:cente;
	min-width:50px;
}
.s_w30>.selectBox {
    width: 75px;
    float:left;
}

	.searchBox>table>tbody>tr>.p_left {
    padding-left: 42px;
}
	.btnArea {
    margin-top: 0%;
    text-align: left;
    padding: 2%;
}
.msgBox.success {
    border: none;
    color: #4693db;
    background: #e8f1fa;
    width: 50%;
}
.btnArea {
    margin-top: 30px;
    text-align: left;
}
.register .info, div.info {
    margin-top: 5px;
    color: #61696f;
    font-size: 0.92em;
    line-height: 22px;
    width: 45%;
    padding: 1%;
}
.selectBox select {
    height: 32px;
    padding: 0px 20px 0 6px;
    border: none;
    vertical-align: middle;
    background: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    width:100%;
}
.totalList .selectBox {
    float: right;
    margin-right: 6px;
}
	
	h4, h6 {
		padding: 0 2%;
	}
	.popup h4, .popup h6  {
		padding: 0;
	}
	.searchBox li label:first-child {
		min-width: 50px;
	}
	label.book_srch{
	display:none;
	color: white;
}
	.searchBox {
		padding: 20px 20px 10px;
	}
	.contentsBox > h5.headingBox {
		margin: 35px 20px 12px;
	}
	.contentsBox > .textBox {
		margin-left: 20px;
		margin-right: 20px;
	}
	.popup .contentsBox > .textBox,
	.contentsBox > .boxGray.textBox {
		margin-left: 0px;
		margin-right: 0px;
	}
	.textBox.scrollBox+input+label {
	    margin: 10px 20px;
	}

	.contentsBox .tab ul li {
		min-width: 110px;
		height: 50px;
		line-height: 50px;
	}
	.tab.type2 {
		padding: 0 20px;
	}
	.tab.type2 > div {
	    width: 100%;
	    height: 50px;
	}
	.tab.type2 .btnPrev,
	.tab.type2 .btnNext {
	    width: 20px;
    	height: 49px;
	}
	.tab ul li a {
		font-size: 1.15em;
	}
	.step {
/* 		display: none; */
	}
	.contentsBox > .imgBox {
		margin: 20px;
	}
	.paging a {
		display: none;
	}
	.paging .mobile {
		display: inline-block;
	}
	.paging .btnFirst, .paging .btnPrev, .paging .btnLast {
		display: inline-block;
	}
}

@media screen and (max-width: 590px) {
	.searchBox li .selectBox+.search input {
		width: 130px;
	}
}
@media screen and (max-width: 500px) {
	.searchBox li {
		width: 100%;
	}
	.searchBox li .selectBox+.search {
	    display: block;
	    width: 100%;
	    margin-top: 5px;
	    padding-left: 74px;
	    text-align: left;
	}
	.searchBox li .selectBox+.search input {
		width: 140px;
		width: calc(100% - 138px);
	}
	.searchBox li label+.search {
	    width: 70%;
	    width: calc(100% - 80px);
	}
	.searchBox li label+.search input {
		display: block;
		width: 100%;
		margin-bottom: 5px;
	}
	.contentsWrap .boxGray {
		padding: 20px;
	}
}
@media screen and (max-width: 414px) {
	.contentsBox .tab {
		height: 40px;
	}
	.contentsBox .tab ul li {
		min-width: 95px;
	    height: 40px;
	    line-height: 40px;
	}
	.contentsBox .tab ul li a {
		font-size: 1.15em;
	}
	.searchBox li {
		display: block;
		width: 100%;
	}
	button {
		min-width: 80px;
		padding: 0 15px;
	    z-index: 1000;
	}
}
@media screen and (max-width: 360px) {
	.searchBox li .selectBox+.search input {
		display: block;
		width: 100%;
		margin-bottom: 5px;
	}
	
	

	
	
	
	
	
	
	
}


/*반은형*/
@media all and (max-width:767px){
	.bubble{
	display:none;
	}
	
.popup .contentsWrap .contentsBox {
    width: 100%;
    padding: 0%;}

.alignCenter{font-size: 15px; margin: 8% 0;}	
.alignCenter >p {font-size: 12px;}
	
.step {display:none;}
	
.alignCenter > ul > li {
    width: 70%;
    height: 90%;
    border: 1px solid #cacaca;
    background-color: #f5f6fa;
    padding-top: 2%;
    margin: 5% auto;
    float:none;
}
button#bnt2{
	display: inline-block;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	font-size:80%;
}

}