/* 공통 */
.sub_con {width:100%; padding:0 15px;}
.sub_title {text-align: center;}
.sub_title h2 {font-size:13px; font-weight: 500; color:#076ab6; font-family: 'Montserrat'; text-transform: uppercase;}
.sub_title h1 {font-size:32px; color:#2a2a2a; font-weight: 400; font-family: 'S-CoreDream-4Regular';}
.sub_title h1::after {content: ''; display: block ; width:1px; height:30px; background: #076ab6; margin:10px auto 0;}
.apos_head {display: inline-block; position: relative; }
.apos_head h1 {font-size:25px; font-weight: 400; color:#fff; font-family: 'S-CoreDream-4Regular'; padding:0 50px; word-break: keep-all; line-height: 40px;}
.apos_head > img {position: absolute; top:-8px; width:30px;}
.apos_head .apos1 {left:0;}
.apos_head .apos2 {right:0;}
.g_bg {text-align: center; padding:50px 0; /*background: url('../img/dot_ptn.png') 50% 50% repeat;*/}
.w_bg {text-align: center; padding: 0 0 50px; background: #fff; margin-top: 30px;}
.sub_p {font-size:15px; font-weight: 300; color:#4b4b4b; letter-spacing: -.5px; line-height: 25px; word-break: keep-all;}
.sub_title2 {position: relative; border-bottom:1px solid #eee; padding-bottom:20px;}
/* .sub_title2::before {content: ''; display: block; position: absolute; top: 50%; transform: translateY(-50%); left: 0; height: 1px; background: #eee;}
.sub_title2::after {content: ''; display: block; position: absolute; top: 50%; transform: translateY(-50%); right: 0; height: 1px; background: #eee;} */
.sub_title2 h2 {font-size:13px; font-weight: 500; color:#076ab6; font-family: 'Montserrat'; margin-bottom:4px;}
.sub_title2 h1 {font-size:22px; font-weight: 400; color:#2a2a2a; font-family: 'S-CoreDream-4Regular';}
/* pro_cer */
.pro_cer ul {display: flex; text-align: center; flex-wrap: wrap; margin-top:40px;}
.pro_cer ul li {width:calc(50% - 5px); margin-right:10px; margin-bottom:10px;}
.pro_cer ul li:nth-child(even) {margin-right:0;}
.pro_cer ul li a {display: block; width: 100%; height: auto; position: relative; box-shadow: 3px 3px 6px 0 rgba(141, 141, 141, 0.16);}
.pro_cer ul li a > img {width: 100%;}
.pro_cer ul li a .hv_plus {  position: absolute; width: 100%; height: 100%; left: 0; top: 0; background: rgba(7,106,182,.8); transition: all .2s ease; opacity: 0; display: flex;
justify-content: center; align-items: center; display: none;}

/*Content CSS*/
#product1 { text-align: center; position: relative;}
.pro_img_box { background: #fff; box-shadow: 6px 6px 10px 0 rgba(141, 141, 141, 0.16); text-align: left;}
.pro_img_box > div {width:100%%;}
.pro_img_box > div:nth-child(1) {overflow: hidden;}
.pro_img_box > div:nth-child(2) {display: flex; justify-content: center; flex-direction: column; padding: 0; text-align: center;}
.pro_img_box .img {text-align: center; margin-bottom: 30px;}
.pro_img_box .img img {max-width: 100%;}
.pro_img_box h2 {font-size:26px; font-weight: 400; color:#2a2a2a; line-height: 36px; font-family: 'S-CoreDream-4Regular';}
.pro_img_box h2::after {content: ''; display: block; width:20px; height:2px; background: #076ab6; margin: 15px auto;}
.pro_img_box > div img {transition: all .4s ease;}
/* article1 */
.pro3_article1 {padding:60px 0 0;}
.pro3_article1 .pro_img_box {margin-top:30px; padding: 40px 20px 40px;text-align: center;}


/* article2 */
.p3_a2_box {margin-top: 70px;}
.p3_a2_box ul {display: flex; justify-content: center; margin-top:40px;}
.p3_a2_box ul li {margin-right:2%; width:80%;}
.p3_a2_box ul li img {width: 100%;}
.p3_a2_box ul li .cbox {display: block;}
.p3_a2_box ul li .cbox img {max-width: 100%;}
.p3_a2_box ul li:last-child {margin-right:0;}
.p3_a2_box ul li p {font-size:18px; font-weight: 300; color:#4b4b4b; letter-spacing: -.3px; margin-top:20px;}
.p3_a2_box h3  {margin-top:20px; font-size:15px; font-weight: 400; color:#076ab6; letter-spacing: -.5px; word-break: keep-all;}
.pro3_article2  .p3_a2_box:first-child {margin-top:0px;}
/* article3 */
.pro3_article3 .sub_title2::before, .pro3_article3 .sub_title2::after {width:460px;}
.pro3_article3 .sub_title2 {margin-top:100px;}
.pro3_article3 .pro_img_box {flex-direction: column; }
.pro3_article3 .pro_img_box > div {width: 100%; text-align: center;}
.pro3_article3 .pro_img_box > div:nth-child(1):hover img {transform: none;}
.pro3_article3 .pro_img_box > div:nth-child(1){display: flex; align-items: center;}
.pro3_article3 .pro_img_box > div:nth-child(2) {padding:60px;}
.pro3_article3 .pro_img_box h2::after {margin:30px auto 40px; }



@media screen and (max-width: 600px) {

}

@media screen and (max-width: 640px) {

}

@media screen and (max-width: 960px) {

}

@media screen and (max-width:1200px) {

}