body {font-size: 100%; letter-spacing: -0.025em; -webkit-text-size-adjust:none;} .inner {max-width: 1260px; margin:0 auto;} div {margin:0;padding:0; box-sizing: border-box;} .w1 {width: 10%;} .w2 {width: 20%;} .w3 {width: 30%;} .w4 {width: 40%;} .w5 {width: 50%;} .w6 {width: 60%;} .w7 {width: 70%;} .w8 {width: 80%;} .w9 {width: 90%;} #hd_pop {max-width: 100%;} #hd_pop * {max-width: 100%} #w_foot .w_foot_link i , #section3 .w_notice li a i,.w_klist .w_ktext a i ,#section2 .listslide #listslide li a u i, .iconset {background: url(../images/iconset.png) no-repeat; overflow: hidden; text-align: left; text-indent: -9999px; overflow: hidden; display: inline-block;} /*헤더*/ #w_hd {background: #fff; position: fixed; top:0; left: 0; right: 0; z-index: 99; box-shadow: 0 2px 2px rgba(0,0,0,0.3); border-top:3px solid #80b0d5} #w_hd .inner {position: relative;} #w_hd:before, #w_hd:after {content: '';display: block; clear: both;} #w_logo {padding:28px 0 0; position: absolute; top:0; left:0;} #w_gnb {padding: 28px 0px 0 0; float: right} #w_gnb > nav > ul {font-size: 0} #w_gnb > nav > ul > li {display: inline-block; font-size: 1rem; position: relative;} #w_gnb > nav > ul > li > a {font-size: 20px; padding:28px 16px 20px; color:#222; display: block; font-weight: bold; word-break: keep-all;} #w_gnb > nav > ul > li:hover > a, #w_gnb > nav > ul > li > a:focus,#w_gnb > nav > ul > li.current > a {color:#156bb2;} #w_gnb > nav > ul > li > ul {display: none; position: absolute; width: 192px; border-top:1px solid #ddd; top:100%; left:50%; margin-left: -96px;box-shadow: 2px 3px 15px rgba(0,0,0,0.3);padding:2px;background: #fff} #w_gnb > nav > ul > li > ul > li {} #w_gnb > nav > ul > li > ul > li > a {background: #fff; border-top:0; display: block; padding:12px 10px ; text-align: center; font-size: 15px; word-break: keep-all;} #w_gnb > nav > ul > li:nth-child(3) > ul > li > a {line-height: 1.1;padding:6px 10px ;} /*#w_gnb > nav > ul > li > ul > li > a:hover, #w_gnb > nav > ul > li > ul > li > a:focus, #w_gnb > nav > ul > li > ul > li.current > a {color:#156bb2;}*/ #w_gnb > nav > ul > li > ul > li > a:hover {background:#156bb2;color:#fff;} .w_tel {padding:12px; color:#fff; border:1px solid #fff; display: inline-block; position: absolute; right: 0; top:27px; border-radius:10px;background: #156bb2} #w_gnb > nav > ul > li > ul > li > a i {color:#888; font-size:0.85em; line-height: 0.8;} #w_gnb > nav > ul > li > ul > li > a:hover i {color:#80b0d5} .mbnav, .w_mbtel {display: none;} #w_topmenu {position:absolute; right: 20px; top:8px;} #w_topmenu ul {font-size:0} #w_topmenu ul li {display:inline-block; vertical-align: top; margin-left:8px;} #w_topmenu ul li a {display:inline-block;vertical-align:top; color:#555; padding:2px 8px 2px 4px; border-radius: 4px; font-size:12px; border:1px solid #ddd; background: #f9f9f9} #w_topmenu ul li a i {display: inline-block; width: 24px; margin-right: 6px;} #w_topmenu ul li a i img {width: 100%} #w_topmenu ul li a:hover {color:#156bb2; border:1px solid #156bb2; background: #fff} /*#w_topmenu ul li a.tbtn01 {background:#0c658e;} #w_topmenu ul li a.tbtn02 {background:#4dc312;} */ #section1 {overflow: hidden; position: relative;} #mainslide {position: relative;} #mainslide .vs01 {background: url(../images/vs01.jpg) no-repeat 50% 50%;} #mainslide .vs02 {background: url(../images/vs02.jpg) no-repeat 50% 50%;} #mainslide .vs03 {background: url(../images/vs03.jpg) no-repeat 50% 50%;} #mainslide .slide {background-size: cover; min-height: 700px;} #mainslide,#mainslide .slide {min-height: 700px;} .distb {display: table; width: 100%; height: 100%; overflow: hidden;} .distbcell {display: table-cell; vertical-align: middle; text-align: center;} .scrollbarbtn {position: absolute; bottom:60px; left:90%; margin-left: -45px; z-index: 60; cursor: pointer; z-index: 60} .section {overflow: hidden;} .minititle {font-family: arial;} #mainslide .slide {color:#fff;} #mainslide .slide .minititle {padding-bottom:100px; letter-spacing:0.8em; font-weight: 100; font-size: 14px; position: relative; display:block} #mainslide .slide .minititle:after {position: absolute; content: ''; width: 40px; height: 2px; left:50%; top:40px; border:1px solid #fff; border-radius: 10px; margin-left:-20px} #mainslide .slide .slogan {padding:30px 0 20px; font-size:48px; font-weight: 64;text-shadow: 0 0 24px rgba(0,0,0,0.8)} #mainslide .slide .slogan strong {display:block; font-size:68px} #mainslide .slide .slogan strong i {font-size: 0.75em; font-style: normal;} #mainslide .vs03.slide .slogan strong {line-height: 0.8em; padding-bottom: 10px} #mainslide .vs01.slide .slogan strong {font-size: 88px; padding-bottom: 26px} .w_btn {display: inline-block;} #mainslide .slide .slogan .sss {font-size: 28px; word-break: keep-all; max-width: 920px;display: inline-block; padding-top: 10px; line-height: 1.4} #mainslide .slide .w_btn {padding:14px 30px; color:#fff; border:1px solid #fff; font-size:14px; border-radius: 10px;border:0; border:1px solid #fff;box-shadow: 0 0 30px rgba(0,0,0,0.4)} .label-main {font-size: 24px; border:1px solid #fff; border-radius: 30px; padding:10px 20px; background: rgba(0,0,0,0.2); box-shadow: 2px 2px 8px rgba(0,0,0,0.2);color:#fff ; letter-spacing: -0.025em} .bx-wrapper {height: 100%} .bx-viewport {z-index: 1;} .bx-controls {position: absolute; bottom:0; left: 0; right: 0; top:0;} .bx-pager {position: absolute; bottom:100px; left: 0 ;right: 0;text-align: center; z-index: 60} .bx-pager .bx-pager-item {display: inline-block; margin:0 8px; vertical-align: bottom;} .bx-pager .bx-pager-item a {width: 14px; height: 14px; opacity: 0.3; background: #fff; display: block; text-align: left; overflow: hidden; text-indent: -9999px; transition: all 0.3s ease; border-radius:50%} .bx-pager .bx-pager-item a.active { opacity: 1;} .bx-controls-direction {position: absolute; left:0;right: 0;top:0;bottom: 0} .bx-controls-direction a {position: absolute; width: 68px; height: 68px; display: block;overflow: hidden; text-indent: -9999px; background:rgba(0,0,0,0.3) url(../images/arrow.png) no-repeat; z-index: 60; top:50%; border:1px solid #fff; opacity: 0.4;background-size: 100%;border-radius:50%} .bx-controls-direction a.bx-prev {left:20px;background-position: 0 0; } .bx-controls-direction a.bx-next {right: 20px; background-position: 0 -68px; } .bx-controls-direction a:hover {opacity: 0.7;} .w_title {text-align: center; color:#fff; padding-top: 140px;} .w_title .minititle {letter-spacing: 0.8em; position: relative; font-size:12px} /*.w_title .minititle:before {position: absolute; content: ''; width: 1px; height: 90px; background: #ededed; top: -106px; left:50%;}*/ .w_title h2 {font-size: 52px; font-weight: normal; padding-top:20px} #section0 {background: #f9f9f9; position: relative;} #section0 ul {padding: 70px 20px 140px; font-size: 0; text-align: center; position: relative; z-index: 2} #section0 ul {display: flex;justify-content: center; } #section0 ul li {padding:0 20px; width: calc(100%/3);} #section0 ul li a {display: block; text-align: center; color:#333; font-size: 1.4rem; font-weight: normal; box-shadow: 0 0 12px rgba(0,0,0,0.1);background: #fff; border-radius: 15px; overflow: hidden; padding-bottom: 14px} #section0 ul li a i {display: none; border:1px solid #ddd; border-radius: 20px; padding:10px 20px; font-size: 14px; background: #fff; margin-top: 50px; font-style: italic; color:#333} #section0 ul li span {display: block; width: 100%; height: 200px;transition: all 0.3s ease; margin-bottom: 14px} .new_bg01 {background: url(../images/mimg01.jpg) no-repeat 50% 50%; background-size: 100%} .new_bg02 {background: url(../images/mimg02.jpg) no-repeat 50% 50%; background-size: 100%} .new_bg03 {background: url(../images/mimg03.jpg) no-repeat 50% 50%; background-size: 100%} #section0 ul li:hover .new_bg01 {background-size: 110%} #section0 ul li:hover .new_bg02 {background-size: 110%} #section0 ul li:hover .new_bg03 {background-size: 110%} #section2 {background: #156bb2 no-repeat 50% 0; background-size: cover;position: relative;} #section2 .listslide {padding: 70px 0 140px; } #section2 .listslide #listslide li a {display: block; background: #fff; color:#666; text-align: center; padding-bottom: 40px; font-size: 0.85em; line-height: 1.4; overflow:hidden;border-radius:10px; box-shadow:0 0 10px rgba(0,0,0,0.2); width:280px; height: 320px; position: relative;} #section2 .listslide #listslide li a strong {font-size: 18px; display: block; color:#222; background: #fff; padding:15px; position: absolute;left:0;right: 0;top: 0; word-break: keep-all; box-shadow: 0 3px 3px rgba(0,0,0,0.2); line-height: 1.2} #section2 .listslide #listslide li a u {background: #fff; border:1px solid #d0d0d0; padding:14px 0px; display: block; width: 200px; margin:30px auto 0; border-radius:10px; text-decoration: none; transition: all 0.3s ease;} #section2 .listslide #listslide li a u i {background-position: 0 0; display: inline-block; width:24px; height: 8px; margin-left: 20px;} #section2 .listslide #listslide li a:hover {overflow: hidden; position: relative; z-index: 55} #section2 .listslide #listslide li a:hover u {background: #156bb2; border:1px solid #0d3e95; color:#fff;} #section2 .listslide #listslide li a:hover u i {background-position: 0 -8px;} #section2 .listslide #listslide li a img {width:170px} #section2 .listslide #listslide li a strong i {color:#888; font-weight: normal; font-size: 0.85em; line-height: 1.1} #section3 {min-height: 600px; background:#fff} #section0 .w_title , #section3 .w_title {color:#222} #section3 .w_notice {border-top:1px solid #d0d0d0; margin-top: 50px; padding-bottom: 100px;} #section3 .w_notice li {border-bottom: 1px solid #d0d0d0} #section3 .w_notice li a {display: block;padding:34px 0; font-size: 22px; color:#555; position: relative; border-radius10px;} #section3 .w_notice li a span {display: inline-block; width: 200px; text-align: center; color:#156bb2; font-size: 18px;} #section3 .w_notice li a:hover {color:#156bb2; text-decoration: underline;} #section3 .w_notice li a i {width: 34px; height: 34px; background-position: 0 -234px; float: right; margin-right: 50px; vertical-align: middle;} #section3 .w_notice li a:hover i {background-position: 0 -200px;} #section4 {background: #fff;padding-bottom: 100px; position: relative;} #section4 .w_title {color:#222;} #section4 .w_bslogan {color:#222; font-size: 33px; text-align: center; padding:20px 0 74px;} #section4 .w_bslogan strong {color:#222; display: block; padding-top: 0px; font-size:44px; } #section4 ul { margin:0px auto 100px;display: flex;flex-direction: row; align-items: flex-start; flex-wrap: wrap; justify-content: center; max-width:1200px; } #section4 ul li {display:inline-flex; height: 200px;width:370px; background: #fff; border:1px solid #156bb2; border-radius: 20px; box-shadow:0 0 15px rgba(0,0,0,0.2); margin:10px} /*#section4 ul li.low01 {background: #18b4b6 url(../images/b01.jpg) no-repeat 100% 0;} #section4 ul li.low02 {background: #1976be url(../images/b02.jpg) no-repeat 100% 0;} #section4 ul li.low03 {background: #4c57aa url(../images/b03.jpg) no-repeat 100% 0;}*/ /*#section4 ul li.low01 a {color:#bdf7f2;}*/ /*#section4 ul li.low02 a {color:#8fc9f6;}*/ /*#section4 ul li.low03 a {color:#9da7ec;}*/ #section4 ul li a {display: block; height: 190px; color:#fff;padding-left: 150px; position: relative;} #section4 ul li a strong {padding-top: 60px; font-size: 34px; font-weight: normal;display: block;color:#fff;} .snsarea {background: #80b0d5;position: fixed;bottom:0;left: 0;right: 0;z-index: 90; box-shadow: -1px -1px 3px rgba(0,0,0,0.2)} .snsarea > div {padding:10px;} .snsarea_flex {display: flex;justify-content: space-between;} .snsarea_flex .w80 {width: 74%} .snsarea_flex .w20 {width: 24%} .snsarea ul {background: #fff; border-radius: 40px; display: flex;} .snsarea ul li {width: 25%; text-align: center; position: relative;} .snsarea ul li > a {display: block; padding:10px 0px;font-size: 16px} .snsarea ul li > a i {width: 24px; display: inline-block; margin-right: 10px} .snsarea ul li > a i img {width: 100%} .snsarea_flex .w20 ul {background: #156bb2} .snsarea_flex .w20 ul li {width: 50%} .snsarea_flex .w20 ul li > a {color:#fff} .snsarea_flex .w20 ul li > a:hover {text-decoration: underline;} .snsarea_flex .w80 ul li > a:hover {color:#156bb2;text-decoration: underline;} .incon_layer {position: absolute; bottom:100%; left:0; background: #fff; margin-bottom: 5px; right: 0; padding:20px; border-radius: 10px; box-shadow: 0 0 5px rgba(0,0,0,0.3);display: none;} .incon_layer h3 {color:#156bb2;font-size: 20px; } .incon_layer strong {font-size: 24px; color:#222;} .incon_layer h4 {color:#156bb2; padding: 14px 0 4px; font-size: 18px;} .incon_layer p {color:#666; line-height: 1.5; font-size: 14px;} .incon_layer .naver_btn_area {display: flex;justify-content: space-around;} .incon_layer .naver_btn_area a {display: inline-block; font-size: 14px;} .incon_layer .naver_btn_area a img {display: block; margin-bottom: 6px;} .incon_layer-close_btn {position: absolute; top:8px; right: 8px; width: 26px; height: 26px; color:transparent; border:0; display: block; text-indent: -999px; overflow: hidden; background: url(/images/closse.png) no-repeat 50% 50%; background-size: 100%} #w_foot {padding-top: 0px; padding-bottom: 50px} #w_foot .w_fnb {background: #fff; overflow: hidden; border-top:1px solid #ddd; border-bottom: 1px solid #ddd;} #w_foot .w_fnb ul {overflow: hidden; text-align: center; font-size: 0} #w_foot .w_fnb ul li {padding:15px 0; display: inline-block; font-size: 1rem} #w_foot .w_fnb ul li a {display: block; border-right: 1px solid #bababa; padding:0 22px; color:#666;} #w_foot .w_fnb ul li a:hover {color:#222;} #w_foot .w_fnb ul li:last-child a {border-right: 0} #w_foot .w_foot_link {float: right;display: block; background: #8c8c8c; color:#fff; padding:15px 45px 15px 15px; position: relative;} #w_foot .w_foot_link:hover {background: #777;} #w_foot .w_foot_link i {display: block; width: 6px; height: 12px; background-position: 0 -100px; position: absolute; top:20px; right: 20px;} #w_foot > .inner {padding: 32px 0; position: relative;} #w_foot > .inner #w_logo_f {position: absolute; top:24px; right: 0} #w_foot > .inner .w_foot_info {padding-left: 20px; line-height: 1.8; color:#666;} #w_foot > .inner .w_foot_info b {font-size: 18px; display: block; color:#222;} #w_foot > .inner .w_foot_info span {display: inline-block; padding-right: 28px; position: relative; font-size: 1rem; font-size: 15px;} #w_foot > .inner .w_foot_info span:after {position: absolute; content: ''; display: block; width: 1px;background: #ddd; height: 10px; right: 16px; top:10px;display: block;} #w_foot > .inner .w_foot_info span.last {padding-right: 0} #w_foot > .inner .w_foot_info span.last:after {display: none;} .w_to_top {position: fixed; bottom: 60px; left:50%; margin-left:620px; z-index: 80; box-shadow: 3px 3px 3px rgba(0,0,0,0.3); display: none;border-radius: 50%; } .w_to_top a {display: block;width: 70px; height: 70px; background: url(../images/totop.gif) no-repeat 0 0; text-align: left; overflow: hidden; text-indent: -9999px; border-radius: 50%; } .w_to_top a:hover {background-position: 0 -70px} .ov-bg {position: fixed; top:0; left: 0; right: 0; bottom: 0; background: #000; opacity: 0.8; display: none; z-index: 79} @media screen and (max-height: 759px) and (min-width: 1200px){ .scrollbarbtn {display: none} } @media screen and (max-height: 479px) and (max-width: 1199px){ .scrollbarbtn {display: none} } @media screen and (max-width: 1199px){ body {min-width: 320px;} .inner {width: 100%; padding:0 15px;} #w_hd {height: 55px; background: #fff;} #w_hd .inner {padding:0;} #w_logo {position: relative; padding:10px 0 0 15px;} #w_logo img {width: 170px} .w_mbtel {display: block; position: absolute; right: 50px; top:0;} .w_mbtel a {display: block; width: 52px; height: 52px; background: url(../images/mbtel.gif) no-repeat 0 0; background-size: 52px; color:transparent; cursor: pointer;} .mbnav {display: block; position: absolute; right: 0; top:0;} .mbnav a {display:block;width:52px; height: 52px; background: url(../images/mbnav.gif) no-repeat 0 0; background-size: 52px 100px;color:transparent;cursor: pointer;} .mbnav a.on {background-position: 0 -48px;} .w_tel {display: none;} #w_gnb { position: fixed; top: 55px; background: #f9f9f9; width:100%; right: -100%; padding:0; bottom: 0; z-index: 98 ;border-top:1px solid #ddd; overflow-y:auto;} #w_gnb > nav > ul > li {float: none; display: block;} #w_gnb > nav > ul > li > a {padding:20px 30px; font-size:18px; font-weight: bold; border-bottom: 1px solid #ddd; background: #fff} #w_gnb > nav > ul > li > a.on {color:#fff; background: #156bb2} #w_gnb > nav > ul > li > ul {display: none; position: relative; width: auto; border:0; top:auto; left:auto; margin-left: 0;box-shadow: none;padding:10px 0 20px;background: #f9f9f9; border-bottom: 1px solid #ddd} #w_gnb > nav > ul > li > ul > li > a {background: none; border:0; text-align: left;color:#222; font-size: 16px; padding: 10px 30px;display: block; font-weight: bold;} #w_gnb > nav > ul > li:nth-child(3) > ul > li > a {padding: 8px 30px;} /*#w_gnb > nav > ul > li > ul > li > a:hover, #w_gnb > nav > ul > li > ul > li > a:focus, #w_gnb > nav > ul > li > ul > li.current > a {background: #f9f9f9;color:#156bb2;}*/ #w_gnb > nav > ul > li > ul > li > a:hover {background: #f9f9f9;color:#156bb2;} .allwarpper {overflow: hidden; max-width: 100%} #mainslide .slide .minititle {padding-top:0px; font-size: 14px;} /* #mainslide .slide .minititle:after {height: 34px; bottom:-43px;}*/ #mainslide .slide .slogan {font-size: 46px; padding:42px 10px;} .bx-controls-direction a { width: 32px; height: 32px; background-size: 32px 64px} .bx-controls-direction a.bx-prev {left:0;} .bx-controls-direction a.bx-next {right: 0; background-position: 0 -32px;} #w_foot {padding-top: 50px} #w_foot > .inner {padding:15px;} #w_foot > .inner #w_logo_f {position: relative; top:auto; left: auto; text-align: left; display: block; } #w_foot > .inner #w_logo_f img {width: 160px;} #w_foot > .inner .w_foot_info {padding:15px 0px 20px; text-align: left; line-height: 1.4; font-size:12px;} #w_foot > .inner .w_foot_info b {font-size: 15px; display: block; padding-bottom: 8px} #w_foot > .inner .w_foot_info span { font-size: 13px; padding-right: 15px} #w_foot > .inner .w_foot_info span:after {display: none;} #w_foot .w_fnb ul {float: none;} #w_foot .w_fnb ul li {padding:0; width: 33.3%; display: inline-block;} #w_foot .w_fnb ul li a {font-size: 14px; padding:10px; text-align: center;} #w_foot .w_fnb ul li:last-child a {border-right: 0} #w_foot .w_fnb .inner {padding:0;} #w_foot .w_foot_link {float: none; display: block; font-size: 14px;} #mainslide,#mainslide .slide {min-height: 480px; max-height: 640px} .scrollbarbtn {bottom: 20px} #mainslide .slide .w_btn {font-size: 0.95em} .bx-pager {display: none;} .w_title {padding-top: 50px;} .w_title .minititle {font-size: 0.75em} .w_title .minititle:before {height: 40px;top: -56px;} .w_title h2 {font-size: 32px; font-weight: normal;} #section2 .inner {padding:30px 15px 40px;} /*#section2 .listslide {max-width: 583px; margin:0 auto;}*/ #section2 .listslide #listslide li {} #section2 .listslide #listslide li a {max-width: 100%; font-size:12px; padding-bottom: 20px;position: relative;} #section2 .listslide #listslide li a img {max-width: 100%} #section2 .listslide #listslide li a strong {font-size: 15px; display: block; min-height: 42px; letter-spacing: -0.06em;line-height: 1.3} #section2 .listslide #listslide li a p {min-height: 104px;word-break: break-all; padding:0 5px; } /* #section2 .listslide #listslide li a p br {display: none;}*/ #section2 .listslide #listslide li a u {margin:10px 20px 0; width: auto; padding:8px 10px;} #section2 .listslide #listslide li a u i {margin-left: 10px;} #section3 {min-height: 320px} #section3 .w_notice li a {font-size: 1rem;overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding:15px 0;} #section3 .w_notice li a span {font-size: 0.85rem;width: 30%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; padding:0 10px;} #section3 .w_notice li a i {display: none;} #section4 {background-position: 50% -120px} #section4 .w_bslogan {font-size: 18px; word-break: keep-all;padding:40px 0 30px;} #section4 .w_bslogan strong {font-size: 24px;} #section4 ul li a {padding-left:30px; font-size:0.75em; height: auto; padding-bottom: 40px; color:#fff !important;} #section4 ul li a strong {padding-top: 40px; font-size: 24px;} #section4 ul li {background-position: 0% 50% !important; height: auto} #section4 ul li a i {display: none;} .scrollbarbtn {display: none} #section4 {padding-bottom: 0} #section0 ul {padding:50px 0 70px;} #section0 ul li {margin:0 0 14px; width: 100%; max-width:320px } #section0 ul li a {margin:0;font-size: 20px; font-size: 14px; } #section0 ul li a span {background-size: cover !important; height: 160px;} #section0 ul li a i {padding:4px 10px; margin-top: 10px} #section2 .listslide #listslide li a {height: 240px;} #section0 ul {flex-direction: column;align-items: center;} } /*서브페이지*/ /* 신규업무분야 */ .new_bizarea {position: relative ; display: flex;flex-direction: row-reverse;} .biz_img {} .bix_text {background: #fff url(../images/bg_pp2.jpg); padding:40px 80px; position: relative; width: 620px;} .bix_text h2 {font-size: 32px; color:#222; padding-bottom: 20px;} .bix_text p {font-size: 18px; color:#666; line-height: 1.6} .wh_style_free {margin-top: 80px; border-top:3px solid #222; padding:80px; border-bottom: 1px solid #ddd; line-height: 1.6;} /*신규인사말*/ .incontent {display: flex; justify-content: space-between; position: relative;padding: 0px 0 70px;align-items: center;} .incontent:last-child {padding-bottom: 0} .flex_left {flex-direction: row; } .flex_right {flex-direction: row-reverse;} .int_img {position: relative;} .flex_left .int_text {margin-left:-50px;} .flex_right .int_text {margin-right:-50px;} .int_text {padding:80px; background: #fff; position: relative; box-shadow: 3px 3px 10px rgba(0,0,0,0.1); bottom:-20px;} .int_text h2 {color:#156bb2;font-weight: bold; font-size: 1.7rem; padding-bottom: 30px; word-break: keep-all;} .int_text h2:before, .int_text h2:after {content:' " '; vertical-align: 5px; font-style: italic;} .int_text p {color:#666; line-height: 1.8;word-break: keep-all; font-size: 16px} .new_pp_box {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;} .new_card {background: url(../images/bg_pp2.jpg) no-repeat 0% 0%; overflow: hidden; border: 1px solid #ddd;background-size: cover; padding:20px; text-align: center; } .new_card a {display: block;} .pp_bgimg { display: block; overflow: hidden; margin:0 auto} .pp_bgimg img {width: 100%} .new_card h2 {padding:20px 0; font-size: 24px; height:76px;} .new_card h2 span {font-size: 18px; color:#777; font-weight: normal;} .new_card i {margin-top: 20px;display: inline-block; border:1px solid #ddd; border-radius: 20px; padding:6px 24px; font-size: 14px; background: #fff; font-style: normal;} .new_card i img {width: 24px; height: 24px;} .new_card:hover {background: url(../images/bg_pp.jpg) no-repeat 0% 0%;background-size: cover; } .new_card:hover h2 {color:#fff;} .new_card:hover h2 span {color:#fff} .new_pp_box_main_area { padding:50px 0 50px 50px } .new_pp_box_main {position: relative;} /*1.서브공통*/ #w_container {padding-top: 100px;overflow: hidden;} #w_subtop {position: relative; text-align: center;background: url(../images/sub01.jpg) no-repeat 50% 50%;} #w_subtop.ws_1 {background: url(../images/sub01.jpg) no-repeat 50% 50%; } #w_subtop.ws_2 {background: url(../images/sub01.jpg) no-repeat 50% 50%; } #w_subtop {background-size:cover !important} .w_subtitle {color:#fff; padding: 40px 0 60px; text-shadow:2px 2px 10px rgba(0,0,0,0.2)} /*.w_mini {position: relative; display: inline-block; padding-bottom: 50px; font-weight: bold; font-family: arial; font-size:12px; font-weight: normal; letter-spacing: 1rem}*/ /*.w_mini:after {position: absolute; top:40px; left:50%; width: 40px; height: 3px; background: #fff; opacity: 1; display: block; content: ''; margin-left: -20px;}*/ .w_ptt {font-size: 42px; font-weight: 100;} #w_subnav {position: absolute; bottom: -30px; left: 0; right: 0;} .w_sarea {max-width: 1200px; margin:0 auto; position: relative; font-size: 0; box-shadow: 0 0 10px rgba(0,0,0,0.2)} .w_sa1, .w_sa2, .w_sa3 {display: inline-block; font-size: 1rem; color:#fff; width: calc(100%/3);position: relative;} /*.w_sa3 {width: calc(100/3);}*/ .w_sa1.no3d, .w_sa2.no3d {width: 50%} .w_sa1 a, .w_sa2 a, .w_sa3 a {color:#555; display: block; cursor: pointer; padding:18px 44px 18px 22px; font-weight: 100; text-align: left; background: #fff} .w_sa1 a {padding-left: 54px; background:#fff url(../images/w1.png) no-repeat 25px 50%;} .w_sa1 a, .w_sa2 a {border-right: 1px solid #ddd} .w_sa2 a, .w_sa3 a {background:#fff url(../images/w2.png) no-repeat 95% 50%; } .w_sa2 ul, .w_sa3 ul {display: none; position: absolute; width: 100%; top:100%; left:0;border-top: 1px solid #f9f9f9; z-index: 30; box-shadow: 0 5px 10px rgba(0,0,0,0.2)} .w_sa1:after, .w_sa2:after {position: absolute; right: 0; top:0; bottom: 0; width: 1px; height: 100%; background: #444; background: rgba(256,256,256,0.3); content: ''; display: block;} .w_sa2.on a, .w_sa3.on a {color:#333;} .w_sa2 ul a, .w_sa3 ul a {padding:12px 22px; text-align: left; background: #fff; color:#555} /*.w_sa2 ul li.current a, .w_sa3 ul li.current a, */ .w_sa2 ul a:hover, .w_sa3 ul a:hover {color:#fff;background: #156bb2} .w_sa2 ul a:hover, .w_sa3 ul a:hover i {color:#bde5fb} .w_sa3 a br {display: none;} .w_sa3 a i {font-size: 12px; color:#888} .w_sa1 > a, .w_sa2 > a, .w_sa3 > a {text-overflow: ellipsis; overflow: hidden; white-space: nowrap;} .w_mini_text {display: none;} #contents {min-height: 500px; margin-bottom: 100px} .check_list_area {background:#fff} .check_list_area .questTitle {background:#156bb2;color:#fff; font-size:24px; text-align: center; padding:20px} .check_list_area .quest {padding:24px; border-bottom:1px solid #ddd;font-size:0} .check_list_area .quest h3 {font-size:22px; color:#222; font-weight:bold;} .check_list_area .self_a {font-size:16px; overflow:hidden} .check_list_area .quest h3, .check_list_area .self_a {width:50%;display: inline-block;vertical-align:middle} .check_list_area .self_a li {width:calc(100%/5); float:left;text-align:center; border-right: 1px dotted #bbb;} .check_list_area .self_a li:first-child {border-left: 1px dotted #bbb;} .check_list_area .self_a li label {display:block; width: 100%; height: 100%; cursor: pointer} .check_list_area .self_a li input[type=radio] {width:24px; height:24px; margin-bottom:10px; } .check_list_area .self_a span {display:block;} .check_btn_area {padding:30px;text-align:center} .check_list_area_btn {background:#156bb2; color:#fff; border-radius: 3px; padding:18px 0; width: 300px; font-size:20px; font-weight: bold; border:0;} /*.contenst_bottom {height:100px;}*/ .check_popup {position:fixed; width: 480px; height:420px; background:#fff;box-shadow:0 0 15px rgba(0,0,0,0.4); z-index: 999999; top:50%; left:50%; margin-left: -240px; margin-top:-200px; padding:30px; text-align: center; display:none;} .res-text {display: none} .check_popup .scorearea {font-size:24px; color:#333; padding-bottom:0px;} .check_popup .scorearea strong {font-size:72px; color:#156bb2; font-weight:bold;} .check_popup p {font-size:16px; word-break:keep-all; color:#555; padding-bottom: 20px; line-height: 1.5} .check_popup .check_popup_close {background:#156bb2; color:#fff; border-radius: 3px; padding:18px 0; width: 300px; font-size:20px; font-weight: bold; border:0;} .test_info_start {border:1px solid #156bb2; padding:50px; text-align: center; max-width: 480px; margin:0 auto 50px;} .test_info_start h3 {color:#222; font-size: 24px; padding-bottom: 10px;} .test_info_start p {color:#888; font-size: 14px;padding-bottom: 14px;} .test_info_start li:first-child {margin-bottom: 10px;} .test_info_start input {padding:14px; font-size: 18px; border-radius: 5px; border:1px solid #333; width: 80%} .linksnsarea {padding: 30px 10px 0} .linksnsarea ul {display: flex;flex-direction: row; justify-content: space-between;} .linksnsarea ul li {text-align: center;} .linksnsarea ul li a {font-size: 14px; display: block; text-align: center;} .linksnsarea ul li a i {width: 32px; display: block; margin:0 auto 10px} .linksnsarea ul li a i img {width: 100%;} .linksnsarea ul li a:hover {color:#156bb2} .linksnsarea .incon_layer {left:10px;right: 10px;bottom:6px;} .scorearea strong.red {color:#f90000} /* Chrome, Safari, Edge, Opera */ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* Firefox */ input[type='number'] { -moz-appearance: textfield; } #w_container header h1 {font-size: 3rem; text-align: center; color:#222; position: relative; margin:90px 0 ; font-weight: 100;line-height: 0.6} #w_container header h1 i {color:#888; font-size: 0.5em;} #w_container header h1:after {position: absolute; content: ''; display: block; width: 42px; height: 23px; left:50%; margin-left: -21px; bottom:-50px; background: url(/images/glass.png) no-repeat 50% 50%; background-size: 100%} @media screen and (max-width: 1199px) { #contents {margin-bottom: 0} #w_container {padding-top: 53px;} #w_subtop {height: 90px;} .w_subtitle {padding-top: 20px;} .w_mini {padding-bottom: 10px; font-size: 0.85rem;} .w_mini:after {display: none;} .w_ptt {font-size: 30px;} .w_sa1 {display: none;} .w_sa2, .w_sa3 {width: 50%;} .w_sa2.no3d {width: 100%} .w_sa1 a, .w_sa2 a, .w_sa3 a,.w_sa2 ul a, .w_sa3 ul a {padding:10px 40px 10px 14px; font-size: 0.85em} #w_container header h1 {font-size: 28px; margin: 60px 0 44px;} #w_container header h1:after {width: 30px; margin-left: -15px; bottom: -28px; background-size: 100%} .new_bizarea {flex-direction: column;} .bix_text {padding:30px;} .bix_text h2 {font-size: 24px;} .bix_text p {font-size: 14px} .wh_style_free {padding:20px; font-size: 14px;} #subfrm table th, #subfrm table td {padding:10px 5px; font-size: 14px;} .new_pp_box_main_area {padding:30px 0} .new_card {padding:20px} .new_card .pp_bgimg {width: 100%; height: auto} .new_card h2 {font-size: 18px} .new_card h2 span {font-size: 14px;} .new_card i {font-size: 12px;} .bix_text {width: auto} .check_list_area .questTitle {font-size:20px;} .check_list_area .quest h3, .check_list_area .self_a {width:100%;display: block;vertical-align:top} .check_list_area .quest {padding:18px; border-bottom:1px solid #ddd;font-size:0} .check_list_area .quest h3 {font-size:18px; color:#222; font-weight:bold; padding-bottom:18px;} .check_list_area .self_a li input[type=radio] {width:20px; height:20px;} .check_list_area .self_a span {font-size:14px;} } @media screen and (max-width: 899px) { .check_popup {width: auto; margin-left: auto; left: 10px;right: 10px} .linksnsarea ul li a span {word-break: keep-all; display: inline-block; padding: 0 10px} } .row > .col {float: left} .row:before, .row:after {display: block; clear: both; content:'';} .u6 {width: 50%;} @media screen and (max-width: 1199px) { .m-u12 {width: 100%;} } /*공통*/ .wh_style {position: relative;border-top: 1px solid #222; display: block;} .wh_style:before {position: absolute; top:-3px; left:0; width: 24%; content: ''; display: block; height: 3px; background: #156bb2;} .wh_style dl {border-bottom: 1px solid #ddd; display: block; overflow: hidden;} .wh_style dl dt {width: 24%;float: left; font-weight: bold; color:#156bb2; font-size: 18px;} .wh_style dl dd {color:#666; font-size: 16px; display: block; width: 76%; float: left; line-height: 1.6} .wh_style dl dt, .wh_style dl dd {padding:26px 10px 26px 50px;} .wh_style.bw {border-top: 1px solid #ddd;} .wh_style.bw:before {position: absolute; top:-3px; left:0; width: 25%; content: ''; display: block; height: 3px; background: #156bb2;} .wh_style.bw dl {border-bottom: 1px solid #e2e2e2; } .wh_style.bw dl dt {width: 25%;font-weight: bold; color:#222;} .wh_style.bw dl dd {color:#555;width: 75%;} .wh_style.bw dl dd ul li {padding-left: 15px; position: relative; margin-bottom: 20px; line-height: 1.6; letter-spacing: -0.034em} .wh_style.bw dl dd ul li span {color:#7b7b7b; display: block;padding-left: 0; font-size: 0.85em} .wh_style.bw dl dd ul li:last-child {margin-bottom: 0;} .wh_style.bw dl dd ul li:before {display: block; width: 5px; height: 5px; border-radius: 50%; content: ''; background:#0c57a9; position: absolute; top:12px; left: 0; } .wh_style.bw.pp dl dt {width: 400px;} .wh_style.bw.pp dl dd {width: 800px;} .wh_style.bw.pp:before {width: 400px;} @media screen and (max-width: 1199px) { .wh_style:before {width: 23% !important; } .wh_style dl dt {width: 100%;float: none; font-size: 18px;} .wh_style dl dd {font-size: 14px; width: 100%; float: none;} .wh_style dl dt, .wh_style dl dd {padding:15px;} .wh_style dl dt {padding-bottom: 0} .wh_style.bw dl dt {width: 100%;} .wh_style.bw dl dd {width: 100%;} .wh_style.bw.pp dl dt {width: 100%;} .wh_style.bw.pp dl dd {width: 100%;} .wh_style.bw dl dd ul li {padding-left: 10px; margin-bottom: 8px;} .wh_style.bw dl dd ul li:before {top:9px;} } /*인사말*/ .p_color {color:#156bb2 !important;} .w_insa {position: relative; padding: 80px 0 0 0; letter-spacing: -0.05em; } .w_insa .w_limg {box-shadow:18px 18px 18px rgba(0,0,0,0.2); position: absolute; top:0; left:0; } .w_insa .w_rtext {background: #fff; padding: 70px 70px 70px 110px; margin-left:366px; box-shadow:2px 2px 10px rgba(0,0,0,0.2); border-radius: 20px;} .w_insa .w_rtext h3 {font-size: 32px; padding-bottom: 26px; color:#222; font-weight: normal;} .w_stext {line-height: 2; color:#555;} .w_insa .w_slogo {padding-bottom:40px; } .w_insa .w_slogo img {max-width: 100%;} @media screen and (max-width: 1199px) { .w_insa .w_limg img {max-width: 100%} .w_insa {position: relative; padding: 200px 0 0 0; letter-spacing: -0.025em} .w_insa .w_limg {box-shadow:18px 18px 18px rgba(0,0,0,0.2); position: absolute; top:0; left:0; z-index: -1} .w_insa .w_rtext {background: #f4f4f4; padding: 15px 15px 15px 15px; margin-left:0; } .w_insa .w_rtext h3 {font-size: 18px; padding-bottom: 13px; font-weight: bold;} .w_stext {line-height: 1.6; font-size: 14px;} .w_insa .w_slogo {padding-bottom:20px; padding-top: 10px;} .incontent { padding: 0px 0 40px;flex-wrap: wrap;justify-content: center;align-items: flex-start} /*.flex_left {flex-direction: row; } .flex_right {flex-direction: row-reverse;}*/ .int_img {padding:20px; overflow: hidden; } .int_img img {width: 100%} .flex_left .int_text {margin-left:0px;} .flex_right .int_text {margin-right:0px;} .int_text {padding:20px;box-shadow: 3px 3px 10px rgba(0,0,0,0.0); bottom:auto;} .int_text h2 { font-size: 1.4rem; padding-bottom: 20px; } .int_text p { line-height: 1.6; font-size: 14px} } /*오시는길*/ #map {width: 100%; height: 450px; margin-bottom: 62px; overflow: hidden; } .w_sub_cont {overflow: hidden;position: relative;} .w_sub_cont img{max-width: 100%} .bg_blue {background: #142b58; color:#fff;} .mapbox {padding-left: 20px; margin-bottom: 100px} .row .col:first-child .mapbox {padding-right: 20px; padding-left: 0;} .maptext {border:1px solid #e2e2e2; border-top:0; padding:40px 50px;} .maptext h3 {font-size: 24px; color: #222; text-align: center; position: relative; border-bottom: 1px solid #e2e2e2; padding-bottom: 18px; margin-bottom: 26px;} .maptext h3:after {position: absolute; bottom: 0; left:50%;margin-left: -84px; width:168px; display: block; height: 3px; background:#222; content: ''} .maptext p, .maptext ul, .maptext ul a {color:#555; font-size: 17px; letter-spacing: -0.03em} .maptext ul a:hover {color:#142b58;} .maptext ul {padding-top:26px; } .maptext ul li {margin-bottom: 8px;} .maptext ul li:last-child {margin-bottom: 0} .maptext ul li img {margin-right: 10px;} .maparea {padding: 0px 0;} @media screen and (max-width: 1199px) { #map {width: 100%; height: 250px; margin-bottom: 30px;} .mapbox > img {width: 100%} .mapbox {padding-left: 0px; margin-bottom: 20px} .row .col:first-child .mapbox {padding-right: 0px; padding-left: 0;} .maptext { padding:20px 20px;} .maptext h3 {font-size: 18px; padding-bottom: 12px; margin-bottom: 16px; word-break: keep-all;} .maptext h3:after {margin-left: -42px; width:84px; } .maptext p, .maptext ul, .maptext ul a {font-size: 14px; letter-spacing: -0.01em} .maptext ul {padding-top:13px; } .maparea {padding: 40px 0;} } /*주요업무분야*/ .col:nth-child(odd) .w_klist {margin-right: 20px;} .col:nth-child(even) .w_klist {margin-left:20px;} .w_klist {position: relative; min-height: 524px;} .w_klist .w_kimg {box-shadow: 3px 3px 15px rgba(0,0,0,0.2); overflow: hidden; border-radius: 20px;} .w_klist .w_ktext {position: absolute; top:220px;left: 20px; right: 20px; padding: 32px; background: #fff; z-index: 1; text-align: center; border-radius: 50px;box-shadow: 3px 3px 15px rgba(0,0,0,0.2);} .w_klist .w_ktext h3 {color:#222; font-size: 26px;} .w_klist .w_ktext p {color:#555; font-size: 16px; padding:22px 0 } .w_klist .w_ktext a {display: inline-block; background: #fff; border: 1px solid #156bb2; color:#156bb2; text-align: left; padding:10px 20px; font-size: 14px; transition: all 0.3s ease; border-radius: 20px;} /*.w_klist .w_ktext a:hover {background: #0d3e95; color:#fff;}*/ /*.w_klist .w_ktext a i {background-position: 0 0; display: inline-block; width:24px; height: 8px; margin-left:50px;}*/ /*.w_klist .w_ktext a:hover i {background-position: 0 -8px;}*/ @media screen and (max-width: 1199px) { .col:nth-child(odd) .w_klist {margin-right: 0px;} .col:nth-child(even) .w_klist {margin-left:0px;} .w_klist {position: relative; min-height: auto; padding-bottom: 50px; margin-bottom: 10px; } .w_klist .w_kimg {box-shadow: 4px 4px 5px rgba(0,0,0,0.2)} .w_klist .w_kimg img {width: 100%} .w_klist .w_ktext {position: relative; top:0; left: 0; right: 0; padding: 15px;} .w_klist .w_ktext h3 {font-size: 18px;} .w_klist .w_ktext p {font-size: 14px; padding:12px 0 } .w_klist .w_ktext a { width: 160px; padding:12px 10px; font-size: 14px; text-align: center;} .w_klist .w_ktext a i {margin-left: 10px;} } .k_in_top {position: relative; margin-bottom: 100px;} .k_in_top img {width: 100%; border-radius: 20px; overflow: hidden; box-shadow: 3px 3px 10px rgba(0,0,0,0.1)} .k_in_top a {display: inline-block; border:1px solid #5a6a8d; color:#fff; text-align: center; padding:18px 22px; font-size: 1rem; margin-top: 20px;} .k_left {box-shadow: 13px 18px 18px rgba(0,0,0,0.2); z-index: 1; position: relative;} .k_right {background:#122a5b; color:#fff; position: absolute; bottom: 0; left:50%; right: 0;} .k_right h3 {font-size: 32px;} .k_right p {color:#a6bfea; font-size: 18px; line-height: 1.7; padding-top: 20px; letter-spacing: -0.05em} .k_right .distbcell { padding:30px 60px; text-align: left; min-height: 280px} .k_right.k_bg01 {background:url(../images/bg_pp.jpg) no-repeat 0% 0%;} .ex_banner {background: url(../images/ex_banner.jpg) no-repeat 50% 50%; min-height:370px;text-align: center;display: block; margin-top: 100px;color:#fff;} .ex_banner h3 {font-size: 28px; padding: 120px 10px 20px} .ex_banner p {font-size: 20px;} @media screen and (max-width: 1199px) { .k_in_top {margin-bottom: 50px;} .k_right {position: relative; left:auto;bottom: auto;} .k_right h3 {font-size: 18px;} .k_right p {font-size: 14px; padding-top: 14px;} .k_right p br {display: none} .k_right .distbcell {padding: 20px 20px; min-height: auto;} .ex_banner {min-height:150px;margin-top: 50px;word-break: keep-all;} .ex_banner h3 {font-size: 18px; padding: 40px 15px 10px; } .ex_banner p {font-size: 14px; padding:0 15px 40px;word-break: keep-all;} } /*구성원소개*/ .k_pp_top {background: url(../images/bg_pp.jpg) no-repeat 50% 100%; overflow: hidden; margin-bottom: 70px;} .k_pp_top .inner {position: relative;} .k_pp_img {position: relative; margin-top: 50px; box-shadow: 13px 18px 18px rgba(0,0,0,0.2); z-index: 1; float: left; background: #fff} .k_pp_name {padding: 234px 0 50px 500px; font-size: 42px; letter-spacing:10px; color:#fff; } .k_pp_name span {font-size: 28px; color:#fff; letter-spacing: -0.03em; margin-left: 10px;} .k_pp_tel ul {padding-left: 100px;overflow: hidden;} .k_pp_tel ul li {float: left; width: 240px; font-size: 22px;color:#fff} .k_pp_tel ul li a {color:#fff} .k_pp_tel ul li strong {display: block; color:#78baec; font-size: 1rem; padding-bottom: 0.8rem} @media screen and (max-width: 1199px) { .k_pp_top {background: url(../images/bg_pp.jpg) no-repeat 0% 0;} .k_pp_img {max-width: 154px; margin-right: 20px; margin-top: 27px} .k_pp_name {padding: 77px 0px 80px 0; font-size: 24px;} .k_pp_name span {font-size: 18px; display: block;} .k_pp_tel ul {padding-left: 0px;} .k_pp_tel ul li {font-size: 16px;float: none; width: 100%} .k_pp_tel ul li strong {display: inline-block; margin-right: 8px; width: 80px;} } .pp_list_top {background:#fff no-repeat 50% 0; padding:0px 0 50px;text-align: center; } .pp_list_top p {font-size:33px; color:#222; } .pp_list_top p strong {font-size: 44px;} .col:nth-child(odd) .pp_card {margin-right: 20px;} .col:nth-child(even) .pp_card {margin-left:20px;} .pp_card {display: block; background: #fff; position: relative; padding:40px 50px; margin-bottom: 40px; min-height: 242px; border:1px solid #156bb2; padding-left: 280px} .pp_card .pp_bgimg {position: absolute; bottom: 0; left: 0px; z-index: 1; width:240px;} .pp_card span {color:#1d4b9c;position: relative; z-index: 2;} .pp_card h3 {font-size: 36px; color:#222; font-weight: normal; position: relative; z-index: 2;} .pp_card > a {position: absolute; top:50%;right:20px; background:#cfd4dd url(../images/plus.png) no-repeat 50% 50%; width:50px; height: 50px; margin-top:-25px; text-align: left; text-indent: -9999px; overflow: hidden;display: block; z-index: 3; border-radius:50%;} .pp_card ul {padding-top: 30px;position: relative; z-index: 2;} .pp_card ul li {margin-bottom: 8px;} .pp_card ul li:last-child {margin-bottom: 0} .pp_card ul li img {margin-right: 10px; } /*.pp_card:hover {color:#fff; background: #1d4b9c} .pp_card:hover span {color:#fff;} .pp_card:hover h3 {color:#fff;} .pp_card:hover > a {background:#14346d url(../images/plus.png) no-repeat 50% 50%} .pp_card:hover ul li , .pp_card:hover ul li a {color:#abc2eb;}*/ .pp_bottom {margin-top: 60px; background:#142b58 url(../images/pp_bg.jpg) no-repeat 50% 0; color:#fff; padding:90px 0 70px;} .pp_bottom h2 {font-size: 40px; position: relative; padding-bottom: 20px; margin-bottom: 50px;text-align: center;} .pp_bottom h2:after {position: absolute; content: ''; display: block; left:50%;margin-left: -42px; width: 84px; background: #fff; height: 2px; bottom:0;} .pp_bottom dl {overflow: hidden; border:1px solid #425479; margin-bottom: 20px; display: table;background: rgba(0,0,0,0.2); position: relative;} .pp_bottom dl:before, .pp_bottom dl:after {position: absolute; content: ''; top:50px; bottom: 50px; display: block; width: 1px; background:#425479; } .pp_bottom dl:before {left:270px;} .pp_bottom dl:after {right:256px;} .pp_bottom .stw1, .pp_bottom .stw2, .pp_bottom .stw3 {padding:50px; display: table-cell;} .pp_bottom .stw1 {width: 270px;} .pp_bottom .stw2 {width: 672px;} .pp_bottom .stw3 {vertical-align: middle;} .pp_bottom .stw3 img {margin-right: 10px;} .pp_bottom .stw1 {font-size:36px;} .pp_bottom .stw1 span {display: block; font-size: 1rem; padding-bottom: 0px;} .pp_bottom .stw2 ul li {font-size: 18px; color: #bcccec; line-height: 1.8} @media screen and (max-width: 1199px) { .pp_list_top {background:#fff url(../images/wh.jpg) no-repeat 50% 0; background-size: 200px; padding:25px 0 35px; } .pp_list_top p {font-size:16px; word-break: keep-all;} .pp_list_top p strong {font-size: 20px;word-break: keep-all;} .col:nth-child(odd) .pp_card {margin-right:0px;} .col:nth-child(even) .pp_card {margin-left:0px;} .pp_card {padding:20px 25px; margin-bottom: 20px; min-height: 292px; overflow: hidden;} .pp_card .pp_bgimg {width: 150px; } .pp_card .pp_bgimg img {width: 100%;} .pp_card span {font-size: 14px;} .pp_card h3 {font-size: 28px} .pp_card ul {padding-top: 15px} .pp_bottom {margin-top: 30px; background-position:0% 0; padding:40px 0 40px;} .pp_bottom h2 {font-size: 26px;padding-bottom: 10px; margin-bottom: 25px;} .pp_bottom h2:after {width: 60px; margin-left: -30px;} .pp_bottom dl {margin-bottom: 15px; display: block} .pp_bottom dl:before, .pp_bottom dl:after {display: none;} .pp_bottom .stw1, .pp_bottom .stw2, .pp_bottom .stw3 {padding:0px; display: block; margin: 20px} .pp_bottom .stw1 {width: auto; border-bottom: 1px solid #425479; padding-bottom: 20px} .pp_bottom .stw2 {width: auto;border-bottom: 1px solid #425479; padding-bottom: 20px} .pp_bottom .stw1 {font-size:24px;} .pp_bottom .stw2 ul li {font-size: 14px; line-height: 1.6; overflow: hidden;} #w_topmenu {right:70px;} } @media screen and (max-width: 600px) { /* #w_topmenu {display:none;}*/ #w_topmenu ul li a {text-align: center; padding:4px} #w_topmenu ul li a span {display: none} #w_topmenu ul li a i {margin:0 auto} } .ctt_admin {display: none;} /* 문의하기 */ #subfrm {} #subfrm table {width: 100%; border-top:3px solid #222; border-left: 1px solid #ddd; border-collapse: collapse;border-spacing: 0} #subfrm table th, #subfrm table td {border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; padding:15px;} #subfrm table th {background: #f9f9f9} #subfrm input[type=text], #subfrm input[type=tel], #subfrm input[type=email] {width: 100%; background: #fff; border:1px solid #555; border-radius: 3px;padding:10px; width: 240px;} #subfrm textarea {width: 100%; background: #fff; border:1px solid #555; border-radius: 3px;padding:10px;} .subfrm_btn {text-align: center;padding:30px 0} #submitBtn {display: inline-block;background: #122a5b; color: #fff; padding: 18px 20px; min-width: 240px; max-width: 80%;color: #fff;font-size: 1.1rem;border:0} #robotagree {text-align: center;} #robotagree > label { padding:15px 15px 15px 38px; position: relative; display: inline-block;color:#555;} #robotagree > label:before {content: ''; position: absolute; width: 18px; height: 18px; border:1px solid #555; display: block; top:15px; left: 15px;} #robotagree > label[data-agree=on]:before {background: #122a5b} #robotagree > a {color:#777; cursor: pointer; border:1px solid #ddd; font-size: 14px; display: inline-block; padding:2px 4px; border-radius: 10px;} .mouse { width: 40px; height: 70px; border: 1px solid #fff; border-radius: 20px; position: relative; } .mouse:before { content: ''; width: 6px; height: 6px; position: absolute; top: 10px; left: 50%; transform: translateX(-50%); background-color: #fff; border-radius: 50%; opacity: 1; animation: wheel 2s infinite; -webkit-animation: wheel 2s infinite; } @keyframes wheel { to { opacity: 0; top: 40px; } } @-webkit-keyframes wheel { to { opacity: 0; top: 60px; } } .inner_contents {max-width: 800px;margin:0 auto; letter-spacing: -0.04em; word-break: keep-all;} .inner_contents h2 {color:#156bb2; font-size: 2.2em; padding: 60px 0 30px; text-align: center;} .inner_contents h2:first-child {padding-top: 0} .inner_contents h3 {font-size: 2em; padding: 60px 0 30px; font-weight: normal; font-weight: 100} .inner_contents h3:first-child {padding-top: 0} .inner_contents .pre {white-space: pre-line;line-height: 1.8} .inner_contents p, .inner_contents h2, .inner_contents h3 {word-break: keep-all;} .inner_contents ol, .inner_contents ol li {list-style: none; margin:0;padding:0} .inner_contents ul, .inner_contents ol {padding-top: 16px;} .inner_contents ul li, .inner_contents ol li {position: relative; padding-left: 16px; margin-bottom: 16px; line-height: 1.6} .inner_contents ul li:before {content: ''; position: absolute; left:0; top:7px; display: block; width: 8px; height: 8px; border-radius: 50%; background: #80b0d5;} .inner_contents ol li {padding-left: 22px} .inner_contents ol li span.num {display: inline-block; width: 16px; height: 16px; border-radius: 50%; background: #156bb2; color:#fff;font-size: 12px; line-height: 16px; text-align: center; position: absolute; left: 0; top:5px;} .gray_box {padding:30px; background: #156bb2;color:#fff; border-radius: 10px; margin-top: 40px;} .inner_contents strong {color:#156bb2} .inner_contents strong.p2 {color:#f90000} /*.inimg {padding:5px;background: #f9f9f9;border:1px #ddd solid; display: inline-block; border-radius: 10px; box-shadow: 2px 2px 5px rgba(0,0,0,0.1)}*/ .inimg {display: inline-block;} .inimg img {max-width: 100%;} .inimg.noline {padding:0;border:0; box-shadow: none; border-radius: 0} .inimg.imgsz-1 {width: 240px;} .inimg.imgsz-2 {width: 360px;} .inimg.imgsz-3 {width: 600px;} .inimg.fr-r {float: right; margin:20px 0 20px 30px} .inimg.fr-c {text-align: center; margin:10px auto; display: block; border:4px solid #80b0d5; padding:20px;} .inimg > i {color:#156bb2; font-size: 18px; font-weight: bold; word-break: break-all; padding:8px; display: inline-block; line-height: 1.6} .flex {display: flex; flex-direction: row; justify-content: space-between;} .treebox {padding-top: 60px;} .inner_contents h4 {padding:30px 0 10px; font-size: 1.6em; font-weight: 100} .inner_contents h4:first-child {padding-top: 0} .hun_list {padding:5px 10px; border-radius: 5px;border:1px solid #ddd; background: #f9f9f9; margin-bottom: 4px;} .inner_contents .in_table {padding:20px 0;} .inner_contents .in_table table {width: 100%; border-spacing: 0; border-collapse: collapse; border-top:1px solid #ddd; border-left: 1px solid #ddd} .inner_contents .in_table table th, .inner_contents .in_table table td {text-align: center; padding:12px 8px; border-bottom: 1px solid #ddd; border-right:1px solid #ddd;} .inner_contents .in_table table th {background: #156bb2; color:#fff;} .inner_contents .in_table table tr:nth-child(odd) td {background: #f0f0f0} .point_text {display: inline-block; border:5px solid #80b0d5; padding:8px 10px; border-radius: 10px; margin:5px 10px 5px 0px;} @media screen and (max-width: 819px) { .inner_contents h2 {font-size: 22px;} .inner_contents h3 {font-size: 18px; padding: 40px 0 18px;} .inner_contents p, li {font-size: 14px; } .inimg {display: block;} .inimg.fr-r {float: none; margin:0; padding:20px 0;display: block;} .snsarea_flex ul li > a {display: block;text-align: center;} .snsarea_flex ul li > a i {margin:0 auto} .snsarea_flex ul li > a span {display: none} .label-main {font-size: 16px;} #mainslide .slide .slogan {font-size: 32px;} #mainslide .vs01.slide .slogan strong {font-size: 58px;} #mainslide .slide .slogan strong {font-size: 42px; word-break: keep-all;} #mainslide .slide .slogan .sss {font-size: 18px; padding-left:40px; padding-right: 40px;} .incon_layer {min-width: 280px;} .snsarea ul li {position: static;} .snsarea ul {position: relative;} #w_container header h1 {line-height: 1.2} #w_container header h1 i {margin-top: -2px;display: block;} .check_list_area_btn {width: 100%;max-width: 300px;} .in_table {width: 100%; overflow: auto;} .in_table table {min-width: 640px} .inner_contents .in_table table th, .inner_contents .in_table table td {font-size: 0.85em} .gall_row .col-gn-4 {width: 50%} } /* 검사안내 */ .ex_addarea {padding-top: 30px} .ex_addarea .bullet:before {display: inline-block; content: ''; width: 4px; height: 6px; background: #80b0d5; margin-right: 8px; vertical-align: 5px;} .inner_contents .ex_addarea h3 {padding-bottom: 10px} .ex_addarea .gray_text {margin-bottom: 30px; color:#666; } .stroke-text { letter-spacing: -0.03em; font-size: 42vh; font-weight: bold; font-weight: 800; /* -webkit-text-stroke-width: 1px;*/ /* -webkit-text-stroke-color: #80b0d5;*/ font-style: italic; font-weight: bold; /* color: transparent;*/ color:#80b0d5; white-space: nowrap; overflow: hidden; line-height: 1; display: block; } .marquee { opacity: 0.1; overflow: hidden; position: absolute; bottom:0px; left:0; z-index: 1; width: 150%; animation: marquee 25s linear infinite; } @keyframes marquee { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } } .btn_b01 {min-width: 35px;} .bbs_contents {max-width: 960px; margin:0 auto; font-size: 14px;}