@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);

html,body{height:100%;}

body{ font-family: 'Noto Sans KR', sans-serif; letter-spacing:-0.1px; background:#f8f8f8; }
body,p,div,h1,h2,h3,h4,h5,h6,ul,ol,dl,dt,dd,table,caption,form,fieldset,legend,input{margin:0; padding:0;}
li{list-style-type:none;}
fieldset,img{border:0;}
h1,h2,h3,h4,h5,h6 { font-weight:600;  }
li img, li a, dd img, img, a img{vertical-align:middle;}
.hdd{visibility:hidden; position:fixed; top:-9999; width:0; height:0; line-height:0; font-size:0}
legend,caption{font-size:0; width:0; height:0; line-height:0; visibility:hidden; position:absolute;}
a{text-decoration:none; color:#777;}
a:hover, a:focus, a:active{text-decoration:none; color:#777;}

.swiper-container{width:100%; height:100%; }
.swiper-slide{ text-align:center;font-size:18px; overflow-y:hidden;
-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;}


/* 웹 메뉴 */
#navi_web, #navi_web ul, #navi_web ul li #navi_web ul li ul{ margin:0; padding:0; }
#navi_web  { float:right; margin-top:13px; z-index:99; }
#navi_web:before, #navi_web:after, #navi_web > ul:before, #navi_web > ul:after { content: ''; display: block; clear: both; }
#navi_web ul { list-style: none; }
#navi_web ul li { float: left; position: relative; vertical-align:middle; }
#navi_web ul li a {  display: block; color:#231815; font-weight:500; font-size:16px; text-decoration:none; line-height:18px; }
#navi_web > ul > li:hover > a { border-bottom:3px solid #555; padding-bottom:8px;  }
#navi_web ul .line { padding:0 5px;  }

/* 부메뉴 */
#navi_web > ul ul { opacity: 0; visibility: hidden; position: absolute; width:165px; border:1px solid #ccc; z-index:999; background:#fff; }
#navi_web > ul li:hover ul { opacity: 1; visibility: visible; top:34px; right:-60px; }
#navi_web > ul ul li { float:left; width:50px; margin:2px; list-style: none; }
#navi_web > ul ul li a {display:block; color:#fff; font-size: 13px; text-decoration: none; width:50px; 
-webkit-transition: all 0.15s ease-in-out; -moz-transition: all 0.15s ease-in-out; -ms-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; }
#navi_web > ul ul li a:hover { background:#d45b0b;  }
#navi_web > ul ul li a:hover img { opacity:0.3;   }


/* 모바일 메뉴 */
#navi_mob, #navi_mob ul, #navi_mob ul li #navi_mob ul li ul{ margin:0; padding:0; }
#navi_mob  { float:right; margin-top:1px; z-index:99; }
#navi_mob:before, #navi_web:after, #navi_mob > ul:before, #navi_mob > ul:after { content: ''; display: block; clear: both; }
#navi_mob ul { list-style: none; }
#navi_mob ul li { float: left; position: relative; vertical-align:middle; }
#navi_mob ul li img { width:35px; }
#navi_mob ul li a {  display: block; color:#231815; font-weight:500; font-size:16px; text-decoration:none; line-height:18px; }
#navi_mob > ul > li:hover > a {    }
#navi_mob ul .line { padding:0 5px;  }

/* 부메뉴 */
#navi_mob > ul ul { opacity: 0; visibility: hidden; position: absolute; width:78px; border:1px solid #ccc; z-index:999; background:#fff; }
#navi_mob > ul li:hover ul { opacity: 1; visibility: visible; top:34px; right:-27px; }
#navi_mob > ul ul li { float:left; width:35px; margin:2px; list-style: none; }
#navi_mob > ul ul li img { width:35px; }
#navi_mob > ul ul li a {display:block; color:#fff; font-size: 13px; text-decoration:none; width:35px; 
-webkit-transition: all 0.15s ease-in-out; -moz-transition: all 0.15s ease-in-out; -ms-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; }
#navi_mob > ul ul li a:hover {   }
#navi_mob > ul ul li a:hover img {    }

footer { position:fixed; bottom:0;  height:45px; width:100%; margin:0 auto; text-align: center; background-color:#333; z-index:999; }
.main_sns { text-align:center; padding:5px 0;  }
.main_sns img { width:35px;  }


/* 스마트폰대상  레이아웃 지정：100px～769px */
@media only screen and (min-width: 100px) {
footer { display:block; }
.menuSlide_wrap { display:none; }
#top_web { display:none; }
#top_mob { display:block; background:#fff; height:70px; }

.header_mob { width:90%; height:30px; padding:10px 0; margin:0 auto; }
.header_mob .left { float:left; width:50%; margin:5px 0 0 0; }
.header_mob .left img { width:100%; }
.header_mob .right { float:right; width:50%; margin-top:8px; }
.header_mob .right .right_pdf { float:right; margin:0 5px 0 0px;  }
.header_mob .right .right_pdf img { width:36px;   }
.header_mob .right .right_btn {  float:right; }
.header_mob .right .right_btn img { width:26px; }


/*모바일 메뉴 */
.gnb{display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:9999; }
.gnb .inner{position:fixed; overflow-y:scroll; right:-50%; width:100%; height:100%; padding-bottom:0; z-index:9999; background:#444;}
.gnb .inner_width { width:90%; margin:0 auto;}

.gnb .top .gnb_logo { float:left; width:250px; }
.gnb .top .gnb_logo ul li { float:left; font-size:20px; color:#fff; margin-top:40px; font-weight:bold; }
.gnb .top .home { float:right; width:50px; margin:30px 0 0 0; }
.gnb .gnb_con { float:left; width:100%; margin:20px 0 0 0;  }

.gnb .gnb_con .title { float:left; width:100%; font-size:16px; color:#F7941F; border-bottom:1px solid #fff; padding:0 0 5px 0; margin:0 0 5px 0; }
.gnb .gnb_con .sub_title { float:left; width:100%; font-size:14px; }
.gnb .gnb_con .con {  float:left; width:100%; margin:5px 0 0 0;  }
.con_last { padding-bottom:200px; }
.gnb .gnb_con .con .img { float:left; width:70px; padding:2px 0 0 0;  }
.gnb .gnb_con .con .txt { float:left; font-size:14px; color:#ececec; padding:0px 0 0 20px; line-height:20px;  }
.gnb .gnb_con .con a { color:#ddd; }
.gnb .gnb_con .con a:hover, a:focus, a:active{ color:#fff; }


.swiper-slide { margin:50px 0 35px 0; }
.swiper-slide img {width:100%;}
.swiper-button-next{background-image:url("https://sample.designpk.kr/goe_greenedu/images/arrow_left.png"); left:10px;right:auto; }
.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("https://sample.designpk.kr/goe_greenedu/images/arrow_right.png");right:10px;left:auto}
.swiper-container{width:100%; height:100%; }

}


/* PC대상 및 대형 태블릿 대상 레이아웃 지정：769px～1060px */
@media only screen and (min-width: 800px) {
footer { display:none; }
.menuSlide_wrap { display:block; }
#top_web {  display:block; }
#top_mob {  display:none; }

.header_web {  float:right; top:20px; right:20px; width:135px;  position:fixed; z-index:10; }
.header_web .right {   }
.header_web .right ul li { float:left;  }
.header_web .right .right_pdf img { width:45px; margin-right:10px;  }
.header_web .right .right_btn img { width:30px; }
.header_web .right .right_home img { width:45px; }


/*모바일 메뉴 */
.gnb{display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:9999; }
.gnb .inner{position:fixed; overflow-y:scroll; right:-50%; width:500px; height:100%; padding-bottom:0; z-index:9999; background:#444;}
.gnb .inner_width { width:380px; margin:5px 0 0 60px;}

.gnb .top .gnb_logo { float:left; width:320px; }
.gnb .top .gnb_logo ul li { float:left; font-size:22px; color:#fff; margin-top:38px; font-weight:bold; }
.gnb .top .home { float:right; width:50px; margin:30px 0 0 0; }
.gnb .gnb_con { float:left; width:100%; margin:20px 0 0 0;  }

.gnb .gnb_con .title { float:left; width:100%; font-size:16px; color:#F7941F; border-bottom:1px solid #fff; padding:0 0 5px 0; margin:0 0 5px 0; }
.gnb .gnb_con .sub_title { float:left; width:100%; font-size:14px;}
.gnb .gnb_con .con {  float:left; width:100%; margin:5px 0 0 0;  }
.con_last { padding-bottom:200px; }
.gnb .gnb_con .con .img { float:left; width:70px; padding:2px 0 0 0;  }
.gnb .gnb_con .con .txt { float:left; font-size:16px; color:#ececec; padding:0px 0 0 20px; line-height:20px;  }
.gnb .gnb_con .con a { color:#ddd; }
.gnb .gnb_con .con a:hover, a:focus, a:active{ color:#fff; }




.swiper-slide { margin:10px 0 35px 0; }
.swiper-slide img {width:700px;position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); }
.swiper-button-next{background-image:url("https://sample.designpk.kr/goe_greenedu/images/arrow_left.png"); left:10px;right:auto; }
.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("https://sample.designpk.kr/goe_greenedu/images/arrow_right.png"); right:10px;left:auto}
.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url("https://sample.designpk.kr/goe_greenedu/images/arrow_left.png"); left:10px; right:auto;}
}


@media only screen and (min-width: 1280px) {
footer { display:none; }

.menuSlide_wrap { display:block; }
#top_web {  display:block; }
#top_mob {  display:none; }

.header_web {  float:right; top:20px; right:20px; width:135px;  position:fixed; z-index:10; }
.header_web .right {   }
.header_web .right ul li { float:left;  }
.header_web .right .right_pdf img { width:45px; margin-right:10px;  }
.header_web .right .right_btn img { width:30px; }
.header_web .right .right_home img { width:45px; }



/*모바일 메뉴 */
.gnb{display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:9999; }
.gnb .inner{position:fixed; overflow-y:scroll; right:-50%; width:500px; height:100%; padding-bottom:0; z-index:9999; background:#444;}
.gnb .inner_width { width:380px; margin:5px 0 0 60px;}

.gnb .top .gnb_logo { float:left; width:320px; }
.gnb .top .gnb_logo ul li { float:left; font-size:22px; color:#fff; margin-top:40px; font-weight:bold; }
.gnb .top .home { float:right; width:50px; margin:30px 0 0 0; }
.gnb .gnb_con { float:left; width:100%; margin:20px 0 0 0;  }
.gnb .gnb_con .title { float:left; width:100%; font-size:16px; color:#F7941F; border-bottom:1px solid #fff; padding:0 0 5px 0; margin:0 0 5px 0; }
.gnb .gnb_con .sub_title { float:left; width:100%; font-size:14px; color:#f97463; }
.gnb .gnb_con .con {  float:left; width:100%; margin:5px 0 0 0;  }
.gnb .gnb_con .con .img { float:left; width:70px; padding:2px 0 0 0;  }
.gnb .gnb_con .con .txt { float:left; font-size:16px; color:#ececec; padding:0px 0 0 20px; line-height:20px;  }
.gnb .gnb_con .con a { color:#fff; }
.gnb .gnb_con .con a:hover, a:focus, a:active{ color:#FFFF80; }


.swiper-slide { margin:0px 0 0px 0; overflow:auto; }
.swiper-slide img { width:800px; height: 1132px; box-shadow:5px 5px 5px 1px #ececec;}
.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url("https://sample.designpk.kr/goe_greenedu/images/arrow_left.png"); left:50%; margin-left:-480px; right:auto;}
.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("https://sample.designpk.kr/goe_greenedu/images/arrow_right.png");right:50%;margin-right:-480px; left:auto;}

.top_name img {width: 85%; margin: 0 auto; display: block;}

}