@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 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:83px; 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{float:left; width:35%; 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{float:right; width:65%; padding:15px 0 15px 35px; border-left:1px solid #7c83a1; box-sizing:border-box; word-break:break-word;}
.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:50px; 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 .txt{width:50%; height:444px;}
.opening .txt .inr{width:570px; height:100%; padding:120px 25px 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:300; letter-spacing:-2px; line-height:1.3em; word-break:break-word;}
.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; word-break:break-word;}
.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;}
.location_map{ margin-top:130px;}
.location_map iframe{width:100% !important;}

/* Á¦Ç°¼Ò°³ */
.product_list{position:relative; max-width:1200px; margin:0 auto; padding:80px 0 50px; box-sizing:border-box; word-break:break-word;}
.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:398px; background-repeat:no-repeat; background-position:50%; background-size:100%;}
.product_list em.img01{background-image:url(../images/content/product_list01.jpg);}
.product_list em.img02{background-image:url(../images/content/product_list02.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:140px; 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;}


@media all and (max-width:1255px){
	.area_subvisual .sub_tit{max-width:100%; padding:83px 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;}
}

@media all and (max-width:1220px){
	.area_subvisual{height:454px;}
	.area_subvisual h2{padding-top:175px;}
	.area_subvisual .sub_tit{padding:63px 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:110px;}
}

@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;}

}

@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:25px 15px 0;}
	.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:338px;}
	.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;}
}
@media all and (max-width:895px){
	.product_list em[class^="img"]{height:298px;}
	.product_list em.img03,
	.product_list em.img04{height:388px;}
}

@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:258px;}
	.product_list em.img03,
	.product_list em.img04{height:338px;}
	.title01{font-size:27px;}
	#content .area_product .txt{margin-top:30px;}
	.img_list{margin:30px auto 0;}
}

@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:228px;}
	.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:30px;}
}

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

@media all and (max-width:445px){
	.product_list em[class^="img"]{height:188px;}
	.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){
	.area_subvisual .sub_tit h3{font-size:25px;}
	.product_list em[class^="img"]{height:138px;}
	.product_list .tit h4,
	#content .tit p{font-size:25px;}
}