@charset "UTF-8";

body {overflow-x: hidden;}

#navigation {position: fixed; left: 74px; top: 50%; transform: translateY(-50%); z-index: 1;}
#navigation .dot {width: 13px; height: 13px; background-color: #fff; background-color: #d2d2d2; border-radius:50%; margin-bottom: 34px; cursor: pointer;}
#navigation .dot:last-child {margin-bottom: 0;}
#navigation .dot.active {position: relative; background-color: transparent;}
#navigation .dot.active:before {content:''; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 23px; height: 23px;
background-image: url(/resources/common/images/nav.png);
background-repeat: no-repeat;
background-size: contain;
background-position: center;}

/* main_home */
.section[data-name="main_home"] {background-color: #ff943a; padding-top: 130px; overflow: hidden;}
.section[data-name="main_home"] .content {position: relative;}
.section[data-name="main_home"] .content .title {position: relative; font-family: 'GmarketSansBold'; font-weight: bold; font-size: 5.85em; color:#fff; text-align: center; margin-bottom: 36px;}
.section[data-name="main_home"] .content .text {font-family: 'Noto Sans', sans-serif; font-size: 18px; line-height: 1.7; color:#292929; text-align: center; margin-top: 10px;}
.section[data-name="main_home"] .content .img_box {position: relative; margin: 221px auto 0 auto; width: 447px; height: 139px;}
.section[data-name="main_home"] .content .img_box .earth2 {position: absolute; top: -165px;  width: 100%; transform-origin: 50% 50%; padding: 20px; box-sizing: border-box;
-webkit-transform-origin: 50% 50%;
}
.section[data-name="main_home"] .content .img_box .cloud {position: absolute; bottom: 20px; right: -15px; width: 150px;}
.section[data-name="main_home"] .content .img_box .cloud.mobile {display: none;}
.section[data-name="main_home"] .content .img_box .character_1 {position: absolute; top: -175px; left: 35px; width: 266px; height: 196px;}
.section[data-name="main_home"] .content .img_box .character_2 {position: absolute; bottom: 38.1px; left: -30px; width: 123.1px; height: 124.8px;}
.section[data-name="main_home"] .content .img_box .bg_text {position: absolute; left: 50%; top: -165px; transform: translateX(-50%); font-family: 'GmarketSansBold'; font-weight: bold; font-size: 15.4em; line-height: 1.09; color:#fe8e30;
-webkit-transform: translateX(-50%);}
@keyframes rotate_image{
	100% {
    	transform: rotate(-360deg);
    }
}
@-webkit-keyframes rotate_image{
	100% {
    	-webkit-transform: rotate(360deg);
    }
}
.orange_circle {position: relative;}
.orange_circle:before {content:''; position: absolute; top: -12px; left: 20px; width: 28px; height: 28px; background-color: #ec6c00; border-radius:50%;}

/* main_about */
.section[data-name="main_about"] {background: #f9f9f9; padding: 109px 0 289px 0; position: relative;}
.section[data-name="main_about"] .content {display: flex; align-items: center;}
.section[data-name="main_about"] .content .character {height: 270px; margin-left: 189.8px;}
.section[data-name="main_about"] .content .box {}
.section[data-name="main_about"] .content .box .title {font-family: 'GmarketSansBold'; font-weight: bold; color:#292929; line-height: 1.6; font-size: 40px; margin-bottom: 64px;}
.section[data-name="main_about"] .content .box .sub_title {font-family: 'Noto Sans', sans-serif; font-weight: bold; font-size: 16px; line-height: 1.65; color:#ec6e00; margin-bottom: 9.5px;}
.section[data-name="main_about"] .content .box .text {font-family: 'Noto Sans', sans-serif; font-size: 16px; line-height: 1.8; color:#292929; margin-bottom: 10px;}
.section[data-name="main_about"] .content .box .page_move {width: 248px; height: 46px; margin-top: 50px;}
.section[data-name="main_about"] .bg_text {font-family: 'GmarketSansBold'; font-weight: bold; font-size: 16.5em; line-height: 1.15; color: #f1f1f1;
position: absolute;
bottom: 93px;
right: 50px;}
.section[data-name="main_about"] .position {position: absolute;bottom: -200px; left: 50%;transform: translateX(-50%);}
.section[data-name="main_about"] .swiper-container {padding-bottom: 1px;}
.section[data-name="main_about"] .swiper-container .swiper-slide {width: 248px; min-height: 350px;  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff;
cursor: pointer;
display: flex;
flex-direction: column;}
.section[data-name="main_about"] .swiper-container .swiper-slide.css {margin-right: 28px;}
.section[data-name="main_about"] .swiper-container .swiper-slide.css:last-child {margin-right: 0;}
.section[data-name="main_about"] .swiper-container .swiper-slide .images {width: 248px; height: 248px; object-fit: cover; overflow: hidden; }
.section[data-name="main_about"] .swiper-container .swiper-slide .title {font-family: 'Noto Sans', sans-serif; font-weight: bold; font-size: 16px; line-height: 1.38; color:#292929; padding: 20px 10px 0 10px; }
.section[data-name="main_about"] .position .swiper_button_prev,
.section[data-name="main_about"] .position .swiper_button_next {position: absolute; top: 50%; transform: translateY(-50%); z-index: 1; cursor: pointer;}
.section[data-name="main_about"] .position .swiper_button_prev {left: -85px;}
.section[data-name="main_about"] .position .swiper_button_next {right: -85px;}
.section[data-name="main_about"] .position .more {position: absolute; top: -38px; right: 0; font-family: 'Noto Sans', sans-seri; font-weight: bold; font-size: 14px; line-height: 1.36; color:#5a5a5a;}
.section[data-name="main_about"] .position .page_move {width: 248px;height: 46px; margin: 0 auto; margin-top: 63.4px;}

.section[data-name="main_about"] .effect_area {overflow: hidden;}
.section[data-name="main_about"] .image_box {width: 248px; height: 248px;
background-repeat: no-repeat;
background-size: cover;
background-position: center;}
.section[data-name="main_about"] .swiper-container .swiper-slide .image_box {transition: all 1.3s cubic-bezier(0,0,.05,1);}
.section[data-name="main_about"] .swiper-container .swiper-slide:hover .image_box {transform: scale(1.05)}

/* main_technology */
.section[data-name="main_technology"] {margin-top: 519px !important; padding-top: 222px; background-color: #f9f9f9; position: relative;}
.section[data-name="main_technology"] .content {display: flex; padding-bottom: 1px;}
.section[data-name="main_technology"] .content.position {position: absolute; top: -142.5px;}
.section[data-name="main_technology"] .content.position.us {top: -225px}
.section[data-name="main_technology"] .content.position.id {top: -225px}
.section[data-name="main_technology"] .content.position.pt {top: -200px}
.section[data-name="main_technology"] .content.position .container_1096 {display: flex;}
.section[data-name="main_technology"] .content.position .images {width: 524px; height: 279px; margin-right: 28px; margin-top: auto;
background-repeat: no-repeat;
background-size: cover;
background-position: center;}
.section[data-name="main_technology"] .content.position .box {width: 535px;}
.section[data-name="main_technology"] .content.position .box .title {font-family: 'GmarketSansBold'; font-weight: bold; font-size: 40px; line-height: 1.6; color:#292929;}
.section[data-name="main_technology"] .content.position .box .sub_title {font-family: 'Noto Sans', sans-serif; font-weight: bold; font-size: 16px; line-height: 1.65; color:#ec6c00; margin-top: 64px;}
.section[data-name="main_technology"] .content.position .box .text {font-family: 'Noto Sans', sans-serif; font-size: 16px; line-height: 1.8; color:#292929; margin-top: 10px;}
.section[data-name="main_technology"] .content .white_box {width: 248px; min-height: 306px; margin-right: 28px; box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; padding: 25px 23px; box-sizing: border-box;
 display: flex;
 align-items: center;
 flex-direction: column;}
.section[data-name="main_technology"] .content .white_box:last-child {margin-right: 0;}
.section[data-name="main_technology"] .content .white_box .round {width: 139px; height: 139px; border-radius:50%; background-color: #f8f8f8;
background-repeat: no-repeat;
background-size: auto;
background-position: center;}
.section[data-name="main_technology"] .content .white_box:nth-child(1) .round {background-image: url(/resources/common/images/business/technology_1.png);}
.section[data-name="main_technology"] .content .white_box:nth-child(2) .round{background-image: url(/resources/common/images/business/technology_2.png);}
.section[data-name="main_technology"] .content .white_box:nth-child(3) .round {background-image: url(/resources/common/images/business/technology_3.png);}
.section[data-name="main_technology"] .content .white_box:nth-child(4) .round {background-image: url(/resources/common/images/business/technology_4.png);}
.section[data-name="main_technology"] .content .white_box .title {font-family: 'Noto Sans', sans-serif; font-weight: bold; font-size: 16px; line-height: 1.38; color:#292929; margin-top: 23px; text-align: center; width: 100%;}
.section[data-name="main_technology"] .content .white_box .text {font-family: 'Noto Sans', sans-serif; font-size: 14px; line-height: 1.64; color:#5a5a5a; margin-top: 16px; text-align: center; width: 100%; box-sizing:border-box;}


/* .main_business */
.section[data-name="main_business"] {background: #f9f9f9; padding: 187px 0 120px 0; position: relative;}
.section[data-name="main_business"] .container_1076 {position: relative; z-index: 1;}
.section[data-name="main_business"] .content {display: flex; justify-content: center;}
.section[data-name="main_business"] .content:first-child {margin-bottom: 49px;}
.section[data-name="main_business"] .content .box {display: flex; flex-direction: column; width: 520px;}
.section[data-name="main_business"] .content .images {width: 416px; height: 312px; margin-left: 87px;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
.section[data-name="main_business"] .content .box .title {font-family: 'GmarketSansBold'; font-weight: bold; font-size: 40px; line-height: 1.6; color:#292929; margin-top: auto;}
.section[data-name="main_business"] .content .box .sub_title {font-family: 'Noto Sans', sans-serif; font-weight: bold; font-size: 16px; line-height: 1.65; color:#ec6c00; margin-top: 64px;}
.section[data-name="main_business"] .content .box .text {font-family: 'Noto Sans', sans-serif; font-size: 16px; line-height: 1.8; color:#292929; margin-top: 10px;}
.section[data-name="main_business"] .content .white_box {width: 248px; min-height: 237px; margin-right: 28px; box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; padding: 25px 23px; box-sizing: border-box;
 display: flex;
 align-items: center;
 flex-direction: column;}
 .section[data-name="main_business"] .content .white_box:last-child {margin-right: 0;}
.section[data-name="main_business"] .content .white_box .round {width: 120px; height: 120px; border-radius:50%; background-color: #f8f8f8;
background-repeat: no-repeat;
background-size: auto;
background-position: center;}
.section[data-name="main_business"] .content .white_box:nth-child(1) .round {background-image: url(/resources/common/images/business/team_1.png);} 
.section[data-name="main_business"] .content .white_box:nth-child(2) .round {background-image: url(/resources/common/images/business/team_2.png);} 
.section[data-name="main_business"] .content .white_box:nth-child(3) .round {background-image: url(/resources/common/images/business/team_3.png);} 
.section[data-name="main_business"] .content .white_box:nth-child(4) .round {background-image: url(/resources/common/images/business/team_4.png);} 
.section[data-name="main_business"] .content .white_box .title {font-family: 'Noto Sans', sans-serif; font-weight: bold; font-size: 16px; line-height: 1.38; color:#292929; margin-top: 23px; text-align: center; width: 100%;}
.section[data-name="main_business"] .page_move {width: 248px; height: 46px; margin: 60px auto 0 auto;}
.section[data-name="main_business"] .bg_text {font-family: 'GmarketSansBold'; font-weight: bold; font-size: 16.5em; line-height: 1.15; color: #f1f1f1;
position: absolute;
bottom: 107px;
left: 50px;}

/* main_contact */
.section[data-name="main_contact"] {background: #ffffff; padding: 109px 0 120px 0;}
.section[data-name="main_contact"] .content {display: flex;}
.section[data-name="main_contact"] .content .character {height: 300px; margin-left: 295px;}
.section[data-name="main_contact"] .content .box {}
.section[data-name="main_contact"] .content .box .title {font-family: 'GmarketSansBold'; font-weight: bold; color:#292929; line-height: 1.6; font-size: 40px; margin-bottom: 64px;}
.section[data-name="main_contact"] .content .box .sub_title {font-family: 'Noto Sans', sans-serif; font-weight: bold; font-size: 16px; line-height: 1.65; color:#ec6e00; margin-bottom: 9.5px;}
.section[data-name="main_contact"] .content .box .text {font-family: 'Noto Sans', sans-serif; font-size: 16px; line-height: 1.8; color:#292929; margin-bottom: 10px;}
.section[data-name="main_contact"] .content .box .page_move {width: 248px; height: 46px; margin-top: 50px;}

/* main_careers */
.section[data-name="main_careers"] {background: #f9f9f9; padding: 109px 0 118px 0;}
.section[data-name="main_careers"] .content {display: flex;}
.section[data-name="main_careers"] .content .character {margin-left: 13px; height: 300px; margin-right: 166px;}
.section[data-name="main_careers"] .content .box {}
.section[data-name="main_careers"] .content .box .title {font-family: 'GmarketSansBold'; font-weight: bold; color:#292929; line-height: 1.6; font-size: 40px; margin-bottom: 64px;}
.section[data-name="main_careers"] .content .box .sub_title {font-family: 'Noto Sans', sans-serif; font-weight: bold; font-size: 16px; line-height: 1.65; color:#ec6e00; margin-bottom: 9.5px;}
.section[data-name="main_careers"] .content .box .text {font-family: 'Noto Sans', sans-serif; font-size: 16px; line-height: 1.8; color:#292929; margin-bottom: 10px;}
.section[data-name="main_careers"] .content .box .page_move {width: 248px; height: 46px; margin-top: 50px;}



@media(max-width:1676px){
  .section[data-name="main_home"] .content .img_box .bg_text {font-size: 10em;}
}

@media(max-width:1300px){
	.section[data-name="main_about"] .position .swiper_button_prev, .section[data-name="main_about"] .position .swiper_button_next {display: none;}
}

@media(max-width:1280px){
	.section[data-name="main_technology"] .content.position .container_1096 {margin: 0;}
}

@media(max-width:1024px){
	/* navigation */
	#navigation {display: none;}	
	
	/* main_home */
	.section[data-name="main_home"] {padding: 119px 0 100px 0;}
	.section[data-name="main_home"] .content .title {font-size: 2.45em; margin-bottom: 33px;}
	.section[data-name="main_home"] .content .text {margin-top: 0; font-size: 12px;}
	.orange_circle:before {left: 0; width: 17px; height: 17px;}
	.section[data-name="main_home"] .content .img_box {margin-top: 177px; width: 184px; height: 185px;}
	.section[data-name="main_home"] .content .img_box .bg_text {top: -70px; font-size: 48px;}
	.section[data-name="main_home"] .content .img_box .earth {width: 100%; width: 184px; height: 185px; padding: 0;  display: block; margin: 0 auto;}
	.section[data-name="main_home"] .content .img_box .cloud {width: 70px; bottom: auto; right: -10px; left: auto; top: 20px;}
	.section[data-name="main_home"] .content .img_box .cloud.mobile {display: block; width: 80px; top: auto; bottom: 12px; left: 0; right: auto; }
	.section[data-name="main_home"] .content .img_box .character_1 {width: 139px; height: 103px; top: -110px; left: -25px;}
	.section[data-name="main_home"] .content .img_box .character_2 {width: 64.6px; height: 64.5px; bottom: auto; top: -20px; left: -65px;}
	.section[data-name="main_home"] .content .img_box .earth2 {width: 284px; height: 255px; padding: 0;  display: block; margin: 0 auto; left: -50px; top: 30px;}

	/* main_about */
	.section[data-name="main_about"] {padding: 60px 0 80px 0;}
	.section[data-name="main_about"] .content {display: block;}
	.section[data-name="main_about"] .content .character {display: none;}
	.section[data-name="main_about"] .content .character.mobile {display: block; margin: 0 auto; height: 105px; width: 105px; }
	.section[data-name="main_about"] .content .box .title {text-align: center; font-size: 25px; margin: 0; margin-top: 23px;}
	.section[data-name="main_about"] .content .box .sub_title {text-align: center; font-size: 12px; margin: 0; margin-top: 23px; font-family: 'Noto Sans';}
	.section[data-name="main_about"] .content .box .text {text-align: center; font-size: 12px; margin: 0; margin-top: 10px;}
	.section[data-name="main_about"] .content .box .page_move {margin: 30px auto; font-size: 15px; display: block; text-align: center; line-height: 46px; }
	.section[data-name="main_about"] .bg_text {display: none;}
	.section[data-name="main_about"] .position {position: static; transform: none; left: auto; bottom: auto;}
	.section[data-name="main_about"] .swiper-container .swiper-wrapper {flex-wrap:wrap;}
	.section[data-name="main_about"] .swiper-container .swiper-slide {width: 49%; margin-right: 1%; margin-top: 1%; min-height: 0;}
	.section[data-name="main_about"] .image_box {width: 100%;}
	.section[data-name="main_about"] .swiper-container .swiper-slide:nth-child(n+5) {display: none;}
	.section[data-name="main_about"] .position .more {display: none;}
	.section[data-name="main_about"] .swiper-container .swiper-slide .title {font-size: 12px; padding: 10px;}
	
	/* main_technology */
	.section[data-name="main_technology"] {padding-top: 60px; padding-bottom: 40px; margin-top: 0 !important;} 
	.section[data-name="main_technology"] .content.position {position: static;}
	.section[data-name="main_technology"] .content.position .container_1096 {flex-direction: column; align-items: center;}
	.section[data-name="main_technology"] .content.position .images {width: 360px; height: 168px; margin: 0 auto;}
	.section[data-name="main_technology"] .content.position .box .title {margin-top: 23px; text-align: center; font-size: 25px;}
	.section[data-name="main_technology"] .content.position .box .sub_title {font-size: 12px; margin-top: 23px; text-align: center;}
	.section[data-name="main_technology"] .content.position .box .text {margin-top: 10px; font-size: 12px; text-align: center; width: 500px; margin: 0 auto;}
	.section[data-name="main_technology"] .content {margin-top: 23px; flex-wrap:wrap;}
	.section[data-name="main_technology"] .content .white_box {width: 49%; margin-right: 1%; padding: 16px 10px; margin-top: 1%; min-height: 0;}
	.section[data-name="main_technology"] .content .white_box .round {width: 89px; height: 89px; background-size: 70%;}
	.section[data-name="main_technology"] .content .white_box .title {margin-top: 21px; font-size: 12px;}
	.section[data-name="main_technology"] .content .white_box .text {margin-top: 10px; font-size: 12px;}
	.section[data-name="main_technology"] .content.position .box {width: 100%;}
	.section[data-name="main_technology"] .content.position .container_1096 {width: 100%;}
	
	/* main_business */
	.section[data-name="main_business"] {padding: 40px 0 80px 0;}
	.section[data-name="main_business"] .content .images {display: none;}
	.section[data-name="main_business"] .content .images.mobile {display: block; margin: 0 auto; width: 316px; height: 237px;}
	.section[data-name="main_business"] .content {display: flex; flex-direction: column;}
	.section[data-name="main_business"] .content:nth-child(2) {flex-direction: row; flex-wrap:wrap;}
	.section[data-name="main_business"] .content .box {display: block; width: 100%;}
	.section[data-name="main_business"] .content .box .title {font-size: 25px; text-align: center; margin-top: 23px;}
	.section[data-name="main_business"] .content .box .sub_title {font-size: 12px; text-align: center; margin-top: 23px;}
	.section[data-name="main_business"] .content .box .text {font-size: 12px; text-align: center; margin-top: 10px; width: 500px; margin: 0 auto;}
	.section[data-name="main_business"] .content .white_box {width: 49%; margin-right: 1%; margin-top: 1%; min-height: 0; padding: 16px 10px;}
	.section[data-name="main_business"] .content .white_box:last-child {margin-right: 1%;}
	.section[data-name="main_business"] .content .white_box .round {width: 89px; height: 89px; background-size: 70%;}
	.section[data-name="main_business"] .content .white_box .title {font-size: 12px;}
	.section[data-name="main_business"] .bg_text {display: none;}
	
	/* main_contact */
	.section[data-name="main_contact"] {padding: 60px 0 80px 0;}
	.section[data-name="main_contact"] .content {display: block;}
	.section[data-name="main_contact"] .content .character {display: none;}
	.section[data-name="main_contact"] .content .character.mobile {display: block; margin: 0 auto; width: 135px; height: 124px;}
	.section[data-name="main_contact"] .content .box .title {text-align: center; font-size: 25px; margin-top: 23px; margin-bottom: 0;}
	.section[data-name="main_contact"] .content .box .sub_title {text-align: center; font-size: 12px; margin-top: 23px; margin-bottom: 0;}
	.section[data-name="main_contact"] .content .box .text {text-align: center; font-size: 12px; width: 500px; margin: 10px auto 0 auto;}
	.section[data-name="main_contact"] .content .box .page_move {margin: 60px auto 0 auto; display: block; text-align: center; line-height: 46px; font-size: 15px;}
	
	/* main_careers */
	.section[data-name="main_careers"] {padding: 60px 0 80px 0;}
	.section[data-name="main_careers"] .content .character {margin: 0 auto; width: 158px; height: 127px; display: block;}
	.section[data-name="main_careers"] .content {display: block;}
	.section[data-name="main_careers"] .content .box .title {text-align: center; margin-bottom: 0; margin-top: 23px; font-size: 25px;}
	.section[data-name="main_careers"] .content .box .sub_title {text-align: center; margin-top: 23px; margin-bottom: 0; font-size: 12px;}
	.section[data-name="main_careers"] .content .box .text {text-align: center; margin-top: 10px; margin-bottom: 0; font-size: 12px;}
	.section[data-name="main_careers"] .content .box .page_move {display: block; line-height: 46px; text-align: center; font-size: 15px; margin: 60px auto 0 auto;}
	
}
@media(max-width:500px){
	.section[data-name="main_technology"] .content.position .box .text {width: 100%;}
	.section[data-name="main_business"] .content .box .text {width: 100%;}
	.section[data-name="main_contact"] .content .box .text {width: 100%;}
	
	/* main_about */
	.section[data-name="main_about"] .swiper-container .swiper-slide {min-height: 0;}
	.section[data-name="main_about"] .image_box {height: 160px;}
}

@media(max-width:360px){
	.section[data-name="main_technology"] .content.position .images {width: 100%;}
}
