@charset "utf-8";


html.fix{overflow-y:hidden}


/* input tag */
input[type="text"],
input[type="password"],
input[type="file"],
select{
position:relative;
width:auto;
height:27px;
text-align:left;
background:none;
border:1px solid #ccc;
display:inline-block;
color:#666;
line-height:1;
outline:none;
font-size:14px;
border-radius:0
}
input[type="file"]{width:100%;line-height:normal;height:auto}
textarea{position:relative;width:100%;background:none}

select{ 
height:29px; 
-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
zoom:1 
}
img{max-width:100%}


#wrap{position:relative;left:0;width:100%;min-height:100%;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;-webkit-overflow-scrolling: touch;}


.clearfix:after {content: '';display: block;clear: both;}

/* header */
#header{position:fixed;top:0;left:0;width:100%;height:59px;z-index:500;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease}
#header .header_wrap{position:relative;max-width:1920px;margin:0 auto;padding:0}
#header .header_wrap h1{position:absolute;top:30px;left:50px;z-index:60}
#header .header_wrap h1 img{width:200px}
#header .global_wrap{z-index:10;position:absolute;top:34px;right:50px}
#header .global_wrap > li{float:left;margin-left:20px;overflow:hidden}
#header .global_wrap > li:first-child{margin-left:0}
#header .global_wrap > li > a{display:block;float:left}
#header .global_wrap .global a{font-size:18px;color:#999;line-height:24px;padding-left:10px;margin-left:10px;background:url(../../images/common/global_line.png) left center no-repeat}
#header .global_wrap .global a:first-child{padding-left:0;margin-left:0;background:none}
#header .global_wrap .sns a{margin-left:10px}
#header .global_wrap .sns a:first-child{margin-left:0}

#header .btn_list{position:absolute;top:0;left:0;display:none;height:50px;width:50px;z-index:60}
#header .btn_list span{position:absolute;left:15px;top:0;display:block;width:18px;height:1px;background:#888888;transform: rotate(0deg);-o-transform: rotate(0deg);-moz-transform: rotate(0deg);-webkit-transform: rotate(0deg); transition: .25s ease-in-out;-o-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-webkit-transition: .25s ease-in-out}
#header .btn_list span:first-child{top:18px;}
#header .btn_list span:nth-child(2){top:24px;}
#header .btn_list span:nth-child(3){top:24px;visibility: hidden;}
#header .btn_list span:nth-child(4){top:30px;}

#header .gnb_data{position:absolute;top:0;left:0;right:0;bottom:0;width:auto;height:auto;margin:51px 0 42px 0;overflow-y:auto;display:none}
#header .btn_gnb_close{position:absolute;bottom:15px;left:50%;display:block;width:15px;height:15px;margin-left:-7px;display:none}
#header .gnb_data .data_top{border:1px solid #222}
#header .gnb_data .data_top ul,
#header .gnb_data .data_top li{padding:0;margin:0;list-style:none}
#header .gnb_data .data_top > ul{overflow:hidden}
#header .gnb_data .data_top > ul > li{float:left;text-align:center}
#header .gnb_data .data_top > ul > li.member{width:50%;overflow:hidden}
#header .gnb_data .data_top > ul > li.member li{float:left;width:50%}
#header .gnb_data .data_top > ul > li.member li a{display:block;font-size:14px;line-height:50px;border-left:1px solid #222;color:#fff}
#header .gnb_data .data_top > ul > li.member li:first-child a{border-left:none}
#header .gnb_data .data_top > ul > li.sns{width:50%;overflow:hidden}
#header .gnb_data .data_top > ul > li.sns li{float:left;width:33.33%}
#header .gnb_data .data_top > ul > li.sns li a{display:block;height:50px;border-left:1px solid #222}
#header .gnb_data .data_top > ul > li.sns li a img{padding-top:13px}

#header .gnb_list{}
#header .gnb_list > ul > li{border-bottom:1px solid #222}
#header .gnb_list > ul > li:first-child{border-top:none}
#header .gnb_list > ul > li > a{position:relative;display:block;font-size:16px;color:#fff;padding:0 15px;line-height:50px;letter-spacing:1px}
#header .gnb_list > ul > li > a > span{position:absolute;top:50%;right:15px;display:block;height:15px;width:15px;margin-top:-7px;}
#header .gnb_list > ul > li > a > span span{position:absolute;left:0;top:50%;display:block;width:15px;height:1px;background:#fff;transform: rotate(0deg);-o-transform: rotate(0deg);-moz-transform: rotate(0deg);-webkit-transform: rotate(0deg); transition: .25s ease-in-out;-o-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-webkit-transition: .25s ease-in-out}
#header .gnb_list > ul > li > a > span span:nth-child(1){transform: rotate(90deg);-o-transform: rotate(90deg);-moz-transform: rotate(90deg);-webkit-transform: rotate(90deg)}
#header .gnb_list > ul > li.open > a > span span:nth-child(1){transform: rotate(0deg);-o-transform: rotate(0deg);-moz-transform: rotate(0deg);-webkit-transform: rotate(0deg)}
#header .gnb_list .snb_list{display:none;padding:15px 15px;background:#222}
#header .gnb_list .snb_list li{margin-top:15px}
#header .gnb_list .snb_list li:first-child{margin-top:0}
#header .gnb_list .snb_list li a{display:block;font-size:14px;color:#bbb;line-height:14px;text-align:left}
#header .gnb_list .snb_list li.actived a{color:#fff}
#header.open .btn_gnb_close{display:block}


#gnb{padding-top:20px}
.gnb_wrap {position:relative;z-index:5}
.gnb_wrap > ul{position:relative;display:inline-block;zoom:1;*display:inline;z-index:3}
.gnb_wrap > ul > li{display:inline}
.gnb_wrap > ul > li > a{position:relative;float:left;display:block;font-size:20px;padding:0 20px;color:#999;font-weight:500;line-height:50px}
.gnb_wrap > ul > li > a:hover,.gnb_wrap > ul >  li.actived > a{color:#5fabd5}


.snb_wrap{position:absolute;top:49px;left:0;width:100%;display:none}
.snb_wrap ul li{position:relative;display:inline-block;zoom:1;*display:inline;padding:0 15px 0 20px}
.snb_wrap ul li:before{content:"";display:block;width:4px;height:4px;background:#999;position:absolute;left:0;top:50%;margin-top:-2px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}
.snb_wrap ul li:first-child:before{display:none;}
.snb_wrap ul li a{display:block;line-height:45px;color:#999;font-weight:400;font-size:15px}
.snb_wrap ul li:hover a,.snb_wrap ul li.actived a{color:#f5f5f9;}
.snb_wrap.snb01 ul{position:absolute;top:0;left:0}
.snb_wrap.snb02 ul{position:absolute;top:0;left:50px}
.snb_wrap.snb03 ul{position:absolute;top:0;left:0;width:100%}
.snb_wrap.snb04 ul{position:absolute;top:0;right:200px}
.snb_wrap.snb05 ul{position:absolute;top:0;right:100px}
.snb_wrap.snb06 ul{position:absolute;top:0;right:0}


#topBar{position:absolute;bottom:-7px;left:50%;width:14px;height:14px;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;background:#5fabd5;z-index:2;opacity:0}
#topLine{position:absolute;bottom:0;left:0;width:100%;height:1px;z-index:2;background:#616160;opacity:0}
#snbBg{position:absolute;top:59px;left:0;width:100%;height:45px;background:rgba(65,65,65,0.9);border-bottom:solid 1px #616160;display:none}


/*rgba(28,41,93,0.9)*/
#header.fix .header_wrap{background:rgba(50,50,50,0.9)}
#header.fix #gnb{padding-top:0}
#header.fix .gnb_wrap{width:100%}
#header.fix .gnb_wrap > ul > li > a{line-height:59px}
#header.fix h1{top:20px}
#header.fix .header_wrap h1 img{width:140px}
#header.fix .global_wrap{top:17px}
#header.fix .snb_wrap{top:59px}
/*#header.fix .snb_wrap ul{width:100%}*/


/* container */
#container{opacity:0;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease}
#container.start{opacity:1}


/* footer */
#footer{padding:30px 10px;margin-top:200px;background:#d7d7d7}
#footer address{font-size:14px;line-height:22px;color:#555;margin-top:10px}
#footer .member a {display: inline-block; background: #555; border-radius: 50%; width: 30px; height: 30px; transition: 0.3s; margin-left: 5px; margin-right: 5px}
#footer .member a.face:hover{background: #3B5998}
#footer .member a.blog:hover{background: #23B400}

.Re_list{*zoom:1}
.Re_list:after {content:" ";display:block;clear:both;overflow:hidden}
.Re_list > li{float:left}

#pageNav{position:fixed;top:50%;left:50%;margin-left:897px;z-index:50}
#pageNav ul{}
#pageNav ul li{line-height:0;padding:7px 0;opacity:0}
#pageNav ul li a{display:block;width:13px;height:13px;background:#bbb;opacity:0.5;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease}
#pageNav ul li.actived a,#pageNav ul li a:hover{background:#5fabd5;opacity:1}

#btn_top_scroll{position:fixed;bottom:160px;left:50%;z-index:10;display:none;margin-left:860px}
#btn_top_scroll a{border:1px solid #cacaca;display:block;width:48px;height:48px;line-height:48px;background:#fff}



/* desktop 1920 */
@media screen and (max-width:1920px){ 
#pageNav{top:50%;left:auto;right:30px;margin-left:0}
#btn_top_scroll{margin-left:0;left:auto;right:30px;bottom:30px}
}


/* desktop 1280 */
@media screen and (max-width:1280px){
#header .header_wrap{padding:0}
#header.open .header_wrap{border-bottom:1px solid rgba(255,255,255,0)}
#header .header_wrap h1{left:30px}
#header .global_wrap{right:30px}

.gnb_wrap > ul{padding:0 40px}
.gnb_wrap ul li a{font-size:16px;padding:0 10px}
.snb_wrap ul li a{font-size:13px}
.snb_wrap ul li{padding:0 5px 0 10px}

.snb_wrap.snb01 ul{top:0;left:0}
.snb_wrap.snb02 ul{top:0;left:25px}
.snb_wrap.snb03 ul{top:0;left:0;width:100%}
.snb_wrap.snb04 ul{top:0;right:100px}
.snb_wrap.snb05 ul{top:0;right:50px}
.snb_wrap.snb06 ul{top:0;right:0}
}


/* desktop 1024 */
@media screen and (max-width:1024px){ 
#header{height:50px;position:fixed}
#header.open{height:100%;background:#444}
#header .header_wrap{margin:0;height:50px;border-bottom:1px solid rgba(255,255,255,0.2)}
#header .header_wrap h1{position:relative;top:auto;left:auto;text-align:center;padding:16px 0}
#header .header_wrap h1 img{width:70px}
#header .global_wrap{display:none}

#header .gnb_data{display:block}

#header .btn_list{display:block}

#header.fix .header_wrap h1 img{width:70px}

#gnb{display:none}
#topBar{display:none}
#pageNav{display:none}
#btn_top_scroll{right:20px;bottom:20px}
}


/* mobie 768 */
@media screen and (max-width:768px){
.m_only_b{display:none}
.i_wrap{display:block;width:auto !important}
.t_wrap{display:block;width:auto !important}
.s_wrap{display:block;width:auto !important}
}


/* mobie 640 */
@media screen and (max-width:640px){
#header .header_wrap{padding:0 15px}
#footer{padding:20px 10px;margin-top:100px}
#footer address{font-size:13px;line-height:18px;margin-top:15px}

#btn_top_scroll{right:15px}
}






/**** Isotope CSS3 transitions ****/


.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}


.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}


.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}


/**** disabling Isotope CSS3 transitions ****/


.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}


/* End: Recommended Isotope styles */


/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling {
  -webkit-transition: none;
     -moz-transition: none;
      -ms-transition: none;
       -o-transition: none;
          transition: none;
}