@charset "utf-8";

html,body,section,article,header,footer,nav,
div,p,
h1,h2,h3,h4,h5,h6,
ul,ol,li,dl,dd,dt,
img,a,
form,input,select,option,fieldset,textarea,button,label,
figure,video {
	margin:0;
	padding:0;
	border:0;
	background-repeat:no-repeat;
	background-position:center;
	background-color:transparent;
	line-height:1;
	text-decoration:none;
	font-family:'pretendard','noto sans kr','맑은 고딕',돋움,'Apple SD Gothic Neo','sans-serif','Korea_hero';
	font-size:15px;
	font-weight:normal;
	color:#555;
	letter-spacing:-0.4px;
	box-sizing:border-box;
	text-size-adjust:none;
	list-style:none;
	word-break: keep-all;
}
a:link, a:visited,
a:hover, a:focus, a:active {
	text-decoration:none;
}

table {width:100%; border-spacing:0; border-collapse:collapse;}

/* 폼초기화 */
select,button,input[type=text],input[type=submit],textarea	{
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	/* border-radius:0; */
}

select	{	box-sizing:border-box;}
/*크롬사라피*/
@media screen and (-webkit-min-device-pixel-ratio:0){
	select	{	padding-right:22px !important;	background:url(/images/bg_select.svg) no-repeat right center; background-size:contain;}
}
/*파이어폭스*/
@-moz-document url-prefix(){
	select	{	padding-right:22px !important;	background:url(/images/bg_select.svg) no-repeat right center; background-size:contain;}
}

:root {
 --main-c: #1e79ef;;
}


body{background: #f9f9f9;  }
.main{padding: 80px 0; width: 100%; height:100%; background: #f9f9f9;  }
.main_bg{display: block; margin: 0 auto; max-width: 800px; height: 800px; width: 100%; border-radius: 30px; background: url(/images/bg.jpg) 50% no-repeat; background-size: cover; box-shadow: inset 4px 4px 3px rgba(0, 0, 0, 0.2), 10px 10px 30px rgba(0, 0, 0, 0.2); position: relative; }
.main_bg hgroup{width: 100%; position: absolute; left: 50%; top: 50%; padding: 96px; transform: translate(-50%, -50%); box-sizing: border-box;}
.main_bg hgroup h2{margin-bottom: 30px; text-align: center; color: #fff; font-weight: bold; font-size: 2.5rem;}
.main_bg hgroup p{padding: 1.35rem; background: var(--main-c); color: #fff; border-radius: 500px; position: relative; font-weight: bold; font-size: 1.35rem; font-weight: bold; box-shadow: inset 2px 2px 5px rgba(0, 0, 0, 0.2), 10px 10px 30px rgba(0, 0, 0, 0.2); max-width: 200px; width: 100%; margin: 0 auto; }
.main_bg hgroup p::after{content: '→'; position: absolute; top: 50%; right: 30px; transform: translateY(-50%);  }



/* 모달팝업 */
#modal-content {display:none;width:600px;max-width:90%;height:500px;box-shadow:0 5px 15px rgba(0, 0, 0, 0.5);background-color: #fff;border: 1px solid rgba(0, 0, 0, 0.2);border-radius: 0;outline: 0 none}
#modal-content .modal-header {height:20px;border-bottom:1px solid #e5e5e5;padding:15px}
#modal-content .modal-header h4 {margin:0;font:bold 18px 'Malgun Gothic';color:#5d5d5d}
#modal-content .modal-body {padding:15px}
#modal-content .modal-body .b-iframe {width:570px;max-width:100%;height:430px}
#modal-content .b-close{float:right;font:bold 21px Arial;line-height:1;color:#000;text-shadow:0 1px 0 #fff;opacity:.2;filter:alpha(opacity=20);padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none}
#modal-content .b-close:hover, #modal-content .b-close:focus{color:#000;text-decoration:none;cursor:pointer;opacity:.5;filter:alpha(opacity=50)}
p.modal-frame-content{width:550px;max-width:100%;height:400px;padding-right:5px;overflow-x:hidden;overflow-y:auto;font:normal 12px 'Malgun Gothic';color:#555;line-height:1.65em}
/*.popbtn {text-decoration:none;cursor:pointer;margin:0 5px}*/
.b-modal __b-popup1__ {max-width:100%}
#modal-content .modal-header,#modal-content .modal-body{box-sizing:content-box !important}

#modal-content2 {display:none; width:400px; height:560px; background:rgba(54,54,54,0.9); border-radius:4px; border:0px;}
#modal-content2 .modal-header {position:relative; height:28px;}
#modal-content2 .modal-body2 {padding:0;}
#modal-content2 .b-close{position:absolute;top:0;right:16px;font-size:40px;font-weight:900;font-family:Tahoma;color:#fff;opacity:.5;filter:alpha(opacity=50);padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none}
#modal-content2 .b-close:hover, #modal-content .b-close:focus{cursor:pointer;opacity:1;filter:alpha(opacity=100)}
#modal-content2 .modal-body2 .b-iframe {width:400px;height:560px;}
