@charset "utf-8";


/* ==========================================================================
   Base styles & Helper
   ========================================================================== */

   @import url('lib/normalize.css');
   @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
   @import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);

   /* base */
   *{margin:0;padding:0;}
   img{border:0;}
   .blind{display:none;}
   h1, h2, h3, h4, h5, h6, fieldset,ul, ol, dl, dt, dd, p, button, figure{margin:0;padding:0;}
   html{}
   body {font-family: 'Noto Sans KR', sans-serif,"Dotum","돋움",sans-serif; color:#333; }
   h1, h2, h3, h4, h5, h6, strong, b, th{font-weight:bold;font-family :'Noto Sans KR',"나눔 고딕","Dotum","돋움",sans-serif;}
   legend, caption{
      width:0;
      height:0;
      visibility:hidden;
      font-size:0;
      line-height:0;
   }
   a{font-style:normal;text-decoration:none;color:#333;}
   fieldset, button{background:none;border:0px;}
   li{list-style:none;}

   table{width:100%;border-collapse:collapse;}
   iframe{vertical-align:middle;border:0 none;}
   input, button{box-sizing:inherit;}
   hr{border-width:1px 0 0 0;}

   .reverseWrap{margin: 0 auto;  width: 1126px;}
   .reverseWrap>div{overflow: hidden;}
   .reverseWrap>div .item{float: left;}
   .reverseWrap .item>a{display: block;position: relative;transform-style: preserve-3d;}
   .card-01{width: 274px;height: 172px;}
   .item_front{
position: relative;
z-index: 1;
background: #fff;
-ms-backface-visibility: visible;
-webkit-backface-visibility: visible;
backface-visibility: visible;

-webkit-transform: rotateY(0deg);
 -ms-transform: rotateY(0deg);
 transform: rotateY(0deg);

-webkit-transform-style: preserve-3d;       
 -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;

 -moz-transition: all 0.5s ease-out;
 -o-transition: all 0.5s ease-out;       
 -webkit-transition: all 0.5s ease-out;
 -ms-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;

   }
.item:hover .item_front{
   opacity: 0;
z-index: 0;
-webkit-backface-visibility: visible;
 -ms-backface-visibility: visible;
backface-visibility: visible;

-webkit-transform: rotateY(180deg);
 -ms-transform: rotateY(180deg);
transform: rotateY(180deg);

-webkit-transform-style: preserve-3d;
 -ms-transform-style: preserve-3d;
transform-style: preserve-3d;

-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
 -ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;

}
.item_back{display: block;position: absolute;top: 0;left: 0;z-index: 0;
-webkit-backface-visibility: visible;
-ms-backface-visibility: visible;
backface-visibility: visible;

-webkit-transform: rotateY(-180deg);
-ms-transform: rotateY(-180deg);
transform: rotateY(-180deg);

-webkit-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;

-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;

}
.item:hover .item_back{
z-index: 0;
-webkit-backface-visibility: visible;
-ms-backface-visibility: visible;
backface-visibility: visible;

-webkit-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
transform: rotateY(0deg);

-webkit-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;

-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;

}
/* .reverseWrap .item.card-01>a{perspective: 0px;} */
.item_front #rpaimg_index1{width:550px;}
.item_back #rpaimg_index2{width:550px;}