* {box-sizing: border-box;}
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);
/*reset*/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video, button, input, select, textarea {
    margin: 0;
    padding: 0;
    font: inherit;
    vertical-align: top;
}
button,input {border-radius: 0}
fieldset,img {border: 0}
ol,ul {list-style: none}
address,em {font-style: normal}
a {text-decoration: none}
iframe {
    overflow: hidden;
    margin: 0;
    padding: 0;
    border: 0
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main {display: block;}
h1,h2,h3,h4,h5,h6 {font-weight: normal}
.blind {position: absolute;overflow: hidden;clip: rect(0 0 0 0);margin: -1px;width: 1px;height: 1px}
button {cursor:pointer;}
button, input, select {vertical-align: middle;}

/*테이블 칸 여백빼기, 선합치기*/
table {border-spacing: 0; border-collapse:collapse;}

/*스킵네비게이션*/
#accessibilityLink {
    position: relative;
    top: 0;
    left: 0;
    z-index: 999999;
}
#accessibilityLink a {
    position: absolute;
    left: 0;
    top: -9999px;
    background: #333;
    color: #fff;
    height: 30px;
    line-height: 30px;
    text-align: center;
    font-size: 12px;
    width: 100%;
}
#accessibilityLink a:focus, #accessibilityLink a:active { 
    top: 0; 
}

/*영문단어 중단점을 음절로 처리,주로 모바일에서 사용*/
body {
    word-break: break-all;
/*    아이폰사파리에서 뷰포트크기 변경시 텍스트확대 방지*/
    -webkit-text-size-adjust:none;
}


/*공통스타일*/
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: rgba(255,255,255,0.3);
}
::-moz-placeholder { /* Firefox 19+ */
  color: rgba(255,255,255,0.3);
}
:-ms-input-placeholder { /* IE 10+ */
  color: rgba(255,255,255,0.3);
}
:-moz-placeholder { /* Firefox 18- */
  color: rgba(255,255,255,0.3);
}



@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);

body,input,button,textarea,select,table {
    font-size: 12px;
    font-family:'Noto Sans KR', 'Malgun Gothic', sans-serif;
}
html,body {height: 100%;}
body { color: #333; overflow-x: hidden;}
body a {color: #555;}
body.on {overflow-y: hidden;}


body{padding:0; margin:0;} 

.pop{ 
  position:absolute;
  top:0;right:0;bottom:0;left:0;
  display:-webkit-box;
  display:-moz-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex;
 
  align-items:center;
  justify-content:center;
  -webkit-align-items:center;
  -webkit-justify-content:center;
 
  -webkit-box-pack:center;
  -webkit-box-align:center;
  -moz-box-pack:center;
  -moz-box-align:center;
  -ms-box-pack:center;
  -ms-box-align:center;
}



 .swiper-container {
        width: 100%;
        height: 100%;
    }
    .swiper-slide {
        text-align: center;
        font-size: 18px;


        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
		


.m-bottom {position:fixed; bottom: 0; left: 0; right: 0; z-index: 99991; width: 100%; max-width: 500px; margin: 0 auto;}
.page-btn {width: 80%; left: 0; right: 0; margin: 0 auto; position: absolute; top: 31%;}
.page-prev {position: absolute; left: 0; opacity: 0; margin-top: -30px; }
.page-next {position: absolute; right: 0; opacity: 0; margin-top: -30px;  }


.swiper-pagination4 { width: 13%; height: 10px; position: absolute; left: 0; right:0; margin: 0 auto; z-index: 9; display: flex; justify-content: space-between; position: absolute;bottom: 32vw; }
.swiper-pagination-bullet { width: 10px; height: 10px; border-radius: 0; margin-left: 1px; opacity: 1;  border-radius: 100%; position: relative; border: 1px solid #419b7e !important; background: none !important; }
.swiper-pagination4 .swiper-pagination-bullet:after { content:''; width: 10px; height: 10px; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto;  border-radius: 100%; }
.swiper-pagination4 .swiper-pagination-bullet-active:after { content:''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; border-radius: 100%;background-color: #419b7e !important; }
.swiper-pagination>span:nth-child(1) { margin-left: 0; }

.wrap_m {
    width: 100%;
    max-width: 500px;
    background: #fff;
    margin: 0 auto; 
	overflow:hidden
	}

ul.tabs {
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    width: 100%;
    font-size:13px;
	border-left: 1px solid #ddd;
	height:40px;
}
ul.tabs li { margin-bottom:-1px; color:#444;
    float: left;
    text-align:center;
    cursor: pointer;
    width:16.5%;
    height: 39px;
    line-height: 39px;
    border: 1px solid #ccc;
    border-left: none;
    font-weight: 600;
    background: #eee;
    overflow: hidden;
    position: relative;
	
}
ul.tabs li.active { color:#f8981c;
    background: #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
}

ul.tabs li.selected { color:#fff;
    background: #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
}
.tab_container {
    border: none;
    border-top: none;
    clear: both;
    float: left;
    width: 100%;
    background: #FFFFFF;max-width:900px;
}
.tab_content { position: absolute;
    margin:40px 0px 0px 0px; padding-right:60px;
    font-size: 1em;
    display: none;
}
.tab_container .tab_content ul {
    width:100%;
    margin:0px;
    padding:0px;
}
.tab_container .tab_content ul li {
    padding:5px;
    list-style:none;
}
 #container {
    width: 1100px;
    margin: 0 auto;
}




/* #main{width: 100%; height: 1000px;background: url(../img/main01.jpg) center no-repeat;position: relative;} */



#container2{ padding-left:0px; padding:5px 0 100px 0;} 

ul.tabs2 { font-family:'Noto Sans KR', 'Malgun Gothic', dotum, '돋움', '굴림', Gulim, sans-serif;
    margin: 0;
    padding: 0;
    margin:0 auto;
	text-align:center;
    list-style: none;
    width: 100%;
    font-size:14px;
	height:40px;
}


ul.tabs2 li {  color:#232222;
    float: left;
    text-align:center;
    cursor: pointer;
    width:16.5%;
    height: 45px;
    line-height: 35px;
    border: 1px solid #ccc;
    font-weight: 400;
    background: #fff;
    overflow: hidden;
    position: relative;
	
}


ul.tabs2 li.selected, ul.tabs li.selected:hover
{
    position: relative;
    top: 0px;
	color:#fff; background: #d3660e; border:none;}
	
ul.tabs2 li.selected a, ul.tabs li.selected a:hover { color:#fff;}
        

ul.tabs2 li a {  font-size:10px; text-decoration: none; color:#444; line-height:49px;}
        
ul.tabs2 li.selected a:hover
{
    text-decoration: none;
}

ul.tabs2 li.selected
{
   color:#fff;
}

ul.tabs2 li.active { color:#555;  }




.tab_container2 {
    border: none;
    border-top: none;
    clear: both;
    float: left;
    width: 100%;
    background: #FFFFFF;max-width:900px;
}
.tab_content2 { position: absolute;
    margin:40px 0px 0px 0px; padding-right:60px;
    font-size: 1em;
    display: none;
}
.tab_container2 .tab_content2 ul {
    width:100%;
    margin:0px;
    padding:0px;
}
.tab_container2 .tab_content2 ul li {
    padding:5px;
    list-style:none;
}
 #container2 {
    width: 1100px;
    margin: 0 auto;
}
	


		

		


/*tabs3*/	

#t-container3 { width: 82%; position: relative; left: 0; right: 0; margin: 0 auto;}
ul.tabs3 { font-family:'Noto Sans KR', 'Malgun Gothic', dotum, '돋움', '굴림', Gulim, sans-serif;
    margin: 0 auto;
    padding: 0;
    float: left;
    list-style: none;
    width: 100%;
    font-size:12px;
	height:40px;  margin-bottom:20px;
}


ul.tabs3 li { margin-bottom:-1px; color:#747474; margin-left:0px;
    float: left;
    text-align:center;
    cursor: pointer;
    width:33.3%;
    height:40px;
    line-height: 46px;
    border-bottom: 5px solid #747474!important;
    font-weight: 400;
    background: none;
    overflow: hidden;
    position: relative; margin-left: 2%;
	
}


ul.tabs3 li.selected, ul.tabs3 li.selected:hover
{
    position: relative;
    top: 0px;
	color:#008c8d; background: none;
	border:none; 
	}
	
ul.tabs3 li.selected a, ul.tabs3 li.selected a:hover { color:#008c8d; border-bottom: 5px solid #008c8d;}
        

ul.tabs3 li a {  font-size:14px; font-weight:400; text-decoration: none; color:#747474; line-height:38px; display: block;}
        
ul.tabs3 li.selected a:hover
{
    text-decoration: none;
}

ul.tabs3 li.selected
{
   color:#008c8d;  border-bottom: 5px solid #008c8d!important;
}

ul.tabs3 li.active { color:#008c8d;   border-bottom: 5px solid #008c8d;}






.sec04{position: relative;overflow: hidden; width: 100%; height: auto;}



@keyframes lineon {
	from { opacity: 1; }
	90% {opacity: 1; }
	to { opacity: 0;  }
}





.q_btn{position: fixed;bottom: 0;left: 0;right: 0;margin: auto; z-index: 99;}
.q_btn a,img{ display: inline;}
.q_btn{position: fixed; bottom: 0;left: 0;right: 0;margin: auto;width: 100%; display: flex; z-index: 230;}
.q_btn div{width: 100%; display: block; padding: 3vw 0;background: #552436; color: #fff; text-align: center; font-size:5vw; font-weight: 500;font-family: 'Noto Sans KR', sans-serif;}
.q_btn img{width: 100%;}	

.sub_top { position: relative; left: 0; top: 0; width: 100%; height: 70vw; z-index: 99;   margin-top: 0; overflow: hidden;background: url(../img/sub-top.jpg) center bottom no-repeat;background-size: cover; }
/* .sub_top:after { content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2; background-color: #000; opacity: 0.44; animation: sub_top_bg 1.6s 0.7s both; } */
/* 
#sub_top01{left: 0; top: 0; width: 100%; height: 100%; background: url(../img/sub-top01.jpg) center center no-repeat;background-size: cover; animation: sub_top 2s 0.3s both; }
#sub_top02{left: 0; top: 0; width: 100%; height: 100%; background: url(../img/sub-top02.jpg) center center no-repeat;background-size: cover; animation: sub_top 2s 0.3s both; }
#sub_top03{left: 0; top: 0; width: 100%; height: 100%; background: url(../img/sub-top03.jpg) center center no-repeat;background-size: cover; animation: sub_top 2s 0.3s both; }
#sub_top04{left: 0; top: 0; width: 100%; height: 100%; background: url(../img/sub-top04.jpg) center center no-repeat;background-size: cover; animation: sub_top 2s 0.3s both; }
#sub_top05{left: 0; top: 0; width: 100%; height: 100%; background: url(../img/sub-top05.jpg) center center no-repeat;background-size: cover; animation: sub_top 2s 0.3s both; }
#sub_top06{left: 0; top: 0; width: 100%; height: 100%; background: url(../img/sub-top06.jpg) center center no-repeat;background-size: cover; animation: sub_top 2s 0.3s both; }
 */
.sub_top_txt { width: 100%; height: 10vw; position: absolute; left: 0; right: 0; top: 25vw; margin: auto; z-index: 9; color: #000; text-align: center; animation: sub_top_txt 1.5s .3s both; font-family: 'Noto Sans KR', sans-serif; }
.sub_top_txt p { font-size: 3.5vw; line-height: 100%;  font-weight: 400; margin-top: 4vw;  }
.sub_top_txt h2 {font-family: 'Nanum Myeongjo', serif; font-size: 10vw; line-height: 110%; text-transform: uppercase; font-weight: 400; letter-spacing: 0;color:#a75c75;}

.sub_top_txt h2 span {font-weight: 700; }



.sub_top_tit {position:relative; top: 0px; /*top: 65px;*/ z-index: 2;animation: sub_top_txt 0.65s 0.3s ease-in-out both;}

.sub_top_txtb { position: absolute; left: 500px; top: 20px;  }



@keyframes sub_top {
	from { transform:scale(1.5) }
	to {  }
}
@keyframes sub_top_bg {
	from { opacity: 0; }
	to{ }
}
@keyframes sub_top_txt {
	from { opacity: 0; transform: translateY(40px); }
	to{ }
}



#sub-tit-line {
	width: 1px;
	margin: 20px auto;
	height: 25px;
	background: #999;
}

.snb_wrap { width: 100%; height: auto; text-align: center; }
.snb { width: 100%; display: flex; justify-content: space-between; border-bottom: #e1e1e1 1px solid; }
.snb li { font-family: 'Noto Sans KR', sans-serif; font-size: 12px; font-weight: 400; width: 100%; height: 45px; line-height: 45px; box-sizing: border-box; background: #fff;border-left: #e1e1e1 1px solid;}
.snb li a { color: #000; display: block; }
.snb li:nth-child(1) { border-left: none; }
.snb .selected { background-color: #419b7e; }
.snb .selected a { color: #fff; }



ol,ul,li,a {list-style:none; text-decoration:none;}




#sub {width:100%;margin:0 auto; position:relative; text-align:center;  font-family:'Noto Sans KR', 'Malgun Gothic', dotum, '돋움', '굴림', Gulim, sans-serif;font-weight:400; max-width: 720px; }

#desc {
    color: #888;
    font-weight: 600;
    font-size: 0.5em;
    text-align: center;
    margin-top: 8px;
	letter-spacing:-1px
}



.sub-page { position:relative ; padding-bottom: 50px;}




#sub {width:100%;margin:0 auto; position:relative; text-align:center;  font-family:'Noto Sans KR', 'Malgun Gothic', dotum, '돋움', '굴림', Gulim, sans-serif;font-weight:700;}
#sub .sub-tit{font-size:28px; font-weight:700; padding-bottom:0px; line-height:90%; letter-spacing: -1.5px;}
.sub_tit_txt{ font-family:'Noto Sans KR', 'Malgun Gothic', dotum, '돋움', '굴림', Gulim, sans-serif;font-weight:400; text-align: center; color: #888; font-size:2.5vw;margin: 2vw 0 10vw 0;}
.sub-page{ width: 90%; text-align:center; margin:0 auto; margin-top: 10px; opacity: 1; overflow: hidden; padding-bottom: 40px; }
.sub-page h2{ font-size:20px; color:#111; padding-top:28px; text-align: left; margin-bottom: 10px;}
/*.sub-page img { width: 100%; }*/



#sub>ul {padding-left:0px; width:90%; height:40px; margin:0 auto; list-style:none; font-size:11px;}
#sub>li>A {text-decoration:none; }
#sub>li {line-height:26px;}
#sub .select {background:#231816; height:40px;line-height:39px; vertical-align:middle; }
#sub .select a{color:#FFFFFF;}




#sub-tit {margin-top:40px;}

@keyframes sub-tit {
	from { opacity: 0; }
	to {  }
}





#container{ padding-left:0px; padding:5px 0 100px 0;} 

ul.tabs {
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    width: 100%;
    font-size:13px;
	border-left: 1px solid #ddd;
	height:40px;
}
ul.tabs li { margin-bottom:-1px; color:#444;
    float: left;
    text-align:center;
    cursor: pointer;
    width:16.5%;
    height: 39px;
    line-height: 39px;
    border: 1px solid #ccc;
    border-left: none;
    font-weight: 600;
    background: #eee;
    overflow: hidden;
    position: relative;
	
}
ul.tabs li.active { color:#f8981c;
    background: #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
}

ul.tabs li.selected { color:#fff;
    background: #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
}
.tab_container {
    border: none;
    border-top: none;
    clear: both;
    float: left;
    width: 100%;
    background: #FFFFFF;max-width:900px;
}
.tab_content { position: absolute;
    margin:40px 0px 0px 0px; padding-right:60px;
    font-size: 1em;
    display: none;
}
.tab_container .tab_content ul {
    width:100%;
    margin:0px;
    padding:0px;
}
.tab_container .tab_content ul li {
    padding:5px;
    list-style:none;
}
 #container {
    width: 1100px;
    margin: 0 auto;
}










#container2{ padding-left:0px; padding:5px 0 100px 0;} 

ul.tabs2 { font-family:'Noto Sans KR', 'Malgun Gothic', dotum, '돋움', '굴림', Gulim, sans-serif;
    margin: 0;
    padding: 0;
    float: left;
    list-style: none;
    width: 100%;
    font-size:14px;
	height:40px;
}



ul.tabs2 li { margin-bottom:-1px; color:#232222; margin-left:0px;
    float: left;
    text-align:center;
    cursor: pointer;
    width:18.4%;

    height: 45px;
    line-height: 45px;
   border: 1px solid #eee;
    font-weight: 400;
    background: #fff;
    overflow: hidden;
    position: relative;
	
}


ul.tabs2 li.selected, ul.tabs li.selected:hover
{
    position: relative;
    top: 0px;
	color:#fff; background: #442530; }
	
ul.tabs2 li.selected a, ul.tabs li.selected a:hover { color:#fff;}
        

ul.tabs2 li a {  font-size:12px; font-weight:600; text-decoration: none; color:#444; display: block !important; }
         
ul.tabs2 li.selected a:hover
{
    text-decoration: none;
}

ul.tabs2 li.selected
{
   color:#fff;
}

ul.tabs2 li.active { color:#fff;  }




.tab_container2 {
    border: none;
    border-top: none;
    clear: both;
    float: left;
    width: 100%;
    background: #FFFFFF;max-width:900px;
}
.tab_content2 { position: absolute;
    margin:40px 0px 0px 0px; padding-right:60px;
    font-size: 1em;
    display: none;
}
.tab_container2 .tab_content2 ul {
    width:100%;
    margin:0px;
    padding:0px;
}
.tab_container2 .tab_content2 ul li {
    padding:5px;
    list-style:none;
}
 #container2 {
    width: 1100px;
    margin: 0 auto;
}