@charset "utf-8";

@import url(base.css); /* reset */
@import url(common.css);/* header,footer */

/* 플리킹리스트 */
#flickingList {position:relative;overflow:hidden; margin:0 auto; text-align:center;width:100%; height:845px; top:0px; left:0px;z-index:4; }
#flickingList .cont {position:relative; overflow:hidden; top:0px; width:100%; vertical-align:top;text-align:center; z-index:1;}
#flickingList .layerWrap {position:relative; overflow:hidden; top:0px;width:12000px;  white-space:nowrap;  vertical-align:top;}
#flickingList .layer {float:left; width:100%;  text-align:center; }
#flickingList .bg1 {background:url("../images/main/main_img1.jpg") no-repeat top center;height:845px;}
#flickingList .bg2 {background:url("../images/main/main_img2.jpg") no-repeat top center;height:845px;}

#flickingList .tabWrap {position:absolute;bottom:5px; left:50%; text-align:center;z-index:4;}
#flickingList .tabWrap li {display:inline;}
#flickingList .tabWrap li a {display:inline-block; width:20px; height:20px; background:url("../images/main/btn_off.png") no-repeat;}
#flickingList .tabWrap li a.current {background:url("../images/main/btn_on.png") no-repeat;}
#flickingList .tabWrap li a.btn_play {display:inline-block; width:20px; height:20px; background:url("../images/main/play.png") no-repeat;}
#flickingList .tabWrap li a.btn_stop {display:inline-block; width:20px; height:20px; background:url("../images/main/stop.png") no-repeat;}
#flickingList .tabWrap li a.current.btn_play {display:inline-block; width:20px; height:20px; background:url("../images/main/play_on.png") no-repeat;}
#flickingList .tabWrap li a.current.btn_stop  {display:inline-block; width:20px; height:20px; background:url("../images/main/stop_on.png") no-repeat;}

#flickingList .prevNext {position:absolute;top:344px; width:100%;height:75px;z-index:4;border:0px solid red;}
#flickingList button {overflow:visible; margin:0; padding:0; border:none; background:none; cursor:pointer;}
#flickingList button.prev {position:absolute; top:0px; left:20px; width:75px; height:75px; z-index:4;}
#flickingList button.next {position:absolute; top:0px; right:20px; width:75px; height:75px; z-index:4;}

#flickingList .layerWrap .tit{font-size:40px; color:#fff; padding-top:174px; }
#flickingList .layerWrap .txt{font-size:16px; color:#fff; padding-bottom:21px;}

.m_btn{width:227px; height:38px; border:1px solid #fff; text-align:center; line-height:38px; display:inline-block; z-index:5;}
.m_btn a{color :#fff;}
.c_btn{width:152px; height:26px; text-align:center; line-height:22px; display:inline-block; background:url(../images/main/bg_c_btn.png) no-repeat;}
.c_btn a{color :#fff;}

/* contents */
#main_contents_wrap{position:relative; height:194px; background:url("../images/main/bg_contents.png") no-repeat center top; margin-top:-192px;z-index: 5}
#main_contents_wrap .m_contents{margin:auto; width:1051px; padding-top:45px;}
#main_contents_wrap .m_contents:after{content:""; display:block; clear:both;}
#main_contents_wrap .company{width:283px;padding-bottom:10px; float:left; padding-left:26px; background:url("../images/main/bg_company.png") no-repeat 210px 30px;}
#main_contents_wrap .company h2, #main_contents_wrap .catalogue h2{color:#fff; padding-bottom:15px; font-weight:400;}
#main_contents_wrap .company .txt, #main_contents_wrap .catalogue .txt{width:180px; color:#fff;}
#main_contents_wrap .company .txt a, #main_contents_wrap .catalogue .txt a{color:#fff;}
#main_contents_wrap .catalogue .txt{margin-bottom:5px;}
#main_contents_wrap .products{width:410px;float:left; padding-left:22px;}
#main_contents_wrap .products h2{color:#343434; padding-bottom:10px; font-weight:400;}
#main_contents_wrap .products ul:after{content:""; display:block; clear:both;}
#main_contents_wrap .products li{float:left; padding-left:16px;}
#main_contents_wrap .products li:first-child{float:left; padding-left:0;}
#main_contents_wrap .catalogue{width:283px;;float:left; padding-left:26px; background:url("../images/main/bg_catalogue.png") no-repeat 210px 30px;}
#main_contents_wrap .m_contents h2{font-size:18px;}