@charset "utf-8";

@font-face{
font-family: "NanumBarunGothic";
src: url('font/NanumBarunGothic.eot')format('eot');
src: url('font/NanumBarunGothic.woff') format('woff');
}
@font-face{
font-family: "NanumBarunGothicBold";
src: url('font/NanumBarunGothicBold.eot')format('eot');
src: url('font/NanumBarunGothicBold.woff') format('woff');
}

*:focus {outline: none;}

input,button,img{vertical-align:middle;}
html, body, div, span, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i, a,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {margin:0; padding:0; border:0; outline:0; text-decoration:none;}
body {min-width:320px; line-height:1;}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {display:block;}
nav ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {content:'';content:none;}
table {border-collapse:collapse;border-spacing:0;}
body, input, textarea, select, button, table { font-family: 'NanumBarunGothic', 'NanumBarunGothicBold' , 'Roboto',Dotum,'돋움',Gulim,Helvetica,sans-serif;-webkit-text-size-adjust:none;}
ul, ol {list-style-type:none;}
input, select {vertical-align:middle;}
a {text-decoration:none; color:#454545}
.hidden {display:none;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }


::-webkit-scrollbar {
    -webkit-appearance: none;
}
::-webkit-scrollbar:vertical {
    width: 12px;
}
::-webkit-scrollbar:horizontal {
    height: 12px;
}
::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .3);
    border-radius: 7px;
    border: 2px solid #eee;
	min-height:15px;
}
::-webkit-scrollbar-track {
    border-radius: 5px;
    background-color: #eee;
}


/* 폼공통 */
input{vertical-align:middle;}
input[type="text"] {width:100%; border:1px solid #ddd; height:35px; color:#5b5b5b}
input[type="text"]::-webkit-input-placeholder {color:#a7a7a7;}
input[type="text"]:-input-placeholder {color:#a7a7a7;}
input[type="text"]:-ms-input-placeholder {color:#a7a7a7;}
input[type="text"]::-moz-input-placeholder {color:#a7a7a7;}

input[type="text"] {width:100%; border:1px solid #ddd;}
input[type="text"]::-webkit-input-placeholder {color:#a7a7a7;}
input[type="text"]:-input-placeholder {color:#a7a7a7;}
input[type="text"]:-ms-input-placeholder {color:#a7a7a7;}
input[type="text"]::-moz-input-placeholder {color:#a7a7a7;}


#wrap{width:100%;}
.content{text-align:center;}
.inner{width:1200px; margin:0 auto;}

.content img{display:block; margin-left:auto; margin-right:auto;}
.content a{display:inline-block;}
.video_cont{margin-bottom:45px;}
footer{background:#fafafa; border-top:1px solid #e1e1e1; padding:20px 0;}
footer p{color:#555; font-size:13px; line-height:165%; text-align:center;}
footer p span{color:#7a99cf;}





























#wrap{width:100%; height:100%; word-break:keep-all;}
.inner{width:1200px; margin:0 auto; height:100%;}

.top{position:relative; top:0; width:100%; background:#fff; display:block; border-bottom:2px solid #2a89ca;}
.top p{padding:30px 20px; line-height:135%; box-sizing:border-box;}
.side_a{float:left; width:45%; height:100%; display:table; background:#fafdff;}
.side_b{float:left; width:55%; height:100%; display:table; background:#e5f4fd;}

.side_a ul{width:80%; display:table-cell; vertical-align:middle; padding:0 20px; box-sizing:border-box;}
.side_a ul li{position:relative; margin-bottom:20px; line-height:135%; left:10px;}
.side_a ul li:before{position:absolute; content:""; display:block; background:#2a89ca; width:3px; height:3px; top:10px; left:-10px;}
.side_a ul li.tit{font-family:"NanumBarunGothicBold"; font-size:18px; margin-top:20px;}
.side_a ul li.tit:before{background:none;}

.side_b form{display:table-cell; vertical-align:middle; padding:0 30px; box-sizing:border-box;}
.side_b form input{margin:10px 0; border-bottom:1px solid #666; color:#666;font-size:1em;}
.side_b form input[type="text"]{width:60%; display:block; background:rgba(255,255,255,0.8); padding:2px 10px;}
.side_b form input[type="radio"]{margin-right:5px;}
.side_b form li{margin-bottom:25px;}
.side_b form li.filebox{position:relative;}

.
.side_b form .upload-name{position:relative; width:200px; display:block; height:35px; padding:0 10px; vertical-align:middle; background:rgba(255,255,255,0.8); border-bottom:1px solid #666;}
.side_b form li > span,
.side_b form li > span > strong{display:block;}
.side_b form li > span{width:90%; line-height:125%; font-size:14px; margin:10px 0; background:#ccc; padding:10px; box-sizing:border-box; border-radius:20px;}
.side_b form li > span > strong{margin-bottom:5px;}
.side_b form li.btn{position:relative; left:70%; display:inline-block;}
.side_b form li.btn input{width:120px; height:40px; line-height:40px; background:#2a89ca; border-radius:50px; border:none; color:#fff; font-size:17px; transition:all .2s ease-in;cursor:pointer;}
.side_b form li.btn input:hover{background:#1274b7; color:#fff; box-shadow:2px 2px 5px rgba(0,0,0,0.2); transition:all .2s ease-out;}

/*파일첨부 스타일링*/
.file_input{float:left;}
.file_input label {
    position:relative;
    cursor:pointer;
    display:inline-block;
    vertical-align:middle;
    overflow:hidden;
    width:100px;
    height:40px;
    background:#9b9b9b;
    color:#fff;
    text-align:center;
    line-height:46px;
}
.file_input label input {
    position:absolute;
    width:0;
    height:0;
    overflow:hidden;
	z-index:-1;
}
.file_input input[type=text] {
    vertical-align:middle;
    display:inline-block;
}
.file_input label:hover{
background:#777;
}

input[type="radio"]{
	width: 20px;
	height: 20px;
	background-color: #fff;
	vertical-align: -5px;
	cursor:pointer;
}
@media screen and (max-width:1200px){
	.inner{width:98%;}
	.side_a{float:none; margin-right:auto; margin-left:auto; width:100%; height:auto; padding:30px 20px; box-sizing:border-box;}
	.side_b{float:none; margin-right:auto; margin-left:auto; width:100%; height:auto; padding:40px 20px 20px; box-sizing:border-box;}
	.side_b form li.btn{position:relative; left:50%; margin-left:-60px; display:inline-block;}

	.side_b form li > span{width:100%;}
}