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

html, body {width:100%; font-family:'Noto Sans KR', sans-serif ,'돋움', 'Dotum','Arial','Tahoma','AppleGothic';}
html {overflow:auto; scroll-behavior:smooth; }
body {font-size:12px; line-height:normal; letter-spacing:-0.4px;  background-color:#fff; }
iframe {display:block;}

/* reset */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {margin:0; padding:0}
table {border-collapse:collapse; border-spacing:0; empty-cells:show; table-layout:fixed;}
caption, th {text-align:left;}
li {list-style:none;}
fieldset {margin:0; padding:0; border:0; background:none;}
legend, caption {position:absolute; top:-99999px; left:-99999px;.display:none;}
label {cursor:text;}
input:checked[type="checkbox"] {-webkit-appearance:checkbox; background-color:#fff;}
input[type="button"], input[type="text"], input[type="image"] {-webkit-appearance:none;-webkit-border-radius:0;}
input, textarea, select {'Noto Sans KR', sans-serif;  font-size:inherit; font-weight:inherit;}
textarea, input {outline-color:-moz-use-text-color; outline-style:none; outline-width:medium;}
input:-webkit-autofill {-webkit-box-shadow: 0 0 0 1000px white inset; background:#fff !important;}
textarea {resize:none;-webkit-appearance:none; -webkit-border-radius:0;}
address, caption, cite, code, dfn, em, strong, th, var {font-style:normal; font-weight:normal;}
abbr, acronym {border:0; font-variant:normal;}
strong {font-weight:bold;}
img {border:0;}
em, i {font-style:normal;}
a {color:#3a3a3a; text-decoration:none; cursor:pointer;}
a:hover,a:focus {text-decoration:none;}
.hide {z-index:-1; position:absolute; top:-999999em; left:-999999em; display:inline-block;.display:none; width:1px; height:1px; font-size:1px; line-height:1px;}
button {margin:0; padding:0; border:none;background-color:transparent; font-family:'Noto Sans KR', sans-serif;}
button::-moz-focus-inner {padding:0; border:0;}
::-ms-clear {display:none;}
input.check, input.radio {position:relative; vertical-align:middle;}
input.check {top:-1px}
label.label {position:absolute;}
image {width:100%; max-width:100%;}

/*  */
.wrap {overflow:hidden;}
.hearder_wrap {position:relative; display:flex; align-items:center; justify-content: center;  height:56px; text-align:center; font-family:'Noto Sans KR', sans-serif; }
    .hearder_wrap h1 {display:inline-block; }
        .logoLink {display:inline-block; color:#8EC244;}
        .sideMenu_w{position:absolute; left:0; top:0;}
        .menuButton {position:absolute; left:0; top:0; z-index:9;}
        /*  */
        #allmenu_btn_wrap {position:absolute;z-index:1002;top:20px;right:-15px}
        .sideMenu_w #allmenu_btn {display:block;position:relative;width:50px;height:56px;cursor:pointer;transition:all .2s}
        .sideMenu_w #allmenu_btn span:before,
        .sideMenu_w #allmenu_btn span:after{position:absolute;z-index:20;width:20px;height:2px;background-color:#222}
        .sideMenu_w #allmenu_btn span {position:absolute;top:45%;left:70%;margin-top:-1px;-webkit-transition:all ease .2s;transition:all ease .2s}
        .sideMenu_w #allmenu_btn span:before,
        .sideMenu_w #allmenu_btn span:after{z-index:-1;content:'';right:0;-webkit-transition:all ease .2s;transition:all ease .2s}
        .sideMenu_w #allmenu_btn span:before{top:-3px}
        .sideMenu_w #allmenu_btn span:after{top:6px}
        .active #allmenu_btn{z-index:200}
        .active span{background-color:transparent}
        .active #allmenu_btn span:before{-webkit-transform:translateY(6px) translateX(0) rotate(45deg);-ms-transform:translateY(6px) translateX(0) rotate(45deg);transform:translateY(6px) translateX(0) rotate(45deg)}
        .active #allmenu_btn span:after{-webkit-transform:translateY(-3px) translateX(0) rotate(-45deg);-ms-transform:translateY(-3px) translateX(0) rotate(-45deg);transform:translateY(-3px) translateX(0) rotate(-45deg)}
        .sideMenu-inner {display:none; position:fixed; left:0; top:0; z-index:8; width:100%; height:100vh; background-color:rgba(0,0,0,.5);}
            .active .sideMenu-inner {display:block;}
            .sideMenu-cont {display:block; position:fixed; left:-999px; top:0; z-index:8; max-width:350px; width:60%; height:100vh; background-color:#fff; transition:all 0.4s;}
            .active .sideMenu-cont {left:0;}
            .sideMenu-list {padding-top:50px;}
                .sideMenu-list li {}
                    .sideMenu-list a {display:block; height:30px; line-height:30px; padding:10px; color:#333; font-size:15px;}
                    .sideMenu-list a:hover {text-decoration:underline;}
    .content_w_main {}
        .contents_section {}
            [class^="contents_0"] {}
            .contents_01 {position:relative; display:flex; background-color:#000; overflow:hidden;}
                .contents_01-inner {position:absolute; left:0; bottom:10%; width:100%;}
                    .contentsList {padding:0 30px; color:#fff; max-width:1200px; margin:0 auto; box-sizing:border-box; font-weight:700; font-size:38px;}
                        [class^="contentsList-0"] {margin-top:5px; position:relative; display:block; opacity:0; animation:fadeInText 1s 2s ease-out forwards; }
                        .contentsList-01 {margin-top:0; animation-delay:0.2s;}
                        .contentsList-02 {animation-delay:0.8s; }
                        .contentsList-03 {animation-delay:1.6s;}
                        .contentsList-04 {animation-delay:2.4s;}
                        .contentsList-05 {animation-delay:3.2s;}
                        .contentsList-06 {animation-delay:4s;}
                        /*.contentsList-07 {animation-delay:4.8s;}*/
                          @keyframes fadeInText {
                                100% {opacity:1;}
                            }
                    .infoText_w {}
                        .infoText_w .contentsBottomL {width:100%; padding:7px 0;}
                            .infoText_w strong {color:#fff; display:block; text-align:center; font-weight:500;}
            .contents_02 {margin:50px auto 0; padding:0 20px; max-width:1200px;}
                .contentsCategory {display:flex; flex-wrap:wrap; width:100%;  text-align:center;}
                    .contentsCategory li {width:25%; flex-shrink:0; padding:0 6px; box-sizing:border-box;overflow:hidden;}
                        [class^="category-link"] {position:relative; display:block; padding:10px; width:100%; height:100%; box-sizing:border-box; border:1px solid #ddd; text-align:center;}
                            .categoryText_w {box-sizing:border-box; width:100%; padding-bottom:10px; z-index:2; color:#333; font-weight:700; text-align:left;}
                                .categoryText-inner {text-align:center;}
                                    .categoryText_w strong {display:block; width:100%; margin-top:20px; flex-shrink:0; font-size:18px; color:#333; letter-spacing:-0.6px; font-weight:700;}
                                    .categoryText_w span {display:inline-block; position:relative; margin-top:7px; padding:12px 2px; font-size:14px; font-family:'Roboto'; color:#333; font-weight:700; letter-spacing:-0.2px;}
                                    .categoryText_w span:before,
                                    .categoryText_w span:after{display:block;position:absolute;bottom:0;width:100%;height:4px;content:"";-webkit-transition:width .4s;transition:width .4s;-webkit-transition-timing-function:cubic-bezier(0.165, 0.840, 0.440, 1.000);transition-timing-function:cubic-bezier(0.165, 0.840, 0.440, 1.000)}
                                    .categoryText_w span:before{right:0;width:100%;background:#dbdbdb;-webkit-transition-delay:.2s;transition-delay:.2s;}
                                    .categoryText_w span:after{width:0;left:0;background:#8EC244;-webkit-transition-delay:0s;transition-delay:0s}
                                    .callText {margin-top:10px; font-size:12px; font-weight:400; color:#666;}
                                   [class^="category-link"]:hover .categoryText_w span:before{width:0;-webkit-transition-delay:0s;transition-delay:0s}
                                   [class^="category-link"]:hover .categoryText_w span:after{width:100%;-webkit-transition-delay:.2s;transition-delay:.2s}
                            .contentsCategory .image_w {padding-top:53%;}
                            .image_wrap {overflow:hidden;}
                                .image_w {position:relative; max-width:1200px; margin:0 auto; padding-top:40%; width:100%; overflow:hidden; transition:all 0.3s;}
                                [class^="category-link"]:hover .image_w {transform:scale(1.2);}
                            [class^="category-link0"]:hover {background-color:#f8f8f8;}
                            /*[class^="category-link0"]:before { display:block; content: ""; position: absolute; border: 4px solid #8EC244;  z-index:2; top:0px; left:0px; right:0px;  bottom:0px; opacity: 0;  transition-duration: 0.3s; transition-property: opacity;}*/
                            [class^="category-link0"]:hover:before {opacity:1;}
                            [class^="category-link0"]:hover .categoryText_w strong {text-decoration:none;}
                                .image-inner {position:absolute; left:50%; top:50%; min-width:100%; }
                                .image-inner img {transform:translate(-50%,-50%);}
                            .image_w:after {display:block; content:''; position:absolute; left:0; top:0; width:100%; height:100%; opacity:0.7;}
                                .image-inner {}
                                    .image-inner img {width:100%;}
                            .contents_01 .image_wrap {width:100%;}
                            .contents_01 .image-inner {}
                            .contents_01 img {opacity:0.2;}
            .contents_03 {margin-top:50px; background-color:#303438; color:#fff;}
                .contentsBottom {display:flex; width:100%; max-width:1200px; margin:0 auto; }
                    .contentsBottomL {display:flex; align-items:center; justify-content:center; flex-shrink:0; width:357px; background-color:#8EC244; box-sizing:border-box;}
                        .contentsBottomL-inner {}
                            .contentsBottomL-inner strong {display:block; font-size:15px; font-weight:500;}
                            .contentsBottomL-inner a {display:block; color:#fff; font-size:30px; font-weight:700;}
                        .contents_03 ul {padding:30px;}
                            .contents_03 li:first-of-type {margin-top:0;}
                            .contents_03 li {padding-left:20px; margin-top:5px; position:relative; font-size:15px; font-weight:700;}
                            .contents_03 li:after {display:block; content:''; position:absolute; left:0; top:50%; margin-top:-2px; width:4px; height:4px; border-radius:100%; background-color:#ccc; }
    .footer_wrap {background-color:#212427; font-size:12px; color:#5b5b5c; text-align:center;}
        .footer {max-width:1200px; padding:25px 20px; box-sizing:border-box; margin:0 auto; letter-spacing:0;}
            .footer ul {}
                .footer li {display:block;}
                .footer li:first-of-type {margin-top:0; display:block; }
                .footer li:last-of-type {margin-top:10px; font-size:11px;}
                .footer strong {display:inline-block; }
                .footer span {display:inline-block; }
@media (max-width: 1220px) {
    .contents_01-inner {bottom:30px;}
    .contentsList {font-size:32px;}
    .image_w  {padding-top:53%;}
}

@media (max-width: 1024px) {
    .contents_01 {}
    .contents_01 .image-inner {top:50%;}
    .contentsList {font-size:34px;}

}
@media (max-width: 920px) {
    .contentsList {font-size:27px;}
    .contentsBottomL {width:40%;}
    .contentsBottomL-inner {padding:0 10px;}
    .contents_02 {margin-top:38px; padding:0 14px;}
    .contentsCategory li {width:50%; margin-top:12px;}
    .categoryText_w span {padding:10px 2px;}
    .contentsBottomL-inner a {font-size:25px;}

}
@media (max-width: 680px) {
    .contentsList {font-size:24px;}
    .contentsList strong {font-weight:500;}
    .contents_01-inner {bottom:30px;}
    .sideMenu-cont {width:70%; max-width:100%;}
    .contents_01 .image_w {padding-top:65%;}



}
@media (max-width: 510px) {
    .contentsList {font-size:18px; padding:0 20px;}
    .categoryText_w span {margin-top:0;}
    .contentsBottomL-inner {text-align:center;}
    .contentsBottomL-inner a {font-size:20px;}
    .contentsCategory li {width:100%;}
    .contents_02  {margin-top:28px;}
    .contents_03 {margin-top:30px;}
    .contentsBottom {flex-wrap:wrap; }
    .contentsBottomL {padding:10px;}
    .contents_01-inner {bottom:30px;}
    .contentsBottomL,.contents_03 ul {width:100%;}
    /*.contentsCategory li:last-of-type .image-inner {top:25%;}*/
}