/* ¸ÞÀοµ¿ª ½ºÅ¸ÀÏ ½ÃÆ® */

/* ¸ð¹ÙÀÏ ÇØ»óµµ */
@media only screen and (max-width:767px) {


div#pagepiling  { width:100%; height:100vh;}

div#section1 { width:100%; height:100vh; }
div#cont_main { width:100%;margin:0px auto;}
div#cont_main img.pc { display:none; }
div#cont_main img.mo { width:100%;height:800px;}

div.me { position:absolute;bottom:12%;left:30.5%;font-size:27px;width:150px;height:150px;padding:10px;text-align:center;transform-origin:50% 50%;color:#fff;}
div.side { position:absolute;right:0.5%;bottom:42%;width:110px;height:338px;background-color:#ffffff61;border-radius:10px; }
.cy { position:absolute;bottom:22%;left:38.5%;animation: rotate_image 6s linear infinite; }

.scroll-down {
  position : absolute;
  bottom :20%;
  left: 50%;
  transform:translateX(-50%);
  display:flex;
  flex-direction : column;
  align-items:center;
}
.scroll {
  width:1.5rem;
  height:3rem;
  border:1px solid #333;
  border-radius : 2rem;
  display : flex;
  justify-content:center;
  align-items:center;
}

.scroll span {
  width:0.6rem;
  height:0.6rem;
  border-radius :50%;
  background:#111;
  display : block;
  animation : cursor 1.15s linear infinite;
}

.arrow-down {
  width:0.8rem;
  height:0.8rem;
  border:1px solid transparent;
  border-right-color : black;
  border-bottom-color : black;
  transform : rotate(45deg);
  margin-top:10%;
  animation : arrow 1.15s linear infinite;
}

@keyframes rotate_image{
    100% {
        transform:rotate(360deg);
    }
}

@keyframes cursor{
    0% {
	    opacity : 0; 
        transform:translateY(-1rem);
    }
    100% {
	    opacity : 1; 
        transform:translateY(1rem);
    }
}

@keyframes arrow{
    0% {
	    opacity : 0; 
    }
    25% {
	    opacity : 0.25; 
    }
    50% {
	    opacity : 0.5; 
    }
    75% {
	    opacity : 0.75; 
    }
    100% {
	    opacity : 1; 
    }

}

div#section2 { width:100%; height:100vh; }

img.pc1 { display:none; }
img.mo1 { width:100%;height:680px;margin-top:120px;}
div#pc_d { display:none;}

div.thema { margin-top:8%; } 
div#cont2{ display:table; width:96%; margin:0px auto;padding:2px; }
div#cont2 ul { width:98%; margin:0px auto; } 
div#cont2 div.tt_img { display:block;width:100%;font-size:10px;  }
/*
div#cont2 div.tt_img ul li { float:left;display:inline-block;width:31%; height:100px;margin:2px; }
div#cont2 div.tt_img ul li img { width:100%;height:65px;}
/* div#cont2 div.tt_img ul li span { display:none; } */
div#cont2 div.tt_img ul li { float:left;display:inline-block;width:29%;height:150px;margin:2px; }
div#cont2 div.tt_img ul li img { width:100%;height:100px;}

table.thema_list {width:96%; margin:10px auto;}
table.thema_list tr th { padding:6px; background:#fff; color:#314072; font-weight:bold; font-size:9px; text-align:center;}
table.thema_list tr td { padding:4px 5px; line-height:1.8;font-size:14px;}
table.thema_list tr td a { text-align:left; padding-left:20px; line-height:18px;font-size:13px;}

div#mo_d h2 { font-size:17px; text-align:center; }
div#mo_d h3 { font-size:12px; text-align:center;}


div#section3 { width:100%; height:100vh; }

#btns1 {width:45.0%;text-align:center;float:left;background:#fff;border:1px solid #555;}
#btns1 a { display:inline-block;width:100%;text-align:center;text-decoration:none;line-height:40px;letter-spacing:2px;font-size:15px;}
#btns1 a:hover { color:#111;;background:#ddd;}

#btns2 {width:45.0%;text-align:center;float:right;background:#222;color:#fff;border:1px solid #555;}
#btns2 a { display:inline-block; width:100%;text-align:center;text-decoration:none;line-height:40px;letter-spacing:2px;font-size:15px;  color:#fff;}
#btns2 a:hover { color:#111; background:#ddd;}

#radi{ margin:1px auto; width:100px; font-size:15px;text-align:center; padding:15px;border:1px solid #5a6671;color:#5a6671;letter-spacing:2px;cursor:pointer; } 
#radi:hover{ color:#fff; } 

/* small wind power start (section2) */

div#section2 img { width:100%; }


@keyframes rotate_image{
    100% {
        transform: rotate(360deg);
    }
}

div#section4 { width:100%; height:100vh;  }

div#cont_wind { display:table; width:100%;}
div#cont_wind iframe { width:100%; height:160px; }
div#cont_wind ul { width:98%; margin:0 auto; } 
div#cont_wind ul li { display:inline-block; }

div#cont_footer { }
div#cont_footer ul li.bo { position:relative;width:100%;color:#222;margin-top:10px; }
div#cont_footer ul li.bo div { display:block; width:98%;margin:0px auto;}
div#cont_footer ul li.bo div ul { display:block; width:100%;margin:0px auto;}
div#cont_footer ul li.bo div ul li.left { width:100%;padding:8px;font-size:24px;color:#040404; }
div#cont_footer ul li.bo div ul li.left img { width:60%;text-align:center;margin:0px auto;}
div#cont_footer ul li.bo div ul li.right { width:80%;padding-top:10px;font-size:15px;margin:0px auto;}

/* scroll */
div#scroll { position:fixed;width:100px;height:120px;padding:10px;right:2%;bottom:5%;z-index:100;background-color:rgb(255,255,255,0.2); }
div#scroll ul { width:100%;margin:0px auto; } 
div#scroll ul li { width:96%;padding:2px 6px;text-align:center; }
div#scroll ul li.top { color:#222;font-weight:bold; }

.move_scale {
    -webkit-animation-name: animation_scale;
    -webkit-animation-duration: 1.5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 0.5s;  /* ½ÃÀÛ ½Ã°£ */
    -webkit-animation-direction:alternate ;  /* Á¾·áÈÄ ¸ð¼Ç */
    -webkit-animation-iteration-count:infinite; /* ¿¡´Ï¸ÞÀÌ¼Ç ¹Ýº¹ Ƚ¼ö */
    -webkit-animation-fill-mode: both
}

@-webkit-keyframes animation_scale {
    0% {
        -webkit-transform: translateX(0px) translateY(0px) scale(0.8);
        opacity: 0;
    }
    1% {
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(0px) translateY(0px) scale(1);
    }
}

.slick-dots li{width:173px !important;}
.slick-dots li a{font-size:14px !important;}

div.block {	position:relative; padding:50px 15px 0 15px;}

a.expand {  margin:0px auto;display: block;position:absolute;z-index:100;width:92%;height:100%;text-align:center; color: #fff;font-size:12px; }

.reveal-modal-bg { position:fixed;height:100%; width:100%; background:#000; background:rgba(0,0,0,.8); z-index:99999; display: none;top:0;left:0; }
.reveal-modal { 
    visibility: hidden;top:150px;left:0%;width:100%; background: #eee url(modal-gloss.png) no-repeat 200px 80px; position: absolute; z-index: 9999; padding:10px 10px 34px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
	-box-shadow: 0 0 10px rgba(0,0,0,.4);
}
	
.reveal-modal.small 		{ width: 200px; margin-left: -140px;}
.reveal-modal.medium 		{ width: 400px; margin-left: -240px;}
.reveal-modal.large 		{ width: 600px; margin-left: -340px;}
.reveal-modal.xlarge 		{ width: 800px; margin-left: -440px;}

.reveal-modal .close-reveal-modal {	font-size: 22px; line-height: .5; position: absolute; top:8px;	right: 11px; color: #aaa;text-shadow: 0 -1px 1px rbga(0,0,0,.6);font-weight: bold; cursor: pointer; } 


div#popup { position:absolute;top:80px; left:35%; width:550px; margin:100px auto; opacity:1.0;z-index:9999; }
div#popup div.popup_table { position: relative; width:520px; margin:0px auto;  }
div#popup div.popup_table div#X { width:20px;height:20px;color:#fff;background:#af2949;font-size:16px;text-align:center; }
div#popup div.popup_table span { font-size:13px;  }

table.pop_up {width:100%; margin:30px auto; border:3px solid #fff; background:#fff;}
table.pop_up tr th { padding:6px; background:#fff; color:#314072; font-weight:bold; font-size:14px; text-align:center;}
table.pop_up tr th.t_tit { background:#f5f5f5; color:#314072; font-weight:bold;font-size:13px;}
table.pop_up tr td { padding:4px 5px; line-height:1.8;font-size:14px;}
table.pop_up tr td.a_left {text-align:left; padding-left:20px; line-height:2;font-size:13px;}
table.pop_up tr td.a_tab {text-align:center; padding-top:38px; font-size:13px;}
table.pop_up tr td a { text-align:left; padding-left:20px; line-height:18px;font-size:13px;}

}


@media only screen and (min-width:1600px){

div#pagepiling  { width:100%; height:100vh;}

div#section1 { width:100%; height:100vh; }

div#cont_main { position:relative;width:100%;margin:0px auto;margin-top:-30px; }
div#cont_main img.pc { width:100%;margin:0px auto;text-align:center; }
div#cont_main img.mo { display:none; }

div.me { position:absolute;bottom:7%;left:42.6%;font-size:27px;width:150px;height:150px;padding:55px;text-align:center;transform-origin:50% 50%;color:#fff;}
div.side { position:absolute;right:0.5%;bottom:42%;width:110px;height:338px;background-color:#ffffff61;border-radius:10px; }
.cy { position:absolute;bottom:20%;left:46.5%;animation: rotate_image 6s linear infinite; }

.scroll-down {
  position : absolute;
  bottom :20%;
  left: 50%;
  transform:translateX(-50%);
  display:flex;
  flex-direction : column;
  align-items:center;
}
.scroll {
  width:1.5rem;
  height:3rem;
  border:1px solid #333;
  border-radius : 2rem;
  display : flex;
  justify-content:center;
  align-items:center;
}

.scroll span {
  width:0.6rem;
  height:0.6rem;
  border-radius :50%;
  background:#111;
  display : block;
  animation : cursor 1.15s linear infinite;
}

.arrow-down {
  width:0.8rem;
  height:0.8rem;
  border:1px solid transparent;
  border-right-color : black;
  border-bottom-color : black;
  transform : rotate(45deg);
  margin-top:10%;
  animation : arrow 1.15s linear infinite;
}

@keyframes rotate_image{
    100% {
        transform:rotate(360deg);
    }
}

@keyframes cursor{
    0% {
	    opacity : 0; 
        transform:translateY(-1rem);
    }
    100% {
	    opacity : 1; 
        transform:translateY(1rem);
    }
}

@keyframes arrow{
    0% {
	    opacity : 0; 
    }
    25% {
	    opacity : 0.25; 
    }
    50% {
	    opacity : 0.5; 
    }
    75% {
	    opacity : 0.75; 
    }
    100% {
	    opacity : 1; 
    }

}

div#section2 { }

img.mo1 { display:none;}

div#section3 { }

div#reser { margin:15px auto;width:150px;padding:10px;color:#fff;text-align:center;font-size:15px;background:#2e2e2e;border-radius:20px; }

/*
div.thema { margin-top:-12%; } 
div#cont2{ display:table; width:100%; margin:0px auto; padding:4px; }
div#cont2 ul { width:65%; margin:0px auto; } 
div#cont2 div.tt_img { display:block;width:100%;font-size:12px;  }
div#cont2 div.tt_img ul li { display:inline-block; width:18.7%;margin-left:0.7%;  }
div#cont2 div.tt_img ul li img { width:100%;height:160px;}
*/
div.thema { margin-top:3%; } 
div#cont2{ display:table; width:100%; margin:0px auto; padding:4px; }
div#cont2 ul { width:80%; margin:0px auto; } 
div#cont2 div.tt_img { display:block;width:100%;font-size:10px;  }
div#cont2 div.tt_img ul li { display:inline-block; width:15%; /*±âÁ¸ width:23%*/ margin-left:0.7%; /*float:left;*/ }
div#cont2 div.tt_img ul li img { width:100%;height:220px;}

div#cont_s { display:none; }
div#mo_d { display:none;}

#btns1 {width:45.0%;text-align:center;float:left;background:#fff;border:1px solid #555;}
#btns1 a { display:inline-block;width:100%;text-align:center;text-decoration:none;line-height:40px;letter-spacing:2px;font-size:15px;}
#btns1 a:hover { color:#111;;background:#ddd;}

#btns2 {width:45.0%;text-align:center;float:right;background:#222;color:#fff;border:1px solid #555;}
#btns2 a { display:inline-block; width:100%;text-align:center;text-decoration:none;line-height:40px;letter-spacing:2px;font-size:15px;  color:#fff;}
#btns2 a:hover { color:#111; background:#ddd;}

#radi{ margin:1px auto; width:100px; font-size:15px;text-align:center; padding:15px;border:1px solid #5a6671;color:#5a6671;letter-spacing:2px;cursor:pointer; } 
#radi:hover{ color:#fff; } 

/* small wind power start (section2) */

div#section2 img { width:100%; }

div#cont_wind{ display:table; width:100%; margin-top:180px;}
div#cont_wind iframe { width:100%; height:360px; }
div#cont_wind ul { width:80%; margin:0 auto; } 
div#cont_wind ul li { display:inline-block; margin-left:0.7%; /*float:left;*/ }
div#cont_wind ul li img { width:100%;height:160px;}

@keyframes rotate_image{
    100% {
        transform: rotate(360deg);
    }
}

div#section4 { }

div#cont_footer { height:35%; background-color:#fff;/*border-top:1px solid #e6e7e9;*/ }
div#cont_footer ul { position:relative;width:100%;font-size:15px;color:#222; }
div#cont_footer ul li.top_m { display:none;}

div#cont_footer ul li.bo { position:relative;width:100%;color:#222;margin-top:20px; }
div#cont_footer ul li.bo div { display:block; width:65%;margin:0px auto;}
div#cont_footer ul li.bo div ul { display:block; width:100%;margin:0px auto;}
div#cont_footer ul li.bo div ul li.left { float:left;width:25%;padding:20px;font-size:24px;color:#040404; }
div#cont_footer ul li.bo div ul li.left img { width:90%;}
div#cont_footer ul li.bo div ul li.right { float:right;width:65%;padding-top:10px;right:20px;font-size:15px;}

/* scroll */
div#scroll { position:fixed;width:100px;height:120px;padding:10px;right:2%;bottom:5%;z-index:100;background-color:rgb(255,255,255,0.2); }
div#scroll ul { width:100%;margin:0px auto; } 
div#scroll ul li { width:96%;padding:2px 6px;text-align:center; }
div#scroll ul li.top { color:#222;font-weight:bold; }

.move_scale {
    -webkit-animation-name: animation_scale;
    -webkit-animation-duration: 1.5s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 0.5s;  /* ½ÃÀÛ ½Ã°£ */
    -webkit-animation-direction:alternate ;  /* Á¾·áÈÄ ¸ð¼Ç */
    -webkit-animation-iteration-count:infinite; /* ¿¡´Ï¸ÞÀÌ¼Ç ¹Ýº¹ Ƚ¼ö */
    -webkit-animation-fill-mode: both
}

@-webkit-keyframes animation_scale {
    0% {
        -webkit-transform: translateX(0px) translateY(0px) scale(0.8);
        opacity: 0;
    }
    1% {
        opacity: 1;
    }

    100% {
        -webkit-transform: translateX(0px) translateY(0px) scale(1);
    }
}

.slick-dots li{width:173px !important;}
.slick-dots li a{font-size:14px !important;}

div.block {	position:relative; padding:50px 15px 0 15px;}

a.expand {  margin:0px auto;display: block;position:absolute;z-index:100;width:92%;height:100%;text-align:center; color: #fff;font-size:17px; }

.reveal-modal-bg { position:fixed;height:100%; width:100%; background: #000; background: rgba(0,0,0,.8); z-index:100; display: none;top:0;left:0; }
.reveal-modal { 
    visibility: hidden;top:150px;left:40%; margin-left:-300px;width:40%; background: #eee url(modal-gloss.png) no-repeat -200px -80px; position: absolute; z-index: 101; padding:30px 40px 34px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
	-box-shadow: 0 0 10px rgba(0,0,0,.4);
}
	
.reveal-modal.small 		{ width: 200px; margin-left: -140px;}
.reveal-modal.medium 		{ width: 400px; margin-left: -240px;}
.reveal-modal.large 		{ width: 600px; margin-left: -340px;}
.reveal-modal.xlarge 		{ width: 800px; margin-left: -440px;}

.reveal-modal .close-reveal-modal {	font-size: 22px; line-height: .5; position: absolute; top:8px;	right: 11px; color: #aaa;text-shadow: 0 -1px 1px rbga(0,0,0,.6);font-weight: bold; cursor: pointer; } 

div#popup { position:absolute;top:80px; left:35%; width:550px; margin:100px auto; opacity:1.0;z-index:9999; }
div#popup div.popup_table { position: relative; width:520px; margin:0px auto;  }
div#popup div.popup_table div#X { width:20px;height:20px;color:#fff;background:#af2949;font-size:16px;text-align:center; }
div#popup div.popup_table span { font-size:13px;  }

table.pop_up {width:100%; margin:30px auto; border:3px solid #fff; background:#fff;}
table.pop_up tr th { padding:6px; background:#fff; color:#314072; font-weight:bold; font-size:14px; text-align:center;}
table.pop_up tr th.t_tit { background:#f5f5f5; color:#314072; font-weight:bold;font-size:13px;}
table.pop_up tr td { padding:4px 5px; line-height:1.8;font-size:14px;}
table.pop_up tr td.a_left {text-align:left; padding-left:20px; line-height:2;font-size:13px;}
table.pop_up tr td.a_tab {text-align:center; padding-top:38px; font-size:13px;}
table.pop_up tr td a { text-align:left; padding-left:20px; line-height:18px;font-size:13px;}

}