@charset "utf-8";
/* Pretendard */
@font-face {
	font-family: 'Pretendard';
    font-style: normal;
    font-weight: 400;
    src: url('/www2/fonts/Pretendard-Regular.eot');
    src: url('/www2/fonts/Pretendard-Regular.eot?#iefix') format('embedded-opentype'),
    url('/www2/fonts/Pretendard-Regular.woff') format('woff'),
    url('/www2/fonts/Pretendard-Regular.otf') format('opentype');
}
@font-face {
    font-family: 'Pretendard-B';
	font-style: normal;
	font-weight: 700;
	src: url('/www2/fonts/Pretendard-Bold.eot');
	src: url('/www2/fonts/Pretendard-Bold.eot?#iefix') format('embedded-opentype'),
	url('/www2/fonts/Pretendard-Bold.woff') format('woff'),
	url('/www2/fonts/Pretendard-Bold.otf') format('opentype');
}
/* esamanru */
@font-face {
	font-family: 'esamanru';
    font-style: normal;
    font-weight: 400;
    src: url('/www2/fonts/esamanru Medium.eot');
    src: url('/www2/fonts/esamanru Medium.eot?#iefix') format('embedded-opentype'),
    url('/www2/fonts/esamanru Medium.woff') format('woff'),
    url('/www2/fonts/esamanru Medium.otf') format('opentype');
}
@font-face {
    font-family: 'esamanru-B';
	font-style: normal;
	font-weight: 700;
	src: url('/www2/fonts/esamanru Bold.eot');
	src: url('/www2/fonts/esamanru Bold.eot?#iefix') format('embedded-opentype'),
	url('/www2/fonts/esamanru Bold.woff') format('woff'),
	url('/www2/fonts/esamanru Bold.otf') format('opentype');
}
html { font-family: Pretendard, "맑은 고딕", dotum, UnDotum, Malgun Gothic, "돋움", Dotum, Tahoma, Verdana, AppleGothic, sans-serif !important; background: url('/www2/images/error_bg.jpg') repeat center center fixed !important; background-size: cover;}
body, div, dl, dt, dd, ul, ol, li, i, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, legend, button, select, p, blockquote, th, td, table { font-family: 'Poppins', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', sans-serif !important; font-size: 100%; padding: 0; margin: 0; word-break: keep-all; -webkit-text-size-adjust: none;/* 모바일에서 폰트크기 변형안되도록 함 */}
ol, ul, li { list-style: none; margin: 0; padding: 0;}
h1, h2, h3, h4, h5, h6 { font-weight: normal;}
address, caption, small, em { font-weight: normal; font-style: normal;}
a { text-decoration: none; outline: none; -webkit-transition: all .1s ease-in-out; -ms-transition: all .1s ease-in-out; -moz-transition: all .1s ease-in-out; -o-transition: all .1s ease-in-out;}
a:link, a:visited { text-decoration: none;}
a:hover, a:active { text-decoration: none;}
.float-clear:after { content: ""; display: block; clear: both;}/* float해제 */
.flex { display: flex; flex-flow: row wrap; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; -moz-flex-flow: row wrap; -o-flex-flow: row wrap;}

#body_layout, .body_wrap { width: 100%; height: 100%;}
* { box-sizing: border-box;}

.body_wrap { position: relative; width: 90%; max-width: 1920px; margin: 0 auto;}
.www2-header .logo { position: absolute; top: 30px; left: 0; width: 142px; height: 77px; background: url('/www2/images/logo.png') no-repeat; background-size: 100%;}
.www2-header .logo a { display: block; width: 100%; height: 100%; font-size: 0;}

.www2-inner { padding: 25px 0;}
.www2-inner > div { float: left; width: 50%;}
.www2-inner .txt-box { align-self: center;}
.www2-inner .txt-box h2 { padding: 50px 0; font-size: 34px; font-family: 'esamanru',sans-serif !important; color: #24427d; line-height: 1.4em; text-align: center;}
.www2-inner .txt-box h2 span.h2-span-1 { font-family: 'esamanru-B',sans-serif !important; color: #00205b;}
.www2-inner .txt-box h2 span.h2-span-2 { font-family: 'esamanru-B',sans-serif !important;}
.www2-inner .txt-box .img-www2 { text-align: right;}
.www2-inner .txt-box .img-www2 img { max-width: 100%;}

.www2-inner .list-box ul { padding-right: 20px;}
.www2-inner .list-box li { position: relative; padding: 25px; margin-bottom: 10px; border-radius: 20px; box-sizing: border-box; background: #fff; box-shadow: 5px 5px 13px rgba(0,0,0,.15); -webkit-box-shadow: 5px 5px 13px rgba(0,0,0,.15); -ms-box-shadow: 5px 5px 13px rgba(0,0,0,.15); -webkit-transition: all .1s ease-in-out; -ms-transition: all .1s ease-in-out; -moz-transition: all .1s ease-in-out; -o-transition: all .1s ease-in-out;}
.www2-inner .list-box li:nth-of-type(odd) { margin-right: 50px;}
.www2-inner .list-box li:nth-of-type(even) { margin-left: 50px;}
.www2-inner .list-box li:hover { box-shadow: 15px 15px 20px rgba(0,0,0,.2); -webkit-box-shadow: 15px 15px 20px rgba(0,0,0,.2); -ms-box-shadow: 15px 15px 20px rgba(0,0,0,.2);}
.www2-inner .list-box li:hover a { background-position: right 11px center !important;}
.www2-inner .list-box li h3 { padding-bottom: 10px; font-size: 20px; font-family: 'esamanru',sans-serif !important;}
.www2-inner .list-box li:nth-of-type(1) h3 { color: #0489dd;}
.www2-inner .list-box li:nth-of-type(2) h3 { color: #1a8b47;}
.www2-inner .list-box li:nth-of-type(3) h3 { color: #114ab0;}
.www2-inner .list-box li:nth-of-type(4) h3 { color: #ff7e1f;}
.www2-inner .list-box li:nth-of-type(5) h3 { color: #083072;}
.www2-inner .list-box li:nth-of-type(6) h3 { color: #3f3276;}
.www2-inner .list-box li:nth-of-type(7) h3 { color: #bf4545;}
.www2-inner .list-box li p { font-size: 15px; color: rgba(0,0,0,.8); letter-spacing: -1px; line-height: 1.4em;}
.www2-inner .list-box li a { position: absolute; right: -20px; top: 13px; display: inline-block; padding: 7px 37px 7px 15px; font-size: 15px; color: #fff; background-position: right 15px center !important; letter-spacing: -1px;}
.www2-inner .list-box li:nth-of-type(1) a { background: #0489dd url('/www2/images/arr.png') no-repeat;}
.www2-inner .list-box li:nth-of-type(2) a { background: #1a8b47 url('/www2/images/arr.png') no-repeat;}
.www2-inner .list-box li:nth-of-type(3) a { background: #114ab0 url('/www2/images/arr.png') no-repeat;}
.www2-inner .list-box li:nth-of-type(4) a { background: #ff7e1f url('/www2/images/arr.png') no-repeat;}
.www2-inner .list-box li:nth-of-type(5) a { background: #083072 url('/www2/images/arr.png') no-repeat;}
.www2-inner .list-box li:nth-of-type(6) a { background: #3f3276 url('/www2/images/arr.png') no-repeat;}
.www2-inner .list-box li:nth-of-type(7) a { background: #bf4545 url('/www2/images/arr.png') no-repeat;}


.www2-footer { width: 100%; padding-bottom: 30px; text-align: center;}
.www2-footer address,
.www2-footer small { font-size: 16px; color: rgba(0,0,0,.8); letter-spacing: -1px;}

/* ////////////////////////////////////////////////// notebook & tablet & mobile */
@media all and (max-width:1400px) {
	.www2-inner { display: block;}
	.www2-inner > div { float: none; width: 100%;}
	.www2-inner .txt-box h2 { padding-top: 30px;}
	.www2-inner .txt-box .img-www2 { text-align: center;}
	.www2-inner .txt-box .img-www2 img { padding-left: 10%;}
	.www2-inner .list-box { margin-top: 50px;}
}
/* ////////////////////////////////////////////////// mobile */
@media all and (max-width:640px) {
	.www2-header .logo { top: 20px; width: 100px; height: 54px;}
	.www2-inner { padding: 60px 0;}
	.www2-inner .txt-box h2 { padding: 30px 0; font-size: 21px;}
	.www2-inner .list-box ul { padding-right: 10px;}
	.www2-inner .list-box li { padding: 22px 22px 60px;}
	.www2-inner .list-box li:nth-of-type(odd) { margin-right: 0;}
	.www2-inner .list-box li:nth-of-type(even) { margin-left: 0;}
	.www2-inner .list-box li h3 { padding-bottom: 7px; font-size: 17px;}
	.www2-inner .list-box li p { font-size: 14px;}
	.www2-inner .list-box li a { position: absolute; right: -10px; top: inherit; bottom: 15px;}
	.www2-footer address,
	.www2-footer small { font-size: 13px;}
}