/*-- sub page css --*/

/*container*/
.sub-section{padding: 150px 0;}
.sub-top{padding-top: 0;}

.common-box{margin-top: 65px;margin-bottom: 65px;}
.mar-t0{margin-top: 0 !important;}
.mar-b0{margin-bottom: 0 !important;}

@media screen and (max-width: 1480px){

	.sub-section{padding: 120px 0;}
	.sub-top{padding-top: 0;}
	
	.common-box{margin-top: 50px;margin-bottom: 50px;}
}

@media screen and (max-width: 1080px){

	.sub-section{padding: 100px 0;}
	.sub-top{padding-top: 0;}
}

@media screen and (max-width: 720px){

	.sub-section{padding: 70px 0;}
	.sub-top{padding-top: 0;}
	
	.common-box{margin-top: 35px;margin-bottom: 35px;}
}

/*sub title*/
.sub-title span{display: flex;align-items: flex-end;gap: 8px;font-size: var(--fs-32);font-weight: var(--fw-6);color: var(--color-1);line-height: .7;margin-bottom: 40px;}
.sub-title span i{width: 13px;height: 13px;border-radius: 13px;background: var(--color-1);}

.sub-title h3{font-size: var(--fs-70);font-weight: var(--fw-8);word-break: keep-all;}
.sub-title p{font-size: var(--fs-22);font-weight: var(--fw-4);word-break: keep-all;line-height: 160%;margin-top: 40px;}
.sub-title p b{font-weight: var(--fw-7);}

.sub-text p{font-size: var(--fs-22);font-weight: var(--fw-4);word-break: keep-all;line-height: 160%;}
.sub-text p + p{margin-top: 40px;}
.sub-text p b{font-weight: var(--fw-7);}
.sub-text p i{color: var(--color-2);}
.sub-text p span{text-decoration: underline;text-underline-offset: 5px;text-decoration-color: #ddd;}

.sub-title-box{background: #f8f8f8;border-radius: 30px;overflow: hidden;padding: 45px 50px;}

@media screen and (max-width: 1480px){

	.sub-title span{margin-bottom: 30px;}
	
	.sub-title p{margin-top: 30px;line-height: 170%;}
	
	.sub-text p{line-height: 170%;}
	.sub-text p + p{margin-top: 30px;}
}

@media screen and (max-width: 1280px){

	.sub-title-box{padding: 35px 40px;}
}

@media screen and (max-width: 1080px){

	.sub-title h3{font-size: var(--fs-60);}
}

@media screen and (max-width: 720px){

	.sub-title span{gap: 6px;font-size: 22px;margin-bottom: 20px;}
	.sub-title span i{width: 6px;height: 6px;}
	
	.sub-title h3{font-size: 32px;}
	.sub-title p{font-size: 15px;margin-top: 25px;}
	
	.sub-text p{font-size: 15px;}
	.sub-text p + p{margin-top: 25px;}
	
	.sub-title-box{padding: 25px 30px;border-radius: 15px;}
}

/*header*/
#header{transition: all .4s ease;will-change: transform;}
#header.on{height: 100px;}
#header.scroll-Ing{transform: translateY(-100%);}

@media screen and (max-width: 1480px){

	#header.on{height: 80px;}
}

@media screen and (max-width: 720px){

	#header.on{height: 60px;}
}

/*parallax*/
.parallax-wrapper{overflow: hidden;}
.parallax, .parallax-vanilla{width: 100%;height: 100%;will-change: transform;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover; 
}

/*motion*/
.sub-motion-1{transform: translateY(50px);opacity: 0;transition: transform 1s ease, opacity .6s ease;}
.sub-motion-2{transform: translateX(-50px);opacity: 0;transition: transform 1s ease, opacity .6s ease;}
.sub-motion-3{transform: translateX(50px);opacity: 0;transition: transform 1s ease, opacity .6s ease;}

.sub_motion.on .sub-motion-1{transform: translateY(0);opacity: 1;}
.sub_motion.on .sub-motion-2{transform: translateX(0);opacity: 1;}
.sub_motion.on .sub-motion-3{transform: translateX(0);opacity: 1;}

/*-- sub visual --*/
.subVisual{height: 700px;background-color: #000;position: relative;}

.subVisual-img{display: block;width: 100%;height: 100%;}

.subVisual-title{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);width: 100%;z-index: 10;}
.subVisual-title h2{text-align: center;color: #FFF;font-size: var(--fs-100);font-weight: var(--fw-7);}

#sv_01 figure{background-image: url(/img/sub/sv_1.jpg);}
#sv_02 figure{background-image: url(/img/sub/sv_2.jpg);}
#sv_03 figure{background-image: url(/img/sub/sv_3.jpg);}
#sv_04 figure{background-image: url(/img/sub/sv_4.jpg);}
#sv_05 figure{background-image: url(/img/sub/sv_5.jpg);}
#sv_06 figure{background-image: url(/img/sub/sv_6.jpg);}

@media screen and (max-width: 1920px){

	.subVisual{height: 530px;}
	
	.subVisual-title h2{font-size: 5.625rem;}
}

@media screen and (max-width: 1480px){

	.subVisual{height: 480px;}
}

@media screen and (max-width: 1080px){

	.subVisual-title h2{font-size: 4.5rem;}
}

@media screen and (max-width: 720px){

	.subVisual{height: 380px;}
	
	.subVisual-title h2{font-size: 40px;}
}

/*-- side bar --*/
.side-wrap{padding-top: 60px;}
.side-wrap>div{display: flex;align-items: center;justify-content: flex-end;}

.side-wrap>div div{padding-right: 32px;position: relative;}
.side-wrap>div div::after{content: "\e93f";position: absolute;top: 5px;right: 5px;z-index: 1;font-family: xeicon !important;font-size: var(--fs-20);}
.side-wrap>div div:last-child{padding-right: 0 !important;}
.side-wrap>div div:last-child::after{display: none;}
.side-wrap>div a{display: flex;align-items: center;gap: 10px;}
.side-wrap>div a img{display: block;max-width: 18px;}
.side-wrap>div span{font-size: var(--fs-18);font-weight: var(--fw-4);}

.side-wrap>div div{opacity: .4;}
.side-wrap>div div:last-child{opacity: 1;}
.side-wrap>div div:last-child span{font-weight: var(--fw-5);color: var(--color-2);}

@media screen and (max-width: 1480px){

	.side-wrap{padding-top: 42px;}
	
	.side-wrap>div div{padding-right: 27px;}
	.side-wrap>div div::after{top: 4px;}
	.side-wrap>div a{gap: 8px;}
	.side-wrap>div a img{max-width: 15px;}
}

@media screen and (max-width: 720px){

	.side-wrap{padding-top: 30px;}
	.side-wrap>div{justify-content: flex-start;}
	.side-wrap>div div{padding-right: 20px;}
	.side-wrap>div div::after{font-size: 15px;top: 3px;right: 3px;}
	.side-wrap>div span{font-size: 14px;letter-spacing: -0.045em;}
	.side-wrap>div a{gap: 6px;}
	.side-wrap>div a img{max-width: 13px;}
}

/*-- stri --*/
.sub-video{display: block;height: 0;padding-bottom: 46.5%;border-radius: 30px;overflow: hidden;position: relative;margin-top: 65px;margin-bottom: 65px;}

.stri-bg{background: #f9f9f9;position: relative;}
.stri-bg::before{content: "";position: absolute;bottom: -600px;left: 0;width: 100%;height: 90%;z-index: 1;
	background-image: url(/img/sub/stri_bg.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.stri-box{position: relative;z-index: 10;}
.stri-box>.parallax-wrapper{height: 400px;border-radius: 30px;margin-top: 65px;margin-bottom: 65px;}
.stri-box figure{display: block;width: 100%;background-image: url(/img/sub/stri_1.jpg);}

@media screen and (max-width: 1480px){

	.sub-video, .stri-box>.parallax-wrapper{margin-top: 50px;margin-bottom: 50px;}
	
	.stri-bg::before{bottom: -500px;}
}

@media screen and (max-width: 720px){

	.sub-video, .stri-box>.parallax-wrapper{margin-top: 35px;margin-bottom: 35px;}
	.sub-video{padding-bottom: 56%;border-radius: 15px;}
	.stri-box>.parallax-wrapper{height: 200px;border-radius: 15px;}
	
	.stri-bg::before{bottom: 0;}
}

/*-- vision --*/
.vision-box{display: flex;gap: 120px;}
.vision-box>div{width: calc( ( 100% - 120px ) / 2 );}
.vision-box>div:nth-child(2){margin-top: 10px;}

.vision-box .parallax-wrapper{border-radius: 30px;height: 70%;margin-top: 70px;
	box-shadow: 20px 20px 35px rgba(0,0,0,.1);
}
.vision-box figure{background-image: url(/img/sub/vision_1.jpg);}

.ceo-sig{display: flex;justify-content: flex-end;align-items: flex-end;gap: 13px;margin-top: 70px;}
.ceo-sig i, .ceo-sig b{word-break: keep-all;}
.ceo-sig i{font-size: var(--fs-22);font-weight: var(--fw-4);line-height: 170%;color: #bbb;}
.ceo-sig b{font-size: var(--fs-30);font-weight: var(--fw-7);line-height: 160%;}

.mouse_img01, .mouse_img02{z-index: -1;}
.mouse_img01{content: '';position: absolute;top: 0;left: 0;}
.mouse_img02{content: '';position: absolute;bottom: 0;right: 0;}

@media screen and (max-width: 1920px){

	.mouse_img01{left: -15%;}
	.mouse_img02{right: -15%;}
}

@media screen and (max-width: 1480px){

	.vision-box{gap: 100px;}
	.vision-box>div{width: calc( ( 100% - 100px ) / 2 );}
	
	.vision-box .parallax-wrapper{height: 69.5%;margin-top: 60px;}
	
	.mouse_img01{left: -25%;}
	.mouse_img02{right: -25%;}
}

@media screen and (max-width: 1280px){

	.vision-box{display: block;}
	.vision-box>div{width: 100%;}
	.vision-box>div:nth-child(1){display: flex;flex-direction: row-reverse;gap: 100px;}
	.vision-box>div:nth-child(1) .sub-title{width: calc( 100% - 500px );}
	.vision-box>div:nth-child(1) .parallax-wrapper{width: 400px;margin-top: 0;}
	.vision-box>div:nth-child(2){margin-top: 60px;}
	
	.vision-box .parallax-wrapper{height: 400px;}
}

@media screen and (max-width: 1080px){

	.vision-box>div:nth-child(1){gap: 70px;}
	.vision-box>div:nth-child(1) .sub-title{width: calc( 100% - 470px );}
	.vision-box>div:nth-child(1) .parallax-wrapper{width: 400px;margin-top: 0;}
	.vision-box>div:nth-child(2){margin-top: 50px;}
}

@media screen and (max-width: 960px){

	.vision-box>div:nth-child(1){display: block;}
	.vision-box>div:nth-child(1) .sub-title{width: 100%;}
	.vision-box>div:nth-child(1) .parallax-wrapper{width: 100%;margin-top: 50px;}
}

@media screen and (max-width: 720px){

	.vision-box>div:nth-child(1) .parallax-wrapper{margin-top: 35px;}
	.vision-box>div:nth-child(2){margin-top: 35px;}
	
	.vision-box .parallax-wrapper{height: 400px;border-radius: 15px;}
	
	.ceo-sig{gap: 10px;margin-top: 30px;}
	.ceo-sig i{font-size: 15px;}
	.ceo-sig b{font-size: 20px;}
	
	.mouse_img01, .mouse_img02{opacity: .7;}
	.mouse_img01{left: -95%;}
	.mouse_img02{right: -95%;}
}

/*-- history --*/
.history-box{margin-top: 65px;}
.history-box.history-2{margin-top: 150px;}

.history-box>.parallax-wrapper{height: 400px;border-radius: 400px;position: relative;}
.history-box>.parallax-wrapper h3{position: absolute;top: 50%;left: 0;transform: translateY(-50%);width: 100%;z-index: 1;
	font-size: var(--fs-80);font-weight: var(--fw-7);text-align: center;color: rgba(255,255,255,.9);
}
.history-1 figure{display: block;width: 100%;background-image: url(/img/sub/history_1.jpg);}
.history-2 figure{display: block;width: 100%;background-image: url(/img/sub/history_2.jpg);}

.history-flex{display: flex;margin-top: 100px;}
.history-flex>div, .history-flex>ul{width: 50%;}

.history-year{position: relative;}
.history-year h3{position: sticky;top: 15vh;font-size: var(--fs-80);font-weight: var(--fw-7);line-height: .8;}

.history-list{border-top: 1px solid #e4e4e4;}
.history-list>li{padding: 50px 0;border-bottom: 1px solid #e4e4e4;}
.history-list>li>h4{font-size: var(--fs-32);font-weight: var(--fw-7);line-height: .9;margin-bottom: 25px;}

.history-detail>li + li{margin-top: 25px;}
.history-detail>li b, .history-detail>li span{display: block;word-break: keep-all;line-height: 160%;padding-left: 18px;}
.history-detail>li b{font-size: var(--fs-22);font-weight: var(--fw-5);position: relative;}
.history-detail>li b::before{content: "";position: absolute;top: 13px;left: 0;width: 8px;height: 8px;border-radius: 8px;background: var(--color-1);}
.history-detail>li span{font-size: var(--fs-20);font-weight: var(--fw-4);color: #565656;margin-top: 13px;}

@media screen and (max-width: 1480px){

	.history-box{margin-top: 50px;}
	.history-box.history-2{margin-top: 120px;}
	.history-box>.parallax-wrapper{height: 380px;border-radius: 380px;}
	
	.history-flex{margin-top: 80px;}
	
	.history-list>li{padding: 40px 0;}
	.history-list>li>h4{margin-bottom: 20px;}
	
	.history-detail>li + li{margin-top: 20px;}
	.history-detail>li b::before{top: 11px;width: 7px;height: 7px;border-radius: 7px;}
	.history-detail>li span{margin-top: 10px;}
}

@media screen and (max-width: 1080px){

	.history-box.history-2{margin-top: 100px;}
	.history-box>.parallax-wrapper{height: 320px;border-radius: 320px;}
	
	.history-flex{display: block;margin-top: 60px;}
	.history-flex>div, .history-flex>ul{width: 100%;}
	.history-flex>div{margin-bottom: 30px;}
	
	.history-list>li{padding: 30px 0;}
	.history-detail>li + li{margin-top: 13px;}
	
	.history-detail>li span{margin-top: 8px;}
}

@media screen and (max-width: 720px){

	.history-box{margin-top: 35px;}
	.history-box.history-2{margin-top: 70px;}
	.history-box>.parallax-wrapper{height: 180px;border-radius: 20px;}
	.history-box>.parallax-wrapper h3{font-size: 32px;}
	
	.history-flex{margin-top: 35px;}
	.history-flex>div{margin-bottom: 25px;}
	
	.history-year h3{font-size: 32px;}
	
	.history-list>li{padding: 25px 0;}
	
	.history-detail>li + li{margin-top: 10px;}
	.history-detail>li b, .history-detail>li span{padding-left: 15px;line-height: 170%;}
	.history-detail>li b{font-size: 17px;}
	.history-detail>li b::before{top: 10px;width: 6px;height: 6px;border-radius: 6px;}
	.history-detail>li span{margin-top: 6px;}
}

/*-- contact us --*/
.contact-list{display: flex;gap: 40px;margin-top: 65px;margin-bottom: 50px;}
.contact-list>li{display: flex;flex-direction: column;align-items: center;justify-content: center;width: calc( ( 100% - 80px ) / 3 );background: #f8f8f8;border-radius: 30px;overflow: hidden;padding: 50px;text-align: center;}

.contact-list>li h4{font-size: var(--fs-20);font-weight: var(--fw-6);margin-bottom: 45px;color: #999;}
.contact-list>li span{font-size: var(--fs-32);font-weight: var(--fw-7);margin-bottom: 23px;}
.contact-list>li a{font-size: var(--fs-22);font-weight: var(--fw-4);background: var(--color-2);color: #FFF;line-height: 50px;border-radius: 50px;padding: 0 25px;}

.contact-list-2{margin-top: 0;margin-bottom: 0;}
.contact-list-2>li{padding: 0;background: none;border-radius: 0;}
.contact-list-2>li>a{display: block;width: 100%;background: none;padding: 0;line-height: inherit;border-radius: 0;}
.contact-list-2>li figure{width: 100%;height: 280px;background: #f9f9f9;border-radius: 30px;overflow: hidden;position: relative;}
.contact-list-2>li figure img{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 1;}
.contact-list-2>li h3{display: flex;align-items: center;justify-content: space-between;color: #000;margin-top: 30px;transition: color .25s ease;}
.contact-list-2>li h3 span{margin-bottom: 0;}
.contact-list-2>li h3 i{font-size: var(--fs-30);font-weight: var(--fw-7);}

.contact-list-2>li:nth-child(1) figure{background: #0763f7;}
.contact-list-2>li:nth-child(2) figure{background: #ff0033;}
.contact-list-2>li:nth-child(3) figure{background: #0a66c2;}

.contact-list-2>li:nth-child(1):hover h3{color: #0763f7;}
.contact-list-2>li:nth-child(2):hover h3{color: #ff0033;}
.contact-list-2>li:nth-child(3):hover h3{color: #0a66c2;}

.contact-box{margin-top: 65px;border-radius: 30px;overflow: hidden;}
.contact-box iframe{display: block;width: 100%;height: 450px;}

@media screen and (max-width: 1480px){

	.contact-list{gap: 35px;margin-top: 50px;margin-bottom: 40px;}
	.contact-list>li{width: calc( ( 100% - 70px ) / 3 );}
	
	.contact-list>li h4{margin-bottom: 40px;}
	
	.contact-list-2{margin-top: 0;margin-bottom: 0;}
	
	.contact-box{margin-top: 50px;}
}

@media screen and (max-width: 1280px){

	.contact-list{gap: 25px;}
	.contact-list>li{width: calc( ( 100% - 50px ) / 3 );padding: 40px;}
	
	.contact-list-2>li{padding: 0;}
	.contact-list-2>li figure{height: 240px;}
	.contact-list-2>li h3{margin-top: 25px;}
	
	.contact-box iframe{height: 420px;}
}

@media screen and (max-width: 1080px){

	.contact-list{flex-direction: column;}
	.contact-list>li{width: 100%;}
	
	.contact-list-2>li figure img{max-width: 100px;}
}

@media screen and (max-width: 720px){

	.contact-list{gap: 20px;margin-top: 35px;margin-bottom: 35px;}
	.contact-list>li{border-radius: 15px;padding: 30px;}
	
	.contact-list>li h4{font-size: 17px;margin-bottom: 25px;}
	.contact-list>li span{margin-bottom: 20px;}
	.contact-list>li a{font-size: 16px;line-height: 45px;padding: 0 20px;}
	
	.contact-list-2{margin-top: 24px;margin-bottom: 0;}
	.contact-list-2>li{padding: 0;background: none;border-radius: 0;}
	.contact-list-2>li>a{padding: 0;line-height: inherit;}
	.contact-list-2>li figure{height: 180px;border-radius: 15px;}
	.contact-list-2>li h3{margin-top: 20px;}
	
	.contact-box{margin-top: 35px;border-radius: 15px;}
	.contact-box iframe{height: 300px;}
	.contact-list-2>li figure img{max-width: 80px;}
}

/*-- carrier --*/
.job-list{display: flex;align-items: center;margin-top: 40px;}
.job-list li{font-size: var(--fs-22);font-weight: var(--fw-4);line-height: 60px;padding: 0 30px;border-radius: 60px;border: 1px solid #ddd;white-space: nowrap;}
.job-list li:nth-child(1){background: #f8f8f8;color: #999;font-weight: var(--fw-7);}

.career-box{margin-top: 65px;}
.career-box figure{border: 1px solid #e4e4e4;border-radius: 30px;overflow: hidden;}
.career-box img{display: block;margin: 0 auto;}

@media screen and (max-width: 1480px){

	.job-list{margin-top: 30px;}
	.job-list li{line-height: 55px;padding: 0 25px;border-radius: 55px;}
	
	.career-box{margin-top: 50px;}
}

@media screen and (max-width: 1280px){

	.job-list{flex-wrap: wrap;gap: 10px;row-gap: 15px;}
}

@media screen and (max-width: 960px){

	.career-box img{width: 100%;}
}

@media screen and (max-width: 720px){

	.job-list{margin-top: 25px;gap: 8px;}
	.job-list li{width: 100%;font-size: 16px;line-height: 50px;padding: 0;border-radius: 50px;text-align: center;}

	.career-box{margin-top: 35px;}
	.career-box figure{border-radius: 15px;}
}

/*-- about khcs --*/
.about-khcs{position: relative;z-index: 10;}
.about-khcs>.parallax-wrapper{height: 400px;border-radius: 30px;margin-top: 65px;margin-bottom: 65px;}
.about-khcs figure{display: block;width: 100%;background-image: url(/img/sub/khcs_1.jpg);}

.key-point{border-radius: 30px;overflow: hidden;padding: 40px 48px;background: #e9f8df;margin-top: 65px;}
.key-point>h4{font-size: var(--fs-32);font-weight: var(--fw-7);margin-bottom: 15px;}
.key-point>ul>li{font-size: var(--fs-20);font-weight: var(--fw-4);line-height: 160%;padding-left: 20px;position: relative;}
.key-point>ul>li + li{margin-top: 10px;}
.key-point>ul>li::before{content: "";position: absolute;top: 14px;left: 0;width: 6px;height: 6px;border-radius: 6px;background: var(--color-1);}
.key-point>ul>li b{font-weight: var(--fw-6);color: #215b00;}

.key-point-solo{margin-top: 40px;}

.img-box{margin-top: 65px;}
.img-box figure{padding: 50px 0;border: 1px solid #e4e4e4;border-radius: 30px;overflow: hidden;}
.img-box figure img{display: block;margin: 0 auto;}

.point-list{border-radius: 30px;overflow: hidden;padding: 40px 48px;background: #e9f8df;margin-top: 65px;}
.point-list-content{margin-top: 40px;}
.point-list ul li + li{margin-top: 20px;}
.point-list ul li span, .point-list ul li i{display: block;font-weight: var(--fw-4);line-height: 160%;padding-left: 20px;}
.point-list ul li span{font-size: var(--fs-20);font-weight: var(--fw-5);position: relative;}
.point-list ul li span::before{content: "";position: absolute;top: 14px;left: 0;width: 6px;height: 6px;border-radius: 6px;background: var(--color-1);}
.point-list ul li i{font-size: var(--fs-18);color: #607750;}

.haif-img{display: flex;align-items: flex-start;gap: 80px;margin-top: 65px;}
.haif-img figure, .haif-img .khcs-table{width: 50%;}
.haif-img img{display: block;}

.haif-img figure{display: flex;flex-direction: column;border: 1px solid #e4e4e4;border-radius: 30px;overflow: hidden;}
.haif-img figure span{font-size: var(--fs-17);font-weight: var(--fw-4);line-height: 160%;text-align: center;padding: 18px 0;}

.khcs-table>h4{font-size: var(--fs-24);font-weight: var(--fw-7);line-height: 160%;margin-bottom: 15px;}
.khcs-table>table{width: 100%;table-layout: fixed;border: 1px solid #e4e4e4;}
.khcs-table>table tr td{font-size: var(--fs-18);font-weight: var(--fw-4);text-align: center;padding: 15px;border: 1px solid #e4e4e4;color: #454545;}
.khcs-table>table tr:first-child td{font-weight: var(--fw-7) !important;background: #f8f8f8;color: #000;}
.khcs-table>table tr td:first-child{font-weight: var(--fw-6);color: #000;}

.khcs-table-solo{margin-top: 40px;}
.khcs-table-solo tr td{text-align: left !important;}

@media screen and (max-width: 1480px){

	.about-khcs>.parallax-wrapper{margin-top: 50px;margin-bottom: 50px;}
	
	.key-point, .point-list{padding: 35px 43px;}
	.key-point, .point-list, .img-box{margin-top: 50px;}
	.point-list-content{margin-top: 30px;}
	.key-point>ul>li, .point-list ul li span, .point-list ul li i{padding-left: 18px;}
	.key-point>ul>li::before, .point-list ul li span::before{top: 11px;}
	
	.point-list ul li + li{margin-top: 15px;}
	
	.img-box figure img{max-width: 90%;}
	
	.haif-img{gap: 70px;margin-top: 50px;}
	
	.khcs-table-solo, .key-point-solo{margin-top: 30px;}
}

@media screen and (max-width: 1080px){

	.haif-img{gap: 60px;}
}

@media screen and (max-width: 860px){

	.haif-img{flex-direction: column;}
	.haif-img figure, .haif-img .khcs-table{width: 100%;}
}

@media screen and (max-width: 720px){

	.about-khcs>.parallax-wrapper{height: 200px;border-radius: 15px;margin-top: 35px;margin-bottom: 35px;}
	
	.key-point, .point-list{padding: 21px 23px;border-radius: 15px;}
	.key-point, .point-list, .img-box{margin-top: 35px;}
	.point-list-content{margin-top: 25px;}
	.key-point>ul>li, .point-list ul li span, .point-list ul li i{padding-left: 15px;}
	.key-point>ul>li::before, .point-list ul li span::before{top: 10px;width: 5px;height: 5px;border-radius: 5px;}
	
	.key-point>h4{margin-bottom: 10px;}
	.key-point>ul>li + li{margin-top: 13px;}
	
	.point-list ul li span{margin-bottom: 3px;}
	.point-list ul li i{font-size: 14px;}

	.img-box figure{padding: 30px 0;border-radius: 15px;}
	
	.haif-img{gap: 35px;margin-top: 35px;}
	.haif-img figure{border-radius: 15px;}
	.haif-img figure span{font-size: 14px;padding: 15px 40px;}
	
	.khcs-table>h4{margin-bottom: 10px;}
	.khcs-table>table tr td{font-size: 14px;padding: 13px;line-height: 150%;}
	
	.khcs-table-solo, .key-point-solo{margin-top: 25px;}
}

/*-- KHCs Markers --*/
.marker-box{display: flex;align-items: flex-start;gap: 65px;}
.marker-box>div{width: calc( ( 100% - 65px ) / 2 );}

.marker-box figure{display: flex;align-items: center;justify-content: center;border: 1px solid #e4e4e4;padding: 50px;border-radius: 30px;overflow: hidden;}
.marker-box figure img{display: block;width: 100%;}

.marker-box-text{margin-top: 40px;}
.marker-box-text h4{display: flex;flex-wrap: wrap;align-items: center;gap: 5px;row-gap: 10px;}
.marker-box-text h4 b{display: block;width: 100%;font-size: var(--fs-32);font-weight: var(--fw-8);line-height: 160%;}
.marker-box-text h4 span{font-size: var(--fs-18);font-weight: var(--fw-4);line-height: 45px;padding: 0 25px;border-radius: 45px;border: 1px solid #ddd;white-space: nowrap;}
.marker-box-text p{font-size: var(--fs-22);font-weight: var(--fw-4);word-break: keep-all;line-height: 160%;margin-top: 30px;}
.marker-box-text p b{font-weight: var(--fw-7);}

@media screen and (max-width: 1480px){

	.marker-box-text h4 span{line-height: 42px;padding: 0 20px;}

	.marker-box-text{margin-top: 30px;}
	.marker-box-text p{margin-top: 25px;}
}

@media screen and (max-width: 1080px){

	.marker-box{gap: 60px;}
	.marker-box>div{width: calc( ( 100% - 60px ) / 2 );}
	
	.marker-box figure{padding: 40px;}
}

@media screen and (max-width: 860px){

	.marker-box{display: block;}
	.marker-box>div{width: 100%;}
	.marker-box>div + div{margin-top: 60px;}
}

@media screen and (max-width: 720px){
	
	.marker-box>div + div{margin-top: 35px;}
	.marker-box figure{padding: 30px;border-radius: 15px;}
	
	.marker-box-text{margin-top: 25px;}
	.marker-box-text p{font-size: 15px;line-height: 170%;}
	
	.marker-box-text h4{gap: 3px;row-gap: 6px;}
	.marker-box-text h4 span{font-size: 15px;line-height: 40px;padding: 0 15px;}
}

/*-- Ability of Differntiation --*/
.ability-list{gap: 30px;}
.ability-list>div{width: calc( (100% - 60px) / 3 );}
.ability-list>div figure{padding: 40px 0;}
.ability-list>div .marker-box-text{margin-top: 25px;}
.ability-list>div .marker-box-text h4{margin-bottom: 0;}
.ability-list>div .marker-box-text h4 b{line-height: 140%;margin-bottom: 5px;}

.ability-section .sub-title h3{font-size: var(--fs-40);}
.ability-section .img-box{margin-top: 35px;}
.ability-section .img-box figure{padding: 50px;}
.ability-section .img-box img{display: block;max-width: 100%;}

.ability-box{display: flex;flex-wrap: wrap;align-items: flex-start;gap: 65px;}
.ability-box>div{width: calc( (100% - 65px) / 2 );}
.ability-box>div:nth-child(3){width: 100%;}
.ability-box>div:nth-child(4){width: 100%;}
.ability-box>div:nth-child(9){width: 100%;}

@media screen and (max-width: 1480px){

	.ability-box{gap: 30px;row-gap: 60px;}
	.ability-box>div{width: calc( (100% - 30px) / 2 );}
	
	.ability-section .img-box{margin-top: 30px;}
}

@media screen and (max-width: 1080px){

	.ability-section .sub-title h3{font-size: 30px;}
}

@media screen and (max-width: 860px){

	.ability-list>div{width: 100%;}
	
	.ability-box{display: block;}
	.ability-box>div{width: 100%;}
	.ability-box>div + div{margin-top: 60px;}
}

@media screen and (max-width: 720px){

	.ability-list>div figure{padding: 30px;}
	
	.ability-section .sub-title h3{font-size: 24px;}
	
	.ability-section .img-box{margin-top: 25px;}
	.ability-section .img-box figure{padding: 30px;}
	
	.ability-box>div + div{margin-top: 35px;}
}

/*-- research list --*/
.research-list{margin-top: 40px;}
.research-list ul li{background: #e9f8df;padding: 40px 48px;border-radius: 30px;overflow: hidden;}
.research-list ul li + li{margin-top: 20px;}
.research-list ul li span, .research-list ul li i{display: block;font-weight: var(--fw-4);line-height: 160%;padding-left: 20px;}
.research-list ul li span{font-size: var(--fs-20);font-weight: var(--fw-5);position: relative;}
.research-list ul li span::before{content: "";position: absolute;top: 14px;left: 0;width: 6px;height: 6px;border-radius: 6px;background: var(--color-1);}
.research-list ul li i{font-size: var(--fs-18);color: #607750;margin-top: 15px;}

.research-img{padding-left: 20px;margin-top: 15px;}
.research-img figure{display: flex;align-items: flex-start;gap: 15px;}
.research-img figure img{display: block;width: calc( ( 100% - 75px ) / 6 );}
.research-img figure.research-img-auto img{width: auto;}
.research-img figure.research-img-4 img{width: calc( ( 100% - 45px ) / 4 );}
.research-img h5{font-size: var(--fs-18);font-weight: var(--fw-4);background: var(--color-3);display: inline-block;vertical-align: top;padding: 5px 15px;border-radius: 30px;margin-top: 15px;}

.research-img-solo{padding-left: 0;margin-top: 50px;}
.research-img-solo h5{font-size: var(--fs-20);padding: 10px 25px;border-radius: 44px;margin-top: 20px;}

@media screen and (max-width: 1480px){
	
	.research-list{margin-top: 30px;}
	.research-list ul li{padding: 35px 43px;}
	.research-list ul li span, .research-list ul li i{padding-left: 18px;}
	.research-list ul li span::before{top: 11px;}
	.research-list ul li i{margin-top: 13px;}
	
	.research-img{padding-left: 18px;margin-top: 13px;}
	.research-img h5{margin-top: 13px;}
	
	.research-img-solo{padding-left: 0;margin-top: 40px;}
}

@media screen and (max-width: 1080px){
	
	.research-img figure{flex-wrap: wrap;}
	.research-img figure img{width: calc( ( 100% - 45px ) / 4 );}
	.research-img figure.research-img-4 img{width: calc( ( 100% - 45px ) / 4 );}
}

@media screen and (max-width: 720px){
	
	.research-list{margin-top: 25px;}
	.research-list ul li{padding: 21px 23px;border-radius: 15px;}
	.research-list ul li + li{margin-top: 15px;}
	.research-list ul li span, .research-list ul li i{padding-left: 15px;}
	.research-list ul li span{margin-bottom: 3px;}
	.research-list ul li span::before{top: 10px;width: 5px;height: 5px;border-radius: 5px;}
	.research-list ul li i{font-size: 14px;}
	
	.research-img{padding-left: 15px;}
	.research-img h5{font-size: 14px;line-height: 160%;border-radius: 5px;}
	.research-img figure{gap: 10px;}
	.research-img figure img{width: calc( ( 100% - 10px ) / 2 );}
	.research-img figure.research-img-auto img{width: 100%;}
	.research-img figure.research-img-4 img{width: 100%;}
	
	.research-img-solo{padding-left: 0;margin-top: 33px;}
	.research-img-solo h5{font-size: 14px;padding: 5px 15px;border-radius: 5px;margin-top: 13px;}
}

/*-- Energy Water -> wave --*/
#wave-container{position: absolute;bottom: -30px;left: 0;width: 100%;z-index: 1;}
#wave-container svg{display: block;}

@media screen and (max-width: 1080px){
	
	#wave-container{bottom: -60px;}
}

@media screen and (max-width: 720px){
	
	#wave-container{bottom: -70px;}
}