@media all and (max-width:1280px){
	#header-menu{
		
	}
	#header-menu > ul > li{
		font-size: 16px;
		margin: 0 20px;
	}
	.page-w{
		width:100%;
		padding: 0 30px;
	}
	#section-02{
		min-height: 100vh;
		height: auto;
		padding-bottom: 100px;
	}
	.video-section video{
	    position:absolute;
	    left:50%;
	    top:50%;
	    transform:translate(-50%,-50%);
	    height:100%;
    }
	.sub-postion > ul > li{
		width: 32%;
	}
}
@media all and (max-width:1024px){
	.brand-bbs ul{
		display:flex;
		flex-wrap:wrap;
	}
	.brand-bbs ul li.gbs p{
		width: 320px;
		margin:0 auto;
		margin-top: 20px;
		
	}
	.brand-bbs ul li.gbs{
		width: 50%;
	}
	#header-menu{
		display:none;
	}
	#header #contact_us{
		display:none;
	}
	#header #mobile-button,
	#header.white #mobile-button,
	#header.sub-page-white #mobile-button{
		display:block;
	}
	.mobile-menu.active{
		right:0;
	}
	.title-index h3{
		font-size: 50px;
	}
	#contact_us_mobile{
		width:100%;
		height:40px;
		text-align:center;
		background:#fff;
		line-height: 40px;
		font-family:'Pretendard';
		font-size:16px;
		border-radius:30px;
		margin-top: 50px;
	}
	.mobile-main-menu{
		margin-top: 50px;
	}
	.mobile-main-menu > ul > li{
		line-height:30px;
	}
	.board_search{
		position:relative;
		right:unset;
		left:0;
		width:100%;
	}
	.sub-title{
		font-size: 48px;
	}
	#card-0 h3{
		font-size: 90px;
	}
	#card-1 h3, #card-2 h3{
		font-size: 90px;
	}
	#contact_title{
		font-size:30px;
	}
	.sub-postion > ul > li{
		width: 49%;
	}
	.creator-list-m ul{
		gap:4%;
	}
	.creator-list-m ul li{
		width:48%;
	}
	.creator-sns{
		width: 100% !important;
	}
	.creator-sns ul{
		display:block !important;
		width:100% !important;
	}
	.creator-sns ul li{
		width: 20% !important;
		display: inline-block;
	}
	.creator-sns ul li img{
		width: 40px;
	}
	.creatore ul{
		flex-wrap:wrap;
	}
	.creatore ul li{
		width: 48%;
	}
	.creatore ul .card-in h4{
		font-size: 28px;
		padding: 10px 0px
	}
	.sub-content-title,
	#road-map-tit h3{
		font-size: 36px;
	}
	.sub-roadmap > ul > li > ul{
		display:block;
	}
	.sub-roadmap > ul > li > ul li{
		width:100%;
	}
	.sub-roadmap > ul > li > ul > li.c{
		margin-top:20px;
	}
	.sub-roadmap > ul > li > ul > li.t{
		font-size: 28px;
	}
	#creator05 h3{
		font-size:48px;
	}
	.fr-popup h3{
		font-size:24px;
	}
	.fr-popup .close-btn{
		top:30px;
	}
	#thumb-sevice02{
		height: 50vh;
	}
	#service02-in h4{
		font-size:20px;
	}
	#brand-m h4{
		font-size: 48px;
		height: 70px;
	}
}
@media (max-width: 768px){
	.service-04-edum{
		display:block;
	}
	.service-04-edu{
		width:100%;
	}
	.brand-md ul{
		display:block;
	}
	.brand-md ul li,
	.content-01 .brand-md ul li,
	.content-02 .brand-md ul li{
		width:100%;
	}
	
	.brand-md ul li h3{
		font-size: 30px;
	}
	#sevice02-mn > ul{
		display:block;
	}
	#sevice02-mn > ul > li{
		width:100%;
	}
	.fr-popup{
		width: 100%;
		height: 100vh;
		border-radius:0;
		overflow-y:auto;
	}
	.sub-postion > ul > li .card-in h3{
		font-size: 48px;
	}
	.sub-postion > ul > li .card-in p{
		font-size:20px;
	}
	.sub-postion > ul > li .card-in ul li{
		font-size:16px;
		line-height:27px;
	}
	.contact_us_content{
		margin-top: 50px;
		display:block;
	}
	#card-1 p, #card-2 p{
		font-size: 40px;
	}
	#section-02m .fp-overflow .page-w,
	.page-w{
		padding: 0 25px;
	}
	#text-video{
		font-size:68px;
	}
	#cont-sv1 h3{
		font-size: 80px;
		height: 100px;
	}
	#cont-sv1 p{
		font-size:40px;
		height: 60px;
	}
	.title-index h3{
		font-size: 40px;
	}
	.more{
		top: 15px;
	}
	.more a{
		font-size:14px;
		line-height: 20px;
		width:60px;
	}
	.more a:before{
		height: 20px;
		width:20px;
	}
	#section-03:after{
		display:none;
	}
	#section-03:before{
		display:none;
	}
	.review-n{
		height: 300px;
	}
	#section-03{
		min-height: 300px;
	}
	#section-03,
	#section-04,
	#section-05{
		padding:50px 0px;
	}
	.news-inner > ul{
		gap:6%;
	}
	.news-inner > ul > li{
		width: 47%;
	}
	.news-inner > ul > li > a .news-card .thumbnail{
		height: 150px;
	}
	#bo_cate a{
		font-size: 14px;
		padding: 2px 15px;
		margin-right:1px;
	}
	#title-em{
		height:200px;
	}
	#title-emin{
		margin-top:150px;
		
	}
	.list-view-row li{
		width: 32%;
	}
	.sub_bg{
		height: 300px;
		
	}
	.sub-title{
		padding-top: 150px;
	}
	#card-0 h3{
		font-size: 80px;
	}
	.contact_us_content #left-bg{
		width:100%;
		height:150px;
	}
	.contact_us_content #right-cont{
		width:100%;
	}
	
	.creator-list-row:hover .text-inner{
		display:block;
		height:200px;
	}
	.creator-list-m ul li a{
		width: 40px;
	}
	.service-04-edu ul li h5{
		font-size:18px;
		line-height: 30px;
	}
	#creator05 h3{
		font-size:36px;
		padding: 0 30px;
		padding-top: 100px;
	}
	#creator05 p{
		font-size: 20px;
		padding: 0 40px;
		line-height: 30px;
	}
	#creator05{
		min-height: auto;
		padding-bottom: 100px;
	}
	.fr-popup .input-field.half{
		width:100%;
	}
	#creator01{
		padding-top:100px;
	}
	.sub-roadmap{
		padding-top: 50px;
	}
	#thumb-sevice02{
		height: 450px;
		border-radius:10px;
	}
	#thumb-sevice02 img{
		height:100%;
		width: auto;
	}
	#sevice02-mn > ul > li h5{
		font-size:24px;
		line-height: 32px;
	}
	#sevice02-mn > ul > li h6{
		font-size:18px;
		line-height: 24px;
	}
	#sevice02-mn > ul > li > ul > li.ca{
		font-size:16px;
		line-height:24px;
		margin-bottom: 20px;
	}
	#sevice02-mn > ul > li > ul > li.ca:before{
		top:8px;
	}
	.faq-wrap ul li h4{
		font-size:20px;
	}
	.faq-wrap ul li p{
		font-size: 16px;
		line-height: 24px;
	}
	#service05{
		padding:70px 0;
		padding-bottom: 100px;
	}
	#fantrie-logo{
		width: 60%;
		margin: auto;
		margin-bottom:50px
	}
	#fantrie-logo img{
		width: 100%;
	}
	.fantrie-content ul{
		display:block
	}
	.fantrie-content ul li{
		width :100%;
	}
	.fantrie-content ul li.c h4{
		font-size: 28px;
		margin-top: 50px;
	}
	.fantrie-content ul li.c p{
		font-size:18px;
	}
	.creator-b .story-ul-m > li .gall_con a{
		display:block;
	}
	.creator-bg-thumb{
		width: 100%;
	}
	.creator-success-om{
		width:100%;
		margin-top: 20px;
	}
	.creator-success-view-page .section-info h3{
		font-size: 22px;
	}
	#creator-success-title-em #title-emin{
		font-size:36px;
		margin-top:100px;
	}
	#contact_title{
		margin:0;
	}
	.about-frank #bg01,
	.about-frank #bg02{
		display:none;
	}
	.content-02 .brand-md ul li{
		padding:0;
	}
	.about-frank{
		height:auto;
		padding: 0px;
	}
	.about-frank #bg01-m{
		display:block;
		width:100%;
	    height: 300px;
	    margin-bottom:30px;
	    background:url(../img/testoff01.jpg) no-repeat;
	    background-size:cover;
	    background-position:center;
	}
	.about-frank #bg02-m{
		display:block;
		width:100%;
	    height: 300px;
	    margin-bottom:30px;
	    background:url(../img/testoff02.jpg) no-repeat;
	    background-size:cover;
	    background-position:center;
	}
	.content-002m .sub-roadmap > ul > li > ul{
		width: 100%;
		margin-bottom: 100px;
	}
	.content-002m .sub-roadmap > ul > li:nth-child(2n) > ul{
		margin-left:0;
		width:100%;
	}
	.content-002m .sub-roadmap > ul > li:nth-child(2n) > ul > li.c{
		padding-left:0;
	}
	.content-002m .sub-roadmap > ul > li:nth-child(1):before{
	width: 60px;
	height: 60px;
	background:url(../img/port-btn.png)no-repeat;
	background-size:contain;
	content:'';
	display:block;
	position: absolute;
	bottom:-40px;
	left:50%;
	opacity:0.5;
	transform:translate(-50%,0);
}
.content-002m .sub-roadmap > ul > li:nth-child(2):before{
	width: 60px;
	height: 60px;
	background:url(../img/port-btn.png)no-repeat;
	background-size:contain;
	content:'';
	display:block;
	position: absolute;
	bottom:-40px;
	left:50%;
	transform:translate(-50%,0);
	opacity:0.5;
}
.content-002m .sub-roadmap > ul > li:nth-child(3):before{
	width: 60px;
	height: 60px;
	background:url(../img/port-btn.png)no-repeat;
	background-size:contain;
	content:'';
	display:block;
	position: absolute;
	bottom:-40px;
	left:50%;
	transform:translate(-50%,0);
	opacity:0.5;
}
	.index-content-01{
		display:block;
	}
	.index-01-right{
		width:100%;
		padding:30px;
		padding-bottom: 120px;
	}
	.index-01-left .slick-slide{
		height:400px;
	}
	.index-01-left .slick-slide img{
		position:absolute;
		left:50%;
		top:50%;
		transform:translate(-50%,-50%);
		height: 100%;
	}
	.index-01-right p{
		font-size: 18px;
	}
	.index-01-right h3{
		font-size: 36px;
	}
	.index-01-right h4{
		font-size: 24px;
		margin-top:20px;
	}
	.index-01-left{
		width:100%;
	}
	.content-bbs h3{
		font-size:24px;
	}
	.content-bbs p{
		font-size:18px;
	}
	.content-bbs > ul{
		display:block;
		position:relative;
	}
	.content-bbs .abs{
		margin-left:0;
	}
	.content-bbs > ul .bbs{
		height: 200px;
	}
	.content-bbs .abs li{
		height: 140px;
	}
	.content-bbs .abs li h4{
		font-size: 18px;
		margin-top:0;
	}
	.content-bbs .abs{
		margin-top:20px;
	}
	.content-bbs .abs li p{
		font-size: 16px;
	}
	#section-02m{
		display:none;
	}
	#fullpage #section-02m{
		display:block;
		min-height: 600px;
	}
	#fullpage #section-02m .fp-overflow > .page-w,
	#fullpage #section-02m .fp-overflow > #s02-sendm,
	#fullpage #section-021m .fp-overflow > .page-w,
	#fullpage #section-021m .fp-overflow > #s02-sendm{
			display:none;
		}
	#section-021m{
		background:#000000;
		overflow:hidden;
		 
	}
	#section-02m-mobile{
	    display:block;
		padding: 100px 0px;
		padding-top: 150px;
    }
	.section02m-title h3{
		font-size:28px;
		font-family:'Pretendard';
		margin-bottom:20px;
		color:#fff;
		text-align:center;
		letter-spacing:10px;
		font-weight:400;
	}
	#vid-text-wrap{
		width:460px;
	}
	#text-video-title{
		font-size:40px;
		letter-spacing: 10px;
	}
	#text-video-title  b{
		display:block;
	}
	#text-video, #text-video2{
		font-size: 24px;

	}
	.partnership-tit h3{
		font-size: 28px;
		top:100px;
	}
	#partnership{
		padding-top:100px;
	}
	.brand-bbs h3{
		font-size:18px;
		margin:40px 0px;
		text-align:center;
	}
	.brand-bbs ul{
		display:block;
	}
	.brand-bbs ul li.gbs{
		width:100%;
	}
	.brand-bbs ul li:nth-child(2n){
		left:30px;
	}
	.brand-bbs ul li:nth-child(2n-1){
		left:-30px;
	}
	#right-cont input[type="submit"]{
		position:relative;
		bottom:0;
		left:0;
		width: 100%;
	}
	.title-index p{
		font-size: 18px;
	}
	.content-02e{
		overflow:hidden;
	}
	.cont02mmin{
		display:block;
		overflow:hidden;
		position:relative;
		height:1px;
		opacity:0;
		transition: all 0.3s ease;
		margin-top: -30px;
	}
	.cont02mmin.active{
		display:block;
		height:150px;
		opacity:1;
		margin-top: 0px;
	}
	#cont-02m-mobile-wrap{
		background:linear-gradient(45deg,#000 ,#33353a, #000);
		padding: 20px;
		color:#fff;
	}
	.cont-02mm h4{
		font-size: 24px;
		font-family:'Pretendard';
		margin-bottom: 10px;
	}
	.cont02mmin{
		padding-bottom: 30px;
	}
	.cont02mmin p{
		font-size:16px;
		font-family:'Pretendard';
		line-height: 24px;
		font-weight:400;
	}
	.cont02mmin .more{
		position:relative;
		display:inline-block;
		width: 60px;
		margin-left:-30px;
		left:50%;

	}
	.cont-02mm{
		position:relative;
		z-index:10;
		color:#ffffff77;
	}
	.cont-02mm.active{
		color:#ffffff;
	}
	.content-bbs h6{
		display:block;
		position:absolute;
		left:unset;
		right:0;
		top:0;
		width:45%;
		font-size: 18px;
		color:#000;
		font-family:'Pretendard';
		line-height:28px;
		font-weight:400;
	}
	#fullpage #section-02m .fp-overflow .page-w .section02m-title{
		padding-top:100px;
	}
	#fullpage #contact_title{
		padding-top:100px;
		height:auto;
		font-size:28px;
		letter-spacing:10px;
		font-weight:400;
	}
	#fullpage #right-cont .input.text_b{
		height:40px;
	}
	#fullpage #right-cont input[type="submit"]{
		height: 40px;
	}
	#fullpage #right-cont li.t{
		font-size:12px;
	}
	#fullpage #contact_us_wrap{
		padding-top:100px;
	}
	 
}
@media all and (max-width:600px){
	#port{
		padding: 20px;
		padding-top: 120px;
	}
	.port-tit:after{
		width: 50px;
		height:50px;
		margin-left:-25px;
		background-size:contain;
	}
	.port-img-an ul li{
		padding: 10px;
	}
	.port-thumb{
		height:200px;
	}
	.port-tit h1{
		font-size: 28px;
	}
	.port-tit h1 span{
		font-size:48px;
	}
	.port-tit h3{
		font-size:18px;
	}
	.contact_us_content{
		padding: 30px;
	}
	
	.contact-pop{
		right:20px;
		bottom:20px;
	}
	.cnt-pop ul li{
		width: 70px;
	}
	.about-frank .content-01 .brand-md h1{
		font-size:40px;
		margin-bottom:30px;
	}
	.about-frank .brand-md{
		padding:50px 0px;
	}
	#card-1 h3, #card-2 h3{
		font-size: 60px;
	}
	.sub-title{
		font-size: 36px;
		
	}
	.list-view-row .text-inner h4{
		font-size: 16px;
	}
	.condate ul li{
		font-size:12px;
	}
	.mobile-menu.active{
		right:0%;
		width:100%;
	}
	#header{
		height: 60px;
	}
	#header #mobile-button,
	#header.white #mobile-button,
	#header.sub-page-white #mobile-button{
		width :30px;
		height: 30px;
		right:20px;
		top:15px;
	}
	#header-logo{
		left:20px;
		top: 15px;
		height: 20px;
	}
	#vid-text-wrap{
		width:400px;
	}
	#text-video,#text-video2{
		font-size:24px;
		line-height: 50px;
	}
	#text-video b ,
    #text-video2 b {
		font-weight:600;
	}
	#text-video b:before,
    #text-video2 b:before{
    	height: 21px;
		padding: 5px;
		
    }
	#cursor{
		height:50px;
		margin-top:-30px;
	}
	#cont-sv1 h3{
		font-size: 60px;
		height: 80px;
	}
	#cont-sv1 p{
		font-size:36px;
		height: 50px;
	}
	.footer-sns{
		position:relative;
		left:0;
		margin:0 auto;
		display:block;
		text-align:center;
		margin-top: 50px;
	}
	.swiperrev{
		margin-top: 70px;
	}
	.bo_sch form{
		display:block;
	}
	.bo_sch .sch_bar{
		width:100%;
	}
	.bo_sch{
		position:relative;
		width:100%;
	}
	.bo_sch .sch_bar input[type=text]{
		margin-left:0;
	}
	.bo_sch form select{
		width:100%;
	}
	#service02-in h4{
		font-size:18px;
		line-height:30px;
	}
	.success-list{
		padding-top: 20px;
	}
	
	.creator-main-info .creator-sns{
		display:block;
		width:100%;
	}
	.creator-main-info .creator-sns ul{
		display:block;
		width: 100%;
		padding:0;
	}
	.creator-main-info .creator-sns ul li{
		width:20% !important;
	}
	.creator-main-info .creator-sns img{
		width: 30px;
	}
	.video-inner{
		overflow:hidden;
	}
	#section-03{
		 height:auto;
		 padding-bottom:120px;
	}
	#fullpage .video-section {
		/* height:700px !important; */
		min-height:0;
	}
	.video-section video{
		height:100%;
	}
	
}
@media all and (max-width:480px){
	
	.video-section {
		height:400px;
	}
	.brand-bbs ul li.gbs p{
		width:280px;
	}
	#creator-success-title-em #title-emin{
		font-size:30px;
		width:100%;
		margin-top:50px;
	}
	.creator-success-view-page .section-info{
		padding-top: 50px;
	}
	.list-viw a{
		height: 40px;
		line-height: 40px;
		font-family:'Pretendard';
	}
	#bo_v_con{
		font-size: 16px;
		line-height:1.4em
	}
	.info-m ul li{
		font-size: 14px;
		padding: 5px 10px;
		margin:10px 5px;
	}
	.creator-success-view-page .section-info h3{
		font-size:20px;
		line-height:30px;
	}
	.creator-main-info{
		width:100%;
		height:200px;
		opacity:1;
	}
	.creator-main-info .creator-sns ul li{
		width:20%;
	}
	#section-03{
		height:600px;
		overflow:hidden;
	}
	.creator-success-om h3{
		font-size:22px;
		line-height: 28px;
	}
	.creator-success-om p{
		font-size: 16px;
		line-height:26px;
	}
	.brand-md ul li p{
		font-size: 16px;
		line-height:26px;
	}
	.creator-bg-thumb{
		height: 200px;
	}
	#brand-m h4{
		font-size: 30px;
		height: 50px;
	}
	.hilight h4.active:before, .success-list h4.active:before{
		width: 100px;
	}
	.faq-wrap ul li h4{
		line-height: 28px;
	}
	.faq-wrap ul li span{
		top:20px;
		left:10px;
	}
	.faq-wrap ul li{
		padding:20px 10px;
		padding-top:60px;
	}
	#thumb-sevice02{
		height: 350px;
		border-radius:10px;
	}
	#creator05 p{
		font-size: 16px;
		padding: 0 20px;
		line-height: 24px;
	}
	#creator05 h3{
		font-size:28px;
		padding-top:60px;
	}
	.service-04-edum{
		display:block;
	}
	.service-04-edu{
		width:100%;
		margin:40px 0px;
		padding: 20px 0px;
	}
	.service-04-edu h3{
		font-size:24px;
	}
	.service-04-edu ul li h5{
		font-size:16px;
	}
	.service-04-edu ul{
		display:block;
	}
	.service-04-edu ul li{
		width:100%;
	}
	.sub-content-title, #road-map-tit h3{
		font-size:28px;
	}
	.sub-roadmap > ul > li span{
		font-size:18px;
	}
	.sub-roadmap > ul > li > ul > li.t{
		margin-top: 30px;
		font-size:24px;
	}
	.creatore ul .card-in p{
		font-size: 16px;
		line-height: 24px;
	}
	.sub-roadmap > ul > li > ul > li.c{
		font-size: 16px;
		line-height: 24px;
		margin-top: 10px;
	}
	.creatore ul{
		margin-top:0;
	}
	.creatore ul li{
		width:100%;
	}
	.creatore ul .card-in h4{
		font-size:24px;
		margin-top:60px;
	}
	#bo_gall{
		margin-top:70px;
	}
	.creator-list-m ul li{
		width:100%;
	}
	#title-emin{
		font-size:24px;
	}
	#card-1, #card-2{
		height: 70vh;
		padding-bottom: 100px;
	}
	.sub-postion > ul > li{
		width: 100%;
	}
	#card-1 p, #card-2 p{
		font-size: 30px;
	}
	#card-1 h3, #card-2 h3{
		font-size:55px;
	}
	#card-0 h3{
		font-size: 70px;
	}
	.sub-title{
		font-size: 26px;
	}
	.list-view-row li{
		width: 47%;
	}
	.list-view-row{
		gap:6%;
	}
	.title-index h3{
		font-size: 24px;
	}
	.more{
		top:40px;
	}
	#cont-sv1 h3{
		font-size: 48px;
		height: 60px;
	}
	#cont-sv1 p{
		font-size:26px;
		height: 30px;
		line-height:30px;
	}
	.review-n{
		height: 200px;
	}
	#fantrie-logo{
		width: 100%;
	}
	#service01{
		padding: 40px 0px;
	}
	.title-index p{
		font-size: 16px;
	}
	.cont02mmin.active{
		display:block;
		height:220px;
		opacity:1;
		margin-top: 0px;
	}
	.index-01-right h3{
		font-size:28px;
	}
	.index-01-right p{
		font-size: 16px;
		line-height: 22px;
		margin-top:10px;
	}
	.content-bbs h6{
		font-size:16px;
		line-height:24px;
		top:15px;
		width:42%;
	}
	#fullpage #contact_us_wrap{
		padding-top:0px;
		min-height:700px;
		height: 700px !important;
	}
	#text-video,#text-video2{
		font-size:18px;
		line-height: 30px;
	}
	#text-video-title{
		font-size: 24px;
		letter-spacing:10px;
		line-height: 40px;
	}
	#text-video-title b{
		margin:0;
		display:inline-block;
		padding:5px 10px;
		padding-left: 20px;
		
	}
	#vid-text-wrap{
		width:300px;
	}
	.cnt-pop ul li{
		width: 40px;
		padding:0;
	}
	.cnt-pop ul li:first-child{
		margin-bottom: 10px;
	}
	#section-021m{
		background:#000000;
		overflow:hidden;
		min-height: 200px;
		 
	}
	#scroll-btn{
		opacity:0.5;
	}
	.slick-prev, .slick-next{
		top:unset;
		bottom:-35px;
	}
	.slick-next:before
	,.slick-prev:before{
		font-size: 25px;
	}
	.cont-02mmb h4{
		font-size:20px;
		margin-bottom:10px;
		margin-top: 30px;
	}
	.cont-02mmb p{
		opacity:0.7;
	}
	.footer-copy #footer-logo{
		width: 80px;
	}
	#fp-nav.fp-right{
		right:0px !important;
	}
}