@charset "utf-8";

@import url('https://fonts.googleapis.com/earlyaccess/notosanskr.css');

html {height: 100%; overflow-y: auto;}
body {height: auto; overflow-x: hidden; margin-top: 0 !important; min-width: 320px; color: #333; line-height: 26px; font-size: 16px; font-family: 'Noto Sans KR', sans-serif; letter-spacing: -0.25px; word-break: break-all; word-wrap: break-word; word-break: keep-all; font-weight: 400; }
h1, h2, h3, h4, h5, h6 { font-family: 'Noto Sans KR', sans-serif;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, blockquote, th, td, p, button {margin: 0; padding: 0; -webkit-text-size-adjust: none;}
fieldset, img, abbr, acronym {border: 0 none;}
legend {position: absolute; height: 0; line-height: 0; font-size: 0; overflow: hidden;}
legend.showlegend {position: static; line-height: 14px; font-size: 12px; overflow: visible;}
address, caption, cite, code, dfn, em, var {font-style: normal; font-weight: normal;}
ol, ul {list-style: none;}
q:before, q:after {content:'';}
table {border-collapse: collapse; border-spacing: 0;}
caption {height: 0; line-height: 0; font-size: 0; overflow: hidden; text-indent: -10000px;}
hr {display: none;}
a { color: #333; text-decoration: none; cursor: pointer;}
button {border: 0 none; background: none;}
button::-moz-focus-inner,input::-moz-focus-inner {border: 0; padding: 0;}
button, input, select, textarea { color: #555; line-height: 19px; font-size: 15px; font-family: 'Noto Sans KR', sans-serif; vertical-align: middle;}
select { -webkit-border-radius: 0;}
textarea {overflow: auto; resize: none;}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {cursor: pointer; overflow: visible; -webkit-appearance: button;}
input[type="checkbox"],
input[type="radio"] {width: 14px; height: 14px; line-height: 14px; box-sizing: border-box; -webkit-border-radius: 0;}
input[type="search"] {-webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box;}
input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}

input::-webkit-input-placeholder{color:#a0a0a0;}
input:-moz-input-placeholder{color:#a0a0a0;}
input::-moz-input-placeholder{color:#a0a0a0;}
input:-ms-input-placeholder{color:#a0a0a0;}
img {  vertical-align: top; }

textarea::-webkit-input-placeholder {
color: #a0a0a0;
}

textarea:-moz-placeholder { /* Firefox 18- */
color: #a0a0a0;  
}

textarea::-moz-placeholder {  /* Firefox 19+ */
color: #a0a0a0;  
}

textarea:-ms-input-placeholder {
color: #a0a0a0;  
}
select 
{
    appearance: none;
	-moz-appearance: none;
  -webkit-appearance: none;
  background-image: url(../../images/contents/select_arrow.png);background-repeat: no-repeat;
  background-position: calc(100% - 15px) center;
 
}

select::-ms-expand {
    display: none;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, object {display: block; margin: 0; padding: 0;}
audio[controls], canvas, video {display: inline-block; *display: inline; *zoom: 1;}

/* Disable orange highlight */
label, a, button {-o-tap-highlight-color:rgba(0, 0, 0, 0);-ms-tap-highlight-color:rgba(0, 0, 0, 0);-moz-tap-highlight-color rgba(0, 0, 0, 0);-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}

/* global */
.fl {float:left;}
.fr {float:right;}
/* 건너뛰기 네비게이션 */
#skip_nav {width: 100%; height: 0; text-align: center; overflow: hidden;}
#skip_nav a {color: #fff; font-size: 16px; line-height: 30px; font-weight: 800; float: left;}
#skip_nav a:focus, 
#skip_nav a:hover, 
#skip_nav a:active {position: absolute; top: 0; left: 0; width: 100%; height: 30px; text-decoration: underline; background-color: #000; overflow: visible; z-index: 9999;}


/* style */
.inner{max-width: 1200px;margin: 0 auto;position: relative;}
#warp div[class^=area], #warp .tabBox {position: relative; width: 100%; box-sizing:border-box;} 
div[class^=content] img, .img_box img {max-width:100%}

.pc_only {}
.m_only {display: none;}
.taC {text-align: center;}

/* wrap */
.area01 {padding-top: 20px; height: 840px;background: url(../images/bg01_2020_B.jpg) no-repeat 50%;-webkit-background-size: cover;background-size: cover; box-sizing:border-box;}

/* tab */
.tabWrap {position: relative;width: 100%;text-align: left;z-index:1;margin-top: -67px;height: 67px;}
.tabWrap.on .tabWrap_inner {position: fixed;left: 0;width: 100%;top:0;z-index:99;background-color: ;}
.tabWrap ul {background-color: #fff;margin: 0 auto;max-width:742px;font-size:0;}
.tabWrap li {display: inline-block;width: 33.333%;vertical-align: top;font-size:16px;box-sizing:border-box;text-align: center;}
.tabWrap li a {display: block;padding: 0 10px;font-size:25px;letter-spacing:-0.4px;border-right: 1px solid #ddd; line-height:65px;color: #444;box-sizing:border-box;transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;}
.tabWrap li:last-child a { border-right:none; }
.tabWrap li.on a {background-color: #ff6600;color: #fff;border: 1px solid #ff6600;}

.tabContWrap {}
.tabContWrap .tabBox {display: none;}

.tabContWrap .tabBox .topCont div[class^=btn] {padding-left: 48px;padding-right: 124px;}
.tabContWrap .tabBox01 { width:100%; }
.tabContWrap .tabBox01 .topCont {position: relative;box-sizing:border-box; width:100%; background: url(../images/img02_2020_B.jpg) no-repeat 50%; background-size: cover;}
.tabContWrap .tabBox01 .topCont .inner {position: static;padding-right: 600px;  padding-bottom: 40px; min-height:551px;text-align: left;box-sizing:border-box;}
.tabContWrap .tabBox01 .topCont .content02 {padding-top: 118px;margin-bottom: 20px;}
.tabContWrap .tabBox01 .topCont .img02 {position: absolute;left:50%;top: 0;bottom: 20px;right: 27px;max-width:936px; display: none; }
.tabContWrap .tabBox01 .topCont .img02 img {/* height: 100%; */}
.tabContWrap .tabBox01 .botCont .inner {padding-top: 58px;padding-bottom: 49px;box-sizing: border-box;}
.tabContWrap .tabBox01 .botCont {position: relative; width:100%; box-sizing: border-box; background: #f2f2f2;}
.tabContWrap .tabBox01 .botCont:before {position: absolute;content: '';left: 50%;top: 0;bottom: 24px; margin-left: -936px; }

.tabContWrap .tabBox02 {background: #f2f2f2; }
.tabContWrap .tabBox02 .topCont {position: relative; box-sizing:border-box; width:100%; background: url(../images/img04_2020_B.jpg) no-repeat 50%; background-size: cover;}
.tabContWrap .tabBox02 .topCont .inner {position: static;/* padding-left: 48px; */padding-right: 600px;  padding-bottom: 40px; min-height:551px;text-align: left;box-sizing:border-box;}
.tabContWrap .tabBox02 .topCont .content04 {padding-top: 118px;margin-bottom: 20px;}
.tabContWrap .tabBox02 .topCont .img04 {position: absolute;left:50%;top: 0;right: 27px;bottom: 20px;max-width:936px;display: none;}
.tabContWrap .tabBox02 .topCont .img04 img {/* height: 100%; */}
.tabContWrap .tabBox02 .botCont .inner {padding-top: 58px;padding-bottom: 49px;box-sizing: border-box;}
.tabContWrap .tabBox02 .botCont {position: relative;padding: 0 27px 24px; box-sizing: border-box; background: #f2f2f2;}
.tabContWrap .tabBox02 .botCont:before {position: absolute;content: '';left: 50%;top: 0;bottom: 24px; margin-left: -936px;}

.tabContWrap .tabBox03 {background: #f2f2f2;}
.tabContWrap .tabBox03 .topCont {position: relative; box-sizing:border-box; width:100%; background: url(../images/img06_2020_B.jpg) no-repeat 50%; background-size: cover;}
.tabContWrap .tabBox03 .topCont .inner {position: static;/* padding-left: 48px; */padding-right: 600px; padding-bottom: 40px; min-height:551px;text-align: left;box-sizing:border-box;}
.tabContWrap .tabBox03 .topCont .content06 {padding-top: 118px;margin-bottom: 20px;}
.tabContWrap .tabBox03 .topCont .img06 {position: absolute;left:50%;top: 0;right: 27px;bottom: 20px;max-width:936px;display: none; background: url(../images/img06.jpg) no-repeat left 50%;-webkit-background-size: cover;background-size: cover;}
.tabContWrap .tabBox03 .topCont .img06 img {/* height: 100%; */}
.tabContWrap .tabBox03 .botCont .inner {padding-top: 58px;padding-bottom: 49px;box-sizing: border-box;}
.tabContWrap .tabBox03 .botCont {position: relative;padding: 0 27px 24px; box-sizing: border-box; background: #f2f2f2;}
.tabContWrap .tabBox03 .botCont:before {position: absolute;content: '';left: 50%;top: 0;bottom: 24px;width: 100%;max-width:1872px; margin-left: -936px;}

.area02 {/* height: 635px; */padding-bottom: 140px;padding-top: 49px;box-sizing:border-box;}
.area02 .content08 {position: relative;width: 100%;}
.area02 .content08 .btn08 {position: absolute;display: inline-block;left: 50%;width: 100%;padding: 0 42%;bottom: -18%;transform: translateX(-50%);-webkit-transform: translateX(-50%);box-sizing:Border-box;}

@media screen and (max-width: 1920px) {
	.tabContWrap .tabBox01 .botCont:before, .tabContWrap .tabBox02 .botCont:before, .tabContWrap .tabBox03 .botCont:before {margin-left: 0;left: 26px;right: 26px;width: auto;}
}
@media screen and (max-width: 767px) {
	.inner{padding: 0 30px;box-sizing:border-box;}
	.pc_only {display: none;}
	.m_only {display: block;}
	img.m_only {display: inline-block;}
	.tabContWrap .tabBox .topCont, .tabContWrap .tabBox .botCont {padding: 0;}
	.tabContWrap .tabBox .topCont div[class^=img] {background: none;}
	.tabContWrap .tabBox .topCont div[class^=btn] {padding: 0 53px;}
	.tabContWrap .tabBox .botCont:before  {display: none;}
	.area01{height: auto;padding: 0;}
	.area01 .inner {padding: 0;}
	.tabContWrap .tabBox01 .topCont .img02, .tabContWrap .tabBox02 .topCont .img04, .tabContWrap .tabBox03 .topCont .img06 {display: block;}

	.tabContWrap .tabBox01 .topCont {background-image: url(../images/snow_mo.png);-webkit-background-size: 100% auto;background-size: 100% auto; background:#f2f2f2; }
	.tabWrap li a {display: block;padding: 0 10px;font-size:16px;letter-spacing:-0.4px;line-height:40px;}

	.tabContWrap .tabBox01 .topCont .inner, .tabContWrap .tabBox02 .topCont .inner, .tabContWrap .tabBox03 .topCont .inner {padding: 0 30px 15px;text-align: center;}
	.tabContWrap .tabBox .topCont .inner div[class^=content] {margin: 0 -30px;}
	.tabContWrap .tabBox01 .topCont .img02, .tabContWrap .tabBox02 .topCont .img04, .tabContWrap .tabBox03 .topCont .img06 {position: static;padding-top: 50px;margin-left: 0;}
	.tabContWrap .tabBox01 .topCont .img02 img, .tabContWrap .tabBox02 .topCont .img04 img, .tabContWrap .tabBox03 .topCont .img06 img {height: auto; width:100% !important;}
	.tabContWrap .tabBox01 .topCont .content02, .tabContWrap .tabBox02 .topCont .content04, .tabContWrap .tabBox03 .topCont .content06 {padding-top: 0;margin-bottom: 17px;}
	.tabContWrap .tabBox01 .topCont .content02 .m_tit, .tabContWrap .tabBox02 .topCont .content04 .m_tit, .tabContWrap .tabBox03 .topCont .content06 .m_tit {margin-bottom: 18px;}
	


/* 	.tabContWrap .tabBox01 {background: #595757 url(../images/bg02_mo.jpg) no-repeat 50%;-webkit-background-size:  auto 100%;background-size: auto 100%;} */
	.tabContWrap .tabBox .botCont .inner {padding: 0 30px 20px;}
/*	.tabContWrap .tabBox02 .botCont .inner, .tabContWrap .tabBox03 .botCont .inner {padding: 40px 40px 64px;} */
	.tabContWrap .tabBox .botCont .inner .m_img {padding: 30px 20px 0;box-sizing:Border-box;}
	.tabContWrap .tabBox02 .botCont:before, .tabContWrap .tabBox03 .botCont:before {left: 13px;right: 13px;}
	.tabContWrap .tabBox02 .topCont, .tabContWrap .tabBox03 .topCont { background: none; }

	.area02 {padding-top: 0;padding-bottom: 0;}
	.area02 .inner {padding: 0;}
	.area02 .content08 .btn08 {display: block;width: 100%;bottom: 22%;padding: 0 72px;box-sizing: border-box;}

    .tabWrap {height: 42px; margin-top: -42px; }
    
}

@media screen and (max-width: 460px) {
	.tabContWrap .tabBox .topCont div[class^=btn] {padding: 0 53px;}
	.tabContWrap .tabBox01 .topCont .inner, .tabContWrap .tabBox02 .topCont .inner, .tabContWrap .tabBox03 .topCont .inner {padding:0 15px 15px; text-align: center;}
	.tabContWrap .tabBox .topCont .inner div[class^=content] {margin: 0 -15px;}

	.inner{padding: 0 15px;box-sizing:border-box;}
	.tabContWrap .tabBox .botCont .inner {padding: 0 15px 15px;}

}
}