*     { margin:0; padding:0; letter-spacing:-0.5px;  font-family:"NotoSans KR";  }
body, html {height: 100%; margin: 0;}

#wrap { width:100%; z-index:1; padding-top:0px; -webkit-text-size-adjust:none; z-index:1; letter-spacing:-0.5pt;}

#main_vi {width:100%; float:left ;   box-sizing:border-box;  text-align:center;  }

#main_vi h1 {font-size:40px;  color:#333; font-weight:800;  line-height:1.1em;  letter-spacing:-1px;}
#main_vi h1 span {color:#dc0314; }
#main_vi p {font-size:20px;color:#333;  font-weight:600; letter-spacing:-1px; width:100%; float:left; margin:5px 0;   }
#main_vi a {font-size:17px; font-weight:400; color:#fff !important; display:inline-block; padding:10px 30px;background-color:#5482c4;margin-top:20px; border-radius:5px; }


.main_title_wrap h3 {width:100%;font-size:1.4em; text-shadow:none; text-align:left; font-weight:600 !important;  color:#333;line-height:1em; letter-spacing:0; margin-bottom:10px; border-bottom:1px solid #ddd;}
.main_title_wrap h3 span {color:#459dd6 !important;}
.main_title_wrap .s_tit  {color:#555 !important; margin-bottom:3px; display:block; font-size:0.9em}
.main_title_wrap h4 {width:100%; text-align:center; font-size:1.5em; font-weight:700;  color:#333; margin-bottom:20px;   }
.main_title_wrap h4 span {font-size:0.65em; width:100%; line-height:40px; font-weight:400; color:#777; display:inline-block}
.line {width:100%; height:1px; background-color:#ddd; display:inline-block; margin:50px 0;}

.in {width:100%; float:left; box-sizing:border-box; padding:2%;}

.main_bn {width:100%; float:left; box-sizing:border-box; border:0px solid #ddd;}
.main_bn li {width:50%; font-size:15px; line-height:1.3em;color:#999; float:left; padding:15px 15px; border-right:1px solid #ddd; box-sizing:border-box;  }
.main_bn li  a {font-size:1em; width:100%; float:left; color:#444; margin-bottom:5px; font-weight:600;}
.main_bn li  a.btn {float:right; width:auto; line-height:30px; width:30px; padding:0; text-align:center; margin-top:-45px;  }


.wrap_bg1 {
     background:url('/common/img/main/bgbg.png') no-repeat center right;
     float:left; width:100%;
     background-attachment: fixed;
     background-repeat: no-repeat;
	 background-size:cover;
	 padding:6% 0;
}

.s_line {width:37px; height:37px; background:url('/common/img/main/icon.png') no-repeat top center; background-size:cover; display:inline-block; margin-bottom:10px;}

p.guide {font-size:15px; color:#666 }

#sub .text_wrap {font-size:17px; color:#666; line-height:1.5em;  padding:50px 0; width:100%; display:inline-block; box-sizing:border-box}
#sub .text_wrap b {font-size:1.6em; color:#333; font-weight:700}

ul.basic {width:100%;}
ul.basic li {width:93%; margin-left:3%; margin-bottom:8px; box-sizing:border-box; font-size:0.97em;  padding-left:10px; list-style:disc}

.product {width:90%;  min-width:1240px;  max-width:1400px;   margin:0 auto;  }

/* section1 fancy-card */
#section1 {position:relative; width:100%; float:left;  }

/*fancy-card*/
*,*:before,*:after{
  box-sizing: border-box;
}
.cf:before,
.cf:after{
  display: table;
  content: " ";
}
.cf:after{
  clear: both
}


/*fancy card styling*/
.cards{width:100%; box-sizing:border-box; float:left; position:relative;}
.cards .bg-overlay{
    background: rgba(0,0,0,0.35);
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    transition: all 200ms linear;
}

.fancy-card{
  width: 50%;
  display: block;
  float: left;
  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0);
  transition: all 250ms ease-in;
  min-height: 185px;
  background-size: cover;
  background-position: center center;
}
.fancy-card.one{
   background-image: url("/common/img/main/bg_img01.jpg");
   height:185px;
}
.fancy-card.two{
  background-image: url("/common/img/main/ph_box_img02.png");
   height:185px;
}
.fancy-card.three{
 background-image: url("/common/img/main/ph_box_img03.png");
  height:185px;
}

.fancy-card.four{
 background-image: url("/common/img/main/ph_box_img04.png");
  height:185px;
}

.fancy-card.five{
	background:url('/common/img/main/bn5-1_img.png') ;
	height:200px;
	  background-size: cover;
  background-position: center center;
}

.fancy-card.six{
	background:url('/common/img/main/bn6-1_img.png') ;
	height:200px;
  background-size: cover;
  background-position: center center;
}

.fancy-card .content{
  padding: 20px 30px;
  color: #fff;
  box-sizing:border-box;
  text-align: center;
  width: 100%;
  height: 100%;
/*  display: flex;*/
/*  flex-wrap: nowrap;*/
/*  align-items: center;*/
/*  flex-direction: row;*/
}
.fancy-card .content h2 {position:relative; color:#fff !important; font-size:1.4em !important; font-weight:600 !important; margin-top:35px; z-index:1;}

.fancy-card .content .primary{
  width: 100%;
  transition: all 250ms ease-out 200ms;
  opacity: 1;
  position:relative;
  z-index:1;
  transform: translate3d(0px, 0px, 1px);
}
.fancy-card .content .secondary{
  position: absolute;
  top:35%;
  opacity: 0;
  left: 0px;
  transform: translate3d(0px, 30px, 1px);
  transition: all 200ms linear 0ms;
 text-align:center; width:100%;

}

.fancy-card .button{
  border: solid 1px #fff;
  padding: 8px 15px;
  display: inline-block;
  border-radius: 3px;
  margin: 12px auto;
  color:#fff;
  font-size:0.92em
  z-index:1;
  position:relative;
}

.fancy-card .button:hover {color:#333; background:#fff;  }



/* section2 Notice */
#section2 {position:relative; width:100%; float:left; }

section.notice {width:100%; padding:5% 2%;   float:left; background-attachment: fixed; text-align:center; background-repeat: no-repeat; box-sizing:border-box;}
.notice_wrap ul li.dot{width:100%; float:left; text-align:left; background:url('/common/img/li_dot.png') no-repeat center left;  line-height:1.8em; margin-left:5px ; padding-left:10px;}
.notice_wrap ul li a{color:#666; margin-left:8px; font-size:0.95em; font-weight:400 }
.notice_wrap ul li a:hover{color:#333;}
.notice_wrap ul li span{color:#999; float:right; font-size:0.9em; font-weight:300; text-shadow:none; margin-right:1%;}



section.notice div {margin:0 auto; color:rgba(255,255,255,.9); font-size:1.1em;  font-weight:500; line-height:1.5em;  }
section.notice div b {font-size:1.3em; letter-spacing:-1px; color:#fff; font-weight:700; display:block; margin-bottom:0;}
section.notice a {text-shadow:none}
.basic_btn {width:185px; line-height:50px; display:inline-block; background-color:#459dd6; color:#fff !important;  font-size:1em; border-radius:3px; font-weight:500;  transition: all 0.3s ease-out;}
a.basic_btn:hover {background-color:#333; color:#fff}


/*m_gall*/
.m_gall_wrap {width:100%; padding:0 2%; box-sizing:border-box;margin:0 auto;}
.m_gall {width:100%; display:flex; justify-content:space-between; align-items:stretch; padding:0 0; box-sizing:border-box;   }
.m_gall div.box {width:48%; }
.m_gall div.box div {width:100%;  box-sizing:border-box; margin-bottom:10px;  }
.m_gall div.box div p.t1 {font-size:19px; font-weight:600; color:#333;}
.m_gall div.box div p.t2 {font-size:16px; width:100%; padding:5px 0; font-weight:400; color:#666; line-height:1.3em; }
.m_gall div.box div p.t3 {font-size:13px; font-weight:400; color:#888;}

.m_gall div.box div p.img_wrap  {width:100%; height:180px;   margin-bottom:10px; border-radius:5px    }
.m_gall div.box:nth-child(1) p.img_wrap {height:180px;}
.m_gall div.box:nth-child(2) p.img_wrap {height:180px;}



/*고객센터*/
section.customer {width:100%; margin:0 auto;display:flex; justify-content: space-between ;}
section.customer div.write {width:100%;    }
section.customer div.write input {width:100%; padding-left:10px; box-sizing:border-box; color:#666;  font-size:16px; height:40px; border:1px solid #ddd; margin-top:-1px;}
section.customer div.write textarea {width:100%; padding-left:10px; box-sizing:border-box; color:#666;  font-size:15px; height:90px; border:1px solid #ddd; margin-top:-1px; padding:10px;}

section.customer div.write a {width:100%; float:right; color:#fff !important; font-size:1em; text-align:center; background-color:#10579a; display:inline-block;  height:60px; padding-top:18px; box-sizing:border-box; border-radius:5px; line-height:1.5em;}


a.btn {font-size:15px !important; color:#fff;  font-weight:300 !important; background: linear-gradient(to right, #dc0314, #dc0314);  color:#fff !important;display:inline-block; padding:4px 30px 6px 30px; margin-top:5px;  }
span.s_btn {display:inline-block; padding:3px 13px; border:1px solid #ddd; box-shadow:1px 1px 2px #ddd; font-size:14px; color:#666; }

#m_top  {width:100%; float:left; box-sizing:border-box; border-bottom:1px solid #ddd;  padding-bottom:15px;}

#wrap ul.util {width:100%; float:left; text-align:right;}
#wrap ul.util li { background-color:#f7f7f7 !important;  font-size:13px; color:#666; padding:8px 0px; width:33.33333%; margin:0;  border-right:1px solid #ddd; box-sizing:border-box; text-align:center; float:left; letter-spacing:0.5px;}

#m_top .m_logo {text-align:center; margin-top:12px; padding-left:3%;}
#m_top ul.nav {width:100%; float:left; text-align:center; position:relative;  margin-top:20px; background-color:#333;  }
#m_top ul.nav li { letter-spacing:0.2px; border-right:1px solid #999;  font-size:18px; font-weight:400;  color:#fff; display:inline-block; padding:0px 60px; line-height:15px; margin:20px 0 20px 0;}
#m_top ul.nav li:last-child {border-right:none;}


#main_vi {position:relative;width:100%; float:left; box-sizing:border-box;  text-align:center;  }

#main_vi h1 {font-size:40px; color:#333; font-weight:800;  line-height:1.1em;  letter-spacing:-1px;}
#main_vi h1 span {color:#dc0314; }
/*#main_vi p {font-size:20px;color:#333;  font-weight:600; letter-spacing:-1px; width:100%; float:left; margin:5px 0;   }*/
#main_vi a {font-size:17px; font-weight:400; color:#fff !important; display:inline-block;; padding:10px 30px; background-color:#5482c4; margin-top:20px; border-radius:5px; }

#sub_vi {width:100%; float:left ; background:url('./img/main_vi_bg.png') no-repeat left; background-size:cover; background-color:#f1f1f1; height:150px;  overflow:hidden; box-sizing:border-box;   color:#fff; border-bottom:1px solid #ddd; text-align:center; }

#sub_vi h1 {font-size:30px;  margin-top:40px; color:#333; font-weight:800;  line-height:1.1em;  letter-spacing:-1px;}
#sub_vi h1 span {color:#dc0314; }
#sub_vi p {font-size:17px;color:#333;  font-weight:600; letter-spacing:-1px; width:100%; float:left; margin:5px 0;   }

.in {width:100%; float:left; box-sizing:border-box; padding:2%; margin-bottom:10px;  }



footer {width:100%; border-top:1px solid #ddd;float:left; background-color:#f7f7f7; border-bottom:none; box-sizing:border-box; font-size:14px; color:#fff !important;  line-height:1.4em; box-sizing:border-box;}
/*footer img {float:left; margin-left:30px; width:140px;}*/
footer p {width:100%; float:right; margin-top:5px; font-weight:300; text-align:left;color:#999; }
footer span {color:#ddd !important; font-weight:300; letter-spacing:0px; line-height:1.3em  }

a.btn {font-size:15px !important; color:#fff;  font-weight:300 !important; background: linear-gradient(to right, #dc0314, #dc0314);  color:#fff !important;display:inline-block; padding:4px 30px 6px 30px; margin-top:5px;  }

span.s_btn {display:inline-block; padding:3px 13px; border:1px solid #ddd; box-shadow:1px 1px 2px #ddd; font-size:14px; color:#666; }

h3.title {font-size:1.3em; font-weight:600; width:80%; text-align:left; color:#333; float:left; letter-spacing:-1px;  box-sizing:border-box;  display:inline-block; }
a.more_btn {float:right; margin-right:5px; font-size:40px; color:#333 !important; font-weight:500; margin-top:20px;}
.color_b{color:#269ace !important;}

.text_box {font-size:0.92em; line-height:1.3em; color:#555;}

.customer ul li {width:100%; float:left; background:#f9f9f9; border:1px solid #ddd; margin-bottom:12px; padding:10px 0;}
.customer .sp_1 {font-size:28px;font-weight:800; color:#2870e8; letter-spacing:0.5px; text-align:center; padding:0;margin-bottom:15px; display:block }
.customer .sp_2 {font-size:24px;  font-weight:500; color:#333; letter-spacing:0px}

.customer h4.h4_tit {width:100%; float:left;  text-align:center; color:#666; font-size:20px; font-weight:400;  line-height:40px; padding:0; }



/*  s1_box_center -gallery */
.m_gall_wrap  { float:left;  border:10px solid #f0d01e; padding:0px; box-sizing:border-box;}
.m_gall_wrap  h2 {font-size:25px; color:#fff;}