/* heroArea start */
.heroArea{
	position: relative; 
	width: 100%; 
}
.heroKcc{
	position: relative;
	margin: 0 auto;
	padding-top: 170px;
	box-sizing: border-box;
	width: 100%; 
	text-align: center; 
	overflow: hidden;
}
.heroKcc h2{
	font-weight: 300; 
	font-size: 48px; 
	margin-bottom: 160px;
}
.heroKcc h2 span{
	font-weight: 600;
}
.kccBg{
	position: relative;
	width: 100%;
	height: 600px;
	background: url(../images/main/heroImg02.png) no-repeat bottom center;
	background-size: cover;
}
.kccListWrap{
	position: absolute; 
	top: -90px;
	left: 50%;
	transform: translateX(-50%);
	width: 1800px;
	height: 720px;
	display: flex;
	flex-wrap: wrap; 
	gap: 1.5%; 
	padding: 0 30px; 
	box-sizing: border-box; 
	margin: 0 auto;
	transition: 0.3s;
}
.kccList{
	position: relative;
	flex-basis: 23%; 
	flex-shrink: 1; 
	flex-grow: 1; 
	height: 515px; 
	border: solid 1px #BEBEBE; 
	background-color: rgba(255, 255, 255, 0.95);
	border-radius: 10px;
}
.kccList::after{
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	width: 180px;
	height: 173px;
	background: url(../images/main/bg_list_globe.png) no-repeat;
	z-index: 0;
}
.kccList .kccText{
	position: relative;
	font-size: 18px; 
	border-radius: 9px 9px 0 0; 
	text-align: left; 
	padding: 14px 0 10px 20px;
	box-sizing: border-box; 
	color: #fff;
	height: 90px;
	background: url(../images/main/icon_new.png) no-repeat center right 20px;
}
.kccList:nth-child(even) .kccText{
	background-color: #127EA8; 
}
.kccList:nth-child(odd) .kccText{
	background-color: #1B78D1;
}
.kccText span{
	font-size: 15px;
	font-weight: 300;
}
.kccText p{
	font-size: 22px;
	font-weight: 700;
}
.kccList ul{
	padding: 6px 5px; 
	box-sizing: border-box;
}
.kccList ul li{
	z-index: 1;
	position: relative;
	padding: 4.5px 20px; 
	box-sizing: border-box;
}
.kccList ul li a{
	position: relative; 
	font-size: 17px; 
	color: #333; 
	text-align: left; 
	display: block; 
	padding-left: 10px; 
	transition: 0.2s;
}
.kccList ul li a::before{
	content: ''; 
	position: absolute; 
	width: 3px; 
	height: 3px; 
	border-radius: 50px; 
	left: 0; 
	top: 50%; 
	transform: translateY(-50%); 
	background-color: #787878;
}

.kccList ul li a span{
	position: relative;
}
.kccList ul li a span::after {
    content: "";
	position: absolute;
	left: 0;
	top: 100%;
	width: 0%;
	height: 1px;
	transition: 0.3s;
}
.kccList ul li a:hover span:after,
.kccList ul li a:focus span:after {
	width: 100%;
}
.kccList:nth-child(odd) ul li a:hover span:after,
.kccList:nth-child(odd) ul li a:focus span:after{
	background-color: #217CD4;
}
.kccList:nth-child(even) ul li a:hover span:after,
.kccList:nth-child(even) ul li a:focus span:after{
	background-color: #1C8CB7;
}
.kccList:nth-child(odd) ul li a:hover,
.kccList:nth-child(odd) ul li a:focus{
	color: #1B78D1;
}
.kccList:nth-child(even) ul li a:hover,
.kccList:nth-child(even) ul li a:focus{
	color: #127EA8;
}
.kccPc{
	display: block;
}
.kccMo{
	display: none;
}

@media screen and (max-width: 1800px){
	.kccListWrap{
		width: 100%;
	}
}

@media screen and (max-width: 1200px){
	.heroKcc {
		padding-top: 150px;
	}
	.heroKcc h2{
		font-size: 42px;
		margin-bottom: 130px;
	}
	.kccBg {
		height: 550px;
	}
}

@media screen and (max-width: 1000px){
	.heroKcc {
		padding-top: 145px;
	}
    .heroKcc h2{
		font-size: 35px; 
		margin-bottom: 120px;
	}
    .kccList{
		flex-basis: 48%; 
		margin-bottom: 15px;
		height: 475px;
	}
    .kccList p{
		font-size: 17px;
	}
    .kccList ul li a{
		font-size: 15px;
	}
	.kccList::after {
		width: 135px;
		height: 130px;
		background-size: 135px;
	}
	.kccListWrap > div:nth-child(1){
		order: 0;
	}
    .kccListWrap > div:nth-child(2){
		order: 2; 
		height: 320px;
	}
    .kccListWrap > div:nth-child(3){
		order: 1;
	}
    .kccListWrap > div:nth-child(4){
		order: 3; height: 320px;
	}
	.kccBg {
		height: 770px;
	}
}

@media screen and (max-width: 720px){
    .heroKcc {
		padding-top: 125px;
	}
	.heroKcc h2{
		font-size: 30px; 
		margin-bottom: 110px;
	}
	/* .kccPc{display: none;}
    .kccMo{display: block;}
    
    .kccList p{font-size: 16px;} */
}

@media screen and (max-width: 640px){
    .heroKcc {
		padding-top: 115px;
	}
}

@media screen and (max-width: 600px){
	.heroKcc {
		padding-top: 110px;
	}
	.heroKcc h2{
		font-size: 26px; 
	}
}

@media screen and (max-width: 540px){
	.kccBg {
		height: 700px;
	}
	.kccPc{
		display: none;
	}
    .kccMo{
		display: block;
	}
	.heroKcc {
		padding-top: 110px;
	}
    .heroKcc h2{
		font-size: 24px;
		line-height: 32px;
		margin-bottom: 105px;
	}
	.kccListWrap {
		position: absolute;
		padding: 0 20px;
	}
	.kccList {
		height: 440px;
		margin-bottom: 10px;
	}
	.kccList ul li {
		padding: 3.5px 20px;
	}
	.kccText{
		padding: 10px 0 10px 15px !important;
		background-position: center right 10px !important;
		height: 75px !important;
	}
	.kccText span {
		font-size: 14px;
	}
	.kccText p {
		font-size: 16px;
	}
	.kccListWrap > div:nth-child(2){
		height: 295px;
	}
    .kccListWrap > div:nth-child(4){
		height: 295px;
	}
}

@media screen and (max-width: 460px){
	.kccList .kccText {
		background-image: none;
		padding: 10px 0 !important;
		text-align: center;
	}
}


#app {
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
	position: absolute;
	flex-direction: column;
}
#app span.txtko {
    color: #fff;
    font-size: 55px;
	font-weight: 700;
    opacity: 0;
	letter-spacing: 10px;
}
#app span.txten{
	color: #fff;
	font-size: 30px;
	font-weight: 200;
	padding-top: 20px;
	margin-top: 20px;
	position: relative;
}
#app span.txten::after {
    content: "";
	position: absolute;
	width: 100px;
	height: 1px;
	background-color: #fff;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
}

@media screen and (max-width: 1400px){
    #app span.txtko {
		font-size: 50px;
		text-align: center;
	}
	#app span.txten{
		font-size: 28px;
		text-align: center;
	}
}

@media screen and (max-width: 1200px){
    #app span.txtko {
		font-size: 43px;
		line-height: 68px;
	}
	#app span.txten{
		font-size: 27px;
		line-height: 37px;
	}
}

@media screen and (max-width: 1000px){
    #app span.txtko {
		font-size: 43px;
		line-height: 65px;
	}
	#app span.txten{
		font-size: 27px;
		line-height: 37px;
	}
}

@media screen and (max-width: 720px){
    #app span.txtko {
		font-size: 40px;
		line-height: 55px;
		letter-spacing: 5px;
	}
	#app span.txten{
		font-size: 25px;
		line-height: 30px;
	}
}

@media screen and (max-width: 500px){
    #app span.txtko {
		font-size: 28px;
		line-height: 37px;
		letter-spacing: 4px;
		margin-top: 80px;
	}
	#app span.txten{
		font-size: 22px;
		line-height: 30px;
	}
}


.text-animated {
    animation: slideInLeft 2s ease-in-out forwards 0s
}

@keyframes slideInLeft {
    0% {
        transform: translate(-30px);
        opacity: 0
    }

    to {
        transform: translate(0);
        opacity: 1
    }
}

.text-animated02 {
    animation: aniEn 7s ease 0s;
}

@keyframes aniEn {
    0% {
		transform: translate(0);
        opacity: 0
    }

    to {
		transform: translate(0);
        opacity: 1
    }
}

/* contain start */
#contain{
	position: relative;
	width: 100%;
	box-sizing: border-box;
}
#contain .mainTit{
	font-size: 20px;
	font-weight: 500;
	color: #686868;
}
#contain .subTxt{
	font-size: 34px;
	font-weight: 500;
	color: #151515;
	line-height: 46px;
	margin-top: 20px;
}
#contain .btn_go{
	display: block;
	margin-top: 60px;
	padding-bottom: 10px;
	background: url("../images/main/icon_arrow.png") no-repeat 0 15px;
	color: #D22D52;
	font-size: 16px;
	font-weight: 500;
}
@media screen and (max-width: 1250px){
	#contain .mainTit{
		font-size: 18px;
	}
	#contain .subTxt{
		font-size: 30px;
		line-height: 40px;
	}
	#contain .btn_go{
		font-size: 16px;
		background-size: 150px;
	}
}
@media screen and (max-width: 1000px){
	#contain .btn_go{
		margin-top: 40px;
	}
}
@media screen and (max-width: 720px){
	#contain .mainTit{
		font-size: 16px;
	}
	#contain .subTxt{
		font-size: 25px;
		line-height: 35px;
		margin-top: 10px;
	}
	#contain .btn_go{
		font-size: 15px;
		background-size: 110px;
		margin-top: 20px;
	}
}
@media screen and (max-width: 500px){
	#contain .subTxt{
		font-size: 20px;
		line-height: 28px;
	}
}


#contain .basicArea{
	position: relative;
	width: 1800px;
	margin: 0 auto;
	padding: 0 30px;
	box-sizing: border-box;
}
@media screen and (max-width: 1800px){
	#contain .basicArea{
		width: 100%;
	}
}
#contain > div{
	position: relative;
	width: 1800px;
	margin: 0 auto;
	padding: 0 30px;
	box-sizing: border-box;
}
#contain > div#section02, div#section05{
	width: 100%;
}
@media screen and (max-width: 1800px){
	#contain > div{
		width: 100%;
	}
}
@media screen and (max-width: 500px){
	#contain > div{
		padding: 0 20px;
	}
}


/* section01 start */
#section01{
	background: url("../images/main/bg_globe.png") no-repeat bottom right;
}
#section01 > a > div{
	padding: 60px 0;
}
@media screen and (max-width: 1400px){
	#section01{
		background-size: 62%;
		background-position: top right 0px;
	}
}
@media screen and (max-width: 1200px){
	#section01{
		background-size: 60%;
	}
	#section01 > a > div{
		padding: 50px 0;
	}
}
@media screen and (max-width: 1000px){
	#section01 > a > div{
		padding: 30px 0;
	}
}
@media screen and (max-width: 720px){
	#section01 > a > div{
		padding: 70px 0 30px 0;
	}
}
@media screen and (max-width: 500px){
	#section01 > a > div{
		padding: 40px 0 20px 0;
	}
}



/* section02 start */
#section02 {
	padding: 100px 0 0 0 !important;
	margin-bottom: 100px !important;
}
#section02::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 500px;
	background-color: #F8F8F8;
}
.kccWrap{
	max-width: 1800px;
	margin: 0 auto;
	padding: 0 30px;
	box-sizing: border-box;
}
.photo-wrap {
	position: relative;
	margin: auto;
}
.photo-wrap .inline-box {
	position: relative;
	max-width: 1400px;
}
.photo-wrap .inline-box::after {
	content: '';
	display: block;
	clear: both;
}
.photo-wrap .inline-box a.kccBtn{
	display: inline-block;
	width: 180px;
	position: absolute;
	bottom: -370px;
}
.photo-wrap .inline-box a.kccBtn .btn_go{
	margin-top: 0 !important;
}
.photo-wrap .btn-box {
	text-align: left;
	position:absolute;
	left: 0;
	top: 120px;
}
.photo-wrap a.btnlive {
	display:inline-block; 
	position:relative; 
	width:130px;
	padding:5px 0 5px 10px;
	text-align: left;
	font-size: 16px;
	line-height: 1.4; 
	color: #234667;
}
.photo-wrap a.btnlive::before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0; 
	border-bottom: 1px solid #234667;
	z-index: 2;
}
.photo-wrap a.btnlive::after {
	content: "";
	display: block;
	width: 1px;
	height: 20px;
	background-color: #234667;
	transform: rotate(-45deg) translate(-15px, 6px);
	position: absolute;
	right: 0;
	top: 0;
	z-index: 2;
}
.photo-wrap a.btnlive span {
	content: "";
	display: block;
	width: 60px;
	height: 60px;
	position: absolute;
	right: -30px;
	top: 0;
	border: 1px solid #234667;
	border-radius: 50%;
	transition: all .3s ease-in-out;
	overflow: hidden;
}
.photo-wrap a.btnlive:hover span,
.photo-wrap a.btnlive:focus span {
	border: 1px dashed #234667;
}  
.photo-wrap a.btnlive:hover span,
.photo-wrap a.btnlive:focus span {
	-webkit-animation: spinAround 9s linear infinite;
	-moz-animation: spinAround 9s linear infinite;
	animation: spinAround 9s linear infinite;
}  
.photo-wrap .photo-box {
	padding-left:550px;
}
.photo-wrap .swiper-container.gallery {
	position: relative;
	width: 100%;
	margin: -150px auto 0;
	padding-bottom: 25px;
}
.photo-wrap .swiper-container.gallery .swiper-wrapper {
	font-size: 0;
}
.photo-wrap .swiper-container.gallery .swiper-wrapper .swiper-slide {
	cursor: pointer;
	width: 37.8%;
	height: 0;
	position: relative;
	display: block;
	padding-bottom: 48%;
	overflow: hidden;
}
.photo-wrap .swiper-container.gallery .swiper-slide {
	white-space: nowrap;
}
.photo-wrap .swiper-container.gallery .swiper-slide a {
	/* white-space: nowrap;
	display: block;
	width: 100%;
	height: 100%; */
	position:absolute;
	top:2px;
	left:2px;
	width:99%;
	height:98%;
	overflow:hidden;
	display:block;
	background:transparent; 
	-moz-background:transparent;
}
.photo-wrap .swiper-container.gallery .swiper-slide a + a {
	margin-left: 35px;
}
.photo-wrap .swiper-container.gallery .swiper-slide + .swiper-slide {
	margin-left: 1px;
}
.photo-wrap .swiper-container.gallery .swiper-slide img {
	border-radius: 15px;
	transition: 0.5s;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
}
.photo-wrap .swiper-container.gallery .swiper-slide p.nation {
	position: absolute;
	display: block;
	min-width: 210px;
	height: 35px;
	border-radius: 30px;
	color: #555;
	left: 0;
	top: 0;
	font-size: 15.5px;
	background-color: #fff;
	text-align: center;
	margin: 20px;
	line-height: 35px;
	z-index: 2;
}
.swiper-container.big-gallery {
	position: relative;
}
.swiper-container.big-gallery .swiper-wrapper {
	font-size: 0;
}
.swiper-container.big-gallery .swiper-wrapper .swiper-slide {
	display: block;
}
.swiper-container.big-gallery .swiper-wrapper .swiper-slide img {
	max-width: 800px;
}
.photo-wrap .swiper-container.gallery .swiper-slide a::before {
	content: '';
	background: rgba(0,0,0,0.8);
	position: absolute;
	width: 100%;
	left: 0;
	top: 100%;
	bottom: 0;
	right: 0;
	opacity: 0;
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
	transition: all 0.4s ease-in-out 0s;
	border-radius: 0px 0px 15px 15px;
	z-index: 1;
}  
.photo-wrap .swiper-container.gallery .swiper-slide a:hover::before,
.photo-wrap .swiper-container.gallery .swiper-slide a:focus::before {
	opacity: 1;
	top: 70%;
}
.swiper-container.big-gallery .swiper-wrapper .swiper-slide .title {
	padding: 20px 0; 
	font-size: 20px;
	line-height: 1.4;
	color: #fff;
	position: absolute; 
	width: 100%;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.5);
}
.photo-wrap .content-details {
	position: absolute;
	text-align: center;
	padding: 0 20px;
	top: 50%;
	left: 50%;
	opacity: 0;
	width: 100%;
	box-sizing: border-box;
	white-space: normal;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	-webkit-transition: all 0.3s ease-in-out 0s;
	-moz-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	z-index: 2;
}
.gallery .swiper-slide a:hover .content-details,
.gallery .swiper-slide a:focus .content-details {
	top: 85%;
	left: 50%;
	opacity: 1; 
}

.photo-wrap .content-details h4 {
	display: -webkit-box;
	text-align: left;
	left: 0px;
	top: -40px;
	position: absolute;
	padding: 0 20px;
	box-sizing: border-box;
	line-height: 28px;
	font-size: 20px;
	overflow: hidden; 
	text-overflow: ellipsis; 
	white-space: normal; 
	word-wrap: break-word; 
	color: #fff; 
	text-align: left; 
	-webkit-line-clamp: 3; 
	-webkit-box-orient: vertical;
	height: 83px;
}
.gallery .swiper-slide a .fadeIn-bottom{
	top: 80%;
}


.gallery .swiper-slide a .more {
	display:inline-block; 
	position:relative; 
	width:105px;
	padding:7px 0 5px 10px;
	text-align: left;
	color:#588ebf;
	font-size: 15px;
	line-height: 1.4;
	margin-top:15px;
}
.gallery .swiper-slide a .more::before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0; 
	border-bottom: 1px solid #588ebf;
	z-index: 2;
}
.gallery .swiper-slide a .more::after {
	content: "";
	display: block;
	width: 1px;
	height: 20px;
	background-color: #588ebf;
	transform: rotate(-45deg) translate(-15px, 6px);
	position: absolute;
	right: 0;
	top: 0;
	z-index: 2;
}
.photo-wrap .swiper-btn-photo {
	position: absolute;
	left: 0;
	bottom: -200px;
}
.photo-wrap .swiper-btn-photo .swiper-gallery-prev {
	display: inline-block; 
	position:absolute; 
	left: 0; 
	bottom:0; 
	width: 50px;
	height: 50px;
	background: url(../images/arrow-left_white.png) no-repeat center center;
	cursor: pointer;
}
.photo-wrap .swiper-btn-photo .swiper-gallery-next {
	display: inline-block; 
	position:absolute; 
	left: 70px; 
	bottom:0;
	right: auto;
	width: 50px;
	height: 50px;
	background: url(../images/arrow-right_white.png) no-repeat center center;
	cursor: pointer;
}

.select-swiper .swiper-container {
	text-align: right;
}
.select-swiper .swiper-wrapper .swiper-slide {
	display: inline-block;
	width: 100px;
	font-family: 'RobotoB';
	font-size: 25px;
	line-height: 1;
	background-color: #ccc;
	border: 0;
	position: relative;
	cursor: pointer;
	height: 7px;
}
.select-swiper .swiper-wrapper .swiper-slide.active {
	background-color: #E23A60;
}
.select-swiper .swiper-wrapper .swiper-slide + .swiper-slide {
	margin-left: 10px;
}
.select-swiper .swiper-container.kccTap {
	position: absolute;
	left: 0;
	bottom: -150px;
	z-index: 85;
	padding-top: 5px;
	margin-top: 0;
}
.select-swiper .swiper-container.kccTap .swiper-wrapper {
	width: auto;
	text-align: right;
	display: inline-block;
	font-size: 0;
	line-height: 1;
}
.select-swiper .swiper-container.kccTap .swiper-wrapper .swiper-slide.active {
	color: #28639b;
}

@media screen and (max-width: 1600px){
	#section02 {
		margin-bottom: 90px !important;
	}
	/* .photo-wrap .swiper-container.gallery .swiper-slide img {
		max-width: 400px;
	} */
	.photo-wrap .inline-box a.kccBtn {
		bottom: -335px;
	}
}

@media screen and (max-width: 1600px){
	#section02 {
		margin-bottom: 80px !important;
	}
	#section02::before {
		height: 430px;
		transition: 0.3s;
	}
	.select-swiper .swiper-container.kccTap {
		bottom: -120px;
		transition: 0.3s;
	}
	.photo-wrap .photo-box {
		padding-left: 500px;
	}
	/* .photo-wrap .swiper-container.gallery .swiper-slide img {
		max-width: 350px;
	} */
	.photo-wrap .inline-box a.kccBtn {
		bottom: -260px;
	}
	.photo-wrap .content-details h4 {
		line-height: 26px;
		font-size: 18px;
	}
}

@media screen and (max-width: 1350px){
	#section02 {
		margin-bottom: 80px !important;
	}
	#section02::before {
		height: 400px;
	}
	.select-swiper .swiper-container.kccTap {
		bottom: -100px;
	}
	/* .photo-wrap .swiper-container.gallery .swiper-slide img {
		max-width: 300px;
	} */
	.photo-wrap .inline-box a.kccBtn {
		bottom: -220px;
	}
}

@media screen and (max-width: 1250px){
	#section02 {
		padding: 80px 0 0 0 !important;
		margin-bottom: 70px !important;
	}
	#section02::before {
		height: 330px;
	}
	.select-swiper .swiper-container.kccTap {
		bottom: -80px;
	}
	.photo-wrap .photo-box {
		padding-left: 450px;
	}
	/* .photo-wrap .swiper-container.gallery .swiper-slide img {
		max-width: 250px;
	} */
	.photo-wrap .inline-box a.kccBtn {
		bottom: -180px;
	}
	.select-swiper .swiper-wrapper .swiper-slide {
		width: 80px;
	}
	.photo-wrap .swiper-container.gallery .swiper-slide p.nation {
		min-width: 180px;
		font-size: 14px;
	}
	.photo-wrap .content-details h4 {
		line-height: 24px;
		font-size: 17px;
		-webkit-line-clamp: 2;
		height: 50px;
		top: -30px;
	}
}

@media screen and (max-width: 1070px) {
	#section02::before {
		height: 500px;
	}
	.kccWrap {
		margin-top: -40px;
	}
	.photo-wrap {
		padding-top: 20px;
	}
	.photo-wrap::before {
		height: 90px;
	}
	.photo-wrap .inline-box {
		padding: 0 10px 50px 0;
	}
	.photo-wrap .inline-box::before {
		content: none;
	}
	.photo-wrap h3 {
		font-size: 40px;
		float: none; 
		padding-top: 25px;
	}
	.photo-wrap h3 span {
		font-size: 30px;
	}

	.photo-wrap .btn-box {
		top: 20px;
		left: auto;
		right: 30px;
	}
	.photo-wrap a.btnlive {
		width:90px;
		padding:5px 0 5px 10px;
		font-size: 14px;
	}
	.photo-wrap a.btnlive::after {
		height: 15px;
		background-color: #234667;
		transform: rotate(-45deg) translate(-15px, 7px);
	}
	.photo-wrap a.btnlive span {
		width: 40px;
		height: 40px;
		right: -20px;
		top: 6px;
	}  
	.photo-wrap .photo-box {
		padding: 0;
	}
	.photo-wrap .swiper-container.gallery {
		position: relative;
		margin: 0 auto 0;
		padding-bottom: 25px;
	}
	.photo-wrap .swiper-container.gallery .swiper-slide a + a {
		margin-left: 20px;
	}
	/* .photo-wrap .swiper-container.gallery .swiper-slide img {
		max-width:280px;
	} */
	.swiper-container.big-gallery .swiper-wrapper .swiper-slide .title {
		padding: 20px 0; 
		font-size: 12px;
	}
	.photo-wrap .content-details {
		position: absolute;
		text-align: center;
		padding: 0 20px;
		top: 50%;
		left: 50%;
		opacity: 0;
		width: 100%;
		box-sizing: border-box;
		white-space: normal;
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		-webkit-transition: all 0.3s ease-in-out 0s;
		-moz-transition: all 0.3s ease-in-out 0s;
		transition: all 0.3s ease-in-out 0s;
	}
	.gallery .swiper-slide a:hover .content-details,
	.gallery .swiper-slide a:focus .content-details {
		top: 85%;
		left: 50%;
		opacity: 1;
	}	
	.gallery .swiper-slide:hover .content-details .title,
	.gallery .swiper-slide:focus .content-details .title {
		font-size: 16px;
	}
	.photo-wrap .content-details h4 {
		font-size: 16px;
	}
	.photo-wrap .content-details p {
		padding: 5px 0 10px; 
		font-size: 11px; 
		height: 3em;
		 /* 20211119 수정 */
	}
	.gallery .swiper-slide a .more {
		font-size: 14px;
		display: none;
	}	
	.gallery .swiper-slide a .more::after {
		height: 15px;
		background-color: #588ebf;
		transform: rotate(-45deg) translate(-15px, 6px);
	}
	.photo-wrap .swiper-btn-photo {
		position: absolute;
		left: 0;
		bottom: -163px;
		display: none;
	}
	.select-swiper .swiper-wrapper {
		padding-top: 13px;
	}
	.select-swiper .swiper-wrapper .swiper-slide {
		font-size: 15px;
	}
	.select-swiper .swiper-container.kccTap .swiper-wrapper .swiper-slide.swiper-slide-thumb-active::before {
		height: 3px;
		top: -20px;
		border-bottom: 3px solid #000;
	}
	.select-swiper .swiper-container.kccTap {
		top: 80px;
	}
	.select-swiper .swiper-wrapper .swiper-slide + .swiper-slide {
		margin-left: 10px;
	}
	.photo-wrap .inline-box a.kccBtn {
		bottom: auto;
		right: 0;
		top: 10px;
	}
	.photo-wrap .inline-box a.kccBtn {
		width: 150px;
	}
	.select-swiper .swiper-container.kccTap {
		height: 30px;
		right: 0;
		left: auto;
		bottom: auto;
		top: 90px;
	}
	.select-swiper .swiper-container.kccTap .swiper-wrapper {
		height: auto;
	}
	.select-swiper .swiper-container.kccTap .swiper-wrapper .swiper-slide.active::before {
		top: -20px;
		border-bottom: 3px solid #28639b;
		height: 3px;
	}
	.gallery .swiper-slide a .fadeIn-bottom {
		padding: 0 10px;
	}
}

@media screen and (max-width: 900px) {
	.select-swiper .swiper-wrapper .swiper-slide {
		width: 65px;
	}
	/* .photo-wrap .swiper-container.gallery .swiper-slide img {
		max-width: 250px;
	} */
}

@media screen and (max-width: 720px) {
	#section02 {
		padding: 60px 0 0 0 !important;
		margin-bottom: 40px !important;
	}
	.photo-wrap .inline-box a.kccBtn {
		top: 65px;
	}
	.photo-wrap .inline-box a.kccBtn {
		width: 110px;
	}
	.photo-wrap .inline-box {
		padding: 0 10px 70px 0;
	}
	.select-swiper .swiper-container.kccTap {
		top: 115px;
		right: auto;
    	left: 0;
	}
	.select-swiper .swiper-wrapper .swiper-slide {
		width: 65px;
	}
	/* .photo-wrap .swiper-container.gallery .swiper-slide img {
		max-width: 250px;
	} */
}

@media screen and (max-width: 600px) {
	#section02 {
		padding: 60px 0 0 0 !important;
		margin-bottom: 30px !important;
	}
	#section02::before {
		height: 400px;
	}
	.photo-wrap .inline-box a.kccBtn {
		top: 65px;
	}
	.photo-wrap .inline-box a.kccBtn {
		width: 110px;
		left: 0;
		right: auto;
		top: 125px;
	}
	.photo-wrap .inline-box {
		padding: 0 10px 120px 0;
	}
	.select-swiper .swiper-container.kccTap {
		top: 170px;
	}
	.photo-wrap .swiper-container.gallery .swiper-wrapper .swiper-slide {
		width: 200px;
		padding-bottom: 253px;
	}
	/* .photo-wrap .swiper-container.gallery .swiper-slide img {
		max-width: 200px;
	} */
	.photo-wrap .swiper-container.gallery .swiper-slide p.nation {
		width: 90%;
		min-width: auto;
		font-size: 13px;
		left: 50%;
		transform: translateX(-50%);
		box-sizing: border-box;
		margin: 15px 0;
	}
	/* .photo-wrap .swiper-container.gallery .swiper-slide a::before {
		top: 70%;
		opacity: 1;
	} 
	.gallery .swiper-slide a .content-details {
		top: 85%;
		left: 50%;
		opacity: 1; 
	} */
}

@media screen and (max-width: 500px) {
	.photo-wrap .inline-box a.kccBtn {
		top: 115px;
	}
	.kccWrap {
		padding: 0 20px;
	}
	.select-swiper .swiper-container.kccTap {
		top: 160px;
	}
}

/******************** Author : SEULKI / Last Update : 2025.06.17 *********************/
/* section03 start */
#section03{
	width: 180rem;
	max-width: calc(100% - 30px - 30px);
	margin: 0 auto;
}
#section03 > ul{
	display: flex;
	justify-content: space-between;
	gap: 3rem;
}
#section03 .banWrap{
	display: flex;
	width: calc(100% / 4 - 3rem);
}
.banWrap a{
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 15px;
	overflow: hidden;
}
.banWrap .img{
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 15px;
	font-size: 0;
	overflow: hidden;
	z-index: -1;
}
.banWrap .img:after{
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 0;
	border-radius: 15px;
	background: rgba(19, 116, 235, 0.5);
	opacity: 0;
	visibility: hidden;
	transition: all 0.5s;
}
.banWrap .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.banWrap a:hover .img::after,
.banWrap a:focus .img::after{
	height: 100%;
	opacity: 1;
	visibility: visible;
	transition: all 0.5s;
}
.banTxtBox{
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	padding: 3rem;
	box-sizing: border-box;
	z-index: 1;
}
.banTxtBox .banTxt{
	color: #fff;
	font-size: 3.5rem;
	font-weight: 700;
}
.banTxtBox .banBtn{
	position: absolute;
	left: 3rem;
	bottom: 5rem;
	display: flex;
	align-items: center;
	color: #fff;
	font-size: 1.8rem;
	box-sizing: border-box;
}
.banTxtBox .banBtn .icon{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 4rem;
	height: 4rem;
	margin-right: 1rem;
	background-color: rgba(0, 0, 0, 0.35);
	border-radius: 30px;
	transition: 0.3s;
	z-index: -1;
}
.banTxtBox .banBtn .icon img{
	filter: brightness(0) invert(1);
}
.banWrap a:hover .banBtn .icon,
.banWrap a:focus .banBtn .icon{
	background-color: rgba(255, 255, 255);
}
.banWrap.apec-box a .banBtn .icon img,
.banWrap a:hover .banBtn .icon img,
.banWrap a:focus .banBtn .icon img{
	filter: brightness(1) invert(0);
}

.banWrap.apec-box .img:before{
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(0deg, rgb(0 0 0 / 60%) 20%, transparent 50%);
	z-index: 0;
}

.banWrap .popupzone{
	position: relative;
	width: 100%;
}
.popupzone-slide{
	background-color: #000;
	border-radius: 15px;
	line-height: 0; 
	overflow: hidden;
}
.popupzone-slide .slide a{
	width: 100%;
	border-radius: 0;
}
.popupzone-slide .slide img{
	width: 100%;
	height: 100%;
	object-fit: initial;
}
.popupzone .slider-controller{
	position: absolute;
	bottom: 4rem;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	height: 3rem;
	padding: 0 2rem;
	border-radius: 50rem;
	background-color: rgba(255,255,255,0.9);
	box-sizing: border-box;
}
.popupzone .slider-controller .slider-btn{
	width: 2rem;
	height: 2rem;
}
.popupzone .slider-controller .slide-num{
	position: relative;
	width: 5rem;
	padding: 0 1.5rem 0 0.5rem;
	font-size: 1.5rem;
	letter-spacing: 2px;
	color: #777;
	box-sizing: border-box;
}
.popupzone .slider-controller .slide-num:after{
	content: "";
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	display: block;
	width: 1px;
	height: 1rem;
	background-color: #ccc;
}
.popupzone .slider-controller .slide-num.count{
	padding: 0;
	width: auto;
	text-align: center;
}
.popupzone .slider-controller .slide-num.count:after{
	display: none;
}
.popupzone .slider-controller .slide-num .current-slide{
	color: #000;
	font-weight: 700;
}

@media screen and (max-width: 1600px){
	html{
		font-size: 9px;
	}
	.banWrap a{
		height: calc(100vw / 4);
	}
	.banTxtBox .banTxt{
		font-size: 3rem;
	}
	.banTxtBox .banBtn{
		font-size: 1.6rem;
	}
}
@media screen and (max-width: 1024px){
	html{font-size: 8px;}
	.banTxtBox {
		padding-left: 20px;
	}
	.banTxtBox .banTxt{
		font-size: 2.6rem;
	}
	
}
@media screen and (max-width: 768px){
	#section03 > ul{
		flex-wrap: wrap;
	}
	#section03 .banWrap{
		width: calc(100% / 2 - 1.5rem);
	}
	.banWrap a{
		height: calc(100vw / 2);
	}
}
@media screen and (max-width: 540px){
	#section03 .banWrap{
		width: 100%;
	}
	.banWrap a{
		height: 16rem;
	}
	.banTxtBox .banBtn{
		position: unset;
	}
	.banWrap .popupzone a{
		height: 100%;
	}
}
/***************************************************************************/

/* section04 start */
#section04{
	padding-top: 100px !important;
	padding-bottom: 90px !important;
}
.WebzineTit{
	margin-bottom: 40px;
}
@media screen and (max-width: 720px){
	.WebzineTit{
		margin-bottom: 20px;
	}
}


.galleryArea {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	/* height: 100vh; */
}
.galleryArea li {
	flex: 1;
	transition: 0.5s;
	position: relative;

	background-size: cover !important;
	object-fit: cover;
	padding-top: 38.25%;
	border-radius: 15px;
	margin-right: 20px;
}
.galleryArea li a{
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}

.galleryArea li:last-child {
	margin-right: 0px;
}
/* .galleryArea li:nth-child(1) {
	background: url("../images/main/webzineimg01.png") no-repeat center center;
}
.galleryArea li:nth-child(2) {
	background: url("../images/main/webzineimg02.png") no-repeat center center;
}
.galleryArea li:nth-child(3) {
	background: url("../images/main/webzineimg03.png") no-repeat center center;
}
.galleryArea li:nth-child(4) {
	background: url("../images/main/webzineimg04.png") no-repeat center center;
} */

.galleryArea:hover li,
.galleryArea:focus li {
	flex: 1;
}
.galleryArea li:hover,
.galleryArea li:focus{
	flex: 2.5;
	filter: none;
}
.galleryArea li.over {
	flex: 2.5;
	filter: none;
}
.galleryArea li {
	filter: brightness(0.30);
}

.content {
	position: absolute;
	color: #fff;
	text-align: center;
	height: 35%;
	left: -320px;
	transition: 0.5s;
	padding: 20px;
	box-sizing: border-box;
	padding-top: 50px;
	width: 100%;
	text-transform:uppercase;
	display: none;
}
.galleryArea li.over .content {
	left: 0;
	bottom: 0;
	transition-delay: 0.3s;
	display: block;
}
.content:before {
	content: '';
	position: absolute;
	width: 30%;
	height: 0px;
	left: 0;
	top: 45px;
	transform-origin: left bottom;
	transform: rotate(0deg) scale(1.3);
	border-bottom: 50px solid #D03054;
	border-right: 25px solid transparent;
	z-index: 0;
}
.galleryArea > li > a > img{
	object-fit: cover;
	width: 100%;
	height: 100%;
	border-radius: 15px;
}
.content h2{
	position: absolute;
	z-index: 1;
	font-weight: 700;
	font-size: 20px;
}
@media screen and (max-width: 1200px){
	#section04{
		padding-top: 80px !important;
		padding-bottom: 80px !important;
	}
	.content:before {
		border-bottom: 40px solid #DB345A;
		border-right: 25px solid transparent;
		top: 50px;
	}
}
@media screen and (max-width: 1000px){
	#section04 {
		padding-top: 70px !important;
		padding-bottom: 70px !important;
	}
	.galleryArea li {
		margin-right: 10px;
	}
	.content::before {
		border-bottom: 35px solid #DB345A;
		border-right: 25px solid transparent;
		width: 40%;
	}
	.galleryArea li.over .content {
		bottom: 30px;
	}
}

@media screen and (max-width: 720px){
	#section04 {
		padding-top: 30px !important;
		padding-bottom: 20px !important;
	}
	.galleryArea li:hover,
	.galleryArea li:focus {
		flex: 1;
	}
	.galleryArea li.over {
		flex: 1;
	}
	.galleryArea {
		display: block;
		list-style: none;
		padding: 0;
		margin: 0;
		overflow: hidden;
	}
	.galleryArea li:nth-child(2) {
		margin-right: 0;
		transition: 0s;
	}
	.galleryArea li {
		width: calc((100% - 2%) / 2);
		margin: 0 2% 15px 0;
		float: left;
		filter: none !important;
	}
	.content {
		left: 0;
		bottom: 30px;
		display: block;
	}
	.content h2 {
		font-size: 17px;
	}
}
@media screen and (max-width: 500px){
	.content h2 {
		font-size: 16px;
	}
	.content::before {
		border-bottom: 27px solid #DB345A;
		width: 55%;
	}
}


/* section05 start */
#section05{
	background-color: #F8F8F8;
	padding: 90px 0 !important;
}
.mainLatest {
	max-width: 1800px;
	background-position: top center;
	background-repeat: no-repeat;
	margin: 0 auto;
	padding: 0 30px;
	box-sizing: border-box;
}
.mainLatest .latestTabs h2 {
	display: block;
	text-align: center;
}
.mainLatest .latestTabs h2 span {
	display: inline-block;
	color: #000;
	font-size: 36px;
	vertical-align: middle;
}
.mainLatest .tabsList {
	position: relative;
	width: 100%;
	height: 310px;
	font-size: 0;
	margin: 0 auto;
}
.mainLatest .tabsList:after {
	content: '';
	clear: both;
	display: block;
}
.mainLatest .tabsList .tabsItem {
	float: left;
	display: block;
	width: 129px;
	margin-right: 10px;
}
.mainLatest .tabsList .tabsItem .title {
	height: 55px;
	position: absolute;
	right: 100px;
	top: -55px;
}
.mainLatest .tabsList .a2 .title {
	right: 0px !important;
}
.mainLatest .tabsList .tabsItem .title button {
	display: block;
	width: 95px;
	height: inherit;
	color: #6F6F6F;
	font-size: 20px;
	text-align: center;
}
.mainLatest .tabsList .tabsItem.on > .title > button {
	color: #fff;
	background-color: #D03054;
	border-radius: 30px;
}
.mainLatest .tabsList .tabContent {
	display: none;
	position: absolute;
	top: 50px;
	left: 0;
	right: 0;
	width: 100%;
	height: 230px;
	border-radius:  6px;
	border-top-left-radius: 0;
	font-size: 14px;
	padding: 45px 0px;
	z-index: -1;
}
.mainLatest .tabsItem.on .tabContent {
	display: block;
	z-index: 0;
}
.mainLatest .latestSlider{
	width: calc(100% - 6%);
	margin: 0 auto;
	z-index: 2;
}
.mainLatest .latestSlider .slide-item {
	padding: 20px 25px;
	box-sizing: border-box;
	border: solid 1px #aaa;
	background-color: #fff;
	border-radius: 25px;
	height: 230px;
}
.mainLatest .latestSlider .slide-item a {
	position: relative;
	display: block;
	height: 100%;
}
.mainLatest .slider .slick-list {
    margin:0 -50px;
}
.mainLatest .slick-slide {
	position: relative;
    margin:0 0.9%;
}
.mainLatest .latestSlider .slide-item i {
	position: relative;
	display: block;
	line-height: 29px;
	color: #DB345A;
	font-size: 17px;
	font-style: normal;
	font-weight: 500;
	text-align: left;
	padding-top: 70px;

}
.mainLatest .latestSlider .slide-item i.clari {
	background: #00a1a7;
}
.mainLatest .latestSlider .slide-item i.clari:before {
	border-color: #00a1a7 transparent transparent transparent;
}
.mainLatest .latestSlider .slide-item i.recruit_ongoing {
	background: #e66f73;
}
.mainLatest .latestSlider .slide-item i.recruit_ongoing:before {
	border-color: #e66f73 transparent transparent transparent;
}
.mainLatest .latestSlider .slide-item i.recruit_end {
	background: #4c5a69;
}
.mainLatest .latestSlider .slide-item i.recruit_end:before {
	border-color: #4c5a69 transparent transparent transparent;
}
.mainLatest .latestSlider .slide-item .desc {
	display: -webkit-box;
	width: 100%;
	color: #333;
	font-size: 20px;
	font-weight: 500;
	margin-top: 15px;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 2; 
	-webkit-box-orient: vertical;
    height: 58px;
}
.mainLatest .latestSlider .slide-item a:hover .desc,
.mainLatest .latestSlider .slide-item a:focus .desc {
	text-decoration: underline;
	text-decoration-color: #777;
	text-underline-offset: 5px;
	text-decoration-thickness: 0.5px
}
.mainLatest .latestSlider .slide-item .info {
	position: absolute;
	top: 15px;
	left: 0;
}
.mainLatest .latestSlider .slide-item .info span {
	position: relative;
	display: inline-block;
	font-size: 17px;
	color: #555;
	font-weight: 200;
}
.mainLatest .latestSlider .slide-item .info span + span {
	margin-left: 20px;
}
.mainLatest .latestSlider .slide-item .info span + span:before {
	position: absolute;
	top: 7px;
	left: -9px;
	content: '';
	width: 1px;
	height: 8px;
	background: #cecece;
}
.mainLatest .control {
	position: absolute;
	width: 100%;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
}
.mainLatest .btn_prev {
	width: 23px;
	height: 42px;
	background-image: url(../images/main/icon_ban_left.png);
	background-size:  23px 42px;
	background-position: center center;
	background-repeat: no-repeat;
	text-indent: -9999px;
}
.mainLatest .btn_next {
	width: 23px;
	height: 42px;
	background-image: url(../images/main/icon_ban_right.png);
	background-size:  23px 42px;
	background-position: center center;
	background-repeat: no-repeat;
	text-indent: -9999px;
	position: absolute;
	right: 0;
	display: inline-block !important;
}
/* slick modify */
.slick-prev {
	left: -3% !important;
	height: 42px !important;
}
.slick-prev::before{
	display: none;
}
.slick-next {
	right: -3% !important;
	height: 42px !important;
}
.slick-next::before{
	display: none;
}

@media screen and (max-width: 1200px){
	#section05 {
		padding: 80px 0 !important;
	}
	.mainLatest .tabsList {
		height: 290px;
	}
	.mainLatest .tabsList .tabContent {
		top: 30px;
	}
	.mainLatest .latestSlider .slide-item .desc {
		font-size: 19px;
	}
	.mainLatest .slick-slide {
		margin: 0 0.5%;
	}
	.mainLatest .latestSlider .slide-item {
		padding: 20px 20px;
	}
}
@media screen and (max-width: 1000px){
	#section05 {
		padding: 60px 0 !important;
	}
	.mainLatest .slick-slide {
		margin: 0 1%;
	}
	.mainLatest .tabsList {
		height: 280px;
	}
	.mainLatest .tabsList .tabsItem .title {
		height: 50px;
		right: 90px;
	}
	.mainLatest .tabsList .tabsItem .title button {
		width: 85px;
		font-size: 18px;
	}
	.mainLatest .tabsList .tabContent {
		top: 20px;
		height: 210px;
	}
	.mainLatest .latestSlider .slide-item {
		height: 210px;
		padding: 10px 20px;
	}
	.mainLatest .latestSlider .slide-item i {
		font-size: 16px;
		padding-top: 60px;
	}
	.mainLatest .latestSlider .slide-item .info span {
		font-size: 16px;
	}
	.mainLatest .latestSlider .slide-item .desc {
		font-size: 18px;
		margin-top: 10px;
	}
}
@media screen and (max-width: 720px){
	#section05 {
		padding: 40px 0 !important;
	}
	.mainLatest .tabsList {
		height: 280px;
	}
	.mainLatest .tabsList .tabsItem .title {
		height: 40px;
		right: auto;
		top: 30px;
		z-index: 10;
		left: 40%;
		transform: translateX(-50%);
	}
	.mainLatest .tabsList .a2 .title {
		right: auto !important;
		left: 60%;
		transform: translateX(-50%);
	}
	.mainLatest .tabsList .tabsItem .title button {
		width: 90px;
		font-size: 17px;
	}
	.mainLatest .tabsList .tabContent {
		top: 50px;
		height: 190px;
	}
	.mainLatest .latestSlider .slide-item {
		height: 190px;
	}
	.mainLatest .latestSlider .slide-item i {
		font-size: 16px;
		padding-top: 55px;
	}
	.mainLatest .latestSlider .slide-item .info span {
		font-size: 15px;
	}
	.mainLatest .latestSlider .slide-item .desc {
		font-size: 17px;
		margin-top: 5px;
		height: 53px;
	}
}
@media screen and (max-width: 500px){
	.mainLatest .slick-slide {
		margin: 0 2%;
	}
	.mainLatest .tabsList .tabsItem .title {
		left: 35%;
		transform: translateX(-50%);
	}
	.mainLatest .tabsList .a2 .title {
		right: auto !important;
		left: 65%;
		transform: translateX(-50%);
	}
	.mainLatest .latestSlider .slide-item {
		height: 180px;
	}
	.mainLatest .tabsList .tabContent {
		top: 40px;
	}
	.mainLatest .tabsList .tabsItem .title {
		top: 25px;
	}
}

/* popup */
/*화면 가운데 위치
.app-smart-popup {    
	position:fixed; 
	top:50%; 
	left:50%; 
	transform:translate(-50%,-50%); 
	border:0; 
	margin:0 !important; 
	z-index:100000000 !important; 
	max-width:600px; 
	width:90%;
}
.app-smart-popup:after{
	display:block; 
	content:''; 
	width:100vw; 
	height:102vh; 
	background:rgba(0,0,0,0.5); 
	position:absolute; 
	top:50%; 
	left:50%; 
	transform:translate(-50%,-50%); 
	z-index:-1;
}
*/
.app-smart-popup {
	position:fixed; 
	top:10px; 
	left:10px; 
	border:0; 
	margin:0 !important; 
	z-index:100000000 !important; 
	max-width:486px; 
	width:90%;
	background: #fff;
}
.app-smart-popup .smart-popup-img img{
	max-width:100% !important;
}
.app-smart-popup img {
	margin-bottom : 10px;
}
.app-smart-popup .smart-popup-btns{
	position:relative; 
	z-index:10; 
	border-top:0; 
	display:flex; 
	justify-content: space-between; 
	margin:10px;
}
.app-smart-popup .smart-popup-btns button{
	float:initial; 
	background:transparent; 
	height:initial; 
	width:initial; 
	/* color:#fff; */
	font-size:15px;
	font-weight: 500;
}
.app-smart-popup .smart-popup-btns button.smart-popup-close{
	border:0; 
	background:transparent;
}
.app-smart-popup .smart-popup-btns button.smart-popup-close:hover,
.app-smart-popup .smart-popup-btns button.smart-popup-close:focus{
	background:transparent;
}


/* 20250702 메인 상단 apec 배너 추가 */
.top_line_bnr{
	position: relative;
}
.top-banner.active + .header_wrap{
	top: calc(10rem + 32px);
}
.top-banner.active + .header_wrap .searchWrap{
	top: -10rem;
}
.top-banner.active + .header_wrap .posi_vari{
	top: -7rem;
}
.top-banner,
.top-banner *{
	box-sizing: border-box;
}
.top-banner{
	position: relative;
	display: block;
	height: 10rem;
	background: #edf1f5 url('/images/main/img-banner-bg.png') 50% 100% repeat;
	border-top: 1px #ddd solid;
	border-bottom: 1px #ddd solid;
	text-align: center;
}
.top-banner a{
	display: block;
	height: 100%;
	padding: 1rem 0;
}
.top-banner .banner-img{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding: 0 5rem;
}
.top-banner .banner-img img{
	max-height: 100%;
}
.banner-close{
	position: absolute;
	right: 4rem;
	top: 50%;
	transform: translateY(-50%);
	width: 4rem;
	height: 4rem;
}
@media screen and (max-width: 720px) {
	
	.banner-close{
		right: 25px;
	}
}
@media screen and (max-width: 640px) {
	.top-banner.active + .header_wrap{
		top: calc(10rem + 24px);
	}
	.top-banner .banner-img{
		width: 80%;
		padding: 0 2rem;
	}
}