/* ÆùÆ® */ /*³×À̹ö ½ºÄù¾î font-family: 'NanumSquare', sans-serif; */ @import url("http://cdn.jsdelivr.net/nanumsquare/1.0/nanumsquare.css"); /*³×À̹ö ³ª´®°íµñ font-family: 'Nanum Gothic', serif; */ @import url("http://fonts.googleapis.com/earlyaccess/nanumgothic.css"); /*º»°íµñ font-family: 'Noto Sans', sans-serif; */ @import url("http://fonts.googleapis.com/css?family=Noto+Sans"); /*³×À̹ö ¹Ù¸¥°íµñ font-family: 'Nanum Barun Gothic', sans-serif; */ @import url("https://cdn.rawgit.com/openhiun/hangul/14c0f6faa2941116bb53001d6a7dcd5e82300c3f/nanumbarungothic.css"); /*³×À̹ö ³ª´®¸íÁ¶ font-family: 'Nanum Myeongjo', sans-serif; */ @import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css); /*Ä¿½ºÅÒ Ãß°¡ css*/ /*###### ±âŸ °øÅë######*/ html,body {margin:0;padding:0; } #wrap {float:left; width:100%; position:relative; min-width:1200px;} .main_wrap { background-color:#f4f4f4;} .inner {width:1200px; margin:0 auto; position:relative;} /* °Ô½ÃÆÇ ÆäÀÌ¡*/ div.page_list {font-weight:bold; padding:20px;text-align:center; display:table; margin:25px auto;} div.page_list > span {display:inline-block; width:32px; height:32px; border:1px solid #706565; float:left; line-height:32px; background-color:#706565; color:white; margin-left:7px; } div.page_list > a {display:inline-block; width:32px; height:32px; border:1px solid #d0d0d0; float:left; line-height:32px; margin-left:7px; color:black;} div.page_list > a:hover {background-color:#706565; color:white; border:1px solid #706565;} /*admin ÆäÀÌÁö css*/ .admin-home {position: absolute; left:690px; top:80px; } .admin-home ul {margin:0; float:left;} .admin-home ul li {float: left;margin-right:20px;} /*Æ˾÷*/ #popup {position:absolute; top:129px; left:0; width:100%; z-index:999;} #popup > div {float:left; max-width:100%; margin:10px;} #popup > div > img {max-width:100%;} /*####¹è°æ¸Þ´º####*/ /*#### ÃÖ»ó´Ü ¸Þ´º ####*/ #menu_top {position:relative; float:left; width:100%; height: 23px; line-height:23px; z-index:2;border-top:6px solid #434344; background-color: transparent; } #menu_top .float_left {float:left; margin-left:10px;} #menu_top .float_right {float:right;} #menu_top .float_right ul{list-style:none; padding:0; margin:0; overflow:hidden; box-sizing: border-box;} #menu_top .float_right > ul > li{background:#434344; float:left; overflow:hidden; padding:0; margin:0;height:22px;} #menu_top .float_right > ul > li a{font-weight:bold; color:#fff; font-size:12px;display:inline-block; padding: 0 5px 5px 5px; line-height:1.5;} #menu_top .float_right > ul > li.dot{float:left; background-color:transparent; background-image: url(../images/user_menu_dot.png); background-repeat:no-repeat; padding:1px 3.5px;} /*###### header #########*/ #header {width:100%; position:relative; float:left; background-color:transparent; height:90px; z-index:1;} #header > .inner {height:100%; z-index:1;margin-top:-23px;} /*·Î°í*/ #top_logo {padding:28px 0 0 8px; float:left; } #main_gnb {position:relative; float:right; z-index:1;} /*¼­ºêÄ«Å×°í¸® ¹è°æ»ö*/ #gnb_bg {position:absolute; top:0px; left:0; width:100%; z-index:0; height:90px;margin-top:-23px;} #gnb_bg > div {position:absolute; width:100%; top:90px; left:0; border-bottom:1px solid #dedede;} /*¸ÞÀÎÄ«Å×°í¸®*/ #main_gnb > ul {float:left; position:relative; margin-top: 48px;} #main_gnb > ul > li {float:left; position:relative;} #main_gnb > ul > li > a {font-size:18px; float:left; padding:11px 30px 11px 30px; background-color:transparent; text-shadow:1px 1px #000000; color: #ffffff; border-radius: 8px 8px 0 0; -webkit-border-radius: 8px 8px 0 0; -ms-border-radius: 8px 8px 0 0;} #main_gnb > ul > li:hover > a {font-weight:bold; background-color: #496ca0; } #main_gnb > ul > li:hover > ul.sub_gnb {display: block;} /*¼­ºêÄ«Å×°í¸®*/ ul.sub_gnb {position:relative; display:block;clear:both; display:none; background: #ffffff;} ul.sub_gnb > li {text-align:center; border-bottom: 1px solid #f8f8f8;} ul.sub_gnb > li:hover {background: #f4f4f4;} ul.sub_gnb > li:last-child {border: none;} ul.sub_gnb > li > a {font-size:13px; height:41px; line-height: 41px; white-space:nowrap; width:100%; z-index:1; letter-spacing: -1px; color:#000;} ul.sub_gnb > li > a:hover {color: #565252;} /*###### content #########*/ #content {position:relative;width:100%; background-color:#ffffff; margin:0; z-index:0;} /*¸ÞÀιè³Ê section1*/ #main_sec1 {float:left; position:absolute; width:100%;} #main_sec1 .main_ban .bx-wrapper .bx-viewport ul li{width:100%;} /*########under_class#########*/ #under_class{margin-top:540px;} /*¸ÞÀÎ Áß°£ ¹è³Ê section2*/ #main_sec2 {width:100%; float:left; position:relative; } #main_sec2 .box {overflow: hidden;} #main_sec2 .box > div {width: 33.3%; height: 518px; float: left; position: relative;} #main_sec2 .box > div:hover .box_on {opacity: 1; -webkit-transition: all 0.5s; /* Safari */ transition: all 0.5s;} #main_sec2 .box > div:hover > h2 {opacity: 0; -webkit-transition: all 0.5s; /* Safari */ transition: all 0.5s;} #main_sec2 .box > div h2 { font-family: 'NanumSquare', sans-serif; } #main_sec2 .box > div .ko {font-size: 22px; font-weight: bold; color: #423b33; margin: 32px 0 0 16px} #main_sec2 .box > div .en {font-size: 22px; font-weight: normal; color: #8b8175; margin: 0 0 0 16px;} #main_sec2 .box .box_on {background: rgba(4,26,59,0.8); width: 100%; height: 100%; position: absolute; top: 0; text-align: center; opacity: 0; -webkit-transition: all 0.5s; /* Safari */ transition: all 0.5s;} #main_sec2 .box .box_on .ko_on {color: #ffffff; font-weight: bold; font-size: 22px; margin-top: 121px;} #main_sec2 .box .box_on .en_on {color: rgba(255,255,255,0.4); font-weight: normal; font-size: 18px;} #main_sec2 .box .box_on .det_btn {margin-top: 245px;} #main_sec2 .box .box_on .line {width: 27px; height: 1px; background-color: #ffffff; margin: 10px auto 7px auto;;} #main_sec2 .box .box01 {background: url('../images/box01_bg.jpg') no-repeat center top;} #main_sec2 .box .box02 {background: url('../images/box02_bg.jpg') no-repeat center top;} #main_sec2 .box .box03 {background: url('../images/box03_bg.jpg') no-repeat center top;} #main_sec2 > .link {float:left; width:33.3%; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out;} #main_sec2 > .link > a { -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } #main_sec2 > .link > a.link1:hover {background:url('../images/menu_hover_01.png');} #main_sec2 > .link > a.link2:hover {background:url('../images/menu_hover_02.png');} #main_sec2 > .link > a.link3:hover {background:url('../images/menu_hover_03.png');} #main_sec2 > .link img {width:100%; height: 518px;} /*½½¶óÀ̵å css*/ #main_sec2 > .bbs_gallery {position:relative; float:left; width:50%; padding:33px 0; background-color:#f1f1f1; border:1px solid #ebebeb; overflow:hidden; box-sizing:border-box; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out;} #main_sec2 > .bbs_gallery {.width:49.5%;} #main_sec2 > .bbs_gallery .bx-wrapper .bx-prev {left:-40px;} #main_sec2 > .bbs_gallery .bx-wrapper .bx-next {right:-40px;} #main_sec2 > .bbs_gallery .bx-wrapper .bx-pager {bottom:-20px;} .bxslider2 > li {height:120px;} .bxslider2 img {height:100%;} /*¸ÞÀÎ Ãâ·Â ±Û section3*/ #main_sec3 {float:left; width:100%; position:relative; margin-top:85px;margin-bottom:88px;} #main_sec3 ul li:first-child{margin-left:0px;} #main_sec3 ul li{display:inline;margin-left:11px;} #main_sec3 .bbs1, #main_sec3 .bbs2 {width:35%; border:1px solid #dedede; box-sizing:border-box; float:left; .width:34.8%; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out;} #main_sec3 .bbs2 {border-left:0;} .sec3_title {border-bottom:1px solid #dedede; height:48px;} .sec3_title h2 { height:48px; line-height:48px; float:left; margin-left:18px; font-size:15px;} .sec3_title p a { float:right; margin:22px 33px 0 0;} .sec3_cont {padding:15px 33px 25px 15px; height:100px;} .sec3_cont > li { line-height: 20px; height:20px; } .sec3_cont > li.title { padding-left: 12px; background: url('../images/dot.jpg') no-repeat center left; width:70%; float:left; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} .sec3_cont > li.date {width:20%; text-align:right; float:right;} #cs_center {float:left; width:30%; border:1px solid #dedede; border-left:0; box-sizing:border-box; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out;} .sec3_cs_cont {padding:33px 20px 7px 15px; position:relative; height:100px;} .sec3_cs_cont h2.cs_pn {color:#6f613f; font-size:33px; float:left; letter-spacing: -2px; font-weight: 800; .float:none;} .sec3_cs_cont p {color:#969696; line-height:14px; float:left; margin-top:10px; clear:both; .float:none;} .sec3_cs_cont a {position:absolute; top:33px; right:20px;} /*###### footer #########*/ #footer{position:relative; float:left; width:100%; background-color:#34383e; padding:0 0 50px 0;} .notice_box .btn {position: absolute; right: 0; top: 0;} .notice_box .bbs_title {float: left;} .notice_box .txt_notice {float: left;} .notice_box .txt_notice ul li {line-height: 44px; padding-left: 20px; font-size: 16px; color: #5f6265; letter-spacing: -1px;} .notice_box .txt_notice ul li span {margin-right: 40px;} #copyright {float:left; padding:0; color:#919191; line-height:16px; font-size: 12px; margin-top: 20px;} #bot_nav {display:block; height:25px; line-height:15px; } #bot_nav > li {float:left; padding-left:10px; padding-right:10px; border-left:2px solid white;} #bot_nav > li:first-child { border-left:0; padding-left:0;} #bot_nav > li > a {color:white; font-weight:bold;} #bot_nav > li > a:hover {color:#c6c6c6;} #copyright p.yesweb {color:#c6c6c6; display:none;} #copyright_en{float:right; padding:0; color:#919191; line-height:16px; font-size: 12px; margin-top: 40px;} .under_line{ border-bottom: 1px solid #4a4d51;} #footer a.yesweb {float:right; margin-top:60px;} /*#########notice#############*/ #notice{height:85px;background-color:#c5c8cd;width:100%;} #notice .inner{top:23px;} .notice_box { position: relative; height: 44px; margin: 0px auto; background: #fff; overflow: hidden; } .footer_notice { overflow: hidden; } .none { display: none!important; } .inner .logo_area{text-align:center; margin:57px 0 51px 0;} /*######ÄÁÅØÆ® Æû#########*/ #contact_btn {position:fixed; top:43%; width:50px; height:80px; z-index:90; background-color:#3799ca; cursor:pointer; background-repeat:no-repeat; } #contact_btn > a {display:block; width:29px; height:58px;} .contact_btn_in { right:5px; background-image:url('/_yesweb/_skin_h/images/contact_btn_in.png'); background-position:center center;} .contact_btn_out { right:260px; background-image:url('/_yesweb/_skin_h/images/contact_btn_out.png'); background-position:center center;} #contact { position:fixed; top:43%; width:270px; z-index:80;} .contact_in {right:-265px;} .contact_out {right:0;} .ct_cont {height:400px; background-color:#3799ca; position:relative; margin-top:-150px;} .ct_form {padding:30px;} .ct_form h1 {font-size:20px; text-align:center; margin-bottom:30px;} .ct_form p.ct_input { font-weight:800;} .ct_form p.ct_input > input {height:1.5em; margin-bottom:10px; padding-left:5px;} .ct_form textarea {resize:none; overflow:hidden; width:100%;} .ct_form p.ct_agree {line-height:2em; margin-top:5px;} .ct_form p.ct_agree > input {float:left;} .ct_form p.ct_agree > label {float:left; cursor:pointer;} .ct_form p.agree_a { text-align:right; clear:both;} .ct_form p.agree_a > a {font-size:13px; font-weight:bold;} .ct_form p.agree_a > a:hover {color:black; } .ct_form p.ct_submit {margin-top:20px; width:90%; margin-left:5%;} .ct_form #ct_submit {background-color:#4b4844; color:#f5f5f5; width:100%; padding:10px 0; font-size:14px; border:0; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out;} .ct_form #ct_submit:hover, .ct_form #ct_submit:active { background-color:#5e5c59; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out;} /* ·Î±×ÀÎ Á¤Áø¾Æ */ #login{width:100%; margin: 60px 0 60px 0;} #login .inner{margin:0 auto;} .inner .top_box{width:99%;margin: 0 auto 60px auto;} .inner .top_box img{padding:60px 0px 80px 0px;margin-left:35%;} .inner .top_box p {text-align: center; font-weight: bold; font-size: 20px;} .inner .top_box p span {color: #ef0c65;} .inner .top_box p:first-child {margin-bottom: 5px;} .inner .bottom_box{width:99%; height:200px;margin:0 auto; border-top:2px solid #363636; border-bottom:1px solid #cdcdcd; background-image:url('../images/line.jpg'); background-repeat:no-repeat;background-position:606px center; } .bottom_box .left{width:50%; float:left;padding-top:64px; position:relative; font-size:14px; color:#272727; font-weight:bold;} .bottom_box .left p:first-child {margin-bottom: 10px;} .bottom_box .left .left_01 span{padding:0px 70px 0px 10px} .bottom_box .left .left_02 span{padding:0px 59px 0px 10px} .bottom_box .left .input{width:220px;} .bottom_box .right a{margin-left:20px; float: right;} .bottom_box .right a#gray{margin-left:23px;} /* input style */ .bottom_box .left input[type=text], .bottom_box .left input[type=password] {border: 1px solid #dddddd; padding: 5px 0;} .bottom_box .left input[type=image] {float:right;position:absolute; right:110px; top: 64px;} .bottom_box .right{float:right;font-size:12px; color:#616161; padding-top:64px; margin-right: 70px;} .bottom_box .right img{vertical-align:middle;} .bottom_box .right p {overflow: hidden; line-height: 28px;} .bottom_box .right p:first-child {margin-bottom: 10px;} .sns_login {margin-top: 35px;} .sns_login ul {overflow: hidden; width: 50%; margin: 0 auto;} .sns_login ul li {float: left; margin-left: 10px;} .sns_login ul li:first-child {margin-left: 0;}