/* °øÅë */
ol, li {list-style: none;}

/* ÀÎÆ®·Î */
.cont_1_img img { float: right; padding: 20px;}
.cont_2_img img { float: left; padding: 20px;}
.cont_3_img img { float: right; padding: 20px;}

.cont_title { font-size: 24px; line-height: 30px; }
.cont_explain { margin-top: 20px;}
.cont_1_text { margin-top: 100px;}
.cont_2_text { margin-top: 100px; padding-left: 150px;}
.cont_3_text { margin-top: 100px;}
.cont_explain p {font-size: 12px; line-height: 24px; color: #aaa;}
.intro-cont { background-color: #f9f9f9; overflow: hidden; min-height: 390px; width: 100%; padding: 0px;}
.intro-cont-white { background-color: #ffffff; overflow: hidden; height: 300px; width: 100%; padding: 0px;}
.intro-row { margin-top: 20px; text-align: center;}

/* ȸ¿ø°¡ÀÔ */
.loginColumns {
    max-width: 1000px;
    margin: 0 auto;
    padding: 20px;
}
.joinImg{text-align: center; padding-top: 30px;}
.join-wrap { margin: 0 auto; padding: 30px 0; width: 360px; }
.join-wrap.join_comp {width:100%; padding:30px 0 0 !important;}
.welcmoeImg { position: relative; padding-bottom: 160px; background: url('../images/joinImg.png') no-repeat bottom center; }
.join-wrap .join-title { margin-bottom: 30px; text-align: center; }
.join-wrap .join-title > dl dt { font-size: 40px; font-weight: 500; line-height: 65px; }
.join-wrap .join-title > dl dd { font-size: 17px; font-weight: 500; }
.join-wrap .join-title p.sub_tit {font-size:17px; font-weight:500; letter-spacing: -0.05em; line-height:30px; display: inline-block; vertical-align: middle;}
.join-wrap .join-title p.sub_tit > a {color:#2eaef8; display: inline-block; vertical-align: middle; margin-left:10px;}
.join-wrap .join-form ul li { padding: 5px 0; }
.join-wrap .join-form ul li h3 { padding: 5px 0; font-size: 14px; font-weight: 500; }
.join-wrap .join-form ul li input { width: 360px; font-family:'Noto Sans KR'; font-weight: 500; }
.join-wrap .join-form ul li .input-wrap div > i,
.join-wrap .join-form ul li .input-wrap div > i { opacity: 1 !important; color: #aeaeae; }
.join-wrap .join-form ul li .join-btn { display: inline-block; padding: 12px 0; width: 100%; font-size: 17px; font-weight: 500; color:#fff;  background: #2eaef8; border: none; border-radius: 4px; text-align: center; cursor: pointer; }
.join-wrap .join-form ul li .joinOk-btn { opacity: 0.5; cursor:auto; }
.join-wrap .join-form ul li .chkBox { margin-bottom: 8px; }
.join-wrap .join-form ul li .chkBox,
.join-wrap .join-form ul li span { font-size: 14px; font-family:'Noto Sans KR'; font-weight: 500; }
.join-wrap .join-form ul li .pw-join { margin: 5px 0; height: 30px; }
.join-wrap .join-form ul li .pw-join > span { line-height: 30px; }
.join-wrap .join-form ul li .pw-join .btn-right { float: right; padding:0; width: 130px; height: 30px;  font-family:'Noto Sans KR'; font-weight: 500; text-align: center; line-height: 30px; }
.join-wrap .join-form ul li .dotList li { padding-left: 10px; font-weight: 500; background: url('../images/dotList.png') no-repeat 0px 13px; }
.join-wrap .join-form ul li .asterisk {position: absolute; top: 12px; left: -18px;font-size: 14px; font-weight: 900; color:#db2828; }
.join-wrap .join-form ul li .pw-chk-box {position: relative; padding-right: 70px !important;}
.join-wrap .join-form ul li p { padding-bottom: 10px; font-size: 14px; color: #666; }
.join-wrap .join-form ul li .bornYear { width: 360px; }
.join-wrap .join-form ul li .affiliated-Box { position: relative; margin: 0; padding: 0; height: 38px; width: 360px; }
.join-wrap .join-form ul li .affiliated-opt {position: absolute; top:0; left:0; min-width: 120px !important; }
.join-wrap .join-form ul li .affiliated-txt { position: absolute; top:0; right: 0px; }
.join-wrap .join-form ul li .affiliated-txt input { width: 232px !important; height: 38px; }
.join-wrap .join-form ul li .link-unerline { color: #000; text-decoration: underline; }
.join-wrap .join-form ul li p.name { padding-bottom: 5px; font-weight: 500; }
.join-wrap .join-form ul li p.name > span { vertical-align: middle; color: red; }
.join-wrap .join-form ul li .nickName { position: relative; width: 360px; }
.join-wrap .join-form ul li .nickName input {padding-right:100px !important; box-sizing: border-box;}
.join-wrap .join-form ul li .nickName a.check {position:absolute; right:0; top:0px; padding:0 25px; border-radius: 0 5px 5px 0; box-sizing: border-box; display: inline-block; vertical-align: middle; line-height: 37px; background: #e7e7e7; color:#333;font-weight: 400; font-size:14px; text-align: center; height:100%;}
.join-wrap .join-form ul li .nickName .nickName-button { position: absolute; top:1px; right:0px; margin:0; padding:0; width: 100px; height: 36px; border: none; background: #e7e7e7; border-radius: 0 5px 5px 0; text-align: center; line-height: 36px; vertical-align: top; cursor: pointer; }

.pageMessage { text-align: center; min-height: 700px; }
.pageMessage h1 { padding: 30px 0; }
.pageMessage h3 { padding: 30px 0; }
.pageMessage .text { padding-bottom: 30px; color: #999; line-height: 24px; }

.pw-security {position: absolute; top:8px; right:8px;  width:58px; height: 22px; font-size: 11px; font-weight: 500; color:#fff; background: #db2828; text-align: center; line-height: 22px; border-radius: 5px; }
.pw-usually {position: absolute; top:8px; right:8px;  width:58px; height: 22px; font-size: 11px; font-weight: 500; color:#fff; background: #f2711c; text-align: center; line-height: 22px; border-radius: 5px; }
.pw-strong {position: absolute; top:8px; right:8px;  width:58px; height: 22px; font-size: 11px; font-weight: 500; color:#fff; background: #21ba45; text-align: center; line-height: 22px; border-radius: 5px; }
.pw-very-strong {position: absolute; top:8px; right:8px;  width:58px; height: 22px; font-size: 11px; font-weight: 500; color:#fff; background: #2185d0; text-align: center; line-height: 22px; border-radius: 5px; }
input.error { border: 1px solid #db2828 !important; }
input.success { border: 1px solid #21ba45 !important; }
.errorMsg { padding: 15px 10px; font-weight: 500; }

.join-wrap .sns-login .sns-login-title { margin: 25px 0 6px; width: 100%; background: url('../images/dot.png') repeat-x center left; }
.join-wrap .sns-login .sns-login-title h3 { width: 172px; font-size: 14px; font-weight: 500; background: #fff; }
.join-wrap .sns-login ul li { float: left; margin: 10px 10px 0 0; }
.join-wrap .sns-login ul li:last-child { margin-right: 0; }
.join-wrap .sns-login ul li a { position: relative; display: inline-block; width:113px; height: 40px; background: #eee; line-height: 40px; border-radius: 5px; }
.join-wrap .sns-login ul li a i { position: absolute; top:3px; left:8px; font-size: 22px; color: #fff; font-style: normal;  }
.join-wrap .sns-login ul li a i.icon-naver { position: absolute; top:-2px; left:8px; font-size: 26px !important; font-weight: 900; }
.join-wrap .sns-login ul li a p { color: #fff; font-weight: 500; }
.join-wrap .sns-login ul li .google-btn { background: #eb4f3f; }
.join-wrap .sns-login ul li .facebook-btn { background: #3b5a93; }
.join-wrap .sns-login ul li .naver-btn { background: #01c63f; }
.join-wrap .sns-login ul li .google-btn p { position: absolute; top: 10px; left: 40px; }
.join-wrap .sns-login ul li .facebook-btn p { position: absolute; top: 10px; left: 35px; }
.join-wrap .sns-login ul li .naver-btn p { position: absolute; top: 10px; left: 46px; }
.join-wrap .sns-login .accept { padding: 20px 0; font-size: 14px; color: #999; text-align: center; line-height: 22px; }
.join-wrap .sns-login .accept a { text-decoration: underline; font-weight: 500; }
.join-wrap .sns-login .enrollment { padding: 20px 0; font-size: 14px; color: #000; text-align: center; line-height: 22px; }
.join-wrap .sns-login .enrollment a { color: #2eaef8; text-decoration: underline; }
.join-wrap .sns-login .enrollment i { margin: 0; padding: 0; color: #2eaef8; }
.ui.modal {top : 15%;}
#emailCertification{margin-top: 0px !important;}
#emailCertification .content  { text-align: center; }
#emailCertification .content h2 { padding: 30px 0; }
#emailCertification .content .text { color: #666; line-height: 24px; }
#emailCertification .actions button {padding:0 15px; box-sizing: border-box; border:none !important; transition:all 0.4s; line-height:35px;}
#emailCertification .actions button:first-of-type {background: #e7e7e7; color:#666;}
#emailCertification .actions button:first-of-type:hover {background: #cfcfcf; color:#333;}
#emailCertification .actions button:last-of-type {background: #2eaef8; color:#fff; margin-left:10px;}
#emailCertification .actions button:last-of-type:hover {background: #0076b5;}

/* ºñ¹Ð¹øÈ£ Àç¼³Á¤ */
.forgot-pw-wrap { height: 640px; }
.forgot-pw-wrap .join-form ul li p { margin-bottom: 10px; font-size: 13px; }
.forgot-pw-wrap-mail { width: 500px; height: 640px; }
.forgot-pw-wrap-mail p { margin-top:40px; font-size: 14px; font-weight: 500; }

/* ÀÌ¿ë¾à°ü ¹× °³ÀÎÁ¤º¸Ãë±Þ¹æħ */
.wrapper-content { max-width: 1140px; margin: 0 auto; padding: 40px 10px 40px; }
.ibox {clear: both; margin-bottom: 25px; margin-top: 0; padding: 0;}
#snb li { margin: 14px 0 0 0; height: 35px; line-height: 35px; border-bottom: 1px solid #e7eaec; list-style: none; }
#snb li.active a, #snb li a:hover { color: #ff831d; }

/* Alert */
div.effect { position: fixed; top: 100px; right: -500px; border-radius: 4px; background: #2eaef8; box-sizing: border-box; z-index: 9999; display: block; text-align: center; transition: all 0.4s; padding: 10px 50px;}
div.effect p { font-size: 14px; color: #fff; font-weight: 400; line-height: 22px; text-align: center;}

.exchange-rate {font-size:14px; font-style:italic;}

/* º¸µå - ´º½º */
.leftmenu-header { border-bottom: 2px solid #ff831d; }
.leftmenu-header-title{ padding: 13px; font-family: MalgunGothic; font-size: 17px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: 1.41; letter-spacing: normal; text-align: center; color: #ff831d;}
.leftmenu-item { height: 35px; background-color: #f9f9f9; margin-bottom: 1px;  text-align: left; padding: 11px 0px 11px 20px; font-family: MalgunGothic; font-size: 13px; font-weight: normal; font-style: normal; font-stretch: normal; letter-spacing: normal; }
.leftmenu-item a { color: #222222; }
.leftmenu-item.selected { background-color: #fff1e5; }
.leftmenu-item.selected a { color: #ff831d; }
#newsList { margin-top: 48px; }
.news-title { text-align: left; }
.news-title a{ height: 16px; font-family: MalgunGothic; font-size: 15px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: 1.6; letter-spacing: normal; color: #222222; }
.news-content { font-family: MalgunGothic; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.71; letter-spacing: normal; text-align: left; color: #666666; }
.news-info { font-family: MalgunGothic; font-size: 13px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 3.46; letter-spacing: normal; text-align: left; color: #999999; }
.news-line { border: 1px solid #e9e9e9; margin-bottom: 10px; margin-top: 10px;}
.news-item { min-height: 150px; width: 100%; display: inline-block; }
.news-thumb { float: left;}
.news-thumb img { max-height: 120px; max-width: 210px; border: 1px solid #e9e9e9; padding: 5px;}
.main-news-item { padding: 10px; }
.main-news-img { display: inline-block; width:100%;}
.main-news-title { display: inline-block; }
.main-news-content { /*display: inline-block;*/overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; line-height:1.2em; height:3.6em; overflow:hidden; text-overflow:ellipsis; font-size:12px;}
.main-news-time { display: inline-block; }
.main-news-item-frame { border-bottom: 1px solid #ff831d; min-height: 300px; }
.main-news-img img{width:100%;}



/* media query */
@media (max-width: 384px) {
a.login{background-color: transparent; border: none; color: #000; font-size: 14px; font-weight: 400; letter-spacing: -0.1em;}
.home-container .home-header .top-wrapper .small-title span {font-size: 12px;}
/*.home-container .home-header { height: 40px; }
#banner {display:none;}
#bannerContainer .banner-dots {display:none;}*/
.home-container .home-header .top-wrapper .small-title {margin-top: 20px;}
.home-container .home-header .top-wrapper {padding-top: 0px;}
.home-container .home-header .transparent-wrapper .transparent-auto {margin: auto 10px; font-size: 12px;}
.home-container .home-header .transparent-wrapper .transparent-auto .text {font-size: 11px;}
.home-container .home-quotation .home-products th {font-size: 12px;}
.home-container .home-quotation .home-new-online { height: 17px; font-size: 15px;}
.exchange-rate {font-size:10px;}
/*.navbar-toggle {margin-top: 5px;}
.navbar-login {margin-top: 14px;}
.bi_img {margin-top: 10px;}*/
.navbar {min-height: 33px;}
.intro-cont {display: none;}
.intro-cont-white {display: none;}
a.login:hover{background-color: #ff831d !important; border-radius: 0px;}
/*.navbar-toggle:hover{background-color: #ff831d !important;}*/
#leftmenu { display: none;}
.news-item { display: inline-block;}
.navbar-bars {float: left; background-color: transparent; border: none; /*margin-right: 10px;*/ /*margin-top: 4px;*/}
.navbar-power {float: right; color: black; margin-top: 0px; /*margin-right: 0px;*/ padding: 9px;}
.main-notice {display: none;}
}

@media (max-width: 414px) {
#leftmenu { display: none;}
.news-item { display: inline-block;}
}

@media (max-width: 480px) {
#leftmenu { display: none;}
.news-item { display: inline-block;}
}

@media (max-width: 640px) {
#leftmenu { display: none;}
.news-item { display: inline-block;}
}

@media (max-width: 768px) {
.intro-cont{height: 100%;}
.intro-cont-white{height: 100%;}
.cont_1_text {margin-top: 50px; text-align: center;}
.cont_3_text {margin-top: 50px; text-align: center;}
.cont_title {font-size: 18px; line-height: 30px;}
.cont_explain {margin-top: 20px;}
.cont_explain p {font-size: 12px; line-height: 24px; color: #aaa;}
.cont_1_img {text-align: center;}
.cont_1_img img {float: none; width: 240px; padding: 20px;}
.cont_2_img {text-align: center;}
.cont_2_img img {float: none; width: 240px; padding: 20px;}
.cont_3_img {text-align: center;}
.cont_3_img img {float: none; width: 240px; padding: 20px;}
.cont_2_text {margin-top: 0px; text-align: center; margin-bottom: 40px; padding-left: 0px;}
.joinImg{display:none;}
#leftmenu { display: none;}
.news-item { display: inline-block;}
}

@media (max-width:991px) {
#leftmenu { display: none;}
.news-item { display: inline-block;}
}