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


.selectric-wrapper {
    cursor: pointer;
    position: relative;
}
.selectric-responsive {
    width: 100%;
}
.selectric {
    background: #fff none repeat scroll 0 0;
    border-radius: 1px;
    position: relative;
}
.selectric .label {
    color: #505050;
    display: block;
    font-size:14px;
    height:45px;
    line-height:48px;
    margin: 0 45px 0 25px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.selectric .button {
    color:#333;
    display: block;
    height:45px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    width: 38px;
	text-indent:-999999em;
}
.selectric .button::after {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #000 transparent -moz-use-text-color;
    border-image: none;
    border-style: solid solid none;
    border-width: 4px 4px medium;
    bottom: 0;
    content: " ";
    height: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 0;
}
.selectric-hover .selectric {
    background: #0072bc none repeat scroll 0 0;
	color:#fff !important
}
.selectric-hover .label { color:#fff}
.selectric-hover .selectric .button {
    color: #fff;
}
.selectric-hover .selectric .button::after {
    border-top-color: #e6e6e6;
}
.selectric-open {
    z-index: 9999;
}
.selectric-open .selectric-items {
    display: block;
}
.selectric-disabled {
    cursor: default;
    opacity: 0.5;
}
.selectric-hide-select {
    height: 0;
    overflow: hidden;
    position: relative;
    width: 0;
}
.selectric-hide-select select {
    display: none;
    left: -100%;
    position: absolute;
}
.selectric-input {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
    border: medium none !important;
    clip: rect(0px, 0px, 0px, 0px) !important;
    height: 1px !important;
    left: 0 !important;
    margin: 0 !important;
    outline: medium none !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    top: 0 !important;
    width: 1px !important;
}
.selectric-temp-show {
    display: block !important;
    position: absolute !important;
    visibility: hidden !important;
}
.selectric-items {
    background: #f8f8f8 none repeat scroll 0 0;
    border: 1px solid #c4c4c4;
    box-shadow: 0 0 10px -6px;
    display: none;
    left: 0;
    position: absolute;
    top: 100%;
    z-index: -1;
}
.selectric-items .selectric-scroll {
    height: 100%;
    overflow: auto;
}
.selectric-above .selectric-items {
    bottom: 100%;
    top: auto;
}
.selectric-items ul, .selectric-items li {
    font-size: 12px;
    line-height:27px;
    list-style: outside none none;
    margin: 0;
    min-height: 27px;
    padding: 0;
}
.selectric-items li {
    border-bottom: 1px solid #eee;
    color: #666;
    cursor: pointer;
    display: block;
    padding: 5px;
}
.selectric-items li.selected {
    background: #efefef none repeat scroll 0 0;
    color: #444;
}
.selectric-items li:hover {
    background: #f0f0f0 none repeat scroll 0 0;
    color: #da2128;
}
.selectric-items .disabled {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
    color: #666 !important;
    cursor: default !important;
    opacity: 0.5;
}
.selectric-items .selectric-group .selectric-group-label {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #444;
    cursor: default;
    font-weight: bold;
    padding-left: 10px;
}
.selectric-items .selectric-group.disabled li {
    opacity: 1;
}
.selectric-items .selectric-group li {
    padding-left: 15px;
}


#wrapper {position:relative; width:100%; }
#headerWrap {position:absolute; width:100%;}
.header {position:relative;width:1100px; margin:0 auto;}
#contentWrap {position:relative; width:100%; overflow:hidden; padding-top:134px}
.content {position:relative; width:1100px; margin:0px auto; padding:0; clear:both;}
#footerWrap {position:relative; width:100%; border-top:1px solid #ddd }
.footer {position:relative; width:1100px; margin:0px auto; padding:0; clear:both;}


/*Header*/
.quick { position:fixed; left:50%; margin-left:622px; z-index:100; top:165px; font-size:14px; text-align:center; height:500px}
.quick li { margin-bottom:15px}
.quick li p { margin-top:5px; }

.gnb { border-bottom:1px solid #ddd; width:100%; position:relative; height:40px}
.gnb ul { float:right}
.gnb ul li { float:left; font-size:14px; padding:10px; background:url(/img/common/gnb_line.gif) no-repeat right center;}
.gnb ul li:last-child { background:none}
.gnb ul li a { color:#888787;}
.gnb ul li a:hover { color:#0072bc;}

.logo { position:absolute; left:50%; margin-left:-530px; top:56px; z-index:100}

#headerWrap {  background:url(/img/common/menu_on.png) repeat-x;  height:134px;  overflow: visible !important;  width: 100%;  z-index:50;}
#headerWrap .header-wrap {  margin: 0 auto;  overflow: visible;   position: relative;   width: 1100px;   z-index: 70;}
#headerWrap .header-wrap .nav-wrap {  height:134px;  position: relative;   right: 0;   top: 0;    width: 100%;    z-index: 80;}
#headerWrap .header-wrap .nav-wrap ul.list {    font-size: 17px;    font-weight: normal;    height:93px;    left: 0;    line-height: 50px;    overflow: hidden;    position: absolute;    top:0;    width: 830px;	margin-left:275px}
#headerWrap .header-wrap .nav-wrap ul.list li {   display: inline-block;   float: left;   padding:31px 26px 0;    text-align: center;}
#headerWrap .header-wrap .nav-wrap ul.list li a {   color: #3f3f3f;    display: inline-block;    float: left;	}
#headerWrap .header-wrap .nav-wrap ul.list li a:hover {}
#headerWrap .header-wrap .nav-wrap ul.list a.menu {   height: 50px;}
#headerWrap .header-wrap .nav-wrap ul.list a.menu01 {}
#headerWrap .header-wrap .nav-wrap ul.list a.menu01:hover, #headerWrap .header-wrap .nav-wrap ul.list a.menu01.on {  color: #ed1c24; }
#headerWrap .header-wrap .nav-wrap ul.list a.menu02 {}
#headerWrap .header-wrap .nav-wrap ul.list a.menu02:hover, #headerWrap .header-wrap .nav-wrap ul.list a.menu02-on {  color: #ed1c24;}
#headerWrap .header-wrap .nav-wrap ul.list a.menu03 {}
#headerWrap .header-wrap .nav-wrap ul.list a.menu03:hover, #headerWrap .header-wrap .nav-wrap ul.list a.menu03-on {  color: #ed1c24;}
#headerWrap .header-wrap .nav-wrap ul.list a.menu04 {}
#headerWrap .header-wrap .nav-wrap ul.list a.menu04:hover, #headerWrap .header-wrap .nav-wrap ul.list a.menu04-on {   color: #ed1c24;}
#headerWrap .header-wrap .nav-wrap ul.list a.menu05 {}
#headerWrap .header-wrap .nav-wrap ul.list a.menu05:hover, #headerWrap .header-wrap .nav-wrap ul.list a.menu05-on {    color: #ed1c24;}
#headerWrap .header-wrap .nav-wrap ul.list a.menu06 {}
#headerWrap .header-wrap .nav-wrap ul.list a.menu06:hover, #headerWrap .header-wrap .nav-wrap ul.list a.menu06-on {   color: #ed1c24;}
#headerWrap .header-wrap .nav-wrap ul.list a.menu07 {}
#headerWrap .header-wrap .popup {    display: none;}
#headerWrap .menu-wrap {    top:136px;    height: 50px;    left: 0;    overflow: hidden;    position: absolute;    width: 100%;    z-index:100;}
#headerWrap .menu-wrap .list-wrap {  height: 50px;  margin: 0 auto;  overflow: hidden;  position: relative;  width: 1100px;}
#headerWrap .menu-wrap .list-wrap ul.list {  display: none;   font-size: 14px;   line-height: 50px;   position: absolute;   top: 0;}
#headerWrap .menu-wrap .list-wrap ul.list a {   color: #fff;   opacity: 1;}
#headerWrap .menu-wrap .list-wrap ul.list a:hover {   opacity: 1;    text-decoration: underline;}
#headerWrap .menu-wrap .list-wrap ul.list li {  float: left;  margin-right: 28px;  padding: 0;}
#headerWrap .menu-wrap .list-wrap ul.list li:first-child {  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;}
#headerWrap .menu-wrap .list-wrap ul.list li:last-child { margin-right:0}
#headerWrap .menu-wrap .list-wrap ul.list01 {  left:225px;}
#headerWrap .menu-wrap .list-wrap ul.list02 {  left:353px;}
#headerWrap .menu-wrap .list-wrap ul.list03 {  left:455px;}
#headerWrap .menu-wrap .list-wrap ul.list04 {  left:515px;}
#headerWrap .menu-wrap .list-wrap ul.list05 {  left:473px;}
#headerWrap .menu-wrap .list-wrap ul.list06 {  left:498px;}
#headerWrap .menu-wrap .list-wrap ul.list07 {  left:500px;}


/*content*/
#visual { width:100%; overflow:hidden; position:relative; margin:0 auto; height:385px; }
.visual_wrap { position:relative; width:100%; height:385px; text-align:center; }
.visual_box { position:absolute; width:1920px; left:50%; margin-left:-960px}
.visual_box div { position:absolute; top:0;	left:0; }
.v_ul {	position:absolute;	bottom:90px; right:50%; margin-right:-26px;	z-index:999; }
.v_ul li { float:left;	z-index:1;	cursor:pointer;	margin-right:6px;}
.v_btn01 {	position:absolute;	z-index:1;	top:240px;	left:120px;	cursor:pointer; }
.v_btn02 {	position:absolute;	z-index:1;	top:240px;	right:120px; cursor:pointer; }
.visual_p {	/*position:absolute;*/	left:0;}
.visu_tit { position:absolute; left:48%; margin-left:-200px; color:#fff; z-index:1000; font-size:20px; line-height:35px; top:93px;text-shadow:1px 1px 1px #333;  zoom:1; -moz-text-shadow:1px 1px 1px #333;-webkit-text-shadow:1px 1px 1px #333;}
.visu_tit h2 { font-size:50px; line-height:65px}
.visu_tit .v_box { font-size:18px; line-height:25px; border:1px solid #fff; padding:8px 40px; display:inline-block; margin-top:15px   }


.s_banner { width:1100px; margin:75px auto 0; position:relative; }
.amazon_scroller{ padding: 0px; margin:0; width:1100px !important; height:380px !important }
.amazon_scroller .amazon_scroller_nav{ position: absolute; width:1100px !important}
.amazon_scroller .amazon_scroller_nav li{ cursor: pointer; position: absolute; top:-184px; border:0}
.amazon_scroller .amazon_scroller_mask{ position: absolute;   overflow: hidden; width:1100px !important}
.amazon_scroller ul{ padding: 0px; margin: 0px; float: left;}
.amazon_scroller ul li{  padding: 0px; margin:0 5px; list-style: none; float: left; text-align: center; display:inline; }
.amazon_scroller ul li a{ text-decoration: none;}
.amazon_scroller ul li a amazon_scroller_title{	overflow:hidden;}
.amazon_scroller ul li a:hover{ }
.amazon_scroller ul li a img{ border: none;}
.box {width:355px;	 height:380px;	 box-sizing:border-box;	 -webkit-box-sizing:border-box;	 -moz-box-sizing:border-box;	 text-align:center;border:1px solid #ddd	}
.box:last-child { margin:0}
.actionImg10 {	 overflow:hidden;	 position:relative;	 background-color:#fff;}
.actionImg10 .codeView_btn {	 bottom:20px !important;}
.actionImg10:after {	 position:absolute;	 bottom:0;	 left:0;	 content:'';	 width:100%;	 height:8px;	 background-color:#00a04c;	 transform:scaleX(0);	 -webkit-transform:scaleX(0);	 -moz-transform:scaleX(0);	 transform-origin:left;
	 -webkit-transform-origin:left;	 -moz-transform-origin:left;	 transition:transform .5s;	 -webkit-transition:transform .5s;	 -moz-transition:transform .5s;	 border-radius:0 50px 50px 0;}
.actionImg10 .lm_img {	 overflow:hidden;	 width:100%;	 height:184px;	 margin-bottom:15px;}
.actionImg10 .lm_img img {	 width:100%;	 height:auto;	 filter:grayscale(0%);	 -webkit-filter:grayscale(0%);	 transition:all .8s;	 -webkit-transition:all .8s;	 -moz-transition:all .8s;}
.actionImg10 .lm_txt {	 font-size:15px; color:#595959; line-height:23px}
.actionImg10 .lm_txt .sub_tit {	 display:inline;	 font-size:23px; line-height:30px;	 font-weight:bold; color:#363636; padding:10px 0}
.actionImg10 .lm_txt p { border:1px solid #3a3a3a; padding:5px 0; font-size:14px; width:190px; margin:15px auto 0; }
.actionImg10:hover:after{	 transform:scaleX(1.2);	 -webkit-transform:scaleX(1.2);	 -moz-transform:scaleX(1.2);}
.actionImg10:hover .lm_img img {	 filter:grayscale(0%);	 -webkit-filter:grayscale(0%);	 transform:scale(1.1);	  -webkit-transform:scale(1.1);	 }
.actionImg10:hover .lm_txt .sub_tit {	 color:#0072bc; }
.actionImg10:hover .lm_txt .desc {	 color:#595959;}

.event_area { width:1100px; margin:35px auto; height:100px; background:#666; clear:both}

.board_area { background:url(../image/main2/board_bg.jpg) no-repeat left center; width:100%; height:368px}
.board_area > div > div { float:left; width:360px; margin-right:10px; text-align:center; margin-top:28px}
.board_area > div > div:last-child { margin-right:0 }
.board_area > div > div h2 { color:#fff; font-size:22px; line-height:68px}
.board_area > div > div dl { background:#fff; margin-top:20px; border-radius:10px; padding:25px 15px; box-shadow:2px 2px 5px #333 }
.board_area > div > div dl dt { border-bottom:1px solid #ddd }
.board_area > div > div dl dt h3 { font-size:20px; line-height:25px}
.board_area > div > div dl dt .date { color:#999; font-size:14px; margin-top:8px; margin-bottom:10px}
.board_area > div > div dl dd { margin-top:10px; line-height:25px; color:#5b5b5b}
.board_area .notice h3 { color:#05cebf}
.board_area .data h3 { color:#fd6939}
.board_area .faq h3 { color:#8e3091}

.process { background:url(../image/main2/process_bg.gif) repeat-y center center; height:722px; width:100%;}
.process > div > div { float:left; width:50%; text-align:center}
.process > div > div h2 { font-size:32px; line-height:40px; margin-top:60px; margin-bottom:60px}
.process > div > div h2 p { height:1px; background:#366c6e; display:block; width:110px; margin:20px auto 0}
.process > div .jr_area { background:url(../image/main2/jr_bg.png) no-repeat 0 30px #c1dbdc; height:722px}
.process > div .sr_area { background:url(../image/main2/sr_bg.png) no-repeat 410px 100px #e4e4de; height:722px}
.process > div .jr_area h2 { color:#366c6e}
.process > div .sr_area h2 { color:#99a600}
.process > div .sr_area h2 p { background:#99a600}
.process > div .sr_area dl dt { color:#99a600}

.amazon_scroller2{ padding: 0px; margin:0; width:530px !important; height:380px !important }
.amazon_scroller2 .amazon_scroller_nav2{ position: absolute; width:530px !important}
.amazon_scroller2 .amazon_scroller_nav2 li{ cursor: pointer; position: absolute; top:-140px; border:0}
.amazon_scroller2 .amazon_scroller_mask2{ position: absolute;   overflow: hidden; width:530px !important}
.amazon_scroller2 ul{ padding: 0px; margin: 0px; float: left;}
.amazon_scroller2 ul li{  padding: 0px; margin:0 5px; list-style: none; float: left; text-align: center; display:inline; }
.amazon_scroller2 ul li a{ text-decoration: none;}
.amazon_scroller2 ul li a amazon_scroller_title{	overflow:hidden;}
.amazon_scroller2 ul li a:hover{ }
.amazon_scroller2 ul li a img{ border: none;}
.process dl dt { font-size:25px; line-height:35px; color:#5687b2; padding:20px 0; font-weight:bold}
.process dl dd { font-size:19px; color:#212121; }
.process dl dd p { font-size:15px; color:#444444; margin-top:15px; line-height:22px}

.amazon_scroller3{ padding: 0px; margin:0; width:530px !important; height:380px !important; float:right }
.amazon_scroller3 .amazon_scroller_nav3{ position: absolute; width:530px !important}
.amazon_scroller3 .amazon_scroller_nav3 li{ cursor: pointer; position: absolute; top:-140px; border:0}
.amazon_scroller3 .amazon_scroller_mask3{position: absolute;	overflow: hidden;	width: 530px !important;	}
.amazon_scroller3 ul{ padding: 0px; margin: 0px; float: left;}
.amazon_scroller3 ul li{  padding: 0px; margin:0 5px; list-style: none; float: left; text-align: center; display:inline; }
.amazon_scroller3 ul li a{ text-decoration: none;}
.amazon_scroller3 ul li a amazon_scroller_title{	overflow:hidden;}
.amazon_scroller3 ul li a:hover{ }
.amazon_scroller3 ul li a img{ border: none;}

.study { text-align:center; width:100%; position:relative; height:360px}
.study h2 { font-size:32px; line-height:40px; margin-top:60px; margin-bottom:45px}
.study h2 p { height:1px; background:#494949; display:block; width:110px; margin:20px auto 0}
.study ul { width:900px; margin:0 auto; text-align:center}
.study ul li { float:left; width:300px;}
.study ul li a .s_icon { width:107px; height:107px; display:inline-block; margin-bottom:15px}
.study ul li a .s_icon1 { background:url(../image/main2/s_icon1.png) no-repeat center center}
.study ul li a .s_icon2 { background:url(../image/main2/s_icon2.png) no-repeat center center}
.study ul li a .s_icon3 { background:url(../image/main2/s_icon3.png) no-repeat center center}
.study ul li a:hover .s_icon1 { background:url(../image/main2/s_icon1.png) no-repeat center top}
.study ul li a:hover .s_icon2 { background:url(../image/main2/s_icon2.png) no-repeat center top}
.study ul li a:hover .s_icon3 { background:url(../image/main2/s_icon3.png) no-repeat center top}
.study ul li h3 { font-size:17px; color:#002f46; margin-bottom:5px; font-weight:normal; line-height:22px}

.q_bt { background:url(../image/main2/q_bt_bg.jpg) no-repeat center center; width:100%; height:313px; text-align:center; color:#fff}
.q_bt .call_num { font-size:40px; line-height:45px; color:#ffd217; line-height:53px; margin:10px 0 30px}
.q_bt .txt { padding-top:52px; font-size:16px}
.q_bt ul { width:948px; margin:0 auto}
.q_bt ul li { float:left; margin:5px }
.q_bt ul li a { display:block; width:225px; padding:10px 0; border:1px solid #fff; text-align:center; font-size:16px; color:#fff; background:url(../image/main2/q_bt_arrow.png) no-repeat 210px center}
.q_bt ul li a:hover { background:url(../image/main2/q_bt_arrow.png) no-repeat 210px center #002f46; }


.contents { padding:50px 0; background:#f9f7fa; width:100%; position:relative; height:440px}
.contents > div > div { float:left; width:49%}
.contents h2 { font-size:27px; line-height:35px;  margin-bottom:35px; text-align:center }
.contents h2 p { height:1px; background:#494949; display:block; width:110px; margin:15px auto 0}
.contents ul li { clear:both; margin-bottom:40px; height:45px; margin-left:15px;}
.contents ul li img { float:left; margin-right:25px; margin-left:20px}
.contents ul li dl { float:left;}
.contents ul li dl dt { font-size:18px; line-height:25px; color:#ff9211; margin-bottom:5px}
.contents ul li dl dd { color:#555555}
.contents ul li a:hover dt { text-decoration:underline}
.contents .free { border-left:1px solid #ddd; width:50%; }
.contents .free dt { color:#0072bc;}