.inr{max-width:1200px; margin:0 auto; width: 100%}

/* visual */
.area_visual{position:relative; width:100%; height: 620px; background-size: cover; background-position:50%;}
.area_visual .bx-viewport {overflow:inherit!important;}
.area_visual .bx-wrapper,
.area_visual .bx-viewport,
.area_visual .bxslider,
.area_visual .bxslider .slider {height:100% !important;}
.area_visual .bxslider .slider01 {background:url(../images/main/main_visual01.jpg) no-repeat center; background-size:cover;}
.area_visual .bxslider .slider02 {background:url(../images/main/main_visual02.jpg) no-repeat center; background-size:cover;}
.area_visual .bxslider .slider03 {background:url(../images/main/main_visual011.jpg) no-repeat center; background-size:cover;}
.area_visual .inr{margin:0 auto;}
.area_visual .inr ul{position:absolute; right:0; bottom:20%; width:600px;}
.area_visual .inr ul li{position:relative; margin-right:300px; width:300px; height:205px; background:#08495d;}
.area_visual .inr ul li:last-child{margin-left:300px; background:#2881ee; right:0;}
.area_visual .inr ul li a{box-sizing:border-box; display:block; width:100%; height:100%; padding:30px; color:#fff;}
.area_visual .inr ul li a i{position:absolute; right:30px; bottom:30px;}
.area_visual .inr ul li a i img{height:33px;}
.area_visual .inr ul li a h3{margin-bottom:10px; font-size:22px; }
.area_visual .inr ul li a p{font-weight:300; word-break:keep-all;}
.area_visual .inr h2{position:absolute; top:30%; left:19%; font-size:40px; color:#fff; line-height: 1.3; letter-spacing: -1px;}
.area_visual .inr h2 b {display: block}
.area_visual .inr h2 strong {display: block; color: #484848; font-size: 20px; margin-top: 40px; font-weight: 400;}
.area_visual .bxslider .slider03 h2 strong {color: #fff;}
.area_visual .inr h2 p {font-size: 32px; background: -webkit-linear-gradient(top left, #ff6e24, #ef2839); 
-webkit-background-clip: text; -webkit-text-fill-color: transparent; color:#ad0d0d;}
.area_visual .inr h2 p b {font-size: 37px; letter-spacing: -1.2px;}
.area_visual .bx-controls,
.area_visual .bx-controls-direction {position:absolute; left:0; top:0; width:100%; height:75%;}
.area_visual .bx-controls-direction a {position:absolute; top:50%; display:block; width:50px; height:70px; margin-top:-35px; font-size:0px; z-index:99}
.area_visual .bx-controls-direction a.bx-prev {left:80px; background:url(../images/main/btn_prev.png) no-repeat left center;}
.area_visual .bx-controls-direction a.bx-next {right:80px; background:url(../images/main/btn_next.png) no-repeat right center;}

.area_visual .bx-pager {position:absolute; left:19%; bottom:50px; z-index:89}
.area_visual .bx-pager .bx-pager-item {display:inline-block;margin:0 5px;}
.area_visual .bx-pager .bx-pager-item a {display:block; width:40px; height:4px; font-size:0px; background:rgba(255, 255, 255, .3)}
.area_visual .bx-pager .bx-pager-item a.active {background:#fff}















.about_wrap {position: relative; height: 215px; width: 1200px; margin: 0 auto;}
.about_box {width:100%; box-shadow: 0px 3px 7px 0px rgba(108, 108, 108, 0.35); position: absolute; z-index: 999; overflow: hidden;  bottom: 135px;   transform: translate(-0%, -0%);}
.about_box li {float: left; background-color: #fff; padding: 71px 35px;  width: 28%; box-sizing: border-box;}
.about_box li:last-child {background-color: #2f8ba2; width:16%; height: 215px; position: relative;}
.about_box li:last-child a {text-align: center; color: #fff; display: block; font-size: 25px; font-weight: 700;}
.about_box li:last-child i {text-align: left; width: 100%; margin-top: 20px;  transition: all .3s ease-in;}
.about_box li:last-child a:hover i {margin-left: 35px}
.about_box li i {float: left}
.about_box li p {float: right; width: 84%;}
.about_box li p strong {display: block; font-weight: 600; color: #181818; font-size: 16px; letter-spacing: -1px;}
.about_box li p small {color: #6d6d6d; font-size: 14px; display: block; line-height: 1.3; margin-top: 12px; letter-spacing: -0.5px;}


.business_area {width: 100%; margin: 0 auto; position: relative}
.business_area h3 {text-align: center; font-size: 33px; font-family: 'Roboto'; color: #1b1b1b; letter-spacing: -1px; margin-bottom: 60px}
.business_area h3 b {display: block; color: #7d7d7d; font-size: 18px; font-weight: 300; font-family:'Noto Sans KR'; margin-top: 20px;}
.business_area h3 span {color: #2f8ba2; font-weight: 300;}
.business_area h3:before {top: -135px; left:50%; transform:translateX(-50%); display: block; content: ''; position: absolute; width: 7px; height: 102px; background: url(/images/main/line.png)}
.business_area .fix_pc ul {overflow: hidden;}
.business_area .fix_pc ul.first li:first-child {height: 426px; float: left; background-color: #1e7990; color: #fff; width:25%; padding: 85px 60px; box-sizing: border-box;}
.business_area .fix_pc ul.first li:last-child {float: right; width: 75%}
.business_area .fix_pc ul.second li:first-child {float: left; width: 75%;}
.business_area .fix_pc ul.second li:last-child {color: #1d1d1d; float: right; max-width: 400px; height: 426px; padding: 85px 60px;  box-sizing: border-box;}
.business_area .fix_pc ul.second li a {letter-spacing: 1px; font-size: 12px; font-weight: 400; color: #1d1d1d}
.business_area .fix_pc ul.third li:first-child {float: left; background-color: #2f8ba2; color: #fff; max-width: 400px; width:25%; height: 426px; padding: 85px 60px; box-sizing: border-box;}
.business_area .fix_pc ul.third li:last-child {float: right; width: 75%;}
.business_area .fix_pc ul li small {font-family: 'Roboto'; font-size: 16px; font-weight: 300}
.business_area .fix_pc ul li h5 {font-size: 41px; font-weight: 800; letter-spacing: -2px;}
.business_area .fix_pc ul li span {font-size: 17px; font-weight: 400; display: block; line-height: 1.3; margin: 35px 0; }
.business_area .fix_pc ul li a {font-size: 12px; font-weight: 400; color: #fff; letter-spacing: 1px;}
.business_area .fix_pc ul li a img {transition: all .3s ease-in;}
.business_area .fix_pc ul li a img:hover {margin-left: 35px}
.business_area .fix_pc {position: relative; height: 426px;}
.business_area .fix_pc ul.first {position: absolute; right: 0}
.business_area .fix_pc ul.second {position: absolute; left: 0; top: 426px;}
.business_area .fix_pc ul.third {position: absolute; right: 0; bottom:0}
.business_area .fix_mo {display: none;}
.first, .second, .third {font-family:'NanumSquare';}



.question_area {position: relative; height: 780px; margin-top: 120px;}
.question_area ul li:first-child {position: absolute; left: 0; z-index: 1; bottom: 0;}
.question_area ul li:last-child {background-color: #19495f; position: absolute; right: 0; z-index: 0; height: 780px; width:1601px }
.question_area ul li:last-child div {float: right; width: 63%; margin-top: 125px;}
.question_area h3 {text-align: left; font-size: 33px; font-family: 'Roboto'; color: #fff; letter-spacing: -1px; margin-bottom: 45px}
.question_area h3 b {display: block; color: #fff; font-size: 18px; font-weight: 300; font-family:'Noto Sans KR';}
.question_area h3 span {color: #fff; font-weight: 300}
.question_area h3:before {top: 0; display: block; content: ''; position: absolute; width: 7px; height: 100px; background: url(/images/main/line01.png)}
.question_area dt {color: #fff}
.question_area dd {color: #fff; margin-bottom: 30px;}
.question_area dd textarea {width: 655px; overflow-y: hidden; height: 130px;}
.question_area a {margin-left: 25%; margin-top: 10px; display: inline-block; color: #fff; width: 15%; text-align: center; border:1px solid #fff; padding: 18px 10px; box-sizing: border-box}
.question_area a:hover {background-color: #fff; color: #19495f; border: 1px solid #0e4056; transition-duration: 0.5s; font-weight: 500}
.question_area dd .inputthree {width: 20.8%;}
.question_area dd .input_event {width: 20.8%}



@media all and (max-width:1880px){
	.question_area ul li:last-child div {width: 46%}
	.question_area a {margin-left: 38%;}
	
}
@media all and (max-width:1604px){
	.question_area ul li:last-child div {width: 42%}
}
@media all and (max-width:1530px){
	.business_area .fix_pc {display: none;}
	.business_area .fix_mo {display: block}
	.business_area .fix_mo ul {width: 100%; margin: 0 auto; text-align: center; margin-bottom: 35px;}
	.business_area .fix_mo ul li > img {width: 100%}
	.business_area .fix_mo ul li small {font-family: 'Roboto'; font-size: 16px; font-weight: 300}
	.business_area .fix_mo ul li h5 {font-size: 41px; font-weight: 800; letter-spacing: -2px;}
	.business_area .fix_mo ul li span {font-size: 17px; font-weight: 400; display: block; line-height: 1.3; margin: 25px 0; }
	.business_area .fix_mo ul li a {font-size: 12px; font-weight: 400; color: #fff; letter-spacing: 1px;}
	.business_area .fix_mo ul li a img {transition: all .3s ease-in;}
	.business_area .fix_mo ul li a img:hover {margin-left: 35px}
	.business_area .fix_mo ul.first li:last-child {background-color: #2f8ba2; color: #fff; padding: 35px;}
	.business_area .fix_mo ul.second li:last-child {padding: 35px;}
	.business_area .fix_mo ul.second li a {color: #1d1d1d}
	.business_area .fix_mo ul.second li h5 {color: #1d1d1d}
	.business_area .fix_mo ul.third li:last-child {background-color: #2f8ba2; color: #fff; padding: 35px;}
	.question_area {background: url(../images/main/question_area_bg.jpg)no-repeat center; height: 790px;}
	.question_area ul li:first-child {position: inherit}
	.question_area ul li:first-child img {display: none}
	.question_area ul li:last-child {position: inherit; width: 100%; background-color: transparent}
	.question_area ul li:last-child div {width: 100%}
	.question_area h3 {text-align: center}
	.question_area h3:before {left: 50%; transform:translateX(-50%);}
	.question_area a {left: 50%; transform:translateX(-50%); position: absolute; margin-left: 0}
	.question_area div dl {max-width: 656px; margin: 0 auto} 
	.question_area {margin-top: 0}
	.question_area dd .inputthree {width: 32%;}
	.question_area dd .input_event {width: 32%}
}



@media all and (max-width:1280px){
	.area_visual .inr ul{bottom:5%; right:auto; left:50%; transform: translateX(-50%); }
	.area_visual .inr ul li{background:#08495d}
	.about_box {width: 100%; bottom: 0}
	.business_area {margin-top: 135px;}
}
@media all and (max-width:1218px){
	.about_wrap {width: 900px; height: 230px}
	.about_box li:last-child {height: 230px}

}
@media all and (max-width:1173px){
	.about_box li {padding: 70px 15px;}
}

@media all and (max-width:960px){
	.area_visual {height: 400px}
	.area_visual .inr h2 {top:32%; left: 5%;}
	.area_visual .inr h2 strong {margin-top: 20px}
	.area_visual .inr h2 p {font-size: 23px}
	.area_visual .inr h2 p b {font-size: 27px}
	.area_visual .inr h2 strong {font-size: 15px}
	.about_box li {padding: 25px 15px;}
	.about_box li {width: 50%}
	.about_box {height: 304px}
	.about_wrap {height: 304px}
	.about_box li:first-child {background-color: #31a979;}
	.about_box li:first-child i img {-webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1);}
	.about_box li:first-child p strong {color: #fff}
	.about_box li:first-child p small {color: #fff}
	.about_box li:last-child {width: 50%; height: 152px; padding: 37px 15px;}
	.about_box li:last-child i {text-align: center}
	.about_box li:last-child a {font-size: 22px;}
	.about_box li i {float: none; width: 100%; display: block; text-align: center;}
	.about_box li p {float: none; width: 100%; text-align: center;}
	.business_area .fix_mo ul li h5 {font-size: 33px}
	.about_wrap {width: auto}
	.area_visual .bx-pager {bottom:0; left: 5%;}
}


@media all and (max-width:700px){
	.question_area ul {padding: 0 15px; box-sizing: border-box}
	.question_area dd .input_event {width: 100%}
	.question_area dd textarea {width: 100%}
	.question_area dd .inputthree {width: 31.4%}
	.question_area a {width: 45%}	
}

@media all and (max-width:472px){
	.business_area h3 {font-size: 23px}
	.business_area h3 b {font-size: 15px; margin-top: 0}
	.business_area .fix_mo ul li small {font-size: 14px}
	.business_area .fix_mo ul li h5 {font-size: 23px}
	.business_area .fix_mo ul li span {font-size: 14px; margin:15px 0}
	.business_area .fix_mo ul.first li:last-child {padding: 25px}
	.question_area h3 {font-size: 23px}
	.question_area h3 b {font-size: 15px}
	.question_area div dl {font-size: 15px}
}

@media all and (max-width:442px){
	.question_area dd .inputthree {width: 31%}
	.area_visual .inr h2 p {width: 90%;}
	.area_visual .inr h2 p img {width: 100%}
}

@media all and (max-width:372px){
	.question_area dd .inputthree {width: 30.5%}
	.about_box li {float: none; width: 100%}
	.about_box {height: auto}
	.about_wrap {height: 608px}
	.about_box li:last-child {width: 100%}
}