@charset "utf-8";

@import url(common.css);/*공통*/
@import url(font.css);/*폰트*/
@import url(sub.css);/*컨텐츠*/


h3 {font-size:5.5vw; font-weight:700}

#wrap {position:relative; min-width:340px;}

/********************탑메뉴********************/
#header_wrap {position:fixed; left:0;width:100%;min-width:320px;top:0; z-index:10}
#header{position:relative; height:22vw; background:#000; border-bottom:1px solid #00b050}

#header .head_bt {width:12vw; height:8vw; position: absolute; top: 34%; left: 5vw; z-index: 10;}
#header .head_bt span {position:absolute; top: 0; left:2.5vw; height: 1vw;width: 9vw;background: #00b050; border-radius: 4px;}
#header .head_bt span:before {content:""; display:inline-block; width:1.5vw; height:1.5vw; background:#00b050; border-radius:50%; position:absolute; top: -0.3vw; left:-2.5vw;}

#header .head_bt span:first-child {top: 0px;}
#header .head_bt span:nth-child(2) {top: 3vw;}
#header .head_bt span:last-child {top: 6vw;}

#header h1 {position:absolute; top:50%; left:50%; transform: translate(-50%,-50%);}
#header h1 img {height:12vw;}

/*뒤로가기*/
#header .back_btn {width:12vw; height:8vw; position: absolute; top: 34%; left: 5vw; z-index: 10; font-size:4.5vw; color:#00b050}

/********************탑네비********************/
#mainNavi_wrap{position:relative;z-index:4300;text-align:left;height:0 !Important}
#mainNavi {position:fixed;z-index:7000;top:0;left:-100%;width: 100%;min-width:320px;box-sizing:border-box;display:block;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
#mainNavi .header_slider_ovclick {display: none;}

#mainNavi .bt_mnclose {position:absolute;display:block;z-index:4500;left:80%;top:0;width:12vw;height:12vw;}
#mainNavi .bt_mnclose span {position:absolute; top: 50%; left:2.5vw; height: 1vw;width: 10vw;background: #00b050; border-radius: 4px;}
#mainNavi .bt_mnclose span:first-child {transform: rotate(45deg);}
#mainNavi .bt_mnclose span:last-child {transform: rotate(-45deg);}

#mainNavi.mn-h-open {left:0;}
#mainNavi.mn-h-open .header_slider_ovclick {display: block;}
#mainNavi.mn-h-open .bt_mnclose {display: block;}

/*네비부분*/
.Navi_area {position:fixed;display: block;width:80%;height:100%;min-height:480px; padding:10vw 0 0 0; overflow-y:auto;background:#000;z-index: 4500}

.l_mu01 {width:100%;}
.l_mu01 li {position:relative; overflow:hidden}
.l_mu01 li span {display:inline-block; float:left; vertical-align:middle; width:10vw; height:10vw; margin:-1.5vw 3vw 0 0;}

.l_mu01 li .l_mu01_icon01 {background:url(/share/img/inc/nav_icon01.png) no-repeat 0 50%; background-size:100%}
.l_mu01 li .l_mu01_icon02 {background:url(/share/img/inc/nav_icon02.png) no-repeat 0 50%; background-size:100%}
.l_mu01 li .l_mu01_icon03 {background:url(/share/img/inc/nav_icon03.png) no-repeat 0 50%; background-size:100%}
.l_mu01 li .l_mu01_icon04 {background:url(/share/img/inc/nav_icon04.png) no-repeat 0 50%; background-size:100%}
.l_mu01 li .l_mu01_icon05 {background:url(/share/img/inc/nav_icon05.png) no-repeat 0 50%; background-size:100%}

.l_mu01 li.on .l_mu01_icon01 {background:url(/share/img/inc/nav_iconw01.png) no-repeat 0 50%; background-size:100%}
.l_mu01 li.on .l_mu01_icon02 {background:url(/share/img/inc/nav_iconw02.png) no-repeat 0 50%; background-size:100%}
.l_mu01 li.on .l_mu01_icon03 {background:url(/share/img/inc/nav_iconw03.png) no-repeat 0 50%; background-size:100%}
.l_mu01 li.on .l_mu01_icon04 {background:url(/share/img/inc/nav_iconw04.png) no-repeat 0 50%; background-size:100%}
.l_mu01 li.on .l_mu01_icon05 {background:url(/share/img/inc/nav_iconw05.png) no-repeat 0 50%; background-size:100%}

.l_mu01 li a, .l_mu02 li a{padding:5vw; display:block; color:#fff; font-weight:700; font-size:4.5vw}
.l_mu02 li a{color:#00b050; font-size:4.2vw}
.l_mu01 li.on a, .l_mu02 li.on a {background:#00b050; color:#fff;}

.l_mu01 li a:after, .l_mu02 li a:after {position: absolute;top: 50%;right: 4vw;transform: translateY(-50%);color: #00b050; font-size:5.5vw; display: block;content: "\f112";font-family: LineAwesome}
.l_mu01 li.on a:after, .l_mu02 li.on a:after {color:#fff}


.l_mu02 {width:100%;}
.l_mu02 li {position:relative; overflow:hidden}
.l_mu02 li span {display:inline-block; float:left; vertical-align:middle; width: 7vw; height: 10vw; margin:-1.5vw 3vw 0 0;}

/*좌측메뉴 로그아웃*/
.l_mu02 li .l_mu02_icon01 {background:url(/share/img/myiron/icons_lock.png) no-repeat 0 50%; background-size:100%}

   
/*배너부분*/
.l_mu_slider {position: relative;display: block;z-index: 10}
.l_mu_slider .item a {position: relative;display: block}
.l_mu_slider .item img {display: inline-block;width: 100%;}

.l_mu_slider .slick-arrow {position: absolute;top: 50%;border-radius: 50%;width: 10vw;height: 10vw;margin-top: -25px;text-indent: -9999px;border: none;cursor: pointer;z-index: 100}
.l_mu_slider .slick-next {right: 0;background: url("/share/img/inc/slider_next.png") no-repeat center;background-size: 100%;}
.l_mu_slider .slick-prev {left: 0;background: url("/share/img/inc/slider_prev.png") no-repeat center; background-size: 100%;}

/*정보*/
.l_mu_info {position:relative; padding:5vw; border-top:4px solid #00b050; overflow:hidden}
.l_mu_infotxt {float:left; width:58%; color:#343434; font-size:5.5vw; margin-top:1vw}
.l_mu_infotxt span {display:block; color:#696969; font-size:4.2vw; margin-top:1vw}
.l_mu_infobtn {float:right; width:40%;}
.l_mu_infobtn a {background:#00b050; color:#fff; display:block; width:100%; padding:2vw 2vw; text-align:center; border-radius:2.5vw}
.l_mu_infobtn a span.icon {display:block; background:url(/share/img/inc/l_mu_info_icon.png) no-repeat 0 0; width:8vw; height:11vw; margin:0 auto; background-size:100%; }


.l_myinfo {overflow:hidden; color:#999; padding:4vw}
.l_myinfo .myinfo_pic {float:left; width:34%;}
.l_myinfo .myinfo_pic img {width:100%; border-radius:50%; vertical-align:middle}
.l_myinfo .myinfo_txt {float:right; width:60%; margin-top:5vw; font-size: 3.7vw}
.l_myinfo .myinfo_txt p {font-size:5vw}

/********************푸터********************/
#footer {position:relative; background:#00b050; color:#fff; padding:5vw 0}
#footer .ft_logo img {height:12vw; margin-bottom:2vw;}


/********************하단퀵********************/
#ft_quick_wrap {position:fixed;bottom: 0;left: 0;width: 100%;min-width:320px;background:#000;z-index: 100;}
#ft_quick {overflow: hidden;width:100%; padding: 0 4vw; /* padding: 0 3vw; 기존 */}
#ft_quick li{position: relative;float:left; width:25%; box-sizing:border-box; padding:3vw 0;}
#ft_quick li a{display:block; padding-top: 8vw; text-align:center;}
#ft_quick li span { position: relative;display:inline-block; text-indent:-9999px;}

#ft_quick li:nth-child(1) a{background:url(/share/img/inc/nav_icon01.png) no-repeat 50% 50%; background-size:50%}
#ft_quick li:nth-child(2) a{background:url(/share/img/inc/nav_icon02.png) no-repeat 50% 50%; background-size:50%}
#ft_quick li:nth-child(3) a{background:url(/share/img/inc/nav_icon03.png) no-repeat 50% 50%; background-size:50%}
#ft_quick li:nth-child(4) a{background:url(/share/img/inc/nav_icon04.png) no-repeat 50% 50%; background-size:50%}

#ft_quick li:nth-child(1).on a{background:url(/share/img/inc/nav_iconw01.png) no-repeat 50% 50%; background-size:50%}
#ft_quick li:nth-child(2).on a{background:url(/share/img/inc/nav_iconw02.png) no-repeat 50% 50%; background-size:50%}
#ft_quick li:nth-child(3).on a{background:url(/share/img/inc/nav_iconw03.png) no-repeat 50% 50%; background-size:50%}
#ft_quick li:nth-child(4).on a{background:url(/share/img/inc/nav_iconw04.png) no-repeat 50% 50%; background-size:50%}


/********************인트로********************/
.intro_box {position:relative; background:url(/share/img/inc/intro.png) no-repeat 50% 0; background-size:100%; width:100%; height:100vh}
.intro_box .scont2 {height:100vh}

.intro_box .txt, .intro_box .intro_btn {position:absolute; left:0;width:100%;}
.intro_box .txt {font-size:6vw; bottom:70vw;}
.intro_box .txt p {font-size:8vw; padding-bottom:4vw}
.intro_box .intro_btn {bottom:33vw;}

/********************컨텐츠********************/
#scontainer_wrap {position:relative; background:#fff; min-height:400px; }
.scont {position:relative; padding:30vw 0 15vw; width:94%; margin:0 auto;}
.scont2 {position:relative; width:94%; margin:0 auto;}
.scont_pp {padding-top:22vw !important;}
.scont_mm {margin-top:-8vw !important;}


/********************모달********************/
.modalp, .at_modal{display:none;}
.modal_box {position:relative; width:100%; height:100vh; background:#fff; margin:0 auto; overflow-y:auto; -webkit-overflow-scrolling:touch;}
.modal_sbox {position:relative; width:94%; height:100vh; margin:0 auto;}
.modal_tlt {position:relative; padding:10vw 0 12vw; color:#00b050; font-size:6.6vw;}
.mdl_tlt {font-size:5vw}

.modal_cont {padding-bottom:35vw;}

.modal_close {position:absolute;display:block;z-index:4500; right:-3vw;top:6.8vw;width:12vw;height:12vw;}
.modal_close span {position:absolute; top: 50%; left:0; height: 1vw;width: 9vw;background: #00b050; border-radius: 4px;}
.modal_close span:first-child {transform: rotate(45deg);}
.modal_close span:last-child {transform: rotate(-45deg);}

.chek_box i {color: #fff; font-size: 22px; margin-top: 3px;}
.modal_box textarea {padding:10px;}


/********************얼럿 모달********************/
.alertbox {width:80%; background:#fff; border:1px solid #00b050; margin:50% auto; text-align:center;}
.alert_cont {position:relative; min-height:35vw; padding:1vw;}
.alert_txt {position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); width:100%;}

.alert_btn {display:inline-block; background:#00b050; color:#fff; line-height:12vw; height:12vw;}
.alert_btn2 {display:inline-block; background:#00b050; color:#fff; line-height:12vw; height:12vw; border-radius:10px;}
.alert_wbtn2 {display:inline-block; background:#fff; color:#00b050; line-height:12vw; height:12vw; border: 0.2vw solid #00b050 ;border-radius:10px;}
.alert_wbtn2.line {border:2px solid #00b050}

.alert_btn.alert_bbtn {background:#000;}
.alert_btn.alert_wbtn {background:#00b050; color:#fff}

.alert_btnul.alert_btnul2 {width:94%; margin:0 auto;}
.alert_btnul {overflow:hidden;}
.alert_btnul li {float:left; width:49.9%;}
.alert_btnul li:nth-child(2) {float:right;}

.alert_btnul.alert_btnul2 li {width:49%;}



.alertbox2 {position:relative; width:90%; background:#fff; border:0.7vw solid #00b050; margin:5% auto; border-radius:3vw; text-align:center;}
.alert2_cont {position:relative; min-height:35vw; padding:7vw 4vw;}
.alert2_txt {width:100%; word-break: keep-all;}
.alert2_txt p {font-size:6vw; margin-bottom:5vw}
.alert2_txt p img {width:6vw; vertical-align:middle;}
.alert2_txt .txt {font-size:3.8vw; line-height:1.5em; word-break: keep-all;}

.alert2_txt .at_ul li {margin:0 0 2vw 7vw;}
.alert2_txt .at_ul li span {padding-left:3vw}
.alert2_txt .at_ul li:before {content:""; display:inline-block; width:3vw; height:0.5vw; background:#fff; vertical-align:middle; margin:-1vw 0 0 -7vw}

.alertbox3 {position:relative; width:100%; height:100vh; background:#fff; margin:0 auto; text-align:center;}

.lcs_switch.lcs_switch2.lcs_off {background:#fff; border:1px solid #00b050;}
.lcs_switch.lcs_switch2 .lcs_cursor {background:#00b050}
.lcs_switch.lcs_switch2.lcs_on .lcs_cursor {background:#fff}



.sm_alertbox {width:80%; background:#fff;  margin:50% auto; text-align:center; border-radius:3vw; overflow:hidden} 
/* .sm_alertbox {width:80%; background:#00b050; top: 30%;
    left: 50%;
    transform: translate(-50%, 50%);
    z-index: 200; text-align:center; border-radius:3vw; overflow:hidden} */
.sm_alert_cont {position:relative; min-height:20vw; padding:1vw;}
.sm_alert_txt {position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); width:100%;}

.sm_alert_btnul {overflow:hidden;}
.sm_alert_btnul li {float:left; width:50%;}
.sm_alert_btnul li:nth-child(2) {float:right;}

/* 인덱스 페이지 swiper */
.swiper-slide.slide1, .swiper-slide.slide2, .swiper-slide.slide3, .swiper-slide.slide4{text-indent: -9999px;background-size: 82%; background-position: top; background-repeat: no-repeat;}
.swiper-slide.slide1{background-image: url(/share/img/swiper/iearn_001_1.gif);}
.swiper-slide.slide2{background-image: url(/share/img/swiper/iearn_002_1.gif);}
.swiper-slide.slide3{background-image: url(/share/img/swiper/iearn_004_1.gif);}
.swiper-slide.slide4{background-image: url(/share/img/swiper/iearn_006_1.gif);}

/* FAQ */
span.highlight {
    background-color: #00b050;
}