@charset "UTF-8";

@media (min-width: 700px){
	.supportItem > ul { margin-left: -1.2rem; }
	.supportItem > ul > li { width: 33.333%; padding-left: 1.2rem; padding-top: 0 !important; margin-top: 0 !important; }
	.supportItem > ul > li:nth-child(n + 4) { padding-top: 1.2rem !important; }
	.supportItem > ul > li .imgContainer-fit { padding-bottom: 60% !important; }
}


@media (min-width: 800px){
	.topContainer h1 { width: 28rem; }
	.mainNotice > .inner { padding: 2.5rem 2rem 2.5rem 10.5rem; margin: auto; }
	
	
	.topInfo > .inner { padding: 6.4rem 0.5rem; }
	.topInfo > .inner > ul > li { display: inline-block; }
	.topInfo > .inner > ul > li:nth-child(n+2) { padding-left: 5rem; padding-top: 0; }
	.topInfo dd { color: #fff; font-size: 3rem; font-weight: 500; }
	.topInfo dd span { font-size: 1.7rem; font-weight: 400; padding-left: 1rem; }
	/* .topInfo dd.orangeText { color: #f29b76; } */
	
	.video-popup { padding: 0 44px;}
	.video-popup .mfp-close { right: 0px; top: 0; }
	
	.m-insertContainer > .inner .insertLine { padding: 5rem 6rem 4rem 4rem; }
	.m-insertContainer > .inner .insertLine:before { left: 6.5rem; }
	
	.m-insertContainer > .inner dl > dt strong { font-size: 1.6rem; }
	.m-insertContainer > .inner dl > dt span { font-size: 1.3rem; }
	.m-insertContainer > .inner dl > dd > input { font-size: 1.4rem; padding: 0.8rem 1rem; }
	
	.m-insertContainer > .inner .btnGroup { padding: 3rem 6rem; }
	
	.agreeContainer .checkBtn-line { padding: 0.5rem 6rem; font-size: 1.4rem; }
	.agreeContainer .checkBtn-first { padding: 1rem 6rem 1.5rem; }
	
	.topContainer-introduce  > .contentContainer > .inner { padding: 5rem 2rem; }
	.step1_container .content .icon {  margin: 0; }
	
	
	.bannerWidth { display: inline-block; width: 50%; }
	.appBanner { padding-right: 0.75rem; }
	.demoBanner { padding-left: 0.75rem; margin-top: 0; }
}


@media (min-width: 1000px){
	/* header.type1 { left: 280px; } */

	.supportItem > ul > li { width: 25%; }
	.supportItem > ul > li:nth-child(4) { padding-top: 0 !important; }
	
		
	.step3_container .qa dd { text-align: center; margin-top: 5rem; }
	.step3_container .qa dd .gridWarp > ul > li { padding-bottom: 1.5rem; vertical-align: top; }
	.step3_container .qa dd ul li + li { border-top: 0; }
	.step3_container .qa dd .inner { padding: 1rem 0; display: block; }
	.step3_container .qa dd img { display: block; margin: auto; width: 6.5rem; vertical-align: top; }
	.step3_container .qa dd span { display: block; padding-top: 2rem; padding-left: 0rem; vertical-align: top; word-break: keep-all; }

	.step3_container .info > dd { margin-top: 5rem; }
	.step3_container .info > dd .gridWarp > ul > li { padding-bottom: 1.5rem; vertical-align: top; }
	.step3_container .info > dd > .gridWarp > ul > li + li { border-top: 0; }
	
	.step3_container .info > dd .inner { padding-left: 0; text-align: center; }
	.step3_container .info > dd .inner:before { position: static; margin: auto; }
	.step3_container .info > dd .inner li { display: inline-block; }
	
	
	/* landing */
	
	.landingContainer > ul > li { display: inline-block; width: 50%; vertical-align: top; }
	.landingContainer > ul > li.landingSupport { padding-right: 2rem; }
	.landingContainer > ul > li.landingDemo { padding-left: 2rem; margin-top: 0;}
	.landingContainer > ul > li > .inner { padding: 5rem 0rem; }
	.landingContent dt em { padding-left: 0; }
	.landingContent dd.landingInfo { padding: 2rem 0 3rem; }
	.landingContent span { display: block; }
}


@media (min-width: 1130px){
	header > .inner { padding-left: 0rem; }

	header #headerLogo a { background-position: left bottom; }

	#sideNav-wrap { left: 0px !important; z-index: 10 !important; }
	#sideNav-wrap > div { padding-top: 6rem !important; }
	#sideContainer { padding-left: 230px; }
	#wrap footer { left: 230px; }
	
	
	.mainNotice { margin: 4rem 0; padding: 0 2rem; }
	.mainNotice > .inner {
		border: 1px solid #e8e8e8;
		border-radius: 6px; box-shadow: 0px 3px 29px 0px rgba(0, 0, 0, 0.03);
	}
	
	.viewContainer { padding-top: 3rem; }
	
	.rightContent-maxWidth { padding: 0 3rem 0; min-height: 70rem; }
	.rightContent-wrap { position: relative; padding: 0 29rem 0 0; max-width: 113rem; margin: auto; }
	.rightContent { display: block; width: 26rem; position: absolute; top: 3rem; right: 0; padding-right: 0; }
	.rightContent.searchContent { padding-top: 0; }
	.rightContent > .inner input { font-size: 1.4rem; }
	.share-wrap .copyUrl-wrap input { font-size: 1.2rem; }
	.searchContent > .inner .searchButton button { line-height: 4.5rem; }
	
	.supportList { padding-top: 2rem; }
	.filter-wrap { display: none; }
	.searchContent > .maxSort { display: block; }
	.viewBaic .createProject { display: none; }
	.mobileShare { display: none; }
	
	.organContainer { padding: 3rem 0 4rem; }
	
	.bannerSection { padding: 4rem 0; }
	.partnerSection { padding: 6rem 0; }
	.quickNav { margin: 7rem 0; }
	
}


@media (min-width: 1250px){
	
	.supportItem > ul { margin-left: -1.5rem; }
	.supportItem > ul > li { padding-left: 1.5rem; }
	.supportItem > ul > li:nth-child(n + 5) { padding-top: 1.5rem !important; }
	
	.topContainer-main .contentContainer > .inner { padding: 8rem 5rem 13rem; }
	.topContainer-main h1 { width: 24rem; position: absolute; left: 5rem; top: calc(50% - 2.5rem); transform: translateY(-50%); }
	.title_logo_wide { display: block; }
	.title_logo { display: none; }
	.topCopy { text-align: right; }
	.topCopy dt span { font-size: 2.8rem; line-height: 3.2rem; }
	.topContainer-main { background-image: url(/style_www/img/custom/main_top_bg.jpg); background-size: auto 100%; }
		
	.organContainer .gridWarp > ul > li { width: 50%; padding-top: 0; }
	.organContainer .gridWarp > ul > li:nth-child( n + 3) { padding-top: 1.5rem; }
	
	
	.introduceStep { padding: 11rem 0rem 12rem; }
	.step1_container .gridWarp { display: table; padding-right: 3rem;}
	.step1_container .gridWarp > ul { display: table-row; margin: 0;  }
	.step1_container .gridWarp > ul > li { display: table-cell; width: 33.333%; padding-top: 0; height: 0; padding-left: 3rem; }
	.step1_container .gridWarp > ul > li > .inner {
		height: 100%; padding: 4rem 3rem; border: 1px solid #eff3f7; 
		border-radius: 1rem; background-color: #f8fafc;
	}
	
	.step1_container .gridWarp > ul > li > .inner .icon { width: 12rem; padding-bottom: 3rem; }
	
	.step2_container { padding-right: calc(100% - 62rem); }
	.step2_container dl { text-align: left; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: calc(100% - 62rem); padding:0 3rem 0 0; }
	.step2_container dl dt { padding-bottom: 1rem; }
	.step2_container .planImg { max-width: 100%; width: 62rem; margin: auto; }
}


@media (min-width: 1410px){
	.mainWidth { padding: 0; max-width: 113rem; }
	.mainContainer { padding: 0 8rem;}
	.maxWidth { padding: 0 3rem; max-width: 119rem; }

	.mainCompany .swiperContainer .swiper-pagination-progressbar { border-radius: 2px; }

}