#intro { background:linear-gradient(#fff 35%, #252525 35%, #252525 50%, #fff 0) no-repeat;}
#intro:before { content:''; position: absolute; height: 100%; width: 100%; bottom: 0; background: url(/2015/images/intro_bottom_bg.png) no-repeat center bottom -20% / cover;}
#intro .W_in { max-width:1100px }
#intro .intro_Head { padding: 1.2% 0 1.5%; background: url('/2015/images/intro_top_bg.png') no-repeat right top -20% / 70%; }
#intro .intro_Head .text_box { padding-top: 3%;}
#intro .Logo { width:10.44vw; min-width: 140px; }
#intro .Layer.LR37 h3 { color:#2b90e2; font-family:'Noto Serif KR', serif; line-height: 1.1;}
#intro .Layer.LR37 h3 strong { color:#ea4e51; }
#intro .Layer.LR37 h3 b { color:#2e8687; }
#intro .Layer.LR37 span { color:#9a9a9a; line-height: 1.2; font-size:12px; }
#intro .Layer.Prod>li>a { width: 100%; height: 100%; border: 7px solid #555; padding: 6%; box-shadow: 0px 0px 10px rgba(0, 0, 0, .3);}
#intro .Layer.Prod>li a { background-image:url('/2015/images/Prod_bg1.png'); background-repeat:no-repeat; background-position:left top; background-size:cover; color: #333;}
#intro .Layer.Prod>li:nth-child(1) h6 { font-size:14px; }
#intro .Layer.Prod>li:nth-child(1) h3 { margin-bottom: 50px; }
#intro .Layer.Prod>li:nth-child(2) { background: linear-gradient(230deg, #ccc, #f9f9f9 50%); background:#fff url('/2015/images/square_bg.png'); background-size:cover; background-position:left top;}
#intro .Layer.Prod>li:nth-child(2)>a { background-image:url('/2015/images/Prod_bg2.png'); background-position:right 5% top 1vw; background-size:50%; }
#intro .Layer.Prod:nth-child(2) h4 small { color:#7c705a; }
#intro .Layer.Prod:nth-child(2) h4 span { color:#3082ba; font-weight: 400;}
#intro .Layer.Prod b { display: block; margin-top: 40px; color:#1486a0; }
#intro .Layer.Prod li:nth-of-type(2) h3 { color:#000; }
#intro .Layer.Prod li:nth-of-type(2) h2 { color:#176da6; line-height: 1; margin-left: 25px;}
#intro .Layer.Prod li:nth-of-type(2) b { margin-top:20px;  }
#intro .Layer.Prod li:nth-of-type(2) p { position: relative; z-index: 1; font-size: 13px; width: 50%; margin-top:20px; margin-bottom: 60px; font-weight: bold; letter-spacing: -1px;}
#intro .Layer.Prod li:nth-of-type(2) small { position: relative; color:#9ab6e5;}
#intro .Layer.Prod:nth-of-type(3) li { margin-top:-5vh; left:25%; /*background: linear-gradient(225deg, #9bd1e9, #ddeff7 50%); */ background-color:#fff; z-index: 1;}
#intro .Layer.Prod:nth-of-type(3) li>a { background-image:url('/2015/images/Prod_bg3.png'); background-position:right 5% top; background-size:50%; }
#intro .Layer.Prod:nth-of-type(3) h6 { line-height: 1.4; color:#6f6f6f}
#intro .Layer.Prod:nth-of-type(3) h6 span {color:#d42;}
#intro .Layer.Prod:nth-of-type(3) small { position: relative; bottom: -30px; margin-left: -20px;}
#intro .Layer.Prod:nth-of-type(3) h2 { margin-bottom: 40px; color:#3266c9; }
#intro .Layer.Prod:nth-of-type(3) p { font-size: 13px; width: 70%; padding-top: 20px; font-weight: bold; letter-spacing: -1px;}
#intro .Layer.Prod:nth-of-type(3) b { margin-top: 0px; float:right; }

.Layer.L2.Mg>li { width: 48%; }
.Layer.Mg>li { margin-right: 4%; }

#intro footer { background:#252525; width: 100%; margin-top: 2.1%; padding: 15px 0;}
#intro footer .Logo { width: 110px; margin-top: 0;}


@media (max-width:768px) {/********** iPad **********/
#intro .Logo { margin-top: 0;}
#intro .Layer.Prod:nth-of-type(3) p { width: 100%;}
}

@media (max-width:540px) {/********** iPad **********/
#intro .intro_Head .text_box span{ display:none;}
.Layer.L2.Mg>li,#intro .Layer.Prod:nth-of-type(3) li { width:100%; left:auto; margin-top:auto;}
}