@CHARSET "UTF-8";
@import "//cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/all.min.css";
@font-face {
    font-family: 'Apple SD Gothic Neo';
    font-style: normal;
    font-weight: 100;
    src: local('Apple SD Gothic Neo Thin'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/100_AppleSDGothicNeo-Thin.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/100_AppleSDGothicNeo-Thin.otf') format('opentype');
}

@font-face {
    font-family: 'Apple SD Gothic Neo';
    font-style: normal;
    font-weight: 200;
    src: local('Apple SD Gothic Neo UltraLight'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/200_AppleSDGothicNeo-UltraLight.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/200_AppleSDGothicNeo-UltraLight.otf') format('opentype');
}

@font-face {
    font-family: 'Apple SD Gothic Neo';
    font-style: normal;
    font-weight: 300;
    src: local('Apple SD Gothic Neo Light'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/300_AppleSDGothicNeo-Light.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/300_AppleSDGothicNeo-Light.otf') format('opentype');
}

@font-face {
    font-family: 'Apple SD Gothic Neo';
    font-style: normal;
    font-weight: 400;
    src: local('Apple SD Gothic Neo Medium'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/400_AppleSDGothicNeo-Medium.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/400_AppleSDGothicNeo-Medium.otf') format('opentype');
}

@font-face {
    font-family: 'Apple SD Gothic Neo';
    font-style: normal;
    font-weight: 500;
    src: local('Apple SD Gothic Neo Regular'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/500_AppleSDGothicNeo-Regular.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/500_AppleSDGothicNeo-Regular.otf') format('opentype');
}

@font-face {
    font-family: 'Apple SD Gothic Neo';
    font-style: normal;
    font-weight: 600;
    src: local('Apple SD Gothic Neo SemiBold'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/600_AppleSDGothicNeo-SemiBold.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/600_AppleSDGothicNeo-SemiBold.otf') format('opentype');
}

@font-face {
    font-family: 'Apple SD Gothic Neo';
    font-style: normal;
    font-weight: 700;
    src: local('Apple SD Gothic Neo Bold'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/700_AppleSDGothicNeo-Bold.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/700_AppleSDGothicNeo-Bold.otf') format('opentype');
}

@font-face {
    font-family: 'Apple SD Gothic Neo';
    font-style: normal;
    font-weight: 800;
    src: local('Apple SD Gothic Neo ExtraBold'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/800_AppleSDGothicNeo-ExtraBold.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/800_AppleSDGothicNeo-ExtraBold.otf') format('opentype');
}

@font-face {
    font-family: 'Apple SD Gothic Neo';
    font-style: normal;
    font-weight: 900;
    src: local('Apple SD Gothic Neo Heavy'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/900_AppleSDGothicNeo-Heavy.woff2') format('woff2'),
        url('https://cdn.jsdelivr.net/npm/font-applesdgothicneo@1.0/fonts/900_AppleSDGothicNeo-Heavy.otf') format('opentype');
}


@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@2.0/nanumsquare.css);

html {position: relative; height: 100%; min-height: 100%; margin: 0; -webkit-text-size-adjust:none; scroll-behavior: smooth;}
body {position: relative; width: 100%; height: auto; min-height: 100%; font-family: 'Apple SD Gothic Neo'; overflow-y: auto; overflow-x: hidden; color:#303030; word-break:keep-all; background: #242421}
*, *::before, *::after {padding:0; margin:0; box-sizing: border-box;}
html,body,div,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;
font-family: 'Apple SD Gothic Neo'; word-break:keep-all; }
input,button,textarea,select{font-family: 'Apple SD Gothic Neo'; color:#303030; word-break:keep-all;}
ul {list-style-type: none; padding-inline-start: 0;}
a {text-decoration: none; }
table{padding:0; border:0; border-spacing:0px; border-collapse:collapse;}
th, td{padding:0;}
button {border: none; background:none; cursor: pointer;}
input:focus, select:focus, option:focus, textarea:focus, button:focus{outline: none;}
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
textarea:focus {outline:none;}



.hidden {display: none;}
input {height: 40px; border-radius: 5px; border: 1px solid #dfdfdf; padding: 0 15px; font-size: 16px; width: 100%; line-height: 40px}
input::placeholder {color:#b2b2b2;}
input:focus, textarea:focus {border: 1px solid #0271D8;}
textarea {height: 130px; border-radius: 5px; border: 2px solid #e6e6e6; padding: 18px 28px; font-size: 16px; width: 100%; resize: none;}
textarea::placeholder {color:#b2b2b2;}

div::-webkit-scrollbar {width:18px; height: 3px;}
div::-webkit-scrollbar-thumb {background-color: #e1e1e1; background-clip : padding-box; border: 5px solid transparent;}
div::-webkit-scrollbar-track {background:none;}

input[type="checkbox"]{display: inline-block; width: 20px; height: 20px; border: 1px solid #dfdfdf; border-radius: 5px}


.nanumfont{ font-family: 'NanumSquare', sans-serif !important}

/*header*/

header{position: fixed; top: 0; left: 0; width: 100%; z-index: 9999}
header.fixed{background: rgba(0,0,0,0.5)}
header .inner{max-width: 1620px; margin: 0 auto; display: flex; align-items: center;
    justify-content: space-between; height: 100px;}
header .inner .nav{display: flex; gap:50px; font-size: 20px; }

header .inner .nav li a{color: #fff; font-weight: 300; font-size: 20px; position: relative; transition-duration: .5s; text-transform: uppercase; line-height: 30px}
header .inner .nav li a:after{content: ''; position: absolute; left: 0; top: -15px; width: 4px; height: 4px; background:transparent ; border-radius: 5px; transition-duration: .5s}


header .inner .nav li a:hover{color: #1792A3; transition-duration: .5s}
header .inner .nav li a:hover:after{content: ''; position: absolute; left: 0; top: -5px; width: 4px; height: 4px; background:#1792A3 ; border-radius: 5px; transition-duration: .5s}

header .inner .nav li a.on{color: #1792A3; transition-duration: .5s}
header .inner .nav li a.on:after{content: ''; position: absolute; left: 0; top: -5px; width: 4px; height: 4px; background:#1792A3 ; border-radius: 5px; transition-duration: .5s}





.mask {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0);
  z-index: 9999;
  opacity: .9;
  transition: 0.5s ease;
}


.loadingImg {
  position: absolute;
    display: block;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
}







/* CUSTOM NAVIGATION */
#my-nav{
    position: absolute;
    z-index: 999;
    right: 0px;
    top: 50%;
    transform: translateY(-50%);
}
#my-nav li{
    display: flex; gap:10px;
    margin: 0;
    cursor: pointer;
    text-align: right;
    justify-content: flex-end;
    align-items: center;
    height: 21px;
}
#my-nav li span.sname{font-size: 16px; color: #fff; display: none}
#my-nav li .line{width: 30px; height: 1px; background: #fff; opacity: .5; display: block}

#my-nav li.active{}
#my-nav li.active span.sname{display: block;}
#my-nav li.active .line{width: 55px; opacity: 1}




/* Main */


.title_intro{ position: absolute; bottom:17%; width: 100%; text-align: center; }

.intro{overflow: hidden; position: relative; }
.intro .fp-overflow{height: 100%}

/* 
.title_intro{display: flex;
    justify-content: center;
    align-items: flex-end;
    height: 100%; padding: 10rem 0}
     */
    
.title_intro h3{color: #fff; font-size: 60px; font-weight: 100;}
.title_intro h3 b{font-size: 75px; font-weight: bold}

@media (max-width: 1760px) {
	
	.title_intro h3{color: #fff; font-size: 50px; font-weight: 100;}
	.title_intro h3 b{font-size: 65px; font-weight: bold}
	
}


#vimeoWrap{
     position: absolute;
    padding-bottom: 56.25%; /* 16/9 ratio */
    padding-top: 0px; /* IE6 workaround*/
    height: 100vh;
    overflow: hidden;
    margin: 0;
    width: 100%;
    top: 0;
    left: 0;
  }
#vimeoWrap iframe,
#vimeoWrap object,
#vimeoWrap embed, video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1
}

.video-container {
  position:relative;
  height:0;
  padding-bottom:56.25%;
}



.video-container iframe {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}
/*.pop-conts .video-container iframe{display: none}
.pop-conts .video-container iframe.on{display: block}*/

.videobg{position: absolute; left: 0; width: 100%; height: 100%; top: 0; background: rgba(0,0,0,0.6); z-index: 1}


.title_pf{display: flex;
    justify-content: center;
    align-items: center;
    height: 100%; padding: 10rem 0; z-index: 2; position: relative;     flex-direction: column; gap: 10px}
.title_pf h3{color: #fff; font-size: 70px; font-weight: 100;}


.play_btn{display: flex; border-radius: 50px;
background: #1792A3; gap:30px; padding: 10px 20px; justify-content: center;
    align-items: center;}
.play_btn span{color: #fff; font-size: 18px; font-weight: 400}

.play_btn{   transition-duration: .5s }
.play_btn:hover{gap:60px; transition-duration: .5s}

.pop-layer .pop-container {
  padding: 0;
  
   position: absolute;
  top: 50%;
  left: 50%;
  width: 800px;
  height: auto;
  background-color: #fff;
  z-index: 10;
  transform: translate(-50%, -50%);
  
}



.pop-layer {
  display: none;
  position: fixed;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  z-index: 10;
 
}





.dim-layer .pop-layer {
  display: block;
}

a.btn-layerClose {
  position: absolute; right: -30px;
  top: 10px; z-index: 9999
}



.work{max-width: 1620px; margin: 0 auto; padding-top: 100px; justify-content: flex-start;}

.main_title_item{}
.main_title_item p{font-size: 16px; color: #1792A3; font-weight: 100; margin-bottom: 5px}
.main_title_item h2{font-size: 40px; color: #fff; font-weight: 300}

.masonry-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, 25%);
    grid-auto-rows: 1px;
  
}

.masonry-item {
      overflow: hidden;
      width: 100%;
      position: relative;
      padding: 2px;
      grid-row-end: span 350;

    }

.masonry-item.videobox{grid-row-end: span 220;}

.masonry-item img{height: 100%;     object-fit: cover; display: block;  width: 100%; }

/* ignore this */
.pseudo-img {
	position: relative; overflow: hidden; display: block;
	width: 100%;
	height: 100%
}

.cusor_are{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: transparent; z-index: 2}


.sub .masonry-container{display: flex; flex-wrap: wrap;}
.sub .masonry-item{width: 50%; height: 460px}
.sub .masonry-item:nth-child(5n){width: 100%; height: 900px}


/* 
.main_work .masonry-item:nth-child(1) {grid-row-end: span 220;}
.main_work .masonry-item:nth-child(2) {grid-row-end: span 369;}
.main_work .masonry-item:nth-child(3) {grid-row-end: span 220;}
.main_work .masonry-item:nth-child(4) {grid-row-end: span 369;}
.main_work .masonry-item:nth-child(5) {grid-row-end: span 369;}
.main_work .masonry-item:nth-child(7) {grid-row-end: span 220;}
.main_work .masonry-item:nth-child(8) {grid-row-end: span 220;}
.main_work .pseudo-img{ height: 100%;  }
 */

.main_work .masonry-item:nth-child(6) {grid-row-end: span 220;}
.main_work .masonry-item:nth-child(8) {grid-row-end: span 220;}

.pseudo-img{
	position:relative;
  padding-bottom:56.25%;
}
.pseudo-img.wide{padding-bottom: 43%}
.pseudo-img.onlyimg{padding-bottom: 0}

.pseudo-img iframe{
	position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%
}

ul.tabs{
	margin: 0px;
	padding: 0px;
	list-style: none;
	display: flex; 
	gap:20px;
	justify-content: flex-end;
    align-items: center;
    margin-top: -50px
}
ul.tabs li{
	background: none;
	color: #fff;
	display: inline-block;
	cursor: pointer;
	border: 1px solid #fff; border-radius: 5px;
	padding: 0 20px;
	height: 50px; line-height: 50px; font-size: 18px;
	text-transform: uppercase
}

ul.tabs li.current{
	background: #1792A3;
	border-color: #1792A3
}

.tab-content{
	display: none;
	margin-top: 50px;
}

.tab-content.current{
	display: inherit;
}


.work_list{display: flex; gap:20px; }
.work_list a{border: 1px solid #515151; padding-bottom: 25px; }
.work_list a:hover{border: 1px solid #1792A3;
box-shadow: 2px 4px 35px 0px rgba(0, 0, 0, 0.50);}

.work_list a span.tag{margin:20px; line-height: 30px; height: 30px; 
font-size: 16px; color: #B6B6B6; border: 1px solid #B6B6B6; border-radius: 5px; display: inline-block; padding: 0 15px}
.work_list a span.work_title{font-size: 25px; color: #fff; margin-top: 10px; display: block; margin: 20px 20px 0 20px;
display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;  
   overflow: hidden;}
.work_list a span.work_title img{max-width: 35px}


.work_list a, .sub .work_list a {
    border: 1px solid #515151;
    padding-bottom: 25px;
    width: calc(25% - 15px); flex:none}

.fp-watermark{display: none !important}


.contact_main .inare{display: flex;align-items: center;
    justify-content: space-between; max-width: 1620px; margin: 0 auto;}



.map_text{display: flex; gap:10px; margin: 40px 0;justify-content: flex-start;
    align-items: center;}
.map_text span{color: #fff; font-size: 22px; font-weight: 200}

.map_btn{display: flex; gap:10px; justify-content: flex-start;
    align-items: center;}

.map_btn a{font-size: 18px; color: #fff; height: 50px; padding: 0 25px; line-height: 48px; border: 1px solid #fff; border-radius: 5px; transition-duration: .5}
.map_btn a:hover{background: #fff; color: #222; transition-duration: .5}


.contact_main{height: 100vh; padding: 100px 0 0 0}
.contact_main .map{width: 60%}
.contact_main .map iframe{width: 100%; height: 600px}

.partner_slide{padding: 50px 0; height: }
.partner_slide .slick-slide{padding: 0 10px}
.partner_slide .slick-slide img{width: 100%}

.footer_main{height:fit-content;}
.footer{ border-top: 1px solid #666666;height: 230px; padding: 40px 0 }
.footer .infoot{max-width: 1620px; margin: 0 auto; display: flex; justify-content: flex-start;
    align-items: center; gap:55px}

.footer .infoot .foot_txt{}
.footer .infoot .foot_link{display: flex; justify-content: flex-start;
    align-items: center; gap:18px; margin-bottom: 25px}
.footer .infoot .foot_link a{position: relative; color: #858585; font-size: 16px;} 
.footer .infoot .foot_link a + a:after{content: ''; position: absolute; left: -9px; width: 1px; height: 8px; background: #858585; top: 7px}


.footer .infoot .foot_copy p{color: #858585; font-size: 16px;}
.footer .infoot .foot_copy p + p{margin-top: 8px}

.footer .infoot .foot_copy p i { font-style: normal; color: #484848; font-weight: 100;   }


.sub{padding: 100px 0}
.sub.nopadding{padding-top: 0}
.sub .inner{max-width: 1620px; margin: 0 auto;}


.sub_title{text-align: center;}
.sub_title h2{font-size: 40px; color: #fff; font-weight: 500; text-transform: uppercase; margin-bottom: 60px}

.sub_visual{background-size: cover !important; height: 600px; overflow: hidden; background-position: center !important}
.sub_visual.bg01{background: url('/resources/images/sub/bg01.png')}
.sub_visual.bg02{background: url('/resources/images/sub/bg02.png')}
.sub_visual.bg03{background: url('/resources/images/sub/bg03.png')}


.sub_visual_in{height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;}
.sub_visual_in h2{font-size: 60px; color: #fff; font-weight: 500; text-transform: uppercase;}

.go_contact{display: flex; color: #fff; font-size: 20px; font-weight: 400; gap:20px; 
padding: 0 50px; height: 54px; border: 1px solid #fff; border-radius: 5px;justify-content: center;
    align-items: center; line-height: 52px ; margin-top: 27px; transition-duration: .5s}


.go_contact:hover{background: #1792A3; border-color: #1792A3; transition-duration: .5s}




.sub ul.tabs{
	margin: 0px;
	padding: 0px;
	list-style: none;
	display: flex; 
	gap:20px;
	justify-content: center;
    align-items: center;
    margin-top: 0px
}

.sub .work_list{flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;}
.sub .work_list a{width: calc(25% - 15px)}
.work_list a img{width: 100%; height: 450px; object-fit: cover;  }


.submap{}
.submap iframe{width: 100%; height: 700px}


.contact_bg{background: #2A2A2A}

.contact_flex{display: flex;max-width: 1620px; margin: 0 auto; padding: 40px 0}
.contact_flex .box{width: 33.33%; padding: 0px 30px; position: relative}
.contact_flex .box + .box{border-left: 1px solid #8E8E8E}

.contact_flex .box h2{color: #fff; font-size: 22px; line-height: 33px; font-weight: 600}
.contact_flex .box p{color: #fff; font-size: 16px; line-height: 21px; font-weight: 300; margin-top: 15px}
.contact_flex .box img{position: absolute; right: 30px; top: 0}
.form{margin-top: 70px}
.form_flex{display: flex; gap:70px; align-items: stretch;
    justify-content: flex-start;}
.form_flex .left{flex:1}

.form_are{display: flex; border-bottom: 1px solid #fff; align-items: center;
    justify-content: flex-start; padding: 10px 0 }
.form_are p{font-size: 18px; color: #fff; line-height: 60px; width: 130px; padding: 0 25px}
.form_are input[type="text"]{height: 60px;
    border-radius: 0px;
    border: 0px solid #dfdfdf;
    padding: 0 15px;
    font-size: 18px;
    width: 100%;
    line-height: 60px;
    background: transparent; color: #fff}
.form *:placeholder{color: #8D8D8D}


.form_are input[type="radio"]{display: none}
.form_are input[type="radio"] + label{height: 45px; border: 1px solid #8D8D8D; color: #8D8D8D;
 line-height: 43px; flex:1; width: 100%; text-align: center; cursor: pointer; font-size: 18px }
.form_are input[type="radio"]:checked + label{color: #fff; border-color: #1792A3; background: #1792A3}
.radio_flex{display: flex; gap: 40px; flex:1}


.file_flex{display: flex; align-items: center;
    justify-content: space-between; flex:1}


.file_flex span{color: #8D8D8D; font-size: 18px; line-height: 60px; }
.file_flex input[type="file"]{display: none}
.file_flex input[type="file"] + label{height: 45px; line-height: 45px; text-align: center; background: #3A3A3A; color: #fff; font-size: 18px; padding: 0 25px}

.form_flex .right{flex:1;  border-bottom: 1px solid #fff}
.form_flex .right p{padding: 10px 25px; font-size: 18px; color: #fff; line-height: 60px; border-bottom: 1px solid #fff}
.form_flex .right textarea{border: 0; padding: 20px 15px;
    font-size: 18px; background: transparent; color: #fff; height: 83%; }


.pre_agree{margin-top: 30px; display: flex; align-items: center;
    justify-content: flex-start;}
.pre_agree input{display: none}
.pre_agree input + label{padding-left: 35px; position: relative; font-size: 18px; color: #8d8d8d; background:url('/resources/images/ckoff.png');
background-repeat: no-repeat; background-position: left center; background-size: 22px 22px; line-height: 22px; cursor: pointer}
.pre_agree input + label span{color: #1792A3; font-weight: bold}

.pre_agree input:checked + label{background-image:url('/resources/images/ckon.png');}

.contact_btn{text-align: center; margin-top: 70px}
.contact_btn button{border: 0; height: 60px; line-height: 60px; text-align: center; background: #1792A3;
 border-radius: 5px; font-size: 20px; font-weight: 500; padding: 0 40px; color: #fff}
.contact_btn a, .contact_btn input, .contact_btn span {border: 0; height: 60px; line-height: 60px; text-align: center; background: #1792A3;
 border-radius: 5px; font-size: 20px; font-weight: 500; padding: 0 40px; color: #fff; display: inline-block; width: 200px; 
 cursor: pointer; }


.contact_ok{text-align: center; padding-top: 3rem; }
.contact_ok img{display: block; margin: 0 auto 25px}
.contact_ok h2{color: #fff; font-size: 30px; font-weight: bold; margin-bottom: 10px}
.contact_ok p{font-size: 20px; font-weight: 300; color: #fff}

.pre_txt_box{margin-top: 30px; }
.pre_txt_box h2{color: #fff; font-size: 22px; margin-bottom: 10px}
.pre_txt_box .box{height: 150px; overflow-y: auto; padding: 10px; border: 1px solid #f5f5f5}
.pre_txt_box .box p{word-break: keep-all; color: #f5f5f5; font-size: 16px; line-height: 24px; font-weight: 300}





  
  .fliter_add{ position: absolute; bottom: 6px; left: 0; width: 100%; padding: 5px 15px; }
  .fliter_add span{ display: inline-block; padding: 5px; text-align: center; background: #222; border-radius: 10px; 
  color:#fff; font-size: 12px; width: 100%; line-height: 25px; float: left;  }
  
  
  
  
  .no-data{  text-align: center; padding: 80px 0;  }
  .no-data p { font-size: 15px;  }
  
  
  
.file_are{border-radius: 8px; border: 1px solid #dfdfdf; height: 55px; padding: 0 25px; display: flex; align-items: center;  }
.file_are input{display: none} 
.file_are .file-label em{height: 38px; background: #eee; line-height: 38px; border-radius: 5px; 
 font-size: 16px; text-align: center; padding: 0 25px; display: inline-block; font-style: normal;  }
.file_are  .file-label span{font-size: 16px; color: #eee; margin-left: 20px;}

  
  .file_are{ height: auto; padding: 0px; border: 0;  }
  
  .manual_file_w  > div{ display: inline-block; width: 100%;  }
  .manual_file_li{ display: inline-block; width: 100%; margin-top: 7px;   }
 .manual_file_li ul li { display: inline-block;  padding: 10px 0; position: relative;  color:#fff; } 
  .file_are .file-label { display: inline-block; width: 100%; cursor: pointer;  padding: 10px 0 10px; margin-top: 20px;  }
  
  .manual_file_li ul li i { display: inline-block; width: 15px; height: 15px; background: #c4c4c4 url("../images/common/close_iconw.png") no-repeat center; border-radius: 100%;
position: absolute; right: -9px; top:-3px;  background-size: 7px; cursor: pointer;  }

 
 
 .manual_file_li ul li { margin: 5px 3px; position: relative;  }
.manual_file_li ul li { display: inline-block; padding: 5px 10px; border: 1px solid #eee; border-radius: 10px;  }
.manual_file_li ul li:first-child { margin-left: 0;  } 
 
  .qna_file_w td > p{ display: inline-block; width: 100%; margin-top: 10px;  }
  



    .contact_action .essential > p span{ position: relative;  }
  .contact_action .essential > p span:after { content:"*"; display: inline-block; font-style: normal; color:#f00; font-weight: 600; 
  position: absolute; top: -3px; right: -13px; line-height: 1;  }


.main_title_item{ margin-top: 30px !important; }



.popup_banner > .mySwiper_main { overflow:hidden; /* height: 380px; */ position: relative; }
.popup_banner .swiper-pagination{ bottom:10px; right: 10px;   }
.popup_banner .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.popup_banner .swiper-pagination {
    text-align: right;
    padding: 0 10px;
}

.popup_banner .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background-color: #fff;
    border-radius: 6px;
    opacity: 1;
    margin: 0 2px !important;
    padding: 0;
}

.popup_banner .swiper-pagination-bullet-active {
    width: 24px;
    background-color: #222;
    border-radius: 6px;
    margin: 0 2px !important;
    padding: 0;
}
  
  
/* 팝업 */
.popup {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 999999999999;
    padding: 0;
    left: 0;
    top: 0;
}

.popup .popup_bg_w {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    ; background-color: rgba(0,0,0,0.6);
}

.popup .popup_box {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    min-width: 300px;
    max-width: 360px;
    background-color: #fff;
    text-align: center;
    padding: 20px;
    border-radius: 10px;
    z-index: 9999999;
}

.popup .popup_box .popup_top {
    text-align: right;
}

.popup .popup_box .popup_top a.btn_close, .popup .popup_box .popup_top button.btn_close {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 0;
    background: url('/resources/images/ico_close.svg') left center;
    background-size: 20px;
    background-repeat: no-repeat;
}

.popup .popup_box .popup_con {
}

.popup .popup_box .popup_con .top {
    padding-bottom: 15px;
    border-bottom: solid 1px #EEEEEE;
}

.popup .popup_box .popup_con .top .img {
    display: table-cell;
    vertical-align: middle;
    width: 50px;
    height: 50px;
    overflow: hidden;
}

.popup .popup_box .popup_con .top .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 25px;
}

.popup .popup_box .popup_con .top .info {
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    padding-left: 15px;
}

.popup .popup_box .popup_con .top .info .name {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2em;
    margin-bottom: 4px;
}

.popup .popup_box .popup_con .top .info .name > span {
    display: inline-block;
    padding-right: 5px;
}

.popup .popup_box .popup_con .top .style {
}

.popup .popup_box .popup_con .top .style:after {
    content: '';
    display: block;
    clear: both;
}

.popup .popup_box .popup_con .top .style a.cstyle {
    float: left;
    display: block;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.4em;
    margin-right: 5px;
}

.popup .popup_box .popup_con .con {
    display: block;
    width: 100%;
    padding-top: 15px;
}

.popup .popup_box .popup_con .con:after {
    content: '';
    display: block;
    clear: both;
}

.popup .popup_box .popup_con .con div.coin {
    display: table;
    width: 100%;
    margin-bottom: 10px;
}

.popup .popup_box .popup_con .con div.coin:after {
    content: '';
    display: block;
    clear: both;
}

.popup .popup_box .popup_con .con div.coin dl {
    display: table-cell;
    vertical-align: middle;
}

.popup .popup_box .popup_con .con div.coin dl dt {
    float: left;
    margin-top: 3px;
    padding-right: 5px;
    font-size: 13px;
    color: #151515;
    font-weight: 400;
}

.popup .popup_box .popup_con .con div.coin dl dd {
    float: left;
    font-size: 13px;
    color: #151515;
    font-weight: 600;
}

.popup .popup_box .popup_con .con div.coin dl dd:before {
    display: inline-block;
    content: '';
    width: 15px;
    height: 19px;
    background: url('/resources/images/ico_coin.svg') left center;
    background-size: 15px;
    background-repeat: no-repeat;
    vertical-align: sub;
    padding-right: 4px;
}

.popup .popup_box .popup_con .con div.coin > p {
    display: table-cell;
    text-align: right;
    vertical-align: middle;
}

.popup .popup_box .popup_con .con div.coin > p a.btn_coiny {
    padding: 6px 14px;
}

.popup .popup_box .popup_con .con button.btn_coin, .popup .popup_box .popup_con .con .btn_coin {
    width: 100%;
    display: inline-block;
    background-color: #EB655F;
    padding: 15px 20px;
    border: solid 1px #EB655F;
    color: #fff;
    border-radius: 5px;
}

.popup .popup_box .popup_con .con button.btn_coin > p, .popup .popup_box .popup_con .con .btn_coin > p {
    font-size: 20px;
    font-weight: 700;
    padding-bottom: 12px;
    letter-spacing: -0.05em;
}

.popup .popup_box .popup_con .con button.btn_coin .bt_txt, .popup .popup_box .popup_con .con .btn_coin .bt_txt {
    display: table;
    width: 100%;
}

.popup .popup_box .popup_con .con button.btn_coin .bt_txt > p.coin, .popup .popup_box .popup_con .con .btn_coin .bt_txt > p.coin {
    display: table-cell;
    text-align: left;
    vertical-align: middle;
    font-size: 14px;
    font-weight: 700;
}

.popup .popup_box .popup_con .con button.btn_coin .bt_txt > p.coin:before , .popup .popup_box .popup_con .con .btn_coin .bt_txt > p.coin:before {
    display: inline-block;
    content: '';
    width: 15px;
    height: 16px;
    background: url('/resources/images/ico_coin.svg') left center;
    background-size: 15px;
    background-repeat: no-repeat;
    vertical-align: bottom;
    padding-right: 4px;
}

.popup .popup_box .popup_con .con button.btn_coin .bt_txt > p.coin > span, .popup .popup_box .popup_con .con .btn_coin .bt_txt > p.coin > span {
    font-weight: 400;
}

.popup .popup_box .popup_con .con button.btn_coin .bt_txt > p.time , .popup .popup_box .popup_con .con .btn_coin .bt_txt > p.time {
    display: table-cell;
    text-align: right;
    vertical-align: middle;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: -0.05em;
}

.popup .popup_box .popup_con .con button.btn_060, .popup .popup_box .popup_con .con .btn_060 {
    display: inline-block;
    width: 100%;
    background-color: #5C50B4;
    padding: 15px 20px;
    border: solid 1px #5C50B4;
    color: #fff;
    border-radius: 5px;
}

.popup .popup_box .popup_con .con button.btn_060 > p , .popup .popup_box .popup_con .con .btn_060 > p {
    font-size: 20px;
    font-weight: 700;
    padding-bottom: 12px;
    letter-spacing: -0.05em;
}

.popup .popup_box .popup_con .con button.btn_060 .bt_txt , .popup .popup_box .popup_con .con .btn_060 .bt_txt {
    display: table;
    width: 100%;
}

.popup .popup_box .popup_con .con button.btn_060 .bt_txt > p.won, .popup .popup_box .popup_con .con .btn_060 .bt_txt > p.won {
    display: table-cell;
    text-align: left;
    vertical-align: middle;
    font-size: 14px;
    font-weight: 700;
}

.popup .popup_box .popup_con .con button.btn_060 .bt_txt > p.won:before, .popup .popup_box .popup_con .con .btn_060 .bt_txt > p.won:before {
    display: inline-block;
    content: '';
    width: 15px;
    height: 16px;
    background: url('/resources/images/ico_won.svg') left center;
    background-size: 15px;
    background-repeat: no-repeat;
    vertical-align: bottom;
    padding-right: 4px;
}

.popup .popup_box .popup_con .con button.btn_060 .bt_txt > p.won > span, .popup .popup_box .popup_con .con .btn_060 .bt_txt > p.won > span {
    font-weight: 400;
}

.popup .popup_box .popup_con .con button.btn_060 .bt_txt > p.time, .popup .popup_box .popup_con .con .btn_060 .bt_txt > p.time {
    display: table-cell;
    text-align: right;
    vertical-align: middle;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: -0.05em;
}

.popup .popup_boxn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    min-width: 300px;
    max-width: 360px;
    background-color: #fff;
    text-align: center;
    padding: 30px;
    border-radius: 10px;
    z-index: 999999
}

.popup .popup_boxn h4.tit {
    font-size: 20px;
    font-weight: 600;
    color: #151515;
    margin-bottom: 12px;
}

.popup .popup_boxn .btn_bar {
    width: 100%;
    text-align: right;
    margin-bottom: 10px;
}

.popup .popup_boxn .btn_bar .btn_res {
}

.popup .popup_boxn .btn_bar .btn_res > span:before {
    display: inline-block;
    content: '';
    width: 18px;
    height: 20px;
    background: url('/resources/images/ico_re.svg') left center;
    background-size: 18px;
    background-repeat: no-repeat;
    vertical-align: bottom;
    padding-right: 4px;
}

.popup .popup_boxn .range_list {
    text-align: left;
}

.popup .popup_boxn .range_list > h5 {
    display: block;
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 2px;
}

.popup .popup_boxn .range_list > ul {
    margin-bottom: 30px;
}

.popup .popup_boxn .range_list > ul:after {
    content: '';
    display: block;
    clear: both;
}

.popup .popup_boxn .range_list > ul > li {
    float: left;
    margin: 8px 8px 0 0;
}

.popup .popup_boxn .range_list > ul > li.full {
    width: 100%;
}

.popup .popup_boxn .range_list > ul > li > a.btn, .popup .popup_boxn .range_list > ul > li > .btn {
    padding: 6px 20px;
    font-size: 14px;
    letter-spacing: -0.025em;
}

.popup .popup_boxn .range_list > ul > li > a.active , .popup .popup_boxn .range_list > ul > li > .active {
    background-color: #5C50B4;
    color: #ffffff;
    border: solid 1px #5C50B4;
}

.popup .popup_boxn .alarm {
    position: relative;
}

.popup .popup_boxn .alarm h4.tit {
    font-size: 20px;
    font-weight: 600;
    color: #151515;
    margin-bottom: 12px;
}

.popup .popup_boxn .alarm p.txt {
    font-size: 14px;
    line-height: 1.5em;
    color: #555555;
}

.popup .popup_boxn .alarm p.txt strong {
    color: #151515;
}

.popup .popup_boxn .alarm .btn_txt {
    float: right;
    margin-top: 20px;
}

.popup .popup_boxn h4.tit.left_tit {
    text-align: left;
}

.popup .popup_boxn p.txt {
    font-size: 12px;
    font-weight: 400;
    color: #151515;
    margin-bottom: 30px;
}

.popup .popup_boxn p.txt.left_txt {
    text-align: left;
}

.popup .popup_box_foot {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    text-align: center;
    padding: 30px;
    border-radius: 10px 10px 0 0;
}

.popup .popup_box_foot .popup_top {
    text-align: left;
    margin-bottom: 12px;
}

.popup .popup_box_foot .popup_top:after {
    content: '';
    display: block;
    clear: both;
}

.popup .popup_box_foot .popup_top h3.popup_tit {
    float: left;
    font-size: 18px;
    font-weight: 600;
}

.popup .popup_box_foot .popup_top a.btn_close {
    float: right;
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url('/resources/images/ico_close.svg') left center;
    background-size: 20px;
    background-repeat: no-repeat;
}

.popup .popup_box_foot .popup_con {
}

.popup .popup_box_foot .popup_con .top {
    padding-bottom: 15px;
    border-bottom: solid 1px #EEEEEE;
}

.popup .popup_box_foot .popup_con .top .img {
    display: table-cell;
    vertical-align: middle;
    width: 50px;
    height: 50px;
    border-radius: 25px;
    overflow: hidden;
}

.popup .popup_box_foot .popup_con .top .img img {
    width: 100%;
}

.popup .popup_box_foot .popup_con .top .info {
    display: table-cell;
    vertical-align: middle;
    text-align: left;
    padding-left: 15px;
}

.popup .popup_box_foot .popup_con .top .info .name {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2em;
    margin-bottom: 4px;
}

.popup .popup_box_foot .popup_con .top .info .name > span {
    display: inline-block;
    padding-right: 5px;
}

.popup .popup_box_foot .popup_con .con {
    padding-top: 20px;
}

.popup .popup_box_foot .popup_con .con .btn_box {
}

.popup .popup_box_foot .popup_con .con .btn_box dl.coin_hold {
    float: left;
    display: block;
}

.popup .popup_box_foot .popup_con .con .btn_box dl.coin_hold dt {
    float: left;
    padding-right: 5px;
    font-size: 13px;
    line-height: 19px;
    color: #151515;
    font-weight: 400;
}

.popup .popup_box_foot .popup_con .con .btn_box dl.coin_hold dd {
    float: left;
    font-size: 13px;
    color: #151515;
    font-weight: 600;
}

.popup .popup_box_foot .popup_con .con .btn_box dl.coin_hold dd:before {
    display: inline-block;
    content: '';
    width: 15px;
    height: 19px;
    background: url('/resources/images/ico_coin.svg') left center;
    background-size: 15px;
    background-repeat: no-repeat;
    vertical-align: sub;
    padding-right: 4px;
}

.popup .popup_box_foot .popup_con .con .btn_box p.second {
    float: right;
    display: block;
    text-align: left;
    vertical-align: middle;
    font-size: 14px;
    font-weight: 700;
}

.popup .popup_box_foot .popup_con .con .btn_box p.second:before {
    display: inline-block;
    content: '';
    width: 15px;
    height: 17px;
    background: url('/resources/images/ico_coin.svg') left center;
    background-size: 15px;
    background-repeat: no-repeat;
    vertical-align: bottom;
    padding-right: 4px;
}

.popup .popup_box_foot .popup_con .con .btn_box p.second > span {
    font-weight: 400;
}

.popup .popup_box_foot .popup_con .con .btn_box p.second > p.time {
    display: table-cell;
    text-align: right;
    vertical-align: middle;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: -0.05em;
}

.popup .popup_box_foot .popup_con .con button.btn_coin {
    width: 100%;
    background-color: #EB655F;
    padding: 18px 20px;
    border: solid 1px #EB655F;
    font-size: 17px;
    font-weight: 500;
    color: #fff;
    border-radius: 5px;
}

.popup .popup_box_foot .popup_con .con button.btn_060 {
    width: 100%;
    background-color: #5C50B4;
    padding: 18px 20px;
    border: solid 1px #5C50B4;
    font-size: 17px;
    font-weight: 500;
    color: #fff;
    border-radius: 5px;
}
  
  

  
.banner_popup input[type=checkbox]{display:none;}
.banner_popup input[type=checkbox] + label{display:inline-block;position:relative;padding-left:30px;font-weight:400;font-size:13px;line-height:20px;vertical-align:top;cursor:pointer;}
/*.checkbox_r input[type=checkbox] + label em{color:#de4f41;}*/
.banner_popup input[type=checkbox] + label span{font-weight:300;color:#999;}
.banner_popup input[type=checkbox] + label:before{content:""; float:left;
display:inline-block;position:absolute;left:0;top:0;width:20px;height:20px;border:1px solid #dddddd;
border-radius:10px;background:url('/resources/images/check_off.svg') no-repeat center center;background-size:32px auto;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
.banner_popup input[type=checkbox]:checked + label{color:#151515;font-weight:400;}
.banner_popup input[type=checkbox]:checked + label:before{border:1px solid #fff;
background:url('/resources/images/common/check_on4.svg') no-repeat center center;background-size:32px auto;}
.banner_popup input[type=checkbox]:disabled + label{cursor:default;}
/* .checkbox_r + .checkbox_r{margin-left:25px;} */

.banner_popup .popup_boxn{ padding: 0; background: none; max-width: 450px;  } 

.banner_popup .title { position: absolute; left: 0px; top:-50px; width: 100%;  }

.banner_popup .cont{  border-radius: 30px; overflow: hidden; }
.banner_popup .close{ position: absolute; right: -0px; top: 6px;  }
.banner_popup .close img{ width: 30px; cursor: pointer;  }

.banner_popup .title .chkday_w { position: absolute; left: 0; top: 10px ; }
.banner_popup .title .chkday_w label { color:#fff; float: left; margin-left: 30px; cursor: pointer;  }
.banner_popup .title .chkday_w input[type=checkbox] + label { margin-left: 0;  }

  .fp-table{ overflow: hidden; }