@charset "utf-8";
/* 공통속성 */
@import url("common.css");

/*LayOut*/
#main_img { width:100%; height:515px; text-align:center; background-color: #eef3f6;  background-repeat: no-repeat; background-position: center top; }

#products { width:100%; height:507px; background: url(../images/main/product_background.jpg) #00acbb no-repeat; background-size:100%; }
#products #pro_wrap {width:1200px; height:507px; margin:0 auto; }
#products #pro_wrap  dl.con_box {width:100%; height:448px;}
#products #pro_wrap  dl.con_box dt {height:57px; text-align:center;}
#products #pro_wrap  dl.con_box dt.pro_title {padding:30px 0;}
#products #pro_wrap  dl.con_box dd {height:100%;}
#products #pro_wrap  dl.con_box dd ul { display:grid; grid-template-columns: 1fr 1fr; gap: 20px; }
#products #pro_wrap  dl dd ul li { height:335px;  background:#fff;
	box-shadow:2px 2px 2px #002467;
	-moz-box-shadow:2px 2px 2px #002467; 
	-webkit-box-shadow:2px 2px 2px #002467; 
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#002467, direction=135, strength=2);
}
#products #pro_wrap  dl dd ul li:first-child {margin-left:0;}
#products #pro_wrap  dl dd ul li dl {}
#products #pro_wrap  dl dd ul li dl dt { height:240px !important;}
#products #pro_wrap  dl dd ul li dl dt img {width:100%; }
#products #pro_wrap  dl dd ul li dl dd { display: grid; grid-template-columns:1fr 1fr; aligm-items: center; gap: 30px; height:295px; }
#products #pro_wrap  dl dd ul li dl dd h3 {clear:both; font-family:"Nanum Gothic","맑은고딕"; font-size:21px; text-align:center; padding:0; align-self: center; }
#products #pro_wrap  dl dd ul li dl dd h3 a { color:#000;}
#products #pro_wrap  dl dd ul li dl dd p { color:#5b5b5b; padding:25px 20px; white-space: pre-line; font-size:15px; }



#contents {width:1200px; height:227px; margin:0 auto;}
#contents #cscenter {float:left; width:369px; height:171px; margin-top:45px;}
#contents #quick_menu {float:left; width:380px; height:183px; margin-left:35px; margin-top:45px;}
#contents #quick_menu ul li {float:left; margin-left:4px;}
#contents #quick_menu ul li:first-child {margin-left:0;}
#contents #notice {float:right; width:376px; height:183px; margin-top:45px; }

/* 메인 이미지 */
.wrap_main .spot { height: 515px; text-align: center; position: relative; min-width: 940px; }
.wrap_main .spot_images { height: 515px; overflow: hidden; }
.wrap_main .spot_images .spot_image1 { left: 0px; top: 0px; width: 100%; height: 515px; text-align: center; position: absolute; z-index: 10; }
.wrap_main .spot_images .spot_image2 { left: 0px; top: 0px; width: 100%; height: 515px; text-align: center; position: absolute; z-index: 10; }
.wrap_main .spot_images .spot_image3 { left: 0px; top: 0px; width: 100%; height: 515px; text-align: center; position: absolute; z-index: 10; }
.wrap_main .spot_images .spot_image2 { filter: alpha(opacity=0); opacity: 0; }
.wrap_main .spot_images .spot_image3 { filter: alpha(opacity=0); opacity: 0; }
.wrap_main .spot_images .image { height: 515px; }
.wrap_main .spot_images .image div { margin: 0px auto; width: 939px; height: 515px; text-align: left; position: relative; }
:root .wrap_main .spot_images .image div { width: 940px; }
.wrap_main .spot_image1 { background: #2b9cd7; }
.wrap_main .spot_image2 { background: #157900; }
.wrap_main .spot_image3 { background: #303499; }
.wrap_main .spot_image1 .image { background: url("../images/main/main_image_01.jpg") no-repeat 50% 0px; }
.wrap_main .spot_image2 .image { background: url("../images/main/main_image_02.jpg") no-repeat 50% 0px; }
.wrap_main .spot_image3 .image { background: url("../images/main/main_image_03.jpg") no-repeat 50% 0px; }
.wrap_main .spot_image1 .image div { _background: url(image1.jpg) no-repeat 50% 0; }
.wrap_main .spot_image2 .image div { _background: url(image2.jpg) no-repeat 50% 0; }
.wrap_main .spot_image3 .image div { _background: url(image3.jpg) no-repeat 50% 0; }
.wrap_main .mainshow { z-index: 900 !important; }
.wrap_main .spot_static { left: 50%; top:115px; width: 1200px; height: 1px; margin-left: -1150px; position: absolute; z-index: 1000; }
.wrap_main .spot_static .page { top: 367px; right: 15px; position: absolute; z-index: 1000; }
.wrap_main .spot_static .page a { background: url("../images/main/btn_spot_off.png") no-repeat; border: 0px currentColor; width: 15px; height: 19px; float: left; cursor: pointer; _background: none; _cursor: hand; }
.wrap_main .spot_static .page a:hover { background-image: url("../images/main/btn_spot_over.png"); _background: none; }
.wrap_main .spot_static .page a.on { width: 44px; background-image: url("../images/main/btn_spot_on.png"); _background: none; }
mainshow { z-index:1300 }