@charset "utf-8";

.skip_snb_menu {display:none;}

#fs_container_wrap {}
	@media only screen and (max-width:1199px){
		#fs_container_wrap {}
	}


/* 메인 */
.fs_main_visual {position:relative;z-index:0;background: #edf2f7;}
.fs_main_visual:before {content: "";position: absolute;left:-33px;top:41px;z-index:-1;width: 100px;height: 100px;background: #3de3c1;border-radius: 100%;}
.fs_main_visual:after {content: "";position: absolute;left:-33px;top:41px;z-index:-1;width: 100px;height: 100px;background: #2ad3b2;border-radius: 100%;margin-top:51px;}
.fs_main_visual .vis_slide_box {overflow:hidden;display: flex;justify-content: center;}
.fs_main_visual .vis_slide_box .main_visual_text {display:flex;flex-direction:column;justify-content: center;padding-left:10rem;width:50%;background: url("./../images/main/vis_bg2.jpg") no-repeat right bottom;color:#333;letter-spacing: -0.4px;}
.fs_main_visual .vis_slide_box .main_visual_text .sta {font-size:1.8rem;}
.fs_main_visual .vis_slide_box .main_visual_text .stb {padding-top:20px;font-family: "Roboto Serif";font-weight:500;font-size:5.2rem;color:#000;}
.fs_main_visual .vis_slide_box .main_visual_text .stb:after {content:"";display: block;margin:30px 0;width: 35px;height: 2px;background: #000;}
.fs_main_visual .vis_slide_box .main_visual_text .stb em {font-family: "Roboto Serif";font-weight:500;color:#2ad3b2;}
.fs_main_visual .vis_slide_box .main_visual_text .stc {line-height:1.3;font-size:1.9rem;}
.fs_main_visual .vis_slide_box .main_visual_text .stc br {}
.fs_main_visual .vis_slide_box .img_box {width:50%;}
.fs_main_visual .vis_slide_box .img_box img {width: 100%;}
	@media only screen and (max-width:1599px){
		.fs_main_visual .vis_slide_box .main_visual_text {padding-left:6rem;}
	}
	@media only screen and (max-width:1399px){
		.fs_main_visual:before {left:-63px;}
		.fs_main_visual:after {left:-63px;}
		.fs_main_visual .vis_slide_box .main_visual_text {padding-left:4rem;}
		.fs_main_visual .vis_slide_box .main_visual_text .stb:after {margin:20px 0;}
		.fs_main_visual .vis_slide_box .img_box img {width: 135%;}
	}
	@media only screen and (max-width:1023px){
		.fs_main_visual:before {display: none;}
		.fs_main_visual:after {display: none;}
		.fs_main_visual .vis_slide_box {flex-direction:column;}
		.fs_main_visual .vis_slide_box .main_visual_text {width: 100%;padding:7rem 4rem;}
		.fs_main_visual .vis_slide_box .main_visual_text .stc br {display: none;}
		.fs_main_visual .vis_slide_box .img_box {width:100%;}
		.fs_main_visual .vis_slide_box .img_box img {width: 100%;}
	}
	@media only screen and (max-width:767px){
		.fs_main_visual .vis_slide_box {flex-direction:column;}
		.fs_main_visual .vis_slide_box .main_visual_text {width: 100%;padding:4rem 2rem;}
		.fs_main_visual .vis_slide_box .main_visual_text .stc br {display: none;}
		.fs_main_visual .vis_slide_box .main_visual_text .stb {padding-top:10px;}
		.fs_main_visual .vis_slide_box .main_visual_text .stb:after {margin:15px 0;}
	}

/* 링크버튼 */
.link_btn {display: flex;gap:100px;justify-content: center;padding:80px 0;}
.link_btn li {}
.link_btn li a {display: block;text-align: center;}
.link_btn li a .icon {display: grid;place-items:center;width: 140px;height: 140px;margin:0 auto;border-radius: 10px;box-shadow: 10px 10px 20px rgba(9,26,44,0.05);transition: 0.3s;}
.link_btn li a .icon img {}
.link_btn li a .text {display: block;color:#000;margin-top:30px;}
.link_btn li a .text br {}
.link_btn li a:is(:hover,:focus,:active) .icon {transform: translate(-10px, -10px);box-shadow: 10px 10px 20px rgba(9,26,44,0.1);}
	@media only screen and (max-width:1199px){
		.link_btn {gap:50px;padding:40px 0;}
		.link_btn li a .icon {width: 100px;height: 100px;}
		.link_btn li a .icon img {width: 50%;}
	}
	@media only screen and (max-width:1023px){
		.link_btn {gap:30px;}
		.link_btn li a:is(:hover,:focus,:active) .icon {transform: none;box-shadow: 10px 10px 20px rgba(9,26,44,0.05);}
	}
	@media only screen and (max-width:767px){
		.link_btn {flex-wrap:wrap;justify-content:flex-start;gap:10px;padding:30px 0;}
		.link_btn li {width: calc((100% - 10px) / 2);}
		.link_btn li a {display: flex;align-items: center;box-shadow: 10px 10px 20px rgba(9,26,44,0.05);border-radius: 10px;}
		.link_btn li a .icon {flex-shrink:0;width: 80px;height: 80px;box-shadow: none;margin:0;}
		.link_btn li a .icon img {width: 50%;}
		.link_btn li a .text {margin-top:0;text-align: left;}
		.link_btn li a .text br {display: none;}
	}
	@media only screen and (max-width:499px){
		.link_btn li {width: 100%;}
	}


/* 하단내용 */
.box_wrap {display: grid;grid-template-columns: 35% 27% 1fr;grid-template-rows: repeat(2, 1fr);gap:20px;margin:0 160px 100px 160px;}
	/* 공통 */
	.box_wrap h2 {font-size:2.4rem;font-family: "Roboto Serif";font-weight:600;color: #000;}
	/* Promotional Video */
	.box1 {grid-area: 1 / 1 / 3 / 2;max-width:501px;background: #edf2f7;border-radius: 10px;padding:50px 30px;}
	.box1 h2 {}
	.box1 .video {margin:25px 0;}
	.box1 .video iframe {width:100%;aspect-ratio: 2/1;}
	.box1 strong {font-size:2.2rem;color: #222;}
	.box1 strong:after {content:"";display: block;width: 25px;height: 1px;margin:20px 0;background: #000;}
	.box1 p {line-height:1.5;color:#767676;}

	.box2 {grid-area: 1 / 2 / 2 / 4;overflow:hidden;position:relative;z-index:0;padding:50px 30px;background:linear-gradient(to bottom, rgba(48,119,200,0.8), rgba(48,119,200,0.8)), url("./../images/main/img01.png") no-repeat left bottom / cover;color:#fff;font-weight: 300;border-radius: 10px;}
	.box2:after {content:"";position:absolute;left:-100px;top:-100px;z-index:-1;width: 242px;height: 242px;border-radius: 100%;background: rgba(48,191,200,0.2);}
	.box2 h2 {color: #fff;}
	.box2 p {padding-left:8px;margin-top:20px;line-height:1.4;font-size:1.8rem;}
	.box2 a {display: inline-block;position: absolute;right:40px;bottom:40px;}
	.box2 a:after {content:"";display: block;width: 0;height: 2px;margin-top:5px;background: #fff;transition: 0.3s;}
	.box2 a:is(:hover,:focus,:active):after {width: 100%;}
	.box2 a img {margin:2px 0 0 10px;}

	.box3,
	.box4 {display: flex;flex-direction: column;}
	.box3 h2,
	.box4 h2 {margin:25px 0 0 10px;}
	.box3 .box,
	.box4 .box {flex-grow:1;margin-top:15px;padding:30px 20px;box-shadow: 0 0 20px rgba(9,26,44,0.05);border-radius: 10px;}
	.box3 ul li,
	.box4 ul li {margin-bottom:15px;}
	.box3 ul li a,
	.box4 ul li a {display:inline-block;position:relative;padding-right:10px;background-image:url("./../images/main/arr.png");background-repeat:no-repeat;background-position:right -50px center;color: #767676;text-indent:-8px;padding-left:8px;letter-spacing: -0.4px;}
	.box3 ul li a:after,
	.box4 ul li a:after {content: "";position: absolute;left:0;bottom:0;width: 0;height: 1px;background:#000;transition: 0.3s;}
	.box3 ul li a:is(:hover,:focus,:active):after,
	.box4 ul li a:is(:hover,:focus,:active):after {width: 100%;}
	.box3 ul li a:is(:hover,:focus,:active),
	.box4 ul li a:is(:hover,:focus,:active) {padding-right:20px;background-position:right center;color: #222;letter-spacing: -0.6px;}

	.box3 {grid-area: 2 / 2 / 3 / 3;}
	.box3 ul {height: 100%;}
	.box3 ul li:last-child {margin-bottom:0;}

	.box4 {grid-area: 2 / 3 / 3 / 4;}
	.box4 ul {height:140px;overflow-y:auto;}
	.box4 ul::-webkit-scrollbar {width: 3px;}
	.box4 ul::-webkit-scrollbar-track {background: #d3d3d3;}
	.box4 ul::-webkit-scrollbar-thumb {background: #222;}
	.box4 ul li:last-child {margin-bottom:0;}
		@media only screen and (max-width:1599px){
			.box_wrap {margin:0 80px 50px 80px;}
		}
		@media only screen and (max-width:1499px){
			.box_wrap {margin:0 0 50px 0;}
		}
		@media only screen and (max-width:1199px){
			.box4 ul {height:175px;}
		}
		@media only screen and (max-width:1023px){
			.box_wrap {grid-template-columns: 50% 1fr;}
			.box1 {grid-area: 1 / 1 / 2 / 2;}
			.box2 {grid-area: 1 / 2 / 2 / 3;}
			.box3 {grid-area: 2 / 1 / 3 / 2;}
			.box4 {grid-area: 2 / 2 / 3 / 3;}
			.box4 ul {height:100%;overflow-y: visible;}
		}
		@media only screen and (max-width:767px){
			.box_wrap {display: flex;flex-direction: column;}
			.box1 {max-width: none;padding:30px 20px;}
			.box1 .video {margin:15px 0;}
			.box1 strong:after {margin:10px 0;}
			.box1 p br {display: none;}
			.box2 {padding:30px 15px;}
			.box2 a {right:20px;bottom:20px;}

			.box3 h2,
			.box4 h2 {margin:15px 0 0 10px;}
			.box3 .box,
			.box4 .box {margin-top:10px;padding:20px 20px;}
		}