@charset "utf-8";

.lato {font-family: 'Lato', sans-serif;}
.pen {font-family: 'Nanum Pen Script', cursive;}

* { margin: 0; padding: 0; box-sizing: border-box; }

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, enter, dl, dt, dd, ol, ul, li,fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; font-style: normal;
}

html, body { width: 100%; height: 100%; font-family: 'Noto Sans KR', sans-serif; letter-spacing: -1px; color: #333; }

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { 
	display:block;
}

ul, li { list-style: none; }

a { text-decoration: none; color: #333; }

table { border-collapse: collapse; border-spacing: 0; }

input:focus { outline: none; }

input {
    font-family: 'Noto Sans KR', sans-serif;
    /*ios대응*/
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    -moz-appearance: none;
    -moz-border-radius: 0;
}

input[type="radio"] {
  -webkit-appearance: checkbox; /* Chrome, Safari, Opera */
  -moz-appearance: checkbox;    /* Firefox */
}

input[type="checkbox"] {
  -webkit-appearance: checkbox; /* Chrome, Safari, Opera */
  -moz-appearance: checkbox;    /* Firefox */
}

/* input 클릭시 placeholder 지우기 */
input:focus::-webkit-input-placeholder {
  color: transparent;
}
input:focus::-moz-placeholder {
  color: transparent;
}
input:focus:-ms-input-placeholder {
  color: transparent;
}
input:focus::-ms-input-placeholder {
  color: transparent;
}

input:focus { outline: none; }

select{
    background: #fff;

    /*ios대응*/
    -webkit-appearance: none;
    -moz-appearance: none;
}

select::-ms-expand{ 
    display:none; /* 화살표 없애기 for IE10, 11*/
}

/* clears the 'X' from Internet Explorer */
input[type=search]::-ms-clear { display: none; width : 0; height: 0; }
input[type=search]::-ms-reveal { display: none; width : 0; height: 0; }

/* clears the 'X' from Chrome */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }

.clearfix:after { content: ""; display: block; clear: both; }

.at-container{width:1330px;max-width:100% !important;padding:0 15px;margin:0 auto}

/* +++ Use Only this project +++ */
.dp_none { display: none; }

/*************************************************
master
*************************************************/

/* -- mobile( ? ~ 767px ) -- */
@media screen and (max-width: 767px) {
    
    /* common */
    #fullpage .innerWrap {
        padding: 0 4% ;width:auto;margin:0;
    }

    .b700 {
        font-weight: 700;
    }

    .bold {
        font-weight: bold;
    }

    /* nav */

    #header {
        display: none !important;
    }

    #headerM,#headerInnerWrap{height:60px !important;}
	#headerM{position:fixed; width: 100%; z-index:99; border-bottom: 1px solid #fff}
	#headerInner{padding:0;}
	#headerInnerWrap{display:flex;align-items:center;padding-left:4%}
	#headerM .logo{padding:0}	
    #headerM .logo a {display: inline-block;}
    #headerM .logo a img {width: 100px; height: auto;}
	#headerM.fixed #headerInnerWrap{background-color:#fff; border-bottom:1px solid #ccc;background:#fff;}
    
    /* Header :: Open, white */
    #headerM.white #headerInnerWrap{background-color:#fff; border-bottom-color: #ccc}
    #headerM.open .logo .logo-white,
    #headerM.white .logo .logo-white{opacity:1.0;filter:Alpha(opacity=0);}
    #headerM.open .logo .logo-green,
    #headerM.white .logo .logo-green{opacity:1.0;filter:Alpha(opacity=100);}

    #headerM .logo .logo-green {
        position: absolute;
        opacity: 0;
        filter: Alpha(opacity=0);
    }

    #header .logo img {
        display: block;
        vertical-align: top;
        transition: all 0.5s;
    }

	/* -------- Header :: GNB(Mobile/기본스타일) -------- */
	.gnb-overlay-bg-m {
        display:none; 
        position:fixed; 
        top:0; 
        left:0; 
        width:100%; 
        height:100%; 
        background:rgba(0,0,0,0.5); 
        z-index:9998;
	}	

	#gnbM{ 
		display:block; 
		position:fixed; 
		top:0px; 
		right:-82%;
		width:80%; 
		height:100%;  
		max-width:280px; 
		background-color:#fff; 
		z-index:9999; 
		transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);  
		-oz-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-ms-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); /* gnb OPEN 속도 */
		visibility:hidden;
	}

	#gnbM.open{
		right:0px; 
		visibility:visible;
	}

	/* GNB Mobile :: 레이아웃 */
	.gnb-navigation-wrapper {
        position:relative; 
        height:100%; 
        box-sizing:border-box; 
        padding-top:80px; 
        overflow-y:auto;
	}	/* padding-top : Header 높이값 */
	
    .header-util-menu-box + .gnb-navigation-wrapper {padding-top:0}
	
	/* GNB Mobile :: 메뉴영역 :: 1차 */
	#navigation > li {border-bottom:1px solid #e7e7e7;}
	#navigation > li:first-child{border-top:1px solid #e7e7e7}
	#navigation > li > a {position:relative; display:block; padding:15px; color:#999; font-size: 20px; font-weight:400; }
	#navigation > li.active > a{color:#b01f84;}
	#navigation > li.has-2dep > a{}
	#navigation > li.has-2dep.active > a{}
	#navigation > li .gnb-icon{position:absolute; top:50%; right:15px; margin-top:-10px;}
	#navigation > li .gnb-icon i{font-size:20px;}
	/* GNB Mobile ::  메뉴영역 :: 2차 */
	#navigation > li .gnb-2dep{display:none; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; padding:30px 0; background-color:#f2f2f2; }
	#navigation > li .gnb-2dep > li{height:auto !important;}
	#navigation > li .gnb-2dep > li > a{display:block; color:#000; font-size:18px; padding:12px 15px; opacity:0.7;filter:Alpha(opacity=70);}
	#navigation > li .gnb-2dep > li.on > a{opacity:1.0;filter:Alpha(opacity=100); font-weight:500;}
	/* GNB Mobile :: 메뉴영역 ::  3차 */
	#navigation > li .gnb-2dep > li > .gnb-3dep{display:none; padding:10px; background-color:#aaa; margin:0 10px}
	#navigation > li .gnb-2dep > li > .gnb-3dep > li > a{display:block; padding:8px 0; font-size:13px; color:#fff;}
	#navigation > li .gnb-2dep > li > .gnb-3dep > li > a:before{display:inline-block; content:"-"; margin-right:5px;}
	
	/* -------- GNB Mobile :: 스타일2 (Full Style) -------- */
	#gnbM.gnb-style-full{ 
		top:-100%; 
		right:0;
		width:100%; 
		height:100%;  
		max-width:none; 
	}

	#gnbM.gnb-style-full.open{
		top:0px; 
	}
	.gnb-style-full .gnb-navigation-wrapper{height:auto; width:100%; position:absolute; top:0px; bottom:0px; left:0; padding-top:0;}
	.gnb-style-full .header-util-menu-box + .gnb-navigation-wrapper{top:80px; }
	.gnb-style-full-member .gnb-navigation-wrapper{bottom:80px;}
	.gnb-style-full .gnb-navigation-inner{display:table; width:100%; height:100%;}
	.gnb-style-full #navigation{
        display: table-cell;
        vertical-align: middle;
	}
	.gnb-style-full #navigation > li{text-align:center; border:0; opacity:0;filter:Alpha(opacity=0); transform:translateY(-20px);-webkit-transition:all 0s 0s;-moz-transition:all 0s 0s;-o-transition:all 0s 0s;-ms-transition:all 0s 0s;transition:all 0s 0s;}
	.gnb-style-full #navigation > li:first-child {border:0}
	.gnb-style-full #navigation > li > a {}
	.gnb-style-full #navigation > li .gnb-icon i{display:none;}
	.gnb-style-full.open #navigation > li{opacity:1.0;filter:Alpha(opacity=100); transform:translateY(0px); -webkit-transition:transform 0.8s, opacity 0.8s;-moz-transition:transform 0.8s, opacity 0.8s;-o-transition:transform 0.8s, opacity 0.8s;-ms-transition:transform 0.8s, opacity 0.8s;transition:transform 0.8s, opacity 0.8s;}
	.gnb-style-full.open #navigation > li:nth-child(1){-webkit-transition-delay: 0.3s;-moz-transition-delay: 0.3s;-o-transition-delay: 0.3s;-ms-transition-delay: 0.3s;transition-delay:0.3s;}
	.gnb-style-full.open #navigation > li:nth-child(2){-webkit-transition-delay: 0.4s;-moz-transition-delay: 0.4s;-o-transition-delay: 0.4s;-ms-transition-delay: 0.4s;transition-delay:0.4s;}
	.gnb-style-full.open #navigation > li:nth-child(3){-webkit-transition-delay: 0.6s;-moz-transition-delay: 0.6s;-o-transition-delay: 0.6s;-ms-transition-delay: 0.6s;transition-delay:0.6s;}
	.gnb-style-full.open #navigation > li:nth-child(4){-webkit-transition-delay: 0.7s;-moz-transition-delay: 0.7s;-o-transition-delay: 0.7s;-ms-transition-delay: 0.7s;transition-delay:0.7s;}
	.gnb-style-full.open #navigation > li:nth-child(5){-webkit-transition-delay: 0.9s;-moz-transition-delay: 0.9s;-o-transition-delay: 0.9s;-ms-transition-delay: 0.9s;transition-delay:0.9s;}
	

	/* -------- Header :: 네비게이션 오픈 버튼 -------- */
	.nav-open-btn{
		cursor:pointer;
		display:block; 
        position:fixed; 
        top:12px;  
        right:4%; 
        z-index:10000; 
		height:30px;
		transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);  
		-oz-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-ms-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
	}

	.nav-open-btn .line{
		display:block; 
        width: 30px; 
        height: 2px; 
        background-color:#fff; 
        border-radius:5px;
        margin: 7px auto;
	    -webkit-transition: all 0.3s ease-in-out;
	    -o-transition: all 0.3s ease-in-out;
	    transition: all 0.3s ease-in-out;
	}

	.nav-open-btn.active .line{background-color:#333;}
	.nav-open-btn.active .line:nth-child(2), .nav-open-btn.active .line:nth-child(4){opacity: 0;}
	.nav-open-btn.active .line:nth-child(1){
		 -webkit-transform: translateY(11px) rotate(45deg);
		  -ms-transform: translateY(11px) rotate(45deg);
		  -o-transform: translateY(11px) rotate(45deg);
		  transform: translateY(11px) rotate(45deg);
	}
	.nav-open-btn.active .line:nth-child(3){
		 -webkit-transform: translateY(-7px) rotate(-45deg);
		  -ms-transform: translateY(-7px) rotate(-45deg);
		  -o-transform: translateY(-7px) rotate(-45deg);
		  transform: translateY(-7px) rotate(-45deg);
	}
	
	#headerM.fixed .logo .logo-green{opacity:1.0;}
	#headerM.fixed .nav-open-btn .line{background-color:#333}


    /* footer */

    .footer {
        background: #222;
        color: #fff;
        padding: 40px 0;
    }

    .f-logoZone {
        padding-bottom: 20px;
        border-bottom: 1px solid #999;
    }

    .f-logoZone p {
        display: inline-block;
        vertical-align: middle;
    }

    .f-logoZone p:nth-child(2) {
        float: right;
    }

    .f-logoZone p:nth-child(2) select {
        width: 175px;
        height: 40px;
        border-radius: 5px;
        background: transparent;
        color: #fff;
        padding: 0 10px;
        /*화살표 배경 넣기*/
        background: url('../img/nav_arrowOn2.png') no-repeat 94% 49% transparent; /*화살표 select박스 오른쪽 중앙 배치,배경 흰색*/
        background-size: 12px auto;
        font-size: 12px;
        margin-top: -10px;
    }

    .f-logoZone p:nth-child(2) select option {
        color: #333;
    }

    .f-logo img {
        width:100px;
        height: auto;
    }

    .f-menu {
        margin: 20px 0;
        border-bottom: 1px solid #555;
        padding-bottom: 20px;
    }
    .f-menu a {
        color: #fff;
        position: relative;
        font-weight: 400;
        font-size: 14px;
        display: inline-block;
        width: 48%;
        text-align: center;
        border: 1px solid #ccc;
        padding: 10px 0;
        cursor: pointer;
    }

    .f-menu a:nth-child(even) {
        float: right;
    }

    .f-menu a:nth-child(1) {
        margin-bottom: 10px;
    }

    .f-menu a:first-child {
        font-weight: bold;
    }

    .f-info {
        font-size: 14px;
        line-height: 30px;
        font-weight: 400;
    }

    .f-info p span {
        display: block;
    }


    /* popup */
    .pop_up {
        position: fixed;
        width: 100%;
        height: 100vh;
        left: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.5);
        transform: translateX(-200%);
        transition: 1s;
        z-index: 9999;
    }

    .paper {
        position: absolute;
        padding: 50px 20px;
        width: 80%;
        height: 80%;
        margin: 0 auto;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        background: #fff;
    }

    h3 {
        font-size: 24px;
        margin-bottom: 15px;
    }

    .date {
        font-size: 0.875em;
        margin-bottom: 30px;
    }

    .cont_area {
        height: 100%;
    }

    .notice_txt {
        border-top: 2px solid #333;
        height: 90%;
        padding: 20px 0;
        border-bottom: 2px solid #333;
        line-height: 24px;
        overflow-y: scroll;
        font-size: 16px;
    }

    .btn_popup {
        cursor: pointer;
        position: absolute;
        right: 15px;
        top: 15px;
    }

    .btn_popup img {
        width: 30px;
        height: auto;
    }

}



/* -- tablet( 768px ~ 1179px ) -- */
@media screen and (min-width: 768px) and (max-width: 1179px) {
    
    /* common */
    #fullpage .innerWrap {
        padding: 0 4%;width:100%;margin:0;
    }

    .b700 {
        font-weight: 700;
    }

    .bold {
        font-weight: bold;
    }

    /* nav */

    #header {
        display: none !important;
    }

    #headerM,#headerInnerWrap{height:80px;}
	#headerM{position:fixed; width: 100%; z-index:99; border-bottom: 1px solid #fff}
	#headerInner{padding:0;}
	#headerInnerWrap{display:flex;align-items:center;padding-left:4%}
	#headerM .logo{padding:0}	
    #headerM .logo a {display: inline-block;}
    #headerM .logo a img {width: 150px; height: auto;}
	#headerM.fixed #headerInnerWrap{background-color:#fff; border-bottom:1px solid #ccc;background:#fff;}
    
    /* Header :: Open, white */
    #headerM.white #headerInnerWrap{background-color:#fff; border-bottom-color: #ccc}
    #headerM.open .logo .logo-white,
    #headerM.white .logo .logo-white{opacity:1.0;filter:Alpha(opacity=0);}
    #headerM.open .logo .logo-green,
    #headerM.white .logo .logo-green{opacity:1.0;filter:Alpha(opacity=100);}

    #headerM .logo .logo-green {
        position: absolute;
        opacity: 0;
        filter: Alpha(opacity=0);
    }

    #header .logo img {
        display: block;
        vertical-align: top;
        transition: all 0.5s;
    }

	/* -------- Header :: GNB(Mobile/기본스타일) -------- */
	.gnb-overlay-bg-m {
        display:none; 
        position:fixed; 
        top:0; 
        left:0; 
        width:100%; 
        height:100%; 
        background:rgba(0,0,0,0.5); 
        z-index:9998;
	}	

	#gnbM{ 
		display:block; 
		position:fixed; 
		top:0px; 
		right:-82%;
		width:80%; 
		height:100%;  
		max-width:280px; 
		background-color:#fff; 
		z-index:9999; 
		transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);  
		-oz-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-ms-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); /* gnb OPEN 속도 */
		visibility:hidden;
	}

	#gnbM.open{
		right:0px; 
		visibility:visible;
	}

	/* GNB Mobile :: 레이아웃 */
	.gnb-navigation-wrapper {
        position:relative; 
        height:100%; 
        box-sizing:border-box; 
        padding-top:80px; 
        overflow-y:auto;
	}	/* padding-top : Header 높이값 */
	
    .header-util-menu-box + .gnb-navigation-wrapper {padding-top:0}
	
	/* GNB Mobile :: 메뉴영역 :: 1차 */
	#navigation > li {border-bottom:1px solid #e7e7e7;}
	#navigation > li:first-child{border-top:1px solid #e7e7e7}
	#navigation > li > a {position:relative; display:block; padding:15px; color:#999; font-size: 34px; font-weight:400; }
	#navigation > li.active > a{color:#b01f84;}
	#navigation > li.has-2dep > a{}
	#navigation > li.has-2dep.active > a{}
	#navigation > li .gnb-icon{position:absolute; top:50%; right:15px; margin-top:-10px;}
	#navigation > li .gnb-icon i{font-size:20px;}
	/* GNB Mobile ::  메뉴영역 :: 2차 */
	#navigation > li .gnb-2dep{display:none; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; padding:30px 0; background-color:#f2f2f2; }
	#navigation > li .gnb-2dep > li{height:auto !important;}
	#navigation > li .gnb-2dep > li > a{display:block; color:#000; font-size:26px; padding:12px 15px; opacity:0.7;filter:Alpha(opacity=70);}
	#navigation > li .gnb-2dep > li.on > a{opacity:1.0;filter:Alpha(opacity=100); font-weight:500;}
	/* GNB Mobile :: 메뉴영역 ::  3차 */
	#navigation > li .gnb-2dep > li > .gnb-3dep{display:none; padding:10px; background-color:#aaa; margin:0 10px}
	#navigation > li .gnb-2dep > li > .gnb-3dep > li > a{display:block; padding:8px 0; font-size:13px; color:#fff;}
	#navigation > li .gnb-2dep > li > .gnb-3dep > li > a:before{display:inline-block; content:"-"; margin-right:5px;}
	
	/* -------- GNB Mobile :: 스타일2 (Full Style) -------- */
	#gnbM.gnb-style-full{ 
		top:-100%; 
		right:0;
		width:100%; 
		height:100%;  
		max-width:none; 
	}

	#gnbM.gnb-style-full.open{
		top:0px; 
	}
	.gnb-style-full .gnb-navigation-wrapper{height:auto; width:100%; position:absolute; top:0px; bottom:0px; left:0; padding-top:0;}
	.gnb-style-full .header-util-menu-box + .gnb-navigation-wrapper{top:80px; }
	.gnb-style-full-member .gnb-navigation-wrapper{bottom:80px;}
	.gnb-style-full .gnb-navigation-inner{display:table; width:100%; height:100%;}
	.gnb-style-full #navigation{
        display: table-cell;
        vertical-align: middle;
	}
	.gnb-style-full #navigation > li{text-align:center; border:0; opacity:0;filter:Alpha(opacity=0); transform:translateY(-20px);-webkit-transition:all 0s 0s;-moz-transition:all 0s 0s;-o-transition:all 0s 0s;-ms-transition:all 0s 0s;transition:all 0s 0s;}
	.gnb-style-full #navigation > li:first-child {border:0}
	.gnb-style-full #navigation > li > a {}
	.gnb-style-full #navigation > li .gnb-icon i{display:none;}
	.gnb-style-full.open #navigation > li{opacity:1.0;filter:Alpha(opacity=100); transform:translateY(0px); -webkit-transition:transform 0.8s, opacity 0.8s;-moz-transition:transform 0.8s, opacity 0.8s;-o-transition:transform 0.8s, opacity 0.8s;-ms-transition:transform 0.8s, opacity 0.8s;transition:transform 0.8s, opacity 0.8s;}
	.gnb-style-full.open #navigation > li:nth-child(1){-webkit-transition-delay: 0.3s;-moz-transition-delay: 0.3s;-o-transition-delay: 0.3s;-ms-transition-delay: 0.3s;transition-delay:0.3s;}
	.gnb-style-full.open #navigation > li:nth-child(2){-webkit-transition-delay: 0.4s;-moz-transition-delay: 0.4s;-o-transition-delay: 0.4s;-ms-transition-delay: 0.4s;transition-delay:0.4s;}
	.gnb-style-full.open #navigation > li:nth-child(3){-webkit-transition-delay: 0.6s;-moz-transition-delay: 0.6s;-o-transition-delay: 0.6s;-ms-transition-delay: 0.6s;transition-delay:0.6s;}
	.gnb-style-full.open #navigation > li:nth-child(4){-webkit-transition-delay: 0.7s;-moz-transition-delay: 0.7s;-o-transition-delay: 0.7s;-ms-transition-delay: 0.7s;transition-delay:0.7s;}
	.gnb-style-full.open #navigation > li:nth-child(5){-webkit-transition-delay: 0.9s;-moz-transition-delay: 0.9s;-o-transition-delay: 0.9s;-ms-transition-delay: 0.9s;transition-delay:0.9s;}
	

	/* -------- Header :: 네비게이션 오픈 버튼 -------- */
	.nav-open-btn{
		cursor:pointer;
		display:block; 
        position:fixed; 
        top:18px;  
        right:4%; 
        z-index:10000; 
		height:50px;
		transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);  
		-oz-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-ms-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
	}

	.nav-open-btn .line{
		display:block; 
        width: 40px; 
        height:3px; 
        background-color:#fff; 
        border-radius:5px;
        margin: 8px auto;
	    -webkit-transition: all 0.3s ease-in-out;
	    -o-transition: all 0.3s ease-in-out;
	    transition: all 0.3s ease-in-out;
	}

	.nav-open-btn.active .line{background-color:#333;}
	.nav-open-btn.active .line:nth-child(2), .nav-open-btn.active .line:nth-child(4){opacity: 0;}
	.nav-open-btn.active .line:nth-child(1){
		 -webkit-transform: translateY(15px) rotate(45deg);
		  -ms-transform: translateY(15px) rotate(45deg);
		  -o-transform: translateY(15px) rotate(45deg);
		  transform: translateY(15px) rotate(45deg);
	}
	.nav-open-btn.active .line:nth-child(3){
		 -webkit-transform: translateY(-7px) rotate(-45deg);
		  -ms-transform: translateY(-7px) rotate(-45deg);
		  -o-transform: translateY(-7px) rotate(-45deg);
		  transform: translateY(-7px) rotate(-45deg);
	}
	
	#headerM.fixed .logo .logo-green{opacity:1.0;}
	#headerM.fixed .nav-open-btn .line{background-color:#333}


    /* footer */

    .footer {
        background: #222;
        color: #fff;
        padding: 60px 0;
    }

    .f-logoZone {
        padding-bottom: 20px;
        border-bottom: 1px solid #999;
    }

    .f-logoZone p {
        display: inline-block;
        vertical-align: middle;
    }

    .f-logoZone p:nth-child(2) {
        float: right;
    }

    .f-logoZone p:nth-child(2) select {
        width: 230px;
        height: 50px;
        border-radius: 5px;
        background: transparent;
        color: #fff;
        padding: 0 10px;
        /*화살표 배경 넣기*/
        background: url('../img/nav_arrowOn2.png') no-repeat 94% 49% transparent; /*화살표 select박스 오른쪽 중앙 배치,배경 흰색*/
        background-size: 12px auto;
        font-size: 16px;
    }

    .f-logoZone p:nth-child(2) select option {
        color: #333;
    }

    .f-logo img {
        width:130px;
        height: auto;
    }

    .f-menu {
        margin: 30px 0;
    }
    .f-menu a {
        color: #999;
        position: relative;
        font-weight: 400;
        font-size: 20px;
        cursor: pointer;
    }

    .f-menu a:first-child {
        font-weight: bold;
    }

    .f-menu a::after {
        content: "|";
        padding: 20px;
    }

    .f-menu a:last-child::after {
        display: none;
    }

    .f-info span:last-child::after {
        display: none;
    }

    .f-info {
        line-height: 30px;
        font-weight: 400;
        font-size: 20px;
        word-break: keep-all;
    }

    .f-info span::after {
        content: "|";
        padding: 20px;
    }

    .f-info p:last-child {
        margin-top: 30px;
    }


    /* popup */
    .pop_up {
        position: fixed;
        width: 100%;
        height: 100vh;
        left: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.5);
        transform: translateX(-200%);
        transition: 1s;
        z-index: 9999;
    }

    .paper {
        position: absolute;
        padding: 50px 20px;
        width: 80%;
        height: 80%;
        margin: 0 auto;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        background: #fff;
    }

    h3 {
        font-size: 40px;
        margin-bottom: 15px;
    }

    .date {
        font-size: 0.875em;
        margin-bottom: 30px;
    }

    .cont_area {
        height: 100%;
    }

    .notice_txt {
        border-top: 2px solid #333;
        height: 90%;
        padding: 20px 0;
        border-bottom: 2px solid #333;
        line-height: 24px;
        overflow-y: scroll;
        font-size: 20px;
    }

    .btn_popup {
        cursor: pointer;
        position: absolute;
        right: 20px;
        top: 20px;
    }

    .btn_popup img {
        width: 40px;
        height: auto;
    }
}




/* -- desktop( 1180px ~ ? ) -- */

@media screen and (min-width: 1180px) {

    /* common */
    .innerWrap {
        width: 100%;
        max-width: 1300px;
        margin: 0 auto;
    }

    .b700 {
        font-weight: 700;
    }

    .bold {
        font-weight: bold;
    }

    /* nav */

    #headerM {
        display: none !important;
    }

    header {
        width: 100%;
        position: fixed;
        z-index: 3;
        border-bottom: 1px solid #ccc;
    }

    #header.white .Area {
        background: #fff;
    }

    .logo {
        cursor: pointer;
    }

    #header.white .logo {
        width: 130px;
        height: 53px;
        background: url('../img/logo2.png') no-repeat;
    }

    #header.white .logo img {
        display: none;
    }
    
    #header.white .dropdown > a{
        color:#333;
        transition-duration: 0.5s;
    }

    .logo img {
        width: 130px;
        height: auto;
        margin-top: 7px;
    }

    .Area{
        overflow: hidden;
        transition-duration: 0.5s;
    }

    .Area:hover{
        background-color:#fff;
        transition-duration: 0.5s;
    }

    .Area > .ClearBoth {
        /* background-color:rgba(0,0,0,0); */
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    .Area:hover .logo {
        width: 130px;
        height: 53px;
        background: url('../img/logo2.png') no-repeat;
    }

    .Area:hover .logo img {
        display: none;
    }

    .Area:hover .dropdown > a{
        color:#333;
        transition-duration: 0.5s;
    }


    .nav{
        width:66%
    }

    .nav > li > a {
        color: #fff;
    }

    .nav a:hover{
        color: #3a3a3a;
        text-decoration: none;
    }

    .nav > li {
        display: inline-block;
        text-align: center;
        margin-left: 100px;
        color: #333;
    }

    .dropdown {
        display: inline-block;
        padding: 30px 1px;
    }

    .dropdown > a {
        font-size: 18px;
        font-weight: 400;
        color:#fff;
        text-decoration: none;
    }

    .nav > li:hover > ul {
        opacity: 1;
        visibility: visible;
        margin-top: 0px;
    }


    .nav > li > .fulldrop {
        height: 0;
        visibility: hidden;
        position: absolute;
        list-style: none;
        top: 60px;
        left: 0px;
        background-color: #fff;
        width: 100%;
        text-align: left;
        padding: 0;
        z-index: 99;
        overflow: hidden;
        transition-duration: 0.5s;
        box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, .1);
        margin-top: 26px;
        border-top: 1px solid #ddd;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .column{
        width: 1300px;
        margin: 0 auto;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .column h3 {
        display: inline-block;
        vertical-align: middle;
        color: #333;
        text-align: right;
    }

    .nav > li:hover > .fulldrop {
        height: 70px;
        visibility: hidden;
        position: absolute;
        list-style: none;
        top: 60px;
        left: 0px;
        background-color: #fff;
        width: 100%;
        text-align: left;
        padding: 0;
        z-index: 99;
        overflow: hidden;
        transition-duration: 0.5s;
    }

    .nav > li:hover .fulldrop {
        opacity: 1;
        visibility: visible;
    }

    .nav ul li:hover:after {
        color: white;
    }

    .menu_one {
        font-size: 18px;
        color: #333;
        text-decoration: none;
        padding: 0 20px;
    }

    .topHeight{
        background-color:#fff;
        transition-duration: 0.5s;
      box-shadow: 0px 1px 10px rgba(0,0,0,.1);
    }

    .topHeight #svg path,
    .topHeight #svg rect {
        fill:#51c5f8;
        transition-duration: 0.5s;
    }

    .topHeight .dropdown > a{
        color:#333;
        transition-duration: 0.5s;
    }


    /* footer */
    .footer {
        background: #222;
        color: #fff;
        padding: 40px 0;
    }

    .f-logoZone {
        padding-bottom: 20px;
        border-bottom: 1px solid #999;
    }

    .f-logoZone p {
        display: inline-block;
        vertical-align: middle;
    }

    .f-logoZone p:nth-child(2) {
        float: right;
    }

    .f-logoZone p:nth-child(2) select {
        width: 230px;
        height: 50px;
        border-radius: 5px;
        background: transparent;
        color: #fff;
        padding: 0 10px;
        /*화살표 배경 넣기*/
        background: url('../img/nav_arrowOn2.png') no-repeat 94% 49% transparent; /*화살표 select박스 오른쪽 중앙 배치,배경 흰색*/
        background-size: 12px auto;
        font-size: 16px;
    }

    .f-logoZone p:nth-child(2) select option {
        color: #333;
    }

    .f-logo img {
        width:130px;
        height: auto;
    }

    .f-menu {
        margin: 20px 0;
    }
    .f-menu a {
        color: #fff;
        position: relative;
        font-weight: 400;
        cursor: pointer;
    }

    .f-menu a:first-child {
        font-weight: bold;
    }

    .f-menu a::after {
        content: "|";
        padding: 20px;
    }

    .f-menu a:last-child::after {
        display: none;
    }

    .f-info {
        line-height: 30px;
        font-weight: 400;
    }

    .f-info span::after {
        content: "|";
        padding: 20px;
    }


    /* popup */
    .pop_up {
        position: fixed;
        width: 100%;
        height: 100vh;
        left: 0;
        top: 0;
        background: rgba(0, 0, 0, 0.5);
        transform: translateX(-200%);
        transition: 1s;
        z-index: 9999;
    }

    .paper {
        position: absolute;
        padding: 100px;
        width: 80%;
        margin: 0 auto;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        background: #fff;
    }

    h3 {
        font-size: 50px;
        margin-bottom: 30px;
    }

    .date {
        font-size: 0.875em;
        margin-bottom: 30px;
    }

    .notice_txt {
        border-top: 2px solid #333;
        height: 400px;
        padding: 20px 0;
        border-bottom: 2px solid #333;
        line-height: 24px;
        overflow-y: scroll;
    }

    .btn_popup {
        cursor: pointer;
        position: absolute;
        right: 50px;
        top: 50px;
    }



}




.pop_up{
  
}

.pop_up .notice_txt pre{
  padding:5px;
  white-space:pre-line;
    font-size:14px !important;
}


/*********************************************************************
메인
****************************************************************/
/* -- mobile( ? ~ 767px ) -- */
@media screen and (max-width: 767px) {

    /* main */

    #fullpage {
        overflow: hidden;
    }

    .fp-tableCell {
        display: block;
    }

    .mainbg {
        overflow: hidden;
        width: 100%;
        height: 100vh;
        background: url('../img/bg_M.jpg') no-repeat;
        background-size: cover;
        background-position: right;
    }

    .kenburns-bottom{-webkit-animation:kenburns-bottom 1s ease-out both;animation:kenburns-bottom 1s ease-out both}

    @-webkit-keyframes kenburns-bottom{
        0%{
            -webkit-transform:scale(1.05) translateY(0);
            transform:scale(1.05) translateY(0);
            -webkit-transform-origin:50% 84%;
            transform-origin:50% 84%
        }
        100%{
            -webkit-transform:scale(1) translateY(0);
            transform:scale(1) translateY(0);
            -webkit-transform-origin:bottom;
            transform-origin:bottom
        }
    }
    
    @keyframes kenburns-bottom{
        0%{-webkit-transform:scale(1.05) translateY(0);
            transform:scale(1.05) translateY(0);
            -webkit-transform-origin:50% 84%;
            transform-origin:50% 84%
        }
        100%{
            -webkit-transform:scale(1) translateY(0);
            transform:scale(1) translateY(0);
            -webkit-transform-origin:bottom;
            transform-origin:bottom
        }
    }

    /* 메인 비주얼 :: active효과 */
    @keyframes text-active-animation {
	    from {
		    opacity:0;filter:Alpha(opacity=0);
		    transform: translateX(-50px); 
	    }
	    to {
		    opacity:1.0;filter:Alpha(opacity=100);
		    transform: translateY(0); 
	    }
    }
    .glow-text span{display:inline-block; }
    .maintxtM .glow-text span {
      -webkit-animation: letter-glow 0.5s 0.5s ease both;
      animation: letter-glow 0.5s 0.5s ease both;
    }

    @keyframes letter-glow {
      0% {
        opacity: 0;
        text-shadow: 0px 0px 5px rgba(255, 255, 255, 0.1);
	    transform: translateY(10px);
      }
      66% {
        opacity: 1;
        text-shadow: 0px 0px 20px rgba(255, 255, 255, 0.9);
	    transform: translateY(0px);
      }
      77% {
        opacity: 1;
      }
      100% {
        opacity: 1;
        text-shadow: 0px 0px 20px rgba(255, 255, 255, 0);
	    transform: translateY(0px);
      }
    }

    /*.pg1 {
        background: url('../img/main.jpg') no-repeat;
        background-size: cover;
        background-position: center;
    }*/

    .maintxt {
        display: none;
    }

    .maintxtM {
        text-align: center;
        padding-top: 80px;
        position: absolute;
        top: 40px;
        margin: 0 auto;
        width: 100%;
    }

    .pg1 > .fp-tableCell {
        height: 100vh !important;
    }

    .pg1 > .fp-tableCell > .innerWrap {
        width: 100% !important;
        padding: 0 !important;
    }

    .txt1 {
        width: 86%;
        background: linear-gradient(to right, #b01f84, #1daee4);
        font-size: 18px;
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        padding: 0 4%;
        margin: 0 auto 10px auto;
    }

    .txt2 {
        padding: 0 4%;
        font-size: 28px;
        color: #fff;
        line-height: 38px;
        word-break: break-word;
    }


    /* page2 */

    .pg2 {
        height: auto !important;
        padding: 40px 0;
    }

    .pg2 > div {
        height: auto !important;
    }

    /*.pg2 > div {
        max-height: 500px;
    }*/

    .txtwrap {
        width: 100%;
    }

    .txtwrap .title {
        width: 90%;
        background: linear-gradient(to right, #b01f84, #1daee4);
        font-size: 28px;
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        margin-bottom: 10px;
        text-align: left;
        font-weight: 900;
    }

    .txtwrap p {
        font-size: 14px;
        word-break: keep-all;
    }

    .pg2con {
        display: inline-block;
        width: 100%;
    }

    .pg2con > a {
        display: inline-block;
        vertical-align: middle;
        float: left;
        width: 100%;
        height: 180px;
        margin-top: 30px;
        padding: 20px;
    }

    .company {
        background-image: url('../img/company.jpg');
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: right;
        transition: all 0.3s ease-in;
    }

    .service {
        background-image: url('../img/service.jpg');
        background-repeat: no-repeat;
        background-size: 100%;
        background-position-y: -45px;
        transition: all 0.3s ease-in;
        float: right !important;
    }

    .moreBtnB, .moreBtnW {
        position: relative;
        width: 50px;
        height: 50px;
        margin-top: 30px;
        border: 1px solid #4c5359;
    }

    .moreBtnB .arrow-icon {
        position: absolute;
        left: 50%;
        top: 50%;
        transition: all 0.3s;
        transform: translate(-50%,-50%);
    }

    .moreBtnW .arrow-icon {
        position: absolute;
        left: 50%;
        top: 50%;
        transition: all 0.3s;
        transform: translate(-50%,-50%);
    }

    .moreBtnB .arrow-icon i {
        display: block;
        width: 8px;
        height: 16px;
        transition: all 0.3s;
        background: url('../img/more_btn_black.png') no-repeat;
    }

    .moreBtnW .arrow-icon i {
        display: block;
        width: 8px;
        height: 16px;
        transition: all 0.3s;
        background: url('../img/more_btn_white.png') no-repeat;
    }

    .company .comtxtwrap {
        color: #333;
    }

    .comtxtwrap p:nth-child(1) {
        font-size: 28px;
        font-weight: 700;
    }

    .comtxtwrap p:nth-child(2) {
        display: none;
        margin-top: 10px;
        line-height: 24px;
    }

    .service .comtxtwrap {
        color: #fff;
    }

    /* page3 */
    .pg3 {
        height: 100%;
        position: relative;
    }

    .pg3 > .fp-tableCell > div {
        height: 50%;
    }

    .pg3 > .fp-tableCell > div > .innerWrap {
        position: relative;
        height: 100%;
    }

    .notice {
        width: 0;
        top: 0;
        background: url('../img/notice.jpg') no-repeat;
        background-size: cover;
        background-position-x: -600px;
    }

    .cs {
        position: absolute;
        width: 0;
        left: auto;
        right: 0;
        background: url('../img/cs.jpg') no-repeat;
        background-size: cover;
        background-position: top;
    }

    .pg3txtwrap {
        position: absolute;
        top: 20%;
    }

    .cs .innerWrap .pg3txtwrap {
        text-align: right;
        right: 4%;
        top: 25%;
    }

    .notice p {
        color: #fff;
    }

    .pg3txtwrap p:nth-child(2) {
        margin-top: 10px;
        font-size: 14px;
        word-break: keep-all;
    }

    .pg3txtwrap p:nth-child(1) {
        font-size: 28px;
        font-weight: bold;

    }


    /* page3 btn */
    
    /* 버튼 */
    .btnBox {position: absolute; top: 53%;}
    .btnBox ul li {
        float: left;
        width: 100px;
        text-align: center;
        font-size: 14px;
    }

    .btnBox ul li {
        position: relative;
    }

    .btnBox ul li a {
        padding: 10px 0;
        display: inline-block;
        width: 100%;
        height: 100%;
        color: #fff;
        font-weight: 400 !important;
    }
    

    .cs .innerWrap .btnBox {
        top: 65%;
        right: 4%;
    }

    .cs .innerWrap .btnBox ul li {
        border: 1px solid #333;
    }

    .cs .innerWrap .btnBox ul li a {
        color: #333;
        font-size: 14px;
    }

    .cs .innerWrap .btnBox ul li:last-child {
        border-left: none;
    }

    .notice .innerWrap .btnBox ul li a {
        border: 1px solid #fff;
        position: relative;
        z-index: 1;
        -webkit-transition: all 0.4s;
        -moz-transition: all 0.4s;
        -ms-transition: all 0.4s;
        -o-transition: all 0.4s;
        transition: all 0.4s;
        overflow: hidden;
    }

    .notice .innerWrap .btnBox ul li a {
        border: 1px solid #fff;
        position: relative;
        z-index: 1;
        -webkit-transition: all 0.4s;
        -moz-transition: all 0.4s;
        -ms-transition: all 0.4s;
        -o-transition: all 0.4s;
        transition: all 0.4s;
        overflow: hidden;
    }





    [data-aos="width100"].aos-animate {
        width: 100%;
    }



    /* footer */
    .footer {
        background: #222;
        color: #fff;
        padding: 40px 0;
    }

    .f-logoZone {
        padding-bottom: 20px;
        border-bottom: 1px solid #999;
    }

    .f-logoZone p {
        display: inline-block;
        vertical-align: middle;
    }

    .f-logoZone p:nth-child(2) {
        float: right;
    }

    .f-logoZone p:nth-child(2) select {
        width: 175px;
        height: 40px;
        border-radius: 5px;
        background: transparent;
        color: #fff;
        padding: 0 10px;
        /*화살표 배경 넣기*/
        background: url('../img/nav_arrowOn2.png') no-repeat 94% 49% transparent; /*화살표 select박스 오른쪽 중앙 배치,배경 흰색*/
        background-size: 12px auto;
        font-size: 12px;
        margin-top: -10px;
    }

    .f-logoZone p:nth-child(2) select option {
        color: #333;
    }

    .f-logo img {
        width:100px;
        height: auto;
    }

    .f-menu {
        margin: 20px 0;
        border-bottom: 1px solid #555;
        padding-bottom: 20px;
    }
    .f-menu a {
        color: #fff;
        position: relative;
        font-weight: 400;
        font-size: 14px;
        display: inline-block;
        width: 48%;
        text-align: center;
        border: 1px solid #ccc;
        padding: 10px 0;
    }

    .f-menu a:nth-child(even) {
        float: right;
    }

    .f-menu a:nth-child(1) {
        margin-bottom: 10px;
    }

    .f-menu a:first-child {
        font-weight: bold;
    }

    .f-info {
        font-size: 14px;
        line-height: 30px;
        font-weight: 400;
    }

    .f-info p span {
        display: block;
    }

    /* 메인 왼쪽 네비게이션 (Fullpage) */
    #fp-nav{
        display: none !important;
	    position: fixed;
        z-index: 98;
        top: 50%;
        left: 4%;
        width: 30%;
        opacity: 1;
        -webkit-transform: translate3d(0,0,0);
    }

    #fp-nav ul li a.active span{
        height: 16px;
        width: 16px;
        margin: -6px 0 0 -6px;
        border-radius: 100%;
    }

    #fp-nav ul li:hover a span{
        width: 12px !important;
        height: 12px !important;
        margin-left: -4px !important;
    }

    #fp-nav ul li:hover a.active span{
        width: 12px !important;
        height: 12px !important;
        margin-top: -4px;
        margin-left: -4px !important;
    }

    #fp-nav ul li{position:relative; width:6px; margin:30px 0;}
    #fp-nav ul li:last-child{display:none} /* 마지막 섹션이 footer일경우 */
    
    #fp-nav ul li a{
        display:block; 
        position:relative; 
        width:100%; 
        height:6px;
        box-sizing:border-box; 
    }

    #fp-nav ul li a:before{
	    position: absolute; 
	    top: -12px; 
	    left: -12px; 
	    display: block;
	    content: ''; 
	    width:34px; 
	    height: 34px; 
	    border:1px solid transparent; 
	    box-sizing: border-box;
	    border-radius:50%;
	    -webkit-backface-visibility: hidden;
    }

    #fp-nav ul li a span {
        display:block; 
        width: 8px; 
        height: 8px; 
        background-color:#fff !important; 
        border-radius:50%;
        filter:Alpha(opacity=20);
    }

    #fp-nav ul li .fp-tooltip {
	    position:absolute; 
	    overflow:hidden; 
	    right:20px; top:0; 
	    opacity:0;filter:Alpha(opacity=0); 
	    line-height:20px; 
	    letter-spacing:-0.75px; 
	    font-size:12px; 
	    color:#fff; 
	    margin-right:5px; 
	    text-align:right; 
	    -webkit-transition:all 0.3s;
	    -moz-transition:all 0.3s;
	    -o-transition:all 0.3s;
	    -ms-transition:all 0.3s;
	    transition:all 0.3s;
	    display:none;
    }

    #fp-nav ul li .fp-tooltip span {
        display:block; 
        transform:translateX(100%); 
        transition:all 0.5s;
    }

    #fp-nav ul li a.active:before {
	    border-color: #fff;
        animation: wave-animate 1.5s infinite ease-out;
    }

    #fp-nav ul li a.active span {
        opacity:1.0;
        filter:Alpha(opacity=100);
    }

    #fp-nav ul li a.active + .fp-tooltip {
        opacity:1.0;
        filter:Alpha(opacity=100);
    }

    #fp-nav ul li a.active + .fp-tooltip span{transform:translateX(0%)}
    @keyframes wave-animate {
	    0% {
		    transform: scale(0.33);
		    opacity: 1;
		    transform-origin: center;
	    }
	    80%{
		    opacity:0.7;
	    }
	    100% {
		    transform: scale(1.0);
		    opacity: 0;
		    transform-origin: center;
	    } 
    }

    /* Green Style */
    #fp-nav.purple ul li a.active:before{border-color: #b01f84 !important;}
    #fp-nav.purple ul li a span{background-color: #999 !important;}
    #fp-nav.purple ul li a.active span{background-color: #b01f84 !important;}

}



/* -- tablet( 768px ~ 1299px ) -- */
@media screen and (min-width: 768px) and (max-width: 1299px) {

    /* main */

    #fullpage {
        overflow: hidden;
    }

    .mainbg {
        overflow: hidden;
        width: 100%;
        height: 100vh;
        background: url('../img/bg_T.jpg') no-repeat;
        background-size: cover;
        background-position: left;
    }

    .kenburns-bottom{-webkit-animation:kenburns-bottom 1s ease-out both;animation:kenburns-bottom 1s ease-out both}

    @-webkit-keyframes kenburns-bottom{
        0%{
            -webkit-transform:scale(1.05) translateY(0);
            transform:scale(1.05) translateY(0);
            -webkit-transform-origin:50% 84%;
            transform-origin:50% 84%
        }
        100%{
            -webkit-transform:scale(1) translateY(0);
            transform:scale(1) translateY(0);
            -webkit-transform-origin:bottom;
            transform-origin:bottom
        }
    }
    
    @keyframes kenburns-bottom{
        0%{-webkit-transform:scale(1.05) translateY(0);
            transform:scale(1.05) translateY(0);
            -webkit-transform-origin:50% 84%;
            transform-origin:50% 84%
        }
        100%{
            -webkit-transform:scale(1) translateY(0);
            transform:scale(1) translateY(0);
            -webkit-transform-origin:bottom;
            transform-origin:bottom
        }
    }

    /* 메인 비주얼 :: active효과 */
    @keyframes text-active-animation {
	    from {
		    opacity:0;filter:Alpha(opacity=0);
		    transform: translateX(-50px); 
	    }
	    to {
		    opacity:1.0;filter:Alpha(opacity=100);
		    transform: translateY(0); 
	    }
    }

    .glow-text span{display:inline-block; }
    .maintxtM .glow-text span {
      -webkit-animation: letter-glow 0.5s 0.5s ease both;
      animation: letter-glow 0.5s 0.5s ease both;
    }

    @keyframes letter-glow {
      0% {
        opacity: 0;
        text-shadow: 0px 0px 5px rgba(255, 255, 255, 0.1);
	    transform: translateY(10px);
      }
      66% {
        opacity: 1;
        text-shadow: 0px 0px 20px rgba(255, 255, 255, 0.9);
	    transform: translateY(0px);
      }
      77% {
        opacity: 1;
      }
      100% {
        opacity: 1;
        text-shadow: 0px 0px 20px rgba(255, 255, 255, 0);
	    transform: translateY(0px);
      }
    }

    /*.pg1 {
        background: url('../img/main.jpg') no-repeat;
        background-size: cover;
        background-position: center;
    }*/

    .maintxt {
        display: none;
    }

    .maintxtM {
        padding: 190px 4% 0 4%;
        position: absolute;
        top: 0px;
        width: 100%;
        text-align: center;
    }

    .pg1 > .fp-tableCell {
        height: 100vh !important;
    }

    .pg1 > .fp-tableCell > .innerWrap {
        width: 100% !important;
        padding: 0 !important;
    }

    .txt1 {
        width: 80%;
        background: linear-gradient(to right, #b01f84, #1daee4);
        font-size: 32px;
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        margin: 0 auto 20px auto;
    }

    .txt2 {
        font-size: 50px;
        color: #fff;
        line-height: 60px;
    }


    /* page2 */

    .txtwrap {
        width: 100%;
    }

    .txtwrap .title {
        width: 70%;
        margin: 0 auto;
        background: linear-gradient(to right, #b01f84, #1daee4);
        font-size: 48px;
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        margin-bottom: 20px;
        text-align: center;
        font-weight: 900;
    }

    .txtwrap p {
        width: 92%;
        margin: 0 auto;
        text-align: center;
        font-size: 20px;
    }

    .pg2con {
        display: inline-block;
        width: 100%;
    }

    .pg2con > a {
        display: inline-block;
        vertical-align: middle;
        float: left;
        width: 100%;
        height: 300px;
        margin-top: 30px;
        padding: 40px 60px;
    }

    .company {
        background-image: url('../img/company.jpg');
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: right;
        transition: all 0.3s ease-in;
    }

    .service {
        background-image: url('../img/service.jpg');
        background-repeat: no-repeat;
        background-size: 100%;
        background-position-y: -140px;
        transition: all 0.3s ease-in;
        float: right !important;
    }

    .moreBtnB, .moreBtnW {
        position: relative;
        width: 60px;
        height: 60px;
        margin-top: 20px;
        border: 1px solid #4c5359;
    }

    .moreBtnB .arrow-icon {
        position: absolute;
        left: 50%;
        top: 50%;
        transition: all 0.3s;
        transform: translate(-50%,-50%);
    }

    .moreBtnW .arrow-icon {
        position: absolute;
        left: 50%;
        top: 50%;
        transition: all 0.3s;
        transform: translate(-50%,-50%);
    }

    .moreBtnB .arrow-icon i {
        display: block;
        width: 8px;
        height: 16px;
        transition: all 0.3s;
        background: url('../img/more_btn_black.png') no-repeat;
    }

    .moreBtnW .arrow-icon i {
        display: block;
        width: 8px;
        height: 16px;
        transition: all 0.3s;
        background: url('../img/more_btn_white.png') no-repeat;
    }

    .company .comtxtwrap {
        color: #333;
    }

    .comtxtwrap p:nth-child(1) {
        font-size: 40px;
        font-weight: 700;
    }

    .comtxtwrap p:nth-child(2) {
        margin-top: 10px;
        line-height: 24px;
    }

    .service .comtxtwrap {
        color: #fff;
    }

    /* page3 */
    .pg3 {
        height: 100%;
        position: relative;
    }

    .pg3 > .fp-tableCell > div {
        position: absolute;
        height: 50%;
    }

    .pg3 > .fp-tableCell > div > .innerWrap {
        position: relative;
        height: 100%;
    }

    .notice {
        width: 0;
        top: 0;
        background: url('../img/notice.jpg') no-repeat;
        background-size: cover;
        background-position-x: -600px;
    }

    .cs {
        width: 0;
        left: auto;
        right: 0;
        background: url('../img/cs.jpg') no-repeat;
        background-size: cover;
        background-position: top;
    }

    .pg3txtwrap {
        position: absolute;
        top: 32%;
    }

    .cs .innerWrap .pg3txtwrap {
        text-align: right;
        right: 4%;
        top: 25%;
    }

    .notice p {
        color: #fff;
    }

    .pg3txtwrap p:nth-child(2) {
        margin-top: 10px;
        font-size: 20px;
    }

    .pg3txtwrap p:nth-child(1) {
        font-size: 40px;
        font-weight: bold;

    }


    /* page3 btn */
    
    /* 버튼 */
    .btnBox {position: absolute; top: 55%; margin-top: 10px;}
    .btnBox ul li {
        float: left;
        width: 200px;
        text-align: center;
        font-size: 18px;
    }

    .btnBox ul li {
        position: relative;
    }

    .btnBox ul li a {
        padding: 20px 0;
        display: inline-block;
        width: 100%;
        height: 100%;
        color: #fff;
        font-weight: 400 !important;
        font-size: 20px;
    }
    

    .cs .innerWrap .btnBox {
        top: 48%;
        right: 4%;
    }

    .cs .innerWrap .btnBox ul li {
        border: 1px solid #333;
    }

    .cs .innerWrap .btnBox ul li a {
        color: #333;
    }

    .cs .innerWrap .btnBox ul li:last-child {
        border-left: none;
    }

    .notice .innerWrap .btnBox ul li a {
        border: 1px solid #fff;
        position: relative;
        z-index: 1;
        -webkit-transition: all 0.4s;
        -moz-transition: all 0.4s;
        -ms-transition: all 0.4s;
        -o-transition: all 0.4s;
        transition: all 0.4s;
        overflow: hidden;
    }

    .notice .innerWrap .btnBox ul li a {
        border: 1px solid #fff;
        position: relative;
        z-index: 1;
        -webkit-transition: all 0.4s;
        -moz-transition: all 0.4s;
        -ms-transition: all 0.4s;
        -o-transition: all 0.4s;
        transition: all 0.4s;
        overflow: hidden;
    }





    [data-aos="width100"].aos-animate {
        width: 100%;
    }



    /* footer */
    .footer {
        background: #222;
        color: #fff;
        padding: 60px 0;
    }

    .f-logoZone {
        padding-bottom: 20px;
        border-bottom: 1px solid #999;
    }

    .f-logoZone p {
        display: inline-block;
        vertical-align: middle;
    }

    .f-logoZone p:nth-child(2) {
        float: right;
    }

    .f-logoZone p:nth-child(2) select {
        width: 230px;
        height: 50px;
        border-radius: 5px;
        background: transparent;
        color: #fff;
        padding: 0 10px;
        /*화살표 배경 넣기*/
        background: url('../img/nav_arrowOn2.png') no-repeat 94% 49% transparent; /*화살표 select박스 오른쪽 중앙 배치,배경 흰색*/
        background-size: 12px auto;
        font-size: 16px;
    }

    .f-logoZone p:nth-child(2) select option {
        color: #333;
    }

    .f-logo img {
        width:auto;
        height: auto;
    }

    .f-menu {
        margin: 30px 0;
    }
    .f-menu a {
        color: #999;
        position: relative;
        font-weight: 400;
        font-size: 20px;
    }

    .f-menu a:first-child {
        font-weight: bold;
    }

    .f-menu a::after {
        content: "|";
        padding: 20px;
    }

    .f-menu a:last-child::after {
        display: none;
    }

    .f-info span:last-child::after {
        display: none;
    }

    .f-info {
        line-height: 30px;
        font-weight: 400;
        font-size: 20px;
        word-break: keep-all;
    }

    .f-info span::after {
        content: "|";
        padding: 20px;
    }

    .f-info p:last-child {
        margin-top: 30px;
    }

    /* 메인 왼쪽 네비게이션 (Fullpage) */
    #fp-nav{
	    position: fixed;
        z-index: 98;
        top: 50%;
        left: 4%;
        width: 30%;
        opacity: 1;
        -webkit-transform: translate3d(0,0,0);
    }

    #fp-nav ul li a.active span{
        height: 16px;
        width: 16px;
        margin: -6px 0 0 -6px;
        border-radius: 100%;
    }

    #fp-nav ul li:hover a span{
        width: 12px !important;
        height: 12px !important;
        margin-left: -4px !important;
    }

    #fp-nav ul li:hover a.active span{
        width: 12px !important;
        height: 12px !important;
        margin-top: -4px;
        margin-left: -4px !important;
    }

    #fp-nav ul li{position:relative; width:6px; margin:30px 0;}
    #fp-nav ul li:last-child{display:none} /* 마지막 섹션이 footer일경우 */
    
    #fp-nav ul li a{
        display:block; 
        position:relative; 
        width:100%; 
        height:6px;
        box-sizing:border-box; 
    }

    #fp-nav ul li a:before{
	    position: absolute; 
	    top: -12px; 
	    left: -12px; 
	    display: block;
	    content: ''; 
	    width:34px; 
	    height: 34px; 
	    border:1px solid transparent; 
	    box-sizing: border-box;
	    border-radius:50%;
	    -webkit-backface-visibility: hidden;
    }

    #fp-nav ul li a span {
        display:block; 
        width: 8px; 
        height: 8px; 
        background-color:#fff !important; 
        border-radius:50%;
        filter:Alpha(opacity=20);
    }

    #fp-nav ul li .fp-tooltip {
	    position:absolute; 
	    overflow:hidden; 
	    right:20px; top:0; 
	    opacity:0;filter:Alpha(opacity=0); 
	    line-height:20px; 
	    letter-spacing:-0.75px; 
	    font-size:12px; 
	    color:#fff; 
	    margin-right:5px; 
	    text-align:right; 
	    -webkit-transition:all 0.3s;
	    -moz-transition:all 0.3s;
	    -o-transition:all 0.3s;
	    -ms-transition:all 0.3s;
	    transition:all 0.3s;
	    display:none;
    }

    #fp-nav ul li .fp-tooltip span {
        display:block; 
        transform:translateX(100%); 
        transition:all 0.5s;
    }

    #fp-nav ul li a.active:before {
	    border-color: #fff;
        animation: wave-animate 1.5s infinite ease-out;
    }

    #fp-nav ul li a.active span {
        opacity:1.0;
        filter:Alpha(opacity=100);
    }

    #fp-nav ul li a.active + .fp-tooltip {
        opacity:1.0;
        filter:Alpha(opacity=100);
    }

    #fp-nav ul li a.active + .fp-tooltip span{transform:translateX(0%)}
    @keyframes wave-animate {
	    0% {
		    transform: scale(0.33);
		    opacity: 1;
		    transform-origin: center;
	    }
	    80%{
		    opacity:0.7;
	    }
	    100% {
		    transform: scale(1.0);
		    opacity: 0;
		    transform-origin: center;
	    } 
    }

    /* Green Style */
    #fp-nav.purple ul li a.active:before{border-color: #b01f84 !important;}
    #fp-nav.purple ul li a span{background-color: #999 !important;}
    #fp-nav.purple ul li a.active span{background-color: #b01f84 !important;}

}





/* -- desktop( 1300px ~ ? ) -- */

@media screen and (min-width: 1300px) {
    
    /* main */

    .mainbg {
        overflow: hidden;
        width: 100%;
        height: 100vh;
        background: url('../img/main.jpg') no-repeat;
        background-size: cover;
        background-position: center;
    }

    .kenburns-bottom{-webkit-animation:kenburns-bottom 1s ease-out both;animation:kenburns-bottom 1s ease-out both}

    @-webkit-keyframes kenburns-bottom{
        0%{
            -webkit-transform:scale(1.05) translateY(0);
            transform:scale(1.05) translateY(0);
            -webkit-transform-origin:50% 84%;
            transform-origin:50% 84%
        }
        100%{
            -webkit-transform:scale(1) translateY(0);
            transform:scale(1) translateY(0);
            -webkit-transform-origin:bottom;
            transform-origin:bottom
        }
    }
    
    @keyframes kenburns-bottom{
        0%{-webkit-transform:scale(1.05) translateY(0);
            transform:scale(1.05) translateY(0);
            -webkit-transform-origin:50% 84%;
            transform-origin:50% 84%
        }
        100%{
            -webkit-transform:scale(1) translateY(0);
            transform:scale(1) translateY(0);
            -webkit-transform-origin:bottom;
            transform-origin:bottom
        }
    }

    /* 메인 비주얼 :: active효과 */
    @keyframes text-active-animation {
	    from {
		    opacity:0;filter:Alpha(opacity=0);
		    transform: translateX(-50px); 
	    }
	    to {
		    opacity:1.0;filter:Alpha(opacity=100);
		    transform: translateY(0); 
	    }
    }
    .glow-text {
	    white-space: pre;
    }

    .glow-text span{display:inline-block; }
    .maintxt .glow-text span {
      -webkit-animation: letter-glow 0.5s 0.5s ease both;
      animation: letter-glow 0.5s 0.5s ease both;
    }

    @keyframes letter-glow {
      0% {
        opacity: 0;
        text-shadow: 0px 0px 5px rgba(255, 255, 255, 0.1);
	    transform: translateY(10px);
      }
      66% {
        opacity: 1;
        text-shadow: 0px 0px 20px rgba(255, 255, 255, 0.9);
	    transform: translateY(0px);
      }
      77% {
        opacity: 1;
      }
      100% {
        opacity: 1;
        text-shadow: 0px 0px 20px rgba(255, 255, 255, 0);
	    transform: translateY(0px);
      }
    }

    /*.pg1 {
        background: url('../img/main.jpg') no-repeat;
        background-size: cover;
        background-position: center;
    }*/

    .maintxtM {
        display: none;
    }

    .maintxt {
        padding-top: 260px;
        position: absolute;
        top: 40px;
    }

    .txt1 {
        width: 68%;
        background: linear-gradient(to right, #b01f84, #1daee4);
        font-size: 40px;
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        margin-bottom: 30px;
    }

    .txt2 {
        font-size: 54px;
        white-space: pre;
        color: #fff;
        line-height: 70px;
    }


    /* page2 */

    .txtwrap {
        width: 100%;
        margin-top: 40px;
    }

    .txtwrap .title {
        width: 45%;
        margin: 0 auto;
        background: linear-gradient(to right, #b01f84, #1daee4);
        font-size: 50px;
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        margin-bottom: 20px;
        text-align: center;
        font-weight: 900;
    }

    .txtwrap p {
        text-align: center;
        font-size: 20px;
        white-space: pre;
    }

    .pg2con {
        display: inline-block;
        width: 100%;
    }

    .pg2con > a {
        display: inline-block;
        vertical-align: middle;
        float: left;
        width: 49%;
        height: 471px;
        margin-top: 70px;
        padding: 40px;
    }

    .company {
        background-image: url('../img/company.jpg');
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: right;
        transition: all 0.3s ease-in;
    }

    .service {
        background-image: url('../img/service.jpg');
        background-repeat: no-repeat;
        background-size: 100%;
        transition: all 0.3s ease-in;
        float: right !important;
    }

    .moreBtnB, .moreBtnW {
        position: relative;
        width: 60px;
        height: 60px;
        margin-top: 40px;
        border: 1px solid #4c5359;
    }

    .moreBtnB .arrow-icon {
        position: absolute;
        left: 50%;
        top: 50%;
        transition: all 0.3s;
        transform: translate(-50%,-50%);
    }

    .moreBtnW .arrow-icon {
        position: absolute;
        left: 50%;
        top: 50%;
        transition: all 0.3s;
        transform: translate(-50%,-50%);
    }

    .moreBtnB .arrow-icon i {
        display: block;
        width: 8px;
        height: 16px;
        transition: all 0.3s;
        background: url('../img/more_btn_black.png') no-repeat;
    }

    .moreBtnW .arrow-icon i {
        display: block;
        width: 8px;
        height: 16px;
        transition: all 0.3s;
        background: url('../img/more_btn_white.png') no-repeat;
    }

    .company:hover .moreBtnB .arrow-icon i {
        width: 16px;
        transform: rotate(135deg);
    }

    .service:hover .moreBtnW .arrow-icon i {
        width: 16px;
        transform: rotate(135deg);
    }

    .company .comtxtwrap {
        color: #333;
    }

    .comtxtwrap p:nth-child(1) {
        font-size: 40px;
        font-weight: 700;
    }

    .comtxtwrap p:nth-child(2) {
        margin-top: 20px;
        line-height: 28px;
    }

    .service .comtxtwrap {
        color: #fff;
    }

    .pg2con > a:hover {
        background-size: 110%;
    }

    /* page3 */
    .pg3 {
        height: 100%;
        position: relative;
    }

    .pg3 > .fp-tableCell > div {
        position: absolute;
        height: 50%;
    }

    .pg3 > .fp-tableCell > div > .innerWrap {
        position: relative;
        height: 100%;
    }

    .notice {
        width: 0;
        top: 0;
        background: url('../img/notice.jpg') no-repeat;
        background-size: cover;
        background-position: right;
    }

    .cs {
        width: 0;
        left: auto;
        right: 0;
        background: url('../img/cs.jpg') no-repeat;
        background-size: cover;
        background-position: left;
    }

    .pg3txtwrap {
        position: absolute;
        top: 32%;
    }

    .cs .innerWrap .pg3txtwrap {
        right: 0;
        top: 25%;
    }

    .notice p {
        color: #fff;
    }

    .pg3txtwrap p:nth-child(2) {
        margin-top: 10px;
        font-size: 20px;
    }

    .pg3txtwrap p:nth-child(1) {
        font-size: 40px;
        font-weight: bold;

    }

    .btnbox {
        position: absolute;
        top: 60%;
    }


    /* page3 btn */
    
    /* 버튼 */
    .btnBox {position: absolute; top: 59%; margin-top: 10px;}
    .btnBox ul li {
        float: left;
        width: 200px;
        text-align: center;
        font-size: 18px;
    }

    .notice .innerWrap .btnBox ul li:hover a {
        color: #333 !important;
        transition: 0.3s ease-in-out;
    }

    .cs .innerWrap .btnBox ul li:hover a {
        color: #fff !important;
        transition: 0.3s ease-in-out;
    }

    .btnBox ul li {
        position: relative;
    }

    .btnBox ul li a {
        padding: 20px 0;
        display: inline-block;
        width: 100%;
        height: 100%;
        color: #fff;
        font-weight: 400 !important;
    }
    

    .cs .innerWrap .btnBox {
        right: 110px;
        top: 52%;
    }

    .cs .innerWrap .btnBox ul li {
        border: 1px solid #333;
    }

    .cs .innerWrap .btnBox ul li a {
        color: #333;
    }

    .cs .innerWrap .btnBox ul li:last-child {
        border-left: none;
    }

    .notice .innerWrap .btnBox ul li a {
        border: 1px solid #fff;
        position: relative;
        z-index: 1;
        -webkit-transition: all 0.4s;
        -moz-transition: all 0.4s;
        -ms-transition: all 0.4s;
        -o-transition: all 0.4s;
        transition: all 0.4s;
        overflow: hidden;
    }

    .notice .innerWrap .btnBox ul li a:after {
        content: "";
        width: 0%;
        height: 100%;
        top: 0;
        position: absolute;
        left: 0;
        -webkit-transition: all 0.4s;
        -moz-transition: all 0.4s;
        -ms-transition: all 0.4s;
        -o-transition: all 0.4s;
        transition: all 0.4s;
        background: #fff;
    }
    .notice .innerWrap .btnBox ul li a:hover {
        color: #333;
    }
    .notice .innerWrap .btnBox ul li a:hover:after {
        width: 100%;
        z-index: -1;
    }

    .notice .innerWrap .btnBox ul li a {
        border: 1px solid #fff;
        position: relative;
        z-index: 1;
        -webkit-transition: all 0.4s;
        -moz-transition: all 0.4s;
        -ms-transition: all 0.4s;
        -o-transition: all 0.4s;
        transition: all 0.4s;
        overflow: hidden;
    }

    .cs .innerWrap .btnBox ul li a:after {
        content: "";
        width: 0%;
        height: 100%;
        top: 0;
        position: absolute;
        left: 0;
        -webkit-transition: all 0.4s;
        -moz-transition: all 0.4s;
        -ms-transition: all 0.4s;
        -o-transition: all 0.4s;
        transition: all 0.4s;
        background: #333;
    }
    .cs .innerWrap .btnBox ul li a:hover {
        color: #333;
    }
    .cs .innerWrap .btnBox ul li a:hover:after {
        width: 100%;
        z-index: -1;
    }


    [data-aos="width100"].aos-animate {
        width: 100%;
    }



    /* footer */
    .footer {
        background: #222;
        color: #fff;
        padding: 40px 0;
    }

    .f-logoZone {
        padding-bottom: 20px;
        border-bottom: 1px solid #999;
    }
    .f-logoZone::after{
		content:"";
		display:block;
		clear:both
	}
    .f-logoZone p {
        display: inline-block;
        vertical-align: middle;
    }

    .f-logoZone p:nth-child(2) {
        float: right;
    }

    .f-logoZone p:nth-child(2) select {
        width: 230px;
        height: 50px;
        border-radius: 5px;
        background: transparent;
        color: #fff;
        padding: 0 10px;
        /*화살표 배경 넣기*/
        background: url('../img/nav_arrowOn2.png') no-repeat 94% 49% transparent; /*화살표 select박스 오른쪽 중앙 배치,배경 흰색*/
        background-size: 12px auto;
        font-size: 16px;
    }

    .f-logoZone p:nth-child(2) select option {
        color: #333;
    }

    .f-logo img {
        width:auto;
        height: auto;
    }

    .f-menu {
        margin: 20px 0;
    }
    .f-menu a {
        color: #fff;
        position: relative;
        font-weight: 400;
    }

    .f-menu a:first-child {
        font-weight: bold;
    }

    .f-menu a::after {
        content: "|";
        padding: 20px;
    }

    .f-menu a:last-child::after {
        display: none;
    }

    .f-info {
        line-height: 30px;
        font-weight: 400;
    }

    .f-info span::after {
        content: "|";
        padding: 20px;
    }

    /* 메인 왼쪽 네비게이션 (Fullpage) */
    #fp-nav{
	    position: fixed;
        z-index: 100;
        top: 50%;
        left: 4%;
        opacity: 1;
        -webkit-transform: translate3d(0,0,0);
    }

    #fp-nav ul li a.active span{
        height: 16px;
        width: 16px;
        margin: -6px 0 0 -6px;
        border-radius: 100%;
    }

    #fp-nav ul li:hover a span{
        width: 12px !important;
        height: 12px !important;
        margin-left: -4px !important;
    }

    #fp-nav ul li:hover a.active span{
        width: 12px !important;
        height: 12px !important;
        margin-top: -4px;
        margin-left: -4px !important;
    }

    #fp-nav ul li{position:relative; width:6px; margin:30px 0;}
    #fp-nav ul li:last-child{display:none} /* 마지막 섹션이 footer일경우 */
    
    #fp-nav ul li a{
        display:block; 
        position:relative; 
        width:100%; 
        height:6px;
        box-sizing:border-box; 
    }

    #fp-nav ul li a:before{
	    position: absolute; 
	    top: -12px; 
	    left: -12px; 
	    display: block;
	    content: ''; 
	    width:34px; 
	    height: 34px; 
	    border:1px solid transparent; 
	    box-sizing: border-box;
	    border-radius:50%;
	    -webkit-backface-visibility: hidden;
    }

    #fp-nav ul li a span {
        display:block; 
        width: 8px; 
        height: 8px; 
        background-color:#fff !important; 
        border-radius:50%;
        filter:Alpha(opacity=20);
    }

    #fp-nav ul li .fp-tooltip {
	    position:absolute; 
	    overflow:hidden; 
	    right:20px; top:0; 
	    opacity:0;filter:Alpha(opacity=0); 
	    line-height:20px; 
	    letter-spacing:-0.75px; 
	    font-size:12px; 
	    color:#fff; 
	    margin-right:5px; 
	    text-align:right; 
	    -webkit-transition:all 0.3s;
	    -moz-transition:all 0.3s;
	    -o-transition:all 0.3s;
	    -ms-transition:all 0.3s;
	    transition:all 0.3s;
	    display:none;
    }

    #fp-nav ul li .fp-tooltip span {
        display:block; 
        transform:translateX(100%); 
        transition:all 0.5s;
    }

    #fp-nav ul li a.active:before {
	    border-color: #fff;
        animation: wave-animate 1.5s infinite ease-out;
    }

    #fp-nav ul li a.active span {
        opacity:1.0;
        filter:Alpha(opacity=100);
    }

    #fp-nav ul li a.active + .fp-tooltip {
        opacity:1.0;
        filter:Alpha(opacity=100);
    }

    #fp-nav ul li a.active + .fp-tooltip span{transform:translateX(0%)}
    @keyframes wave-animate {
	    0% {
		    transform: scale(0.33);
		    opacity: 1;
		    transform-origin: center;
	    }
	    80%{
		    opacity:0.7;
	    }
	    100% {
		    transform: scale(1.0);
		    opacity: 0;
		    transform-origin: center;
	    } 
    }

    /* Green Style */
    #fp-nav.purple ul li a.active:before{border-color: #ff5629 !important;}
    #fp-nav.purple ul li a span{background-color: #999 !important;}
    #fp-nav.purple ul li a.active span{background-color: #ff5629 !important;}

}
.at-menu{border-bottom:0;position:relative}
.at-menu .container_fix{width:1330px;max-width:100%;padding:0 15px;margin:0 auto;display:flex;align-items:center;justify-content: space-between;}
.at-menu .logo_box{display:flex;align-items:center;}
.at-menu .logo_box div{margin-top:10px}
.at-menu .pc-menu{width:66%;background:transparent;box-shadow:0 0 0 !important;}
.pc-menu .nav-top.nav-both .menu-li{ display: inline-block;text-align: center;margin-left: 100px;color: #333;}
.pc-menu .nav-top .menu-a{background:transparent;font-size: 18px;font-weight: 400;color: #fff;}
.pc-menu .nav-top.nav-both .sub-1div{border-top:1px solid #ddd;width:100%;position:absolute;left:0;box-shadow:0 0 0;padding:24px 0}
.pc-menu .nav-top .sub-1dul{display:flex;justify-content:center;}
.pc-menu .nav-top .sub-1da{font-size: 18px;font-weight:600;padding:0 20px;color:#3a3a3a;border-bottom:0}
#header.white, .at-menu:hover{background:#fff}
#header.white .at-menu .pc-menu .nav-top .menu-a, .at-menu:hover .pc-menu .nav-top .menu-a{color:#3a3a3a}
#header.white .at-menu .logo_box div img, .at-menu:hover .logo_box div img{display:none}
#header.white .at-menu .logo_box div a, .at-menu:hover .logo_box div a{display:block;width:200px;height:40px;background: url('../img/logo2.png') no-repeat;}
#header.white .pc-menu .nav-top.nav-both .sub-1div{box-shadow:0px 2px 5px 0px rgba(0, 0, 0, .1)}

.main.board_wing{position:fixed;width:40px;bottom:20px;right:25px;z-index:9999}
.board_wing a{display:flex;align-items:center;justify-content:center;width:42px;height:42px;line-height:1.2;border-radius:10px;background:linear-gradient(to right, #b01f84, #1daee4);color:#fff;text-align:center;font-size:13px}
.board_wing a + a{margin-top:5px}

@media(min-width:1920px){
	.pc-menu .nav-top.nav-both .menu-li:nth-child(1) .sub-1dul{padding-left:0}
	.pc-menu .nav-top.nav-both .menu-li:nth-child(2) .sub-1dul{padding-left:7%}
	.pc-menu .nav-top.nav-both .menu-li:nth-child(4) .sub-1dul{justify-content:flex-end;padding-right:28%}

}
@media(max-width:1920px){
	.pc-menu .nav-top.nav-both .menu-li:nth-child(2) .sub-1dul{padding-left:15%}
	.pc-menu .nav-top.nav-both .menu-li:nth-child(4) .sub-1dul{padding-right:20%;justify-content:flex-end}
}
@media(max-width:1179px){
	html.fp-enabled.resize, html.fp-enabled body.resize{overflow:visible !important}
}