html, body { height: 100%; } html { overflow-x: hidden; } a { color: #000; } /* @media(min-width:1400px) { .container { width: 1400px; } } @media(max-width:1399px) { .container { width: auto; } } */ /* 퀵메뉴 */ .quick { position: fixed; /* top: 85%; */ bottom: 15%; right: 73px; transform: translateY(-50%); -webkit-transform: translateY(-50%); z-index: 5; } .quick li { margin-bottom: 20px; } .quick li a { display: block; width: 14px; height: 14px; text-indent: -9999px; } .quick li:nth-child(1) a { background-image: url(../images/rf_menu_home.png); } .quick li:nth-child(2) a { background-image: url(../images/rf_menu_facebook.png); } .quick li:nth-child(3) a { background-image: url(../images/rf_menu_blog.png); } /* layout */ #header .top_wrap { display: flex; } #header .top_wrap .left { width: 30%; bottom: 0; display: flex; align-items: flex-end; } #header .top_wrap .logo { text-align: center; width: 40%; } #header .top_wrap .right { width: 30%; margin-left: auto; justify-content: flex-start; position: relative } #header .top_wrap .right ul { display: flex; position: relative; margin-top: 20px; justify-content: flex-end; } #header .top_wrap .right ul a { display: inline-block; padding-left: 4px; padding-right: 4px; } #header .top_wrap .right p { margin-top: 26px; right: 0; position: absolute; } #header .nav { border-top: 2px #37c02c solid; border-bottom: 2px #37c02c solid; position: relative; } #header .nav .gnb { display: flex; justify-content: space-around; } #header .nav .gnb li a { font-size: 18px; color: #000; display: block; padding-top: 17px; padding-bottom: 15px; font-weight: 600; font-family: 'NanumSquare'; } #header .nav .gnb li a:hover { color: #70a011; text-decoration: none; } /* #header .nav .gnb { */ /* ëª¨ë°”ì¼ ë©”ë‰´ */ .row-offcanvas { height: 100%; } .sidebar-offcanvas { display: none; } .js-offcanvas-btn { position: absolute; right: 0; margin-right: 15px; top: 20px; background-color: transparent; border: 0; } /* ëª¨ë°”ì¼ ë©”ë‰´ ë§ˆê° */ /* ì¸ë±ìŠ¤ */ #index_wrap { margin-top: 64px; } #index_wrap section.section01 .flex { display: flex; justify-content: space-between; padding-left: -17px; padding-right: -17px; } #index_wrap section.section01 .flex .benner { border: 1px #a7a6a6 solid; width: 100%; margin-right: 17px; margin-right: 17px; padding: 25px 20px; min-height: 160px; } #index_wrap section.section01 .flex .benner.benner01 { background: url('../../img/main/section01_bg.jpg'); background-repeat: no-repeat; background-position: 20px 100%; } #index_wrap section.section01 .flex .benner.benner02 { background: url('../../img/main/section02_bg.jpg'); background-repeat: no-repeat; background-position: 96% 96%; } #index_wrap section.section01 .flex .benner.benner03 { background: url('../../img/main/section03_bg.jpg'); background-repeat: no-repeat; background-position: 96% 96%; } #index_wrap section.section01 .flex .benner .title { display: flex; margin-bottom: 12px; } #index_wrap section.section01 .flex .benner .title h2 { font-size: 25px; font-weight: 900; font-family: 'NanumSquare'; color: #61ab01; margin-right: 6px; } #index_wrap section.section01 .flex .benner .title span { font-size: 14px; line-height: 30px; font-weight: 900; color: #646461; font-family: 'Nanum Gothic'; } #index_wrap section.section01 .flex .benner.benner01 ul { padding-left: 100px; } #index_wrap section.section01 .flex .benner.benner01 ul li { margin-bottom: 6px; } #index_wrap section.section01 .flex .benner.benner01 ul li a { font-size: 28px; font-weight: 900; color: #464646; font-family: 'NanumSquare'; } #index_wrap section.section01 .flex .benner.benner01 ul li a:hover { text-decoration: none; } #index_wrap section.section01 .flex .benner .content { font-size: 20px; font-weight: 900; color: #464646; line-height: 27px; font-family: 'NanumSquare'; } #index_wrap section.section02 { margin-top: 80px; } #index_wrap section.section02 .title { text-align: center; color: #959595; font-family: 'NanumSquare'; font-size: 19px; font-weight: 600; margin-bottom: 40px; } #index_wrap section.section02 .title h1 { font-size: 28px; font-weight: 900; color: #000; font-family: 'NanumSquare'; margin-bottom: 16px; } #index_wrap section.section02 .title h1 span { color: #61ab01; } #index_wrap section.section02 .btn_wrap { margin: 0 auto; text-align: center; } #index_wrap section.section02 .btn_wrap a.btn { background: #87bd43; color: #fff; line-height: 42px; height: 42px; padding: 0 30px; font-size:16px; } @media(max-width:991px){ #index_wrap section.section02 .btn_wrap { margin-bottom: 40px; } } #index_wrap section.section03 { margin-top: 80px; background: #fffae7; padding-top: 60px; padding-bottom: 60px; } #index_wrap section.section03 .flex_wrap { display: flex; } #index_wrap section.section03 .flex_wrap .flex-left, #index_wrap section.section03 .flex_wrap .flex-right { width: 50%; } #index_wrap section.section03 .flex_wrap .flex-left .inner-flex { display: flex; flex-wrap: nowrap; width: 100%; margin-left: -12px; margin-right: -12px; } #index_wrap section.section03 .flex_wrap .flex-left .inner-flex .box.box01, #index_wrap section.section03 .flex_wrap .flex-left .inner-flex .box.box02 { width: 100%; margin-left: 12px; margin-right: 12px; text-align: center; padding: 25px 25px 25px; } #index_wrap section.section03 .flex_wrap .flex-left .inner-flex .box.box01 { background: #43bdad; } #index_wrap section.section03 .flex_wrap .flex-left .inner-flex .box.box02 { background: #87bd43; } #index_wrap section.section03 .flex_wrap .flex-left .inner-flex .box p { margin-bottom: 25px; } #index_wrap section.section03 .flex_wrap .flex-left .inner-flex .box a { font-size: 25px; color: #fff; font-family: 'NanumSquare'; font-weight: 900; line-height: 32px; } #index_wrap section.section03 .flex_wrap .flex-right .box { border: 1px #ddd solid; background: #fff; padding: 25px 32px; } @media(min-width:992px) { #index_wrap section.section03 .flex_wrap .flex-right .box { min-height: 229px; } } #index_wrap section.section03 .flex_wrap .flex-right .box .title { display: flex; margin-bottom: 18px; } #index_wrap section.section03 .flex_wrap .flex-right .box .title h1 a { font-size: 28px; font-weight: 900; font-family: 'NanumSquare'; color: #87bd43; } #index_wrap section.section03 .flex_wrap .flex-right .box .title h1 a:hover { text-decoration: none; } #index_wrap section.section03 .flex_wrap .flex-right .box .title p { margin-left: auto; margin-top: 4px; } #index_wrap section.section03 .flex_wrap .flex-right .box .title p a { font-size: 20px; } #index_wrap section.section03 .flex_wrap .flex-right .box .title p a:hover { color: #87bd43; text-decoration: none; } #index_wrap section.section03 .flex_wrap .flex-right .box ul li { position: relative; } #index_wrap section.section03 .flex_wrap .flex-right .box ul li a { padding-bottom: 4px; padding-top: 4px; display: inline-block; font-size: 18px; } #index_wrap section.section03 .flex_wrap .flex-right .box ul li a:hover { color: #87bd43; text-decoration: none; } #index_wrap section.section03 .flex_wrap .flex-right .box ul li span { position: absolute; right: 0; font-size: 16px; font-family: 'NanumSquare'; } /* ì¸ë±ìŠ¤ ë§ˆê° */ /* sub layout */ /* 서브비주얼 */ @keyframes zoom { 0% { -moz-transform: scale(1.2); transform: scale(1.2); -webkit-transform: scale(1.2); -ms-transform: scale(1.2); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.0, M12=0, M21=0, M22=1.0, SizingMethod='auto expand')"; filter: progid: DXImageTransform.Microsoft.Matrix(M11=1.0, M12=0, M21=0, M22=1.0, SizingMethod='auto expand'); } 100% { -moz-transform: scale(1); transform: scale(1); -webkit-transform: scale(1); -ms-transform: scale(1); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand')"; filter: progid: DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand'); } } .s_visual_wrap { position: relative; /* min-width: 1100px;*/ overflow: hidden; } .s_visual_wrap .slide { position: relative; height: 420px; top: 0; /* min-width: 1100px;*/ } .s_visual_wrap .slide ul { padding: 0; margin: 0; margin-top: -100px; padding-top: -100px; top: -100px; } .s_visual_wrap .slide li { height: 420px; background-position: 50% 50%; background-size: cover !important; background-repeat: no-repeat !important; position: absolute; left: 0; top: 0; width: 100%; text-align: center; -webkit-transform-origin: center center; -ms-transform-origin: center center; -moz-transform-origin: center center; transform-origin: center center; background: url('../../img/main/visual01.jpg'); /* -webkit-animation: zoom 20s ease-in-out infinite alternate; -moz-animation: zoom 20s ease-in-out infinite alternate; -o-animation: zoom 20s ease-in-out infinite alternate; -ms-animation: zoom 20s ease-in-out infinite alternate; */ animation: zoom 3s ease-in-out; animation-fill-mode: forwards; animation-iteration-count: 1; padding: 0; margin: 0; top: 0; } .s_visual_wrap .slide .content { top: 46%; position: relative; z-index: 1; text-align: center; /* animation: zoom 3s ease-in-out; animation-fill-mode: forwards; animation-iteration-count: 1; */ } .s_visual_wrap .slide .content h1 { font-size: 82px; font-weight: 700; color: #fff; /* padding-bottom: 0;*/ margin-bottom: 12px; margin-top: 0; padding-top: 0; position: relative; font-family: 'Poppins', 'Montserrat', 'NotoSans', sans-serif; font-family: 'Titillium Web', sans-serif; } .s_visual_wrap .slide .content h1 span { font-weight: 100; } .s_visual_wrap .slide .content p { font-size: 18px; font-weight: 400; color: #fff; font-family: 'NanumSquare', 'ï§ë¬’� 怨좊뵓', 'Nanum Gothic', 'Malgun Gothic', 'Ubuntu', '�ë—�', dotum, sans-serif; margin-top: 20px; } .s_visual_wrap .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* 서브비주얼 ë§ˆê° */ /* 서브네 ë§ˆê° */ /* 서브 ë ˆì´ì•„웃 */ #sub_content { margin-top: 80px; } #sub_content .page-header { text-align: center; margin-bottom: 50px; } #sub_content .page-header h1 { text-align: center; font-size: 42px; font-weight: 900; color: #000; font-family: 'NanumSquare'; } /* 서브 ë ˆì´ì•„웃 ë§ˆê° */ /* footer */ footer { /* margin-top: 30px;*/ border-top: 2px #70a011 solid; background-color: #fff; padding: 0 !important; padding-bottom: 20px !important; } footer.sub { margin-top: 60px; } footer .btn-default { background-color: #fff; background-image: none; text-shadow: none; box-shadow: none; border: 1px #dddddd solid; padding: 4px 11px; border-radius: 0; } footer .footer-menu { padding-top: 22px; padding-bottom: 12px; background-color: #fff; } @media(min-width:992px) { footer .footer-menu { /* border-bottom: 1px #050505 solid; */ margin-left: 480px } } footer .footer-menu ul { padding-top: 8px; padding-bottom: 12px; padding-left: 0; margin-left: 0; } footer .footer-menu ul li:before { color: #464646; content: "|"; font-size: 12px; } footer .footer-menu ul li:first-child, footer .footer-menu ul li:first-child a { padding-left: 0; margin-left: 0; } footer .footer-menu ul li:first-child::before { content: ""; padding-left: 0; margin-left: 0; } footer .footer-menu ul li a { font-size: 16px; color: #9c9c9c; font-weight: 900; padding-left: 16px; padding-right: 16px; } footer .footer-menu ul li a.blue { color: #70a011 } footer .breadcrumb { margin-bottom: 4px; background-color: transparent; } footer p.logo { float: left; /* display: none; */ } footer p.logo img { width: 80%; } footer address { font-size: 16px; line-height: 23px; color: #757575; font-style: normal; font-family: 'Poppins', 'NotoSans', sans-serif; } footer p { margin-top: 0; font-family: 'Poppins', 'NotoSans', sans-serif; padding-top: 6px; color: #757575 !important; font-size: 16px; }