html, body {width:100%; min-height:100%;}
html {overflow-y:scroll; overflow-x:hidden; filter:expression(document.execCommand("BackgroundImageCache", false, true));}
body {background:#fff; overflow-x:hidden; -webkit-text-size-adjust:none;}
body.fixed {overflow:hidden;}
body.fixed #wrap {position:static;}
#wrap {width:100%;}
.overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.4); z-index:500;}
.rel {position: relative;}
.eng {font-family: 'Oswald', Sans-serif;}

.inner {position:relative; width:100%; max-width: 1200px; margin:0 auto; box-sizing:border-box;}
.inner:after {display:block; content:""; clear:both;}
.pc {display:block !important;}
.tablet {display:none !important;}
.mobile {display:none !important;}
.tabmo {display:none !important;}

*::placeholder { color:#999; }                     
*::-webkit-input-placeholder { color:#999; }
*:-moz-placeholder { color:#999; }             
*::-moz-placeholder { color:#999; }           
*:-ms-input-placeholder { color:#999 !important; }      
*::-ms-input-placeholder { color:#999; } 

/*header*/
#header {position: fixed; top: 0; left: 0; width: 100%; height: 145px; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s; z-index: 499;}
#header h1 {float: left; margin-top: 60px; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#header h1 a {position: relative; display: block; width: 253px; height: 27px;}
#header h1 a img {position: absolute; top: 0; left: 0; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#header h1 a img.logo_b {opacity: 0; filter:alpha(opacity=0); -mox-opacity:0;}

#header .top_util {float: right; margin-top: 55px; font-family: 'Oswald', sans-serif; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#header .top_util a {position: relative; display: inline-block; padding: 0 2px; margin-left: 20px; font-size: 16px; font-weight: 500; line-height: 40px; color: #fff; vertical-align: middle; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#header .top_util a:first-child {margin-left: 0;}
#header .top_util a.on:after {content:''; position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background: #fff; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#header .top_util a:hover {color: #0b5ea0 !important;}
#header .top_util a:hover:after {background-color: #0b5ea0 !important;}

#header:hover,
#header.scroll  {background: #fff; -webkit-box-shadow: 4px 4px 12px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow:4px 4px 12px 0px rgba(0, 0, 0, 0.3); box-shadow:4px 4px 12px 0px rgba(0, 0, 0, 0.3);}
#header:hover h1 a img.logo_b,
#header.scroll h1 a img.logo_b {opacity: 1; filter:alpha(opacity=1); -mox-opacity:1;}
#header:hover h1 a img.logo_w,
#header.scroll h1 a img.logo_w {opacity: 0; filter:alpha(opacity=0); -mox-opacity:0;}
#header:hover #topmenu .menu > li > a,
#header.scroll #topmenu .menu > li > a {color: #222;}
#header:hover .top_util a,
#header.scroll .top_util a {color: #222;}
#header:hover .top_util a:after,
#header.scroll .top_util a:after {background-color: #222;}

#header.scroll {height: 110px;}
#header.scroll h1 {margin-top: 42px;}
#header.scroll #topmenu .menu > li > a {line-height: 110px;}
#header.scroll .top_util {margin-top: 35px;}
#header.scroll #submenu {top: 110px;}

/* GNB */
#topmenu {position: absolute; top: 0; left: 50%; margin-left: -180px; font-family: 'Oswald', sans-serif; z-index: 10;}
#topmenu .menu > li {float: left; padding-right: 100px;}
#topmenu .menu > li:last-child {padding-right: 0;}
#topmenu .menu > li > a {font-size: 24px; font-weight: 600; color: #fff; line-height: 145px; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#topmenu .menu > li:hover > a {color: #0b5ea0 !important;}

#topmenu .submenu {display: none; position: absolute; width: 100%; padding-top: 35px;}
#topmenu .submenu ul li {font-family: 'Oswald', 'Noto Sans KR', Sans-serif; font-size: 17px; font-weight: 300; line-height: 28px;}
#topmenu .submenu ul li a {-webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#topmenu .submenu ul li a:hover {color: #0a5590;}

#submenu {display: none; position: absolute; top: 145px; left: 0; width: 100%; height: 292px; border-top: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf; background: #fff url('/images/common/logo_txt.png') no-repeat right bottom;}
#submenu .InfoArea {padding-top: 40px;}
#submenu .InfoArea p {padding-top: 15px; font-size: 16px; font-weight: 300; color: #666; line-height: 1.2;}

/* quick */
#quick {position: fixed; top: 50%; right: 45px; width: 56px; transform:translateY(-50%); z-index: 200;}
#quick ul li {margin-top: 10px;}
#quick ul li:first-child {margin-top: 0;}

/* allmenu */
#header .btn_menu {display: none;}
#allmenu {display: none;}

/*main contents*/
#mainVisual {position: relative; height: 100vh;}

#mainVisual .mainTxt {position: absolute; top: 40%; left: 0; width: 100%; text-align: center; color: #fff; line-height: 1.2; z-index: 150;}
#mainVisual .mainTxt p {font-family: 'Oswald', sans-serif; font-size: 70px;}
#mainVisual .mainTxt span {display: block; padding-top: 40px; font-size: 30px; font-weight: 500;}

#mainVisual .mainSlider div {vertical-align: top;}
#mainVisual .mainSlider .list {height: 100vh;}
#mainVisual .mainSlider .list .ImgArea {width: 100%; height: 100%; background-repeat: no-repeat; background-position: center top; background-size: cover;}
#mainVisual .mainSlider .slick-dots {position: absolute; left: 50%; bottom: 80px; width: 100px; margin-left: -600px; z-index: 210;}
#mainVisual .mainSlider .slick-dots ul {overflow: hidden;}
#mainVisual .mainSlider .slick-dots li {float: left; margin-left: 7px;}
#mainVisual .mainSlider .slick-dots li:first-child {margin-left: 0;}
#mainVisual .mainSlider .slick-dots li button {display: block; width: 14px; height: 14px; border: none; padding: 0; background: #ccc; font-size: 0; line-height: 0; text-indent: -9999px; border-radius: 100%; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#mainVisual .mainSlider .slick-dots li.slick-active button {background: #0b5ea0;}

.icon_scroll {position: absolute; left: 50%; bottom: 20px; margin-left: -17px; font-family: 'Oswald', sans-serif; font-size: 12px; color: #fff; z-index: 100; line-height: 1; animation: scroll 1.5s infinite; -webkit-animation: scroll 1.5s infinite; -o-animation: scroll 1.5s infinite;}
.icon_scroll span {display: block; padding-top: 40px; background: url('/images/main/icon_scroll.png') no-repeat center top;}
.icon_scroll.g {color: #999;}
.icon_scroll.g span {background-image: url('/images/main/icon_scroll_g.png');}

@keyframes scroll {
	0% {transform:translateY(-15px);}
	100% {transform:translateY(0);}
}

.main_section .fp-tableCell {padding-top: 65px;}

.main_titleArea {margin-bottom: 40px; word-break:keep-all;}
.main_titleArea > b {position: relative; display: block; padding-left: 50px; margin-bottom: 35px; font-family: 'Oswald', sans-serif; font-size: 16px; font-weight: 500; color: #000; line-height: 1;}
.main_titleArea > b:before {content:''; position: absolute; top: 50%; left: 0; width: 40px; height: 2px; margin-top: -1px; background: #000;}
.main_titleArea h2 {font-family: 'Oswald', 'Noto Sans KR', Sans-serif; font-size: 50px; font-weight: 500; color: #000; line-height: 1.2;}
.main_titleArea h2.kor {font-weight: 400;}
.main_titleArea p {padding-top: 15px; font-size: 28px; font-weight: 300; line-height: 1.4;}
.main_titleArea > span {font-family: 'Oswald', sans-serif; font-size: 17px; font-weight: 300; line-height: 1.4;}
.main_titleArea.w h2 {color: #fff;} 
.main_titleArea.w p {color: #e6e6e6;}
.main_titleArea.w > span {color: #fff;}

.main_prd .prdThumbSlider {display: inline-block; width: calc(50% + 84px); margin-left: -84px; vertical-align: middle;}
.main_prd .prdCon {display: inline-block; width: 49%; padding-left: 8%; vertical-align: middle; box-sizing: border-box;}
.main_prd .prdSlider .list:after {content:''; clear: both; display: block;}
.main_prd .prdSlider .list .TxtArea .prd_logo {padding-bottom: 18px; vertical-align: top;}
.main_prd .prdSlider .list .TxtArea p {font-size: 20px; font-weight: 300; line-height: 28px;}
.main_prd .prdSlider .list .TxtArea .btn_more01 {margin-top: 35px;}
.main_prd .prd_arrows {margin-top: 50px; font-size: 0;}
.prd_arrows .slick-arrow {display: inline-block; width: 60px; height: 60px; background-repeat: no-repeat; background-position: 0 0; background-size: 100%; font-size: 0; line-height: 0; text-indent: -9999px; vertical-align: top;}
.prd_arrows .slick-arrow.slick-prev {background-image: url('/images/common/btn/btn_prev.jpg');}
.prd_arrows .slick-arrow.slick-next {background-image: url('/images/common/btn/btn_next.jpg');}
.prd_arrows .slick-arrow.slick-prev:hover {background-image: url('/images/common/btn/btn_prev_ov.jpg');}
.prd_arrows .slick-arrow.slick-next:hover {background-image: url('/images/common/btn/btn_next_ov.jpg');}
.main_prd .prd_arrows .slick-arrow.slick-next {border-left: 1px solid #fff;}

.main_company_bg {height: 365px; background: url('/images/main/company_bg.jpg') no-repeat center top; background-size: cover;}

.main_about .inner {max-width: 100%;}
.main_about .main_titleArea {margin-bottom: 55px;}
.main_about .TXtArea {float: left; width: 58%; padding-left: calc((100% - 1200px)/2); box-sizing: border-box;}
.main_about .TXtArea .counterArea {overflow: hidden;}
.main_about .TXtArea .counterArea li {float: left; margin-left: 100px; font-family: 'Oswald', sans-serif;}
.main_about .TXtArea .counterArea li:first-child {width: 100px; margin-left: 0;}
.main_about .TXtArea .counterArea li .counter {display: block; font-size: 100px; font-weight: 500; color: #000; line-height: 1;}
.main_about .TXtArea .counterArea li span {display: block; padding-top: 32px; font-weight: 500; color: #0b5ea0; line-height: 1;}
.main_about .ImgArea {float: right; width: 42%;}
.main_about .ImgArea img {width: 100%;}


.main_line_banner {padding: 65px 0 70px; background: #0b5ea0;}
.main_line_banner .main_titleArea {display: inline-block; width: calc(100% - 415px); margin-bottom: 0; vertical-align: middle;}
.main_line_banner .btn_area {display: inline-block; vertical-align: middle;}
.main_line_banner .btn_area a {margin-left: 10px;}
.main_line_banner .btn_area a:first-child {margin-left: 0;}

.main_global .main_titleArea {margin-bottom: 0;}

.main_news {background: #efefef;}
.main_thumb_slide {position: relative; width: calc(100% + 40px); margin-left: -20px; margin-bottom: -20px;}
.main_thumb_slide .slick-slide {padding: 0 20px 20px 20px;}
.main_thumb_slide .list {border: 1px solid #d8d8d8; background: #fff; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
.main_thumb_slide .list:hover {-webkit-box-shadow: 4px 4px 14px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow:4px 4px 14px 0px rgba(0, 0, 0, 0.2); box-shadow:4px 4px 14px 0px rgba(0, 0, 0, 0.2);}
.main_thumb_slide .list a {display: block;}
.main_thumb_slide .list .ThumbArea {width: 100%; height: 230px; background-repeat: no-repeat; background-position: center top; background-size: cover;}
.main_thumb_slide .list .TxtArea {padding: 40px 30px;}
.main_thumb_slide .list .TxtArea .title {display: block; width: 100%; margin-bottom: 15px; font-family: 'Oswald', 'Noto Sans KR', Sans-serif; font-size: 24px; font-weight: 500; color: #000; line-height: 1; white-space: nowrap; text-overflow:ellipsis; overflow: hidden;}
.main_thumb_slide .list .TxtArea p {display:-webkit-box; height: 48px; font-weight: 300; color: #666; line-height: 24px; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.main_thumb_slide .prd_arrows .slick-arrow {position: absolute; top: 50%; margin-top: -30px; z-index: 10;}
.main_thumb_slide .prd_arrows .slick-arrow.slick-prev {left: -80px;}
.main_thumb_slide .prd_arrows .slick-arrow.slick-next {right: -80px;}

.main_certifi {position: relative;}
.main_certifi:after {content:''; position: absolute; right: 0; bottom: 0; width: 1213px; height: 173px; background: url('/images/common/logo_bg.jpg') no-repeat 0 0;}
.main_certifi .certifi_list {position: relative; max-height:350px; font-size:0; overflow:hidden; z-index: 10;}
.main_certifi .list .ImgArea {display:inline-block; padding:0 23px; text-align:center;}
.main_certifi .list img {height:270px; margin:0 auto; border:1px solid #d8d8d8;  overflow:hidden;}
.main_certifi .slick-slide {float:none !important; display:inline-block !important; vertical-align:middle;}
.main_certifi .slick-slide:nth-child(2n) img {height:230px;}
.main_certifi .slick-slide:nth-child(3n) img {height:200px;}

.main_contact {display: flex; flex-wrap:wrap; width: 100%; height: 100%;}
.main_contact .TxtArea {display: flex; width: 50%; padding-left: calc((100% - 1200px)/2); padding-right: 4%; background: url('/images/main/contact_bg.jpg') no-repeat center top; background-size: cover; vertical-align: middle; box-sizing: border-box; align-items: center;}
.main_contact .TxtArea .main_titleArea {margin-bottom: 30px;}
.main_contact .TxtArea .contact_info p {color: #f4f5f0;}
.main_contact .TxtArea .contact_info ul {margin-top: 10px; overflow: hidden;}
.main_contact .TxtArea .contact_info ul li {float: left; padding-left: 30px; margin-right: 64px; font-family: 'Oswald', Sans-serif; font-weight: 500; color: #fff;}
.main_contact .TxtArea .contact_info ul li:last-child {margin-right: 0;}
.main_contact .TxtArea .contact_info ul li.tel {background: url('/images/main/icon_tel.png') no-repeat 0 55%;}
.main_contact .TxtArea .contact_info ul li.mail {background: url('/images/main/icon_mail.png') no-repeat 0 90%;}
.main_contact .TxtArea .contact_info .btn_area {margin-top: 35px; overflow: hidden;}
.main_contact .TxtArea .contact_info .btn_area a {float: left; display: block; width: 200px; height: 50px; margin-right: 20px; line-height: 46px; border: 1px solid #c4c5c5; text-align: center; font-weight: 500; color: #fff; vertical-align: top; box-sizing: border-box;}
.main_contact .TxtArea .contact_info .btn_area a:last-child {margin-right: 0;}
.main_contact .TxtArea .contact_info .btn_area a span {display: inline-block;}
.main_contact .TxtArea .contact_info .btn_area a span.in {padding-left: 33px; background: url('/images/main/icon_inquiry.png') no-repeat 0 center;}
.main_contact .TxtArea .contact_info .btn_area a span.lo {padding-left: 25px; background: url('/images/main/icon_location.png') no-repeat 0 center;}
.main_contact .MapArea {position: relative; display: flex; width: 50%; height: 100%; vertical-align: middle;}
.main_contact .MapArea .root_daum_roughmap_landing {position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important;}
.main_contact .MapArea .root_daum_roughmap .wrap_controllers {display: none !important;}
.main_contact .MapArea .root_daum_roughmap .wrap_map {height: 100% !important;}

/* 서브비주얼 */
#subVisual {height: 554px; background: url('/images/common/subvisual_01.jpg') no-repeat center top; background-size: cover;}
#subVisual.subVsal02 {background-image: url('/images/common/subvisual_02.jpg');}
#subVisual .inner {height: 100%;}
#subVisual .tb {display: table; width: 100%; height: 100%; padding-top: 70px; box-sizing: border-box;}
#subVisual .tb .subv-title {display: table-cell; vertical-align: middle;}
#subVisual .subv-title h2 {font-size: 64px; font-weight: 600; color: #fff; line-height: 1;}
#subVisual .subv-title p {padding-top: 30px; font-size: 22px; color: #fff;}

/*sub navigation bar*/
#SNB {width:100%; height:70px; border-bottom:1px solid #dfdfdf;}
.SNBWrap {width:100%; max-width:1200px; margin:0 auto; line-height:70px;}
.SNBWrap:after {content:''; clear:both; display:block; width:0; height:0; font-size:0; line-height:0; visibility:hidden;}
.SNBWrap div {border-right:1px solid #dfdfdf; box-sizing:border-box;}
.SNBWrap .home {float:left; width:74px; height:70px; border-left:1px solid #dfdfdf; box-sizing: border-box;}
.SNBWrap .home a {display:block; width:100%; height:100%; background:url('/images/common/icon/icon_home.png') no-repeat center center; background-size:20px; font-size:0; line-height:0; text-indent:-9999px;}
.SNBWrap .depth {position:relative; float:left; width:270px; z-index:100;}
.SNBWrap .depth span {display:block; padding-right:20px; margin:0 24px; background:url('/images/common/icon/snb_arrow.png') no-repeat right center; font-size: 18px; font-weight:300; color:#666; cursor:pointer; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.SNBWrap .depth span.depthNone {background:none; cursor:default;}
.SNBWrap .depth ul {display:none; position:absolute; top:70px; left:-1px; padding:15px 0; width:100%; border:1px solid #dfdfdf; background:#fff;}
.SNBWrap .depth ul li {margin-top:10px; line-height:40px;}
.SNBWrap .depth ul li:first-child {margin-top:0;}
.SNBWrap .depth ul li a {display:block; padding:0 24px; font-weight:300; color:#666; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s;}
.SNBWrap .depth ul li a:hover {color:#0b5ea0;}

/*sub contents*/
.contentsArea {padding: 100px 0 150px;}

.contentsArea .TitleArea {position: relative; padding-bottom: 35px;}
.contentsArea .TitleArea h3 {font-size: 36px; font-weight: 600; line-height: 1.2;}
.contentsArea .TitleArea h3 b {font-family: 'Oswald', Sans-serif; font-size: 30px; font-weight: 500; color: #0b5ea0;}
.contentsArea .TitleArea h3 .eng {font-weight: 500;}

.contentsArea .section {margin-top: 100px;}

/* Tab Style */
.TabType01 {margin-bottom: 80px;}
.TabType01 ul {margin-top: -30px; font-size: 0; text-align: center;}
.TabType01 ul li {position: relative; display: inline-block; padding-bottom: 12px; margin-left: 70px; margin-top: 30px; font-family: 'Oswald', Sans-serif; font-size: 22px; font-weight: 500; vertical-align: top; line-height: 1;}
.TabType01 ul li:first-child {margin-left: 0;}
.TabType01 ul li a {color: #aaa;}
.TabType01 ul li.on:after {content:''; position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background: #0b5ea0;}
.TabType01 ul li.on a {color: #0b5ea0;}

/* 인사말 */
.Greeting .TitleArea {background: url('/images/common/logo_bg02.jpg') no-repeat right bottom;}
.Greeting .ImgArea {margin-bottom: 35px;}
.Greeting .greeting_con {font-size: 18px; font-weight: 300; line-height: 1.3; word-break:keep-all;}
.Greeting .greeting_con strong {display: block; padding-bottom: 35px; font-size: 26px; font-weight: 500;}
.Greeting .greeting_con p {padding-top: 10px;}
.Greeting .greeting_con p:first-of-type {padding-top: 0;}
.Greeting .greeting_con .ceo {text-align: right;}
.Greeting .greeting_con .ceo b {font-size: 24px; font-weight: 500;}

/* 회사소개 */
.contentsArea.Introduction {padding: 0 !important;}
.Introduction .inner {padding-top: 100px; padding-bottom: 150px; background: url('/images/common/logo_bg02.jpg') no-repeat right bottom;}
.Introduction ul {display:flex; flex-wrap:wrap;}
.Introduction ul li {display:flex; width: 31.6666666%; padding: 60px 0; margin-left: 2.5%; background: #f5f5f5; word-break:keep-all; line-height: 1.4;}
.Introduction ul li:first-child {margin-left: 0;}
.Introduction ul li div {width: 100%; padding: 0 4%; text-align: center; box-sizing: border-box;}
.Introduction ul li img {margin-bottom: 20px;}
.Introduction ul li strong {display: block; padding-bottom: 8px; font-size: 24px; font-weight: 500;}
.Introduction ul li span {display: block; font-weight: 300;}

/* 경영이념과 핵심가치 */
.Management .philosophy {padding: 105px 90px; background: url('/images/company/philosophy_img.jpg') no-repeat left top; background-size: cover;}
.Management .philosophy p {font-size: 44px; line-height: 1.2;}
.Management .philosophy p strong {font-weight: 600;}

.Management .value {margin-top: 15px;}
.Management .value ul {padding: 0 30px;}
.Management .value ul:after {content:''; clear: both; display: block;}
.Management .value ul li {position: relative; float: left; padding-left: calc((100% - 800px)/3); text-align: center;}
.Management .value ul li:first-child {padding-left: 0;}
.Management .value ul li:before {content:''; position: absolute; top: 100px; left: 0; width: 115px; height: 1px; background: url('/images/company/value_line.png') repeat-x 0 0;}
.Management .value ul li img {position: relative; z-index: 10;}
.Management .value ul li b {display: block; padding-top: 15px; font-family: 'Oswald', Sans-serif; font-size: 20px; font-weight: 500; line-height: 1;}
.Management .value ul li p {padding-top: 3px; font-size: 20px; font-weight: 300;}

/* 오시는길 */
.Location .root_daum_roughmap {width: 100% !important;}
.Location .location_info ul {margin-top: 30px; overflow: hidden;}
.Location .location_info ul li {float: left; margin-right: 40px; padding-left: 38px; margin-top: 10px; background-repeat: no-repeat; background-position: 0 0; font-family: 'Oswald', 'Noto Sans KR', Sans-serif; font-weight: 300; line-height: 30px;}
.Location .location_info ul li:last-child {margin-right: 0;}
.Location .location_info ul li b {font-weight: 500;}
.Location .location_info ul li.address {background-image: url('/images/company/icon_address.png');}
.Location .location_info ul li.tel {background-image: url('/images/company/icon_tel.png');}
.Location .location_info ul li.fax {background-image: url('/images/company/icon_fax.png');}
.Location .location_info ul li.mail {background-image: url('/images/company/icon_mail.png');}

/* 연혁 */
.contentsArea.History {padding-bottom: 0;}

.History .historyCon {position: relative;}
.History .historySlider .ThumbArea {padding: 120px 0; background-repeat: no-repeat; background-position: center 0; background-size: cover; text-align: center; color: #fff; line-height: 1;}
.History .historySlider .ThumbArea.thumb_01 {background-image: url('/images/company/history_01.jpg');}
.History .historySlider .ThumbArea.thumb_02 {background-image: url('/images/company/history_02.jpg');}
.History .historySlider .ThumbArea span {display: block; font-size: 50px; font-weight: 300;}
.History .historySlider .ThumbArea b {display: block; padding-top: 15px; font-family: 'Oswald', 'Noto Sans KR', Sans-serif; font-size: 78px; font-weight: 600;}

.History .historySlider .history_list {display: table; width: 100%; overflow: hidden;}
.History .historySlider .history_list .cols {position: relative; display: table-cell; width: 50%; padding: 75px 35px 150px; font-size: 18px; box-sizing: border-box; vertical-align: top;}
.History .historySlider .history_list .cols:last-child {padding-left: 0;}
.History .historySlider .history_list .cols:after {content:''; position: absolute; top: 0; left: 107px; width: 1px; height: 100%; background: #dfdfdf;}
.History .historySlider .history_list .cols:first-child:after {left: 142px;}
.History .historySlider .history_list .cols dl {margin-top: 35px; overflow: hidden; line-height: 1.2;}
.History .historySlider .history_list .cols dl:first-child {margin-top: 0;}
.History .historySlider .history_list .cols dl dt {position: relative; float: left; width: 106px; font-family: 'Oswald', Sans-serif; font-weight: 500;}
.History .historySlider .history_list .cols dl dt:after {content:''; position: absolute; top: 50%; right: -6.5px; width: 11px; height: 11px; transform:translateY(-50%); background: #0b5ea0; border-radius: 100%; z-index: 10;}
.History .historySlider .history_list .cols dl dd {float: left; width: calc(100% - 106px); padding-left: 35px; font-weight: 300; color: #666; box-sizing: border-box; word-break:keep-all;}
.History .historySlider .history_list .cols dl dd p {padding-top: 15px;}
.History .historySlider .history_list .cols dl dd p:first-child {padding-top: 0;}

.History .histsory_arrows a {position: absolute; top: 168px; width: 26px; height: 47px; background-repeat: no-repeat; background-position: 0 0; background-size: 100%; font-size: 0; line-height: 0; text-indent: -9999px; z-index: 10; opacity: 0.5; filter:alpha(opacity=50); -mox-opacity:0.5;}
.History .histsory_arrows a:hover {opacity: 1; filter:alpha(opacity=1); -mox-opacity:1;}
.History .histsory_arrows a.slick-prev {left: 30px; background-image: url('/images/company/btn_h_prev.png');}
.History .histsory_arrows a.slick-next {right: 30px; background-image: url('/images/company/btn_h_next.png');}

/* 제품 리스트 */
#subVisual.subVsal02.list {height: auto; padding-bottom: 70px; background-image: url('/images/common/subvisual_prd.jpg');}
#subVisual .visual_slider_wrap {padding-top: 177px;}
#subVisual .prdThumbSlider {display: inline-block; width: 46%; vertical-align: middle;}
#subVisual .prdCon {position: relative; display: inline-block; width: 47.5%; margin-left: 6%; color: #fff; vertical-align: middle;}
#subVisual .prdCon:before {content:''; position: absolute; top: -35px; left: -40px; width: 83px; height: 83px; background: url('/images/product/prd_tt_bg.png') no-repeat 0 0; background-size: 100%;}
#subVisual .prdSlider .TxtArea .category {position: relative; display: block; margin-bottom: 40px; font-family: 'Oswald', Sans-serif; font-size: 56px; font-weight: 500; line-height: 1.2;}
#subVisual .prdSlider .TxtArea img {margin-bottom: 25px;}
#subVisual .prdSlider .TxtArea p {font-size: 20px; font-weight: 300; line-height: 1.4; word-break:keep-all;}

#subVisual .progressBarContainer {margin-top: 50px;}
#subVisual .progressBarContainer ul {overflow: hidden;}
#subVisual .progressBarContainer ul li {float: left; margin-left: 20px; font-family: 'Oswald', Sans-serif; color: #fff; cursor: pointer;}
#subVisual .progressBarContainer ul li:first-child {margin-left: 0;}
#subVisual .progressBarContainer ul li b {font-size: 18px; font-weight: 300;}
#subVisual .progressBarContainer ul li.on b {font-weight: 600;}
#subVisual .progressBarContainer ul li .progressBar {display: inline-block; width: 0; height: 2px; margin-left: 0; margin-top: -4px; background: rgba(255,255,255,0.3); vertical-align: middle; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#subVisual .progressBarContainer ul li.on .progressBar {width: 65px; margin-left: 5px;}
#subVisual .progressBarContainer ul li .progressBar .inProgress {height: 2px; background: #fff;}

#subVisual .arrows a {position: absolute; top: 50%; display: block; width: 32px; height: 62px; margin-top: -31px; background-repeat: no-repeat; background-position: 0 0; background-size: 100%; font-size: 0; line-height: 0; text-indent: -9999px; opacity: 0.5; filter:alpha(opacity=50); -mox-opacity:0.5; -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s;}
#subVisual .arrows a.slick-prev {left: -170px; background-image: url('/images/product/visual_prd_prev.png');}
#subVisual .arrows a.slick-next {right: -170px; background-image: url('/images/product/visual_prd_next.png');}
#subVisual .arrows a:hover {opacity: 1; filter:alpha(opacity=1); -mox-opacity:1;}

.prdInfo {display: table; width: 100%; margin: 60px 0; overflow: hidden;}
.prdInfo .TxtArea {display: table-cell; width: calc(100% - 500px); padding: 0 4%; background: #f5f5f5; text-align: center; vertical-align: middle; box-sizing: border-box;}
.prdInfo .TxtArea p {padding-top: 30px; font-size: 22px; font-weight: 300; line-height: 1.2; word-break:keep-all;}
.prdInfo .ThumbArea {display: table-cell; width: 480px; padding-left: 20px; vertical-align: middle;}

/* 회원단 공통 */
#MemBody {width:100%; padding:0px 0; margin-top:0px; position:relative;}
#MemBody caption {display:none;}
#MemBody textarea { width:100%; height:200px;border:1px solid #ddd; color:#666; overflow-x:hidden; padding:5px; box-sizing:border-box;}

/* 로그인 */
.login #MemBody {padding:50px 0;}
.login #MemBody .login_title {margin-bottom:25px; padding-top:145px; background:url('/images/member/icon_login02.png') no-repeat center 0; text-align:center;}
.login #MemBody .login_title h4 {font-size:36px; font-weight:600; color:#222; letter-spacing:-0.25px;}
.login #MemBody .login_title p {padding-top:20px; font-size:18px; font-weight:300; letter-spacing:-0.2px;}
.login #MemBody .login_con {width:440px; margin:0 auto;}
.login #MemBody .login_con table {width:100%;}
.login #MemBody .login_con table input.text {width:285px; height:38px; background:#f9f9f9;}
.login #MemBody .login_con .login_util {border-top:1px solid #bfbfbf; margin-top:20px; padding-top:20px; overflow:hidden;}
.login #MemBody .login_con .login_util ul {float:left;}
.login #MemBody .login_con .login_util ul li {display:inline-block; padding-left:11px; margin-left:10px; background:url('/images/member/login_gap.gif') no-repeat 0 center; font-size:14px; letter-spacing:-0.2px; line-height:30px;}
.login #MemBody .login_con .login_util ul li:first-child {padding-left:0; margin-left:0; background:none;}
.login #MemBody .login_con .login_util ul li:hover a {text-decoration:underline;}
.login #MemBody .login_con .login_util .btn_black {float:right;}
.login .save {margin-top:-3px; margin-right:6px;}

/* 회원가입 - 약관동의 */
#MemBody.join_agree .info_check_box {padding:30px 20px; border:1px solid #cccccc; background:#f3f3f3; text-align:center;}
#MemBody.join_agree .join_agree_box {margin-top:30px;}
#MemBody.join_agree .info_check_box input.mem_name {width:100px;}
#MemBody.join_agree .info_check_box input.mem_email {width:200px;}
#MemBody.join_agree .join_agree_box .title {position:relative; display:block; margin-bottom:10px; padding-left:15px; font-size:17px;}
#MemBody.join_agree .join_agree_box .title:before {content:''; display:block; position:absolute; top:50%; left:0; width:5px; height:18px; margin-top:-9px; background:#977b5d;}
#MemBody.join_agree .join_agree_box .agree_check {padding:10px; background:#f5f5f5;}

/* 아이디/비번 찾기 */
#findIdpw {overflow:hidden;}
#findIdpw h4 {margin-bottom:20px; font-size:18px; font-weight:600; text-align:left; color:#222;}
#findIdpw .over {overflow:hidden;}
#findIdpw .find { display:inline-block; width:440px; height:260px; background:#f5f5f5; padding:40px 50px; border:1px solid #cfcfcf;}
#findIdpw .find p {padding-bottom:20px; margin-bottom:20px; border-bottom:1px dashed #c3c3c3; font-size:15px; color:#393939; line-height:22px; letter-spacing:-0.8px;}
#findIdpw .find p .blue {text-decoration:underline;}
#findIdpw .findTable {width:100%;}
#findIdpw .findTable th, 
#findIdpw .findTable td {padding:2px 2px;}
#findIdpw .findTable td input.text {width:310px; height:40px;}
#findIdpw .btn_idpw01 {width:104px; height:88px; line-height:88px;}
#findIdpw .btn_idpw02 {width:104px; height:134px; line-height:134px;}
#findIdpw.idpw_result .find {display:block; width:auto; height:auto; margin:0 auto; text-align:center;}
#findIdpw.idpw_result .find {padding-bottom:20px;}
#findIdpw.idpw_result .btnArea {width:280px; margin:0 auto;}

/*개인정보 / 이용약관*/
.rule-txt-area {}
.rule-txt-area textarea { width:100%; height:500px;  padding:10px 15px; border:1px solid #ddd; background: #f9f9f9; box-sizing:border-box; line-height:1.4;}	
.rule-txt-area .rul-btn-box { margin-top:50px; text-align:center;  }

/*전자결제(pay)*/
.pay {background:#fff; width:94%; padding:3%; margin-bottom:0px; margin-left:0; margin-right:0; margin-top:0;}
.pay h3 {position:relative; font-size:22px; margin-bottom:20px;  padding-left:15px; font-weight:600; color:#222;}
.pay h3:before {content:''; display:block; position:absolute; top:50%; left:0; width:5px; height:20px; margin-top:-10px; background:#977b5d;}
.pay h4 {font-size:16px; margin-bottom:10px; color:#222;}
.pay .mgB30 {margin-bottom:30px;}
.pay #Board .privacy .textarea {font-size:13px; line-height:20px;}
.pay .btnArea {text-align:center; margin-top:25px}

/*foot*/
#foot {width:100%; padding: 50px 0; background:#181818; font-size: 15px; font-weight: 300; color: #666; line-height: 24px;}
#foot .f_util {padding-bottom: 10px;}
#foot .f_util a {color: #d2d2d2;}
#foot address span {display: inline-block; margin-right: 18px;}
#foot .copy {font-size: 13px;}
#foot .copy a {color: #666;}

/* 관리자 로그인 */
.divbox {display:none; left:50%; position:absolute;	z-index: 1;}
.divbox .text {width:150px;}
div#box {width:400px; margin-left:-200px; text-align:center; background-color:#fff; position:fixed; left:50%; bottom:300px; z-index:9999; padding:40px 30px 20px 30px; border:5px solid #eee;}
div#box .login_center{overflow:hidden; padding:30px 0;  border-top:1px solid #222;  border-bottom:1px solid #bbb;}
div#p_input {text-align:center;}
div#p_input span.label {display:inline-block; width:90px; padding-right:10px; text-align:right;}
div.login_foot {clear:both; text-align:center; margin-top:20px;}




/*===============================================================*/
/*======================= PC 1280 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:1280px){

.inner {max-width: 100%; padding: 0 4%;}

/* header */
#header .top_util a {margin-left: 15px;}

/* GNB */
#topmenu {margin-left: -160px;}
#topmenu .menu > li {padding-right: 80px;}

/*main contents*/
#mainVisual .mainSlider .slick-dots {left: 4%; margin-left: 0;}

.main_prd .prdCon {padding-left: 4%;}

.main_about .TXtArea {float: none; width: 100%; padding-left: 0;}
.main_about .ImgArea {width: 70%; margin-top: 50px;}

.main_line_banner .main_titleArea {display: block; width: 100%;}
.main_line_banner .btn_area {display: block; margin-top: 50px;}

.main_thumb_slide .prd_arrows .slick-arrow.slick-prev {left: calc(-4vw + 20px);}
.main_thumb_slide .prd_arrows .slick-arrow.slick-next {right: calc(-4vw + 20px);}

.main_contact .TxtArea {padding-left: 4%;}

/* Tab Style */
.TabType01 ul li {margin-left: 60px;}

/* 제품 리스트 */
#subVisual .prdCon {margin-left: 4%;}
#subVisual .prdSlider .TxtArea .category {font-size: 45px;}


}

.lnk-btn {
	position: absolute; bottom:120px;left:50%;margin: 0 0 0 -100px;
	display: inline-block;width: 200px;height: 50px;border: 1px solid #0b5ea0;
	background: #fff;font-family: 'Oswald', sans-serif;font-size: 18px;font-weight: 500;text-align: center;
	color: #0b5ea0;line-height: 48px;box-sizing: border-box;
}
.video-background-contain {  position:absolute; left:0; top:50%; right:0; bottom:0;  width:100%; height:1080px; /* background-color:#ccc; */ z-index:1; box-sizing: border-box; overflow:hidden; transform:translate(0, -50%);}
.video-foreground,
.video-background-contain iframe {   position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  pointer-events: none;  box-sizing: border-box; }

@media (min-aspect-ratio: 16/9) {
  .video-foreground { height: 300%; top: -100%; }
}
@media (max-aspect-ratio: 16/9) {
  .video-foreground { width: 300%; left: -100%; }
}

.movArea {margin-top:40px;position:relative;width:100%;height: auto;padding-top: 50%;}
.movArea iframe {z-index: 1;top: 0;left: 0;position: absolute;width: 100%;height: 100%;}