@charset "utf-8";

.area_subvisual{position:relative; width:100%; height:514px; background-repeat:no-repeat; background-position:50% 0; background-size:cover;}
.area_subvisual.sub01{background-image:url(../images/content/bg_subvisual01.jpg);}
.area_subvisual.sub02{background-image:url(../images/content/bg_subvisual02.jpg);}
.area_subvisual.sub03{background-image:url(../images/content/bg_subvisual03.jpg);}
.area_subvisual.sub04{background-image:url(../images/content/bg_subvisual04.jpg);}
.area_subvisual.sub05{background-image:url(../images/content/bg_subvisual05.jpg);}
.area_subvisual.sub06{background-image:url(../images/content/bg_subvisual06.jpg);}
.area_subvisual h2{padding-top:215px; font-size:55px; color:#fff; text-align:center; font-weight:300; letter-spacing:-2px;}
.area_subvisual:after{content:''; display:block; position:absolute; left:0; bottom:0; width:100%; height:83px; background:#2548a8;}
.area_subvisual .sub_tit{position:relative; max-width:1200px; margin:0 auto; padding-top:60px; z-index:2; color:#fff;}
.area_subvisual .sub_tit span{display:block; font-weight:400; letter-spacing:1px;}
.area_subvisual .sub_tit h3{display:inline-block; margin-top:10px; padding-right:25px; font-size:45px; font-weight:100; letter-spacing:-2px; vertical-align:middle; background:url(../images/content/sub_tit.png) no-repeat 100% 50%;}
.area_subvisual .sub_tit p{display:inline-block; margin:10px 0 0 25px; font-size:18px; font-weight:300; letter-spacing:-1px; vertical-align:middle;}
.area_subvisual .area_tit{position:relative; max-width:1200px; margin:0 auto; text-align:right; z-index:3;}
.area_subvisual .area_tit li{display:inline-block; position:relative; margin:0 19px;}
.area_subvisual .area_tit li:before{content:''; display:block; position:absolute; left:-20px; top:50%; width:2px; height:6px; margin-top:-3px; background:url(../images/content/bg_snb.png) no-repeat;}
.area_subvisual .area_tit li:first-child:before{display:none;}
.area_subvisual .area_tit li:nth-child(3){margin-right:0;}
.area_subvisual .area_tit li{font-size:14px; color:#fff; font-weight:300; letter-spacing:-1px;}
.area_subvisual .area_tit li:first-child a{letter-spacing:0;}

#content .tit{position:relative; text-align:center;}
#content .tit:after{content:''; display:block; position:absolute; bottom:-95px; left:50%; width:1px; height:80px; margin-left:-0.5px; background:#7c83a1;}
#content .area_product .tit:after{display:none;}
#content .tit p{font-size:42px; color:#111; font-weight:600; letter-spacing:-2.5px; line-height:1.2em;}
#content .tit p span{display:block; font-weight:100;}
#content .tit em{display:block; margin-top:15px; font-size:14px; color:#253162; font-weight:300; letter-spacing:1px;}


/* Àλ縻 */
.greeting{position:relative; max-width:1200px; margin:0 auto; padding:80px 0 50px; box-sizing:border-box;}
.greeting .img{display:block; width:100%; height:347px; margin-bottom:50px; background:url(../images/content/bg_greeting.jpg) no-repeat 50%; background-size:cover;}
.greeting .tit{width:40%; float:left; padding-top:15px; box-sizing:border-box; text-align:left !important;}
.greeting .tit:after{display:none !important;}
.greeting .tit p{display:inline-block; position:relative; font-size:42px; color:#111; font-weight:600; letter-spacing:-2.5px; line-height:1.2em;}
.greeting .tit p span{display:block; font-weight:100;}
.greeting .tit em{display:block; margin-top:15px; font-size:14px; color:#253162; font-weight:300; letter-spacing:1px;}
.greeting .txt{width:60%; float:right; padding:15px 0 15px 35px; border-left:1px solid #7c83a1; box-sizing:border-box;}
.greeting .txt p{margin-top:20px; font-size:17px; color:#555; font-weight:400; letter-spacing:-1px; line-height:1.9em;}
.greeting .txt p:first-child{margin-top:0;}
.greeting .ceo{padding-top:50px; text-align:right; clear:right;}
.greeting .ceo p{font-size:17px; color:#555; letter-spacing:-1px;}
.greeting .ceo span{display:inline-block; margin-left:10px; font-family:'Nanum Pen Script'; color:#111; font-size:60px; vertical-align:middle;}


/* ȸ»ç°³¿ä¿Í ºñÀü */
.opening{position:relative; padding:80px 0; box-sizing:border-box;}
.opening ul{margin-top:140px;}
.opening ul li div{float:right;}
.opening ul li div:first-child{float:left;}
.opening ul li .img{width:50%; height:444px; background-repeat:no-repeat; background-position:50%; background-size:cover;}
.opening ul li.overview .img{background-image:url(../images/content/bg_overview.jpg);}
.opening ul li.vision .img{background-image:url(../images/content/bg_vision.jpg);}
.opening ul li.overview .img.third{background-image:url(../images/content/bg_overview2.jpg);}
.opening .txt{width:50%; height:444px;}
.opening .txt .inr{width:570px; height:100%; padding:120px 0 0 90px; background:#faf9f8; box-sizing:border-box;}
.opening ul li.overview .txt .inr{float:right;}
.opening .txt h4{display:inline-block; position:relative; font-size:40px; color:#253162; font-weight:500; letter-spacing:-2px;}
.opening .txt h4:after{content:''; display:block; position:absolute; right:-44px; top:30px; width:34px; height:37px; background:url(../images/content/ico_overview.png) no-repeat;}
.opening li.vision .txt h4:after{background:url(../images/content/ico_vision.png) no-repeat;}
.opening .txt h4 span{display:block; font-size:14px; font-weight:300; letter-spacing:1px;}
.opening .txt p{margin-top:5px; font-size:28px; color:#111; font-weight:200; letter-spacing:-2px;}
.opening .txt p ~ span{display:block; margin-top:15px; padding:3px 0 3px 20px; font-size:16px; color:#555; font-weight:300; border-left:1px solid #7a819e; letter-spacing:-1.5px;}
.opening li:after,
.opening ul li.overview .txt:after{content:''; display:block; clear:both;}

/* ¿À½Ã´Â±æ */
.location{position:relative; max-width:1200px; margin:0 auto; padding:80px 0;  box-sizing:border-box;}
.location ul{margin-top:30px;}
.location li{margin-bottom:15px; padding:0 0 15px 30px; border-bottom:1px solid #c0c3cf; box-sizing:border-box;}
.location li em{display:inline-block; position:relative; width:80px; padding-left:30px; font-size:16px; color:#111; font-weight:500; vertical-align:middle; letter-spacing:-1px;}
.location li em:before{content:''; display:block; position:absolute; left:0; top:50%; width:19px; height:18px; margin-top:-9px; background-repeat:no-repeat; background-position:50% 0;}
.location li.add em:before{background-image:url(../images/content/ico_add.png);}
.location li.tel em:before{background-image:url(../images/content/ico_tel.png);}
.location li.fax em:before{background-image:url(../images/content/ico_fax.png);}
.location li.mail em:before{background-image:url(../images/content/ico_mail.png);}
.location li span{display:inline-block; font-size:15px; color:#555; font-weight:300;}
.os_mac.root_daum_roughmap{width:100% !important; margin-top:130px;}

/* Á¦Ç°¼Ò°³ */
.product_list{position:relative; max-width:1200px; margin:0 auto; padding:80px 0 50px; box-sizing:border-box;}
.product_list .tit h4{font-size:42px; color:#111; font-weight:600; letter-spacing:-2.5px; line-height:1.3em;}
.product_list .tit h4 span{display:block; font-weight:100;}
.product_list .tit em{display:block; margin-top:15px; font-size:14px; color:#253162; font-weight:300; letter-spacing:1px;}
.product_list em[class^="img"]{display:block; height:300px; background-repeat:no-repeat; background-position:50%; background-size:100%;}
.product_list em.img01{background-image:url(../images/content/bg_business_1.jpg);}
.product_list em.img02{background-image:url(../images/content/bg_business_2.jpg);}
.product_list em.img03{height:568px; background-image:url(../images/content/product_list03.jpg);}
.product_list em.img04{height:568px; background-image:url(../images/content/product_list04.jpg);}
.product_list .txt{margin-top:0; text-align:center;}
#content .area_product .txt{margin-top:50px;}
.product_list .txt h5{margin-top:50px; padding-top:38px; font-size:17px; color:#253162; font-weight:500; letter-spacing:1.5px; text-align:center; background:url(../images/content/product_tit.png) no-repeat 50% 0;}
.product_list .txt .check_list{display:inline-block; margin:30px auto 10px; text-align:left;}
.product_list .txt li{margin-top:10px;}
.product_list .txt li:first-child{margin-top:0;}
.product_list .txt .check_list span{display:inline-block; width:23px; height:23px; margin-right:10px; border:1px solid #253162; box-sizing:border-box; font-size:15px; color:#253162; font-weight:700; text-align:center; line-height:1.5em;}
.product_list h5 + .box{margin-top:10px; padding:20px; border:1px solid #c0c3cf; box-sizing:border-box; text-align:left;}
.area_product{margin:0 0 50px;}
.area_img{display:block; width:850px; height:auto; margin:0 auto;}
.area_img img{width:100%; height:auto;}
.img_list{margin:50px auto 0; max-width:852px;}
.img_list:after{content:''; display:block; clear:both;}
.img_list > li{margin:0 40px 40px 0; margin-top:0 !important; float:left; width:405px; box-sizing:border-box; vertical-align:top;}
.img_list > li:nth-child(2){margin:0 0 40px 0;}
.img_list > li:nth-child(4){margin:0;}
.img_list > li.border{border:1px solid #eee;}
.img_list > li img{width:100%; height:auto;}
.title01{display:block; padding:20px 5% 0; word-break:keep-all; font-size:30px; font-weight:300; color:#333; line-height:1.5em;}

.technology {overflow:hidden; width:103.3%; margin:30px 0 0 0;}
.technology dl {width:30%; border:1px solid #dedede; margin:0 3.3% 30px 0; float:left;}
.technology dl dt {width:100%; margin:0 30px 0 0; }
.technology dl dt img {width:100%;}
.technology dl dd {width:100%; text-align:center; box-sizing:border-box; padding:20px;}
.technology dl:nth-of-type(3n) {margin:0 0 0 0;}


/* product */
.product.ready {position:relative; max-width:1200px; margin:0 auto; padding:150px 0 50px; box-sizing:border-box; text-align:center;}
.product.ready dl {margin-top:25px;}
.product.ready dl dt {font-size:42px; letter-spacing:-2.5px; color:#111; font-weight:600; line-height:1.2em;}
.product.ready dl dd {margin-top:15px; color:#555; font-size:16px; font-weight:300; letter-spacing:-1.5px; }

.product_cont{width:1200px; margin:140px auto 0;}
.product {position:relative; margin:0 auto; padding:150px 0 80px; box-sizing:border-box; text-align:center; letter-spacing:-1.5px; line-height:1.9em}
.product * {box-sizing:border-box}
.product .imgList:after {clear:both; content:''; display:block;}
.product .imgList img {max-width:100%;}
.product .part1 {margin-top:140px;}
.product .part1 .imgList {max-width:1200px; margin:0 auto; box-shadow:0 0 15px rgba(0, 0, 0, .1)}
.product .part1 .imgList li {float:left; width:25%;}
.product .part1 .textList {margin-top:-125px; background:#253162;}
.product .part1 .textList ul {max-width:1200px; margin:0 auto;}
.product .part1 .textList ul:after {clear:both; content:''; display:block;}
.product .part1 .textList ul li {float:left; width:33.33%; padding:50px 0px; color:#fff; font-weight:300; font-size:16px;}
.product .part1 .textList ul li:nth-child(2) {background:#343f6b}
.product .part1 .textList ul li i { display:inline-block; margin-bottom:10px;}

.product .part2>p {padding:80px 0; font-size:16px; font-weight:300; color:#111; word-break:keep-all}
.product .part2 .imgList {position:relative; max-width:1200px; margin:0 auto; padding:30px; background:#faf9f8;}
.product .part2 .imgList:before {position:absolute; left:50%; top:0; content:''; display:inline-block; width:20px; height:20px; margin-left:-10px; margin-top:-10px; background:#faf9f8; transform:rotate(-45deg);}
.product .part2 .imgList li {float:left; width:25%;}
.product .part2 .textList {position:relative; max-width:1200px; margin:0 auto;  margin-top:80px; padding:30px; border:1px solid #c0c3cf; background:#fff}
.product .part2 .textList:before {position:absolute; left:50%; top:0; content:''; display:inline-block; width:20px; height:20px; margin-left:-10px; margin-top:-10px; background:#c0c3cf; transform:rotate(-45deg); z-index:-9;}
.product .part2 .textList:after {clear:both; content:''; display:block;}
.product .part2 .textList ul {float:left; width:calc((100% - 60px)/2);}
.product .part2 .textList ul+ul {margin-left:60px}
.product .part2 .textList ul li {text-align:left; font-size:16px; color:#111; font-weight:300; padding-bottom:10px; margin-bottom:10px; border-bottom:1px dashed #c0c3cf}
.product .part2 .textList ul:first-child li:last-child {margin-bottom:0; padding-bottom:0; border-bottom:none}
.product .part2 .textList ul li em {display:inline-block; width:20px; height:20px; margin-right:20px; font-size:12px; font-weight:400; color:#fff; text-align:center; line-height:20px; border-radius:100%; background:#2548a8;}



/* Ãß°¡ */
#content .txt_st01 ul li{position:relative; padding-left:12px;}
#content .txt_st01 ul li:before{content:''; display:block; position:absolute; top:10px; left:0; width:5px; height:5px; background:#253162; border-radius:50%;}
#content .txt_st01 p+p{margin-top:20px;}

.txt_area_st01{overflow:hidden; width:100%;}
.txt_area_st01 .img{float:left; margin-right:18px; width:400px; background:#eee; border:1px solid #c0c3cf;}
.txt_area_st01 .img img{width:100%;}
.txt_area_st01 .txt{float:left; padding:0 20px; width:calc(100% / 1 - 420px); box-sizing:border-box;}

.box_wrap{overflow:hidden;}

.product table.table thead th{background:#2548a8 !important; color:#fff;}
.product table.table tbody tr th{background:#f5f5f5 !important;}

.tit_st01{margin-bottom:40px; padding-top:38px; font-size:20px; color:#253162; font-weight:600; letter-spacing:1px; text-align:center; background:url(/images/content/product_tit.png) no-repeat 50% 0;}
.business .box_wrap{margin-bottom:50px;}







@media all and (max-width:1255px){
	.area_subvisual .sub_tit{max-width:100%; padding:60px 15px 0; box-sizing:border-box;}
	.area_subvisual .area_tit{max-width:100%; padding:0 15px; box-sizing:border-box;}
	.greeting{max-width:100%; padding:50px 15px 50px; box-sizing:border-box;}
	.opening{padding:50px 0;}
	.opening .txt{height:364px;}
	.opening ul li .img{height:364px;}
	.opening .txt .inr{width:100%; padding:70px 50px;}
	.location{max-width:100%; padding:50px 15px; box-sizing:border-box;}
	.product_list{max-width:100%; padding:50px 15px; box-sizing:border-box;}
	.product {max-width:100%; padding:50px 0px; box-sizing:border-box;}
	.product .part2>p {padding:70px 0;}
	.product .part2>p br {display:none;}
	.product .part2 .textList {margin-top:70px;}

    .product_cont{width:100%;}
}

@media all and (max-width:1220px){
	.area_subvisual{height:454px;}
	.area_subvisual h2{padding-top:175px;}
	.area_subvisual .sub_tit{padding:40px 15px 0;}
}

@media all and (max-width:1200px){
	.greeting .tit{width:35%;}
	.greeting .txt{width:65%;}
	.greeting .txt p br{display:none;}
	.product_list .txt{margin-top:0;}
	#content .product .tit {padding:0 15px;}
	#content .product .tit em {word-break:keep-all; line-height:1.7em;}
	.product .part1 .imgList {margin:0 15px;}
	.product .part2 {padding:0 15px;}

}

@media all and (max-width:1100px){
	.greeting .img{margin-bottom:20px;}
	.greeting .tit{float:none; width:100%;}
	.greeting .txt{float:none; width:100%; margin-top:20px; padding:0; border-left:0;}
	.greeting .txt p{margin-top:10px; line-height:1.6em;}
	.greeting .tit p span{display:inline-block !important;}
	.greeting .ceo{padding-top:20px;}
	
	.product .part1 .textList {margin-top:-100px;}
	.product .part2 .textList ul {float:none; width:100%;}
	.product .part2 .textList ul+ul {margin-left:0}
	.product .part2 .textList ul:first-child li:last-child { padding-bottom:10px; margin-bottom:10px; border-bottom:1px dashed #c0c3cf}
	.product .part2 .textList ul:last-child li:last-child {margin-bottom:0; padding-bottom:0; border-bottom:none}

    .txt_area_st01 .img{margin-right:10px; width:300px; background:#eee; border:1px solid #c0c3cf;}
    .txt_area_st01 .txt{padding:0 15px; width:calc(100% / 1 - 320px); box-sizing:border-box;}

}

@media all and (max-width:1030px){
	.opening .txt{width:90%; height:100%;}
	.opening ul li .img{width:90%; height:334px;}
	.opening .txt .inr{margin-bottom:0; padding:50px;}
	.opening ul li div{margin-bottom:25px;}
	.opening .txt p ~ span br{display:none;}
}

@media all and (max-width:1024px){
	#content{padding-top:50px; box-sizing:border-box;}
	.area_subvisual{height:364px;}
	.area_subvisual h2{padding-top:135px; font-size:50px;}
	.area_subvisual .sub_tit{padding:0 15px;}
	.area_subvisual .sub_tit h3{margin-top:0; font-size:40px;}
	.area_subvisual .sub_tit p{font-size:16px; margin:0 0 0 25px;}
	.area_subvisual .area_tit{margin-top:29px;}
	.area_subvisual:after{height:53px;}
	.product_list em[class^="img"]{height:160px;}
	.product_list em.img03,
	.product_list em.img04{height:438px;}
}
@media all and (max-width:950px){
	.area_img{width:100%;}
	.img_list > li{margin:0 4% 4% 0; width:48%;}
	.img_list > li:nth-child(2){margin:0 0 4% 0;}
	.img_list > li:nth-child(4){margin:0;}

	.product .part1 .textList {margin-top:-70px;}
	
}
@media all and (max-width:895px){
	.product_list em[class^="img"]{height:160px;}
	.product_list em.img03,
	.product_list em.img04{height:388px;}
    
    .txt_area_st01 .img{float:none; margin:0 auto 20px; width:400px;}
    .txt_area_st01 .txt{float:none; padding:0 10px 0 0; width:100%;}
}

@media all and (max-width:768px){
	#content .tit p,
	.product_list .tit h4{font-size:35px;}
	.product_list .tit h4 span{}
	#content .tit em{margin-top:10px; font-size:13px;}
	.opening ul{margin-top:120px;}
	.greeting .img{height:267px;}
	.opening .txt .inr{padding:30px;}
	.opening .txt{width:100%;}
	.opening .txt h4{font-size:35px;}
	.opening .txt p{margin-top:0; font-size:25px; line-height:1.2em;}
	.opening ul li .img{width:100%; height:264px;}
	.opening .txt p ~ span{margin-top:10px; padding:3px 0 3px 10px;}
	.product_list em[class^="img"]{height:160px;}
	.product_list em.img03,
	.product_list em.img04{height:338px;}
	.title01{font-size:27px;}
	#content .area_product .txt{margin-top:0;}
	.img_list{margin:30px auto 0;}
    
    .tit_st01{margin-bottom:28px; font-size:18px;}


	.product.ready dl dt {font-size:35px;}
	.product.ready dl dd {margin-top:10px;}
	.product .part1 .imgList li {width:50%;}
	.product .part1 .imgList li img {width:100%;}
	.product .part1 .textList ul li {width:100%; padding:30px;}
	.product .part1 .textList ul li i {margin-bottom:0}
	.product .part2 {padding:0 15px;}
	.product .part2 .imgList li {width:50%;}
	.product .part2 .imgList li img {width:100%;}

    .business .box_wrap{margin-bottom:30px;}
}

@media all and (max-width:645px){
	#content .tit p,
	.product_list .tit h4{font-size:30px; word-break:keep-all;}
	.product_list em[class^="img"]{height:160px;}
	.product_list em.img03,
	.product_list em.img04{height:278px;}
	.area_subvisual{height:334px;}
	.area_subvisual .area_tit{display:none;}
	.area_subvisual:after{display:none;}
	.area_subvisual h2{font-size:40px;}
	.area_subvisual .sub_tit{padding:50px 15px 0;}
	.area_subvisual .sub_tit p{display:none;}
	.area_subvisual .sub_tit h3{font-size:35px;}
	.title01{font-size:24px;}
	.product_list .txt h5{margin-top:0;}
	
	.technology {overflow:hidden; width:100%; margin:30px 0 0 0;}
	.technology dl {width:100%; border:1px solid #dedede; margin:0 0 30px 0; float:left; box-sizing:border-box;}
	.technology dl dt {width:100%; margin:0 30px 0 0; }
	.technology dl dt img {width:100%;}
	.technology dl dd {width:100%; text-align:center; box-sizing:border-box; padding:20px;}
	.technology dl:nth-of-type(0) {margin:0 0 0 0;}
    .technology dl:nth-of-type(3n){margin-bottom:30px;}

	.product.ready dl dt {font-size:30px;}
	.product .part2>p {padding:50px 0; }
	.product .part2>p br {display:none;}
	.product .part2 .imgList {padding:20px;}
	.product .part2 .textList {margin-top:50px; padding:20px;}
	.product .part2 .textList ul li {position:relative; padding-left:35px; word-break:keep-all; line-height:1.5em;}
	.product .part2 .textList ul li em {position:absolute; left:0; top:5px;}
    
    .product_cont .img_box img{width:100%;}
    
    .txt_area_st01 .img{width:100%; box-sizing:border-box;}

}

@media all and (max-width:450px){
	.product_list .tit h4,
	#content .tit p{font-size:28px;}
	#content .tit em{font-size:12px;}
	.product_list em[class^="img"]{height:160px;}
	.title01{font-size:22px;}

	

}

@media all and (max-width:445px){
	.product_list em[class^="img"]{height:160px;}
	.area_subvisual h2{font-size:35px;}
	.area_subvisual .sub_tit h3{font-size:30px;}
	.product_list .tit h4 span{font-size:25px;}
}

@media all and (max-width:365px){
	.product_list em[class^="img"]{height:160px;}
}