@charset "utf-8";
@import url("common.css");

/*Layer*/
body{width:100%}
#wrap{width:100%}
#header{}
#container{width:100%}
#contents{}
#footer{width:100%;}

/*header*/
.pcbr{display:none;}
.ptbr{display:block;}
.tbbr{display:block;}
.mbbr{display:none;}
.dn{display:none;}


.t_view{display: block;}
.tm_view{display: block;}
.m_view{display: none;}


.innerwrap{
	width: 92%;
	max-width: 1480px;
	margin: 0 auto;
}

.page_top{
	position: relative;
	width: 100%;
	height: 600px;
	overflow: hidden;
}
.page_top .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.page_top.pn1 .bg{background: url(/images/page/sub_visual1.jpg) no-repeat center / cover;}
.page_top.pn2 .bg{background: url(/images/page/sub_visual2.jpg) no-repeat center / cover;}
.page_top.pn3 .bg{background: url(/images/page/sub_visual3.jpg) no-repeat center / cover;}
.page_top.pn4 .bg{background: url(/images/page/sub_visual4.jpg) no-repeat center / cover;}
.page_top.pn5 .bg{background: url(/images/page/sub_visual5.jpg) no-repeat center / cover;}

.page_top .txtwrap{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 92%;
	max-width: 1480px;
}
.page_top .txtwrap h2{
	font-size: var(--font-size-30);
	color: #fff;
	font-weight: 500;
}
.page_top .txtwrap p{
	font-size: var(--font-size-50);
	color: #fff;
	font-weight: 500;
	line-height: 1.3em;
	margin-top: 20px;
}

.sub_tab{
	width: 92%;
	max-width: 1480px;
	padding: 200px 0 160px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}
.sub_tab .page_tit{
	font-size: var(--font-size-50);
	font-weight: 500;
	color: #000;
}
.sub_tab .pageLocation{
	display: flex;
}
.sub_tab .pageLocation li{
	font-family: "Pretendard";
	display: inline-block;
	position: relative;
	padding-left: 28px;
	font-size: 17px;
	color: #666;
}
.sub_tab .pageLocation li:after{
	content: "";
	position: absolute;
	left: 9px;
	top: 7px;
	width: 6px;
	height: 6px;
	border-bottom: 1.5px solid #6f6e6b;
	border-right: 1.5px solid #6f6e6b;
	transform: rotate(-45deg);
}
.sub_tab .pageLocation li:first-child{
	padding-left: 0;
}
.sub_tab .pageLocation li:first-child:after{
	display: none;
}
.sub_tab .pageLocation li:first-child a{
	font-family: "Pretendard";
	display: inline-block;
	font-size: 17px;
	color: #666;
}
.sub_tab .pageLocation li:first-child a img{
	margin-right: 7px;
	margin-bottom: 3px;
}
.sub_tab.pn3 .pageLocation li:last-child{
	display: none;
}



.sec_tit{
	font-size: var(--font-size-34);
	font-weight: 500;
	color: #000;
}
.sec_tit.wh{
	color: #fff;
}


.m11{}
.m11 .section1{
	padding: 0 0 240px;
}
.m11 .section1 .slg{
	text-align: center;
}
.m11 .section1 .slg .txt{
	font-size: var(--font-size-50);
	font-weight: 500;
}
.m11 .section1 .conwrap{
	margin: 160px 0;
	display: flex;
	justify-content: space-between;
}
.m11 .section1 .conwrap .txtwrap{
	width: 50%;
	padding-right: 2%;
	padding-top: 80px;
}
.m11 .section1 .conwrap .txtwrap .tit{
	font-size: var(--font-size-30);
	font-weight: 500;
}
.m11 .section1 .conwrap .txtwrap p{
	font-family: "Pretendard";
	font-size: var(--font-size-22);
	line-height: 1.5em;
	color: #666;
	margin-top: 40px;
}
.m11 .section1 .conwrap .imgwrap{
	width: 50%;
}
.m11 .section1 .con_tit{
	font-size: var(--font-size-30);
	font-weight: 500;
	text-align: center;
}
.m11 .section1 .ccwrap{
	margin-top: 30px;
	display: flex;
	justify-content: center;
}
.m11 .section1 .ccwrap2 {
display: flex;
width: 66.6%;
}
.m11 .section1 .ccwrap .cc{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	aspect-ratio: 1;
	border-radius: 50%;
}
.m11 .section1 .ccwrap .cc.cc1{background: #02AABF;width: 33.3%;}
.m11 .section1 .ccwrap .cc.cc2{background: #2078BF;width: 50%;}
.m11 .section1 .ccwrap .cc.cc3{background: #6A61C3;width: 50%;}
.m11 .section1 .ccwrap .cc .txt{
	margin-top: 20px;
	font-size: var(--font-size-28);
	font-weight: 500;
	color: #fff;
}
.m11 .section1 .arr{
	margin: 30px 0;
	text-align: center;
}
.m11 .section1 .bot{
	position: relative;
	overflow: hidden;
	width: 92%;
	max-width: 1480px;
	height: 440px;
	margin: 0 auto;
	display: flex;
	padding:0 10vw;
	justify-content: center;
	align-items: center;
	text-align :center;
}
.m11 .section1 .bot .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(/images/page/m11_bot_bg.jpg) no-repeat center / cover;
}
.m11 .section1 .bot .txt{
	position: relative;
	font-size: var(--font-size-30);
	font-weight: 500;
	color: #fff;
}

.m12{}
.m12 .section1{
	padding: 0 0 130px;
}
.m12 .section1 .slgwrap{
	text-align: center;
}
.m12 .section1 .slgwrap .txt1{
	font-size: var(--font-size-50);
	font-weight: 500;
}
.m12 .section1 .slgwrap .txt2{
	font-family: "Pretendard";
	font-size: var(--font-size-36);
	color: #666;
	text-transform: uppercase;
	margin-top: 20px;
}
.m12 .section1 .conwrap{
	margin-top: 180px;
	display: flex;
}
.m12 .section1 .conwrap .txtwrap{
	width: 30%;
}
.m12 .section1 .conwrap .swiper-container .swiper-pagination {
display: none;
}
.m12 .section1 .conwrap .txtwrap .txt1{
	font-size:var(--font-size-30);
	font-weight: 500;
	line-height: 1.5em;
}
.m12 .section1 .conwrap .txtwrap .txt2{
	font-family: "Pretendard";
	font-size:var(--font-size-24);
	line-height: 1.5em;
	margin-top: 10px;
}
.m12 .section1 .conwrap .swiper-container{
	width: 70%;
}
.m12 .section1 .conwrap .swiper-container .swiper-slide{
	height: 648px;
	padding: 28px;
}
.m12 .section1 .conwrap .swiper-container .swiper-slide.v1{background: url(/images/page/m12_sec1_img1.jpg) no-repeat center / cover;}
.m12 .section1 .conwrap .swiper-container .swiper-slide.v2{background: url(/images/page/m12_sec1_img2.jpg) no-repeat center / cover;}
.m12 .section1 .conwrap .swiper-container .swiper-slide.v3{background: url(/images/page/m12_sec1_img3.jpg) no-repeat center / cover;}
.m12 .section1 .conwrap .swiper-container .swiper-slide .txt{
	font-family: "Pretendard";
	font-size:var(--font-size-24);
	line-height: 1.5em;
	color: #fff;
}

.m12 .section2{
	position: relative;
	padding: 410px 0 100px;
	background: #353A3D;
	margin-top: -400px;
}
.m12 .section2 .bg{
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	width: 100%;
	text-align: center;
}
.m12 .section2 .innerwrap{
	position: relative;
	text-align: center;
}
.m12 .section2 .innerwrap .txt1{
	font-family: "Pretendard";
	font-size: var(--font-size-36);
	line-height: 1.5em;
	color: #DADADA;
}
.m12 .section2 .innerwrap .txt2{
	font-size: var(--font-size-50);
	font-weight: 500;
	color: #fff;
	margin-top: 30px;
}

.m12 .section3{
	width: 100%;
	height: 100vh;
	display: flex;
	align-items: center;
}
.m12 .section3 .txtwrap{
	width: 50%;
	padding: 0 11%;
}
.m12 .section3 .txtwrap .txt1{
	font-size: var(--font-size-36);
	font-weight: 500;
}
.m12 .section3 .txtwrap .txt2{

}
.m12 .section3 .txtwrap .txt2 p{
	font-family: "Pretendard";
	font-size: var(--font-size-24);
	margin-top: 20px;
}
.m12 .section3 .imgwrap{
	width: 50%;
	height: 100%;
}
.m12 .section3 .imgwrap img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}


.m13{}
.m13 .section1{}
.m13 .section1 .slgwrap{
	
}
.m13 .section1 .slgwrap .txt1{
	font-size: var(--font-size-50);
	font-weight: 500;
}
.m13 .section1 .slgwrap .txt2{
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	color: #666;
	margin-top: 30px;
}
.m13 .section1 .conwrap{
	margin-top: 100px;
}
.m13 .section1 .conwrap .con{
	width: 100%;
	display: flex;
	flex-direction: column;
}
.m13 .section1 .conwrap .con .imgwrap{
	width: 100%;
	height: 100%;
}
.m13 .section1 .conwrap .con .imgwrap img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.m13 .section1 .conwrap .con .txtwrap{
	padding: 100px 8% 0 4%;
	width: 100%;
	min-height: 100vh;
}
.m13 .section1 .conwrap .con .txtwrap .step{
	display: flex;
	align-items: flex-end;
	gap: 10px;
	margin-bottom: 60px;
}
.m13 .section1 .conwrap .con .txtwrap .period{
	margin-bottom: 30px;
	font-size: var(--font-size-76);
	font-weight:700;
}
.m13 .section1 .conwrap .con .txtwrap .period span{
	font-size: var(--font-size-30);
	font-weight:500;
}
.m13 .section1 .conwrap .con .txtwrap .yearwrap{
	width: 100%;
	border-top: 2px solid #000;
}
.m13 .section1 .conwrap .con .txtwrap .yearwrap .yearcon{
	display: flex;
	padding: 40px 0;
	border-bottom: 1px solid #ccc;
}
.m13 .section1 .conwrap .con .txtwrap .yearwrap .yearcon .year{
	width: 160px;
	font-size: var(--font-size-30);
	font-weight: 500;
}
.m13 .section1 .conwrap .con .txtwrap .yearwrap .yearcon .list{
	width: calc(100% - 160px);
}
.m13 .section1 .conwrap .con .txtwrap .yearwrap .yearcon .list dl{
	display: flex;
}
.m13 .section1 .conwrap .con .txtwrap .yearwrap .yearcon .list dl dt{
	font-size: var(--font-size-30);
	font-weight: 500;
	width: 140px;
}
.m13 .section1 .conwrap .con .txtwrap .yearwrap .yearcon .list dl dd{
	font-family: "Pretendard";
	font-size: var(--font-size-24);
	width: calc(100% - 140px);
	color: #666;
}


.m14{}
.m14 .sec_tit{
	font-size: var(--font-size-34);
	font-weight: 500;
}
.m14 .section1{
	padding: 60px 0 130px;
	background: #F8F8F8;
}
.m14 .section1 .img{
	margin-top: 150px;
}
.m14 .section2{
	padding: 100px 0 250px;
}
.m14 .section2 ul{
	margin-top: 100px;
	padding: 55px 0;
	border-top: 2px solid #000;
	border-bottom: 1px solid #ccc;
	display: flex;
	align-items: center;
}
.m14 .section2 li{
	width: 100%;
	text-align: center;
	border-right: 1px solid #ccc;
}
.m14 .section2 li:last-child{
	border: none;
}
.m14 .section2 li .name{
	margin-top: 12px;
	font-size: var(--font-size-28);
	font-weight: 500;
}


.m15{}
.m15 .section1{
padding-bottom: 250px;
}
.m15 .map-box{
height: 515px;
}
.m15 .map-box .root_daum_roughmap,
.m15 .map-box .wrap_map{
width: 100%;
height: 100%;
}
.m15 .map-box .root_daum_roughmap .wrap_controllers,
.m15 .map-box .root_daum_roughmap .cont{
display: none;
}
.m15 .info-box{
margin-top: 40px;
display: flex;
justify-content: space-between;
align-items: stretch;
}
.m15 .info-box .info-item{
flex:1;
position: relative;
padding: 20px;
}
.m15 .info-box .info-item:not(:first-child)::before{
content:'';
position: absolute;
width: 1px;
height: 100%;
top:0;
left: 0;
background-color: #ccc;
}
.m15 .info-box .info-title{
font-size: var(--font-size-30);
color: #000;
margin: auto 0;
}
.m15 .info-box .item1 b,
.m15 .info-box .item2 b,
.m15 .info-box .item3 b{
margin-top: 8px;
font-size: var(--font-size-18);
font-weight: 600;	
display: inline-block;
}
.m15 .info-box .item1 p,
.m15 .info-box .item2 p,
.m15 .info-box .item3 p{
margin-top: 18px;
font-size: var(--font-size-18);
color: #666;
}






.m21{}
.m21 .section1{
	padding: 0 0 130px;
}
.m20 .section1 .slgwrap{}
.m20 .section1 .slgwrap .tit{
	font-size: var(--font-size-50);
	font-weight: 500;
}
.m20 .section1 .slgwrap p{
	font-family: "Pretendard";
	font-size: var(--font-size-22);
	line-height: 1.5em;
	margin-top: 40px;
	color: #666;
}

.m21 .section2{
	padding: 130px 0 220px;
	background: #F8F8F8;
}
.m20 .section2 .ccwrap{
	position: relative;
	width:740px;
	display: flex;
	justify-content: space-between;
	text-align: center;
	margin: 140px auto 0;
}
.m20 .section2 .ccwrap:after{
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	height: 1px;
	background: #ccc;
}
.m20 .section2 .ccwrap li{
	position: relative;
	z-index: 2;
}
.m20 .section2 .ccwrap li .step{
	position: absolute;
	left: 50%;
	bottom: calc(100% + 20px);
	transform: translateX(-50%);
	width: 110px;
	height: 40px;
	line-height: 40px;
	border-radius: 40px;
	background: #065290;
	color: #fff;
	font-family: "Pretendard";
	font-size: 17px;
	font-weight: 500;
}
.m20 .section2 .ccwrap li .cc{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 120px;
	aspect-ratio: 1;
	border: 1px solid #ccc;
	border-radius: 50%;
	background: #fff;
}
.m20 .section2 .ccwrap li .cc:after{
	content: "";
	position: absolute;
	left: 108%;
	top: 50%;
	transform: translateY(-50%) rotate(-45deg);
	width: 9px;
	height: 9px;
	border-right: 1.5px solid #666;
	border-bottom: 1.5px solid #666;
}
.m20 .section2 .ccwrap li:last-child .cc:after{display:  none;}
.m20 .section2 .ccwrap li .tit{
	position: absolute;
	left: 50%;
	top: calc(100% + 15px);
	transform: translateX(-50%);
	font-family: "Pretendard";
	font-size: var(--font-size-20);
	white-space: nowrap;
}

.m21 .section3{
	padding: 0 0 130px;
}
.m20 .fieldwrap{
	position: relative;
	width: 100%;
	height: 360px;
	overflow: hidden;
	display: flex;
	align-items: center;
}
.m20 .fieldwrap .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.m20 .fieldwrap .bg img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.m20 .fieldwrap .txtwrap{
	position: relative;
	padding: 0 100px;
	width: 100%;
	display: flex;
	align-items: center;
}
.m20 .fieldwrap .txtwrap .tit{
	width: 50%;
	font-size: var(--font-size-34);
	font-weight: 500;
	color: #fff;
}
.m20 .fieldwrap .txtwrap p{
	font-family: "Pretendard";
	width: 50%;
	font-size: var(--font-size-22);
	color: #fff;
	padding: 35px 0 35px 60px;
	border-left: 1px solid rgba(255,255,255,0.5);
}


.m22{}
.m22 .section1{padding: 0 0 220px;}
.m22 .fieldwrap{
	margin-top: 130px;
}

.m23 .section1{padding: 0 0 130px;}
.m23{}
.m23 .section2{padding: 130px 0 220px;background: #f8f8f8;}
.m23 .section2 .ccwrap{
	margin: 140px auto 0;
}
.m23 .section2 .ccwrap li .cc:after{
	left: 126%;
}
.m23 .section3{
	position: relative;
	overflow: hidden;
	padding: 130px 0 170px;
}
.m23 .section3 .bg{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(/images/page/m23_sec3_bg.jpg) no-repeat center / cover;
}
.m23 .section3 .innerwrap{
	position: relative;
}
.m23 .section3 .boxwrap{
	margin-top: 80px;
	display: flex;
	justify-content: space-between;
}
.m23 .section3 .boxwrap .box{
	width: 32.5%;
	padding: 60px 40px;
	background: rgba(248,248,248,0.8);
}
.m23 .section3 .boxwrap .box .icon{}
.m23 .section3 .boxwrap .box .tit{
	font-size: var(--font-size-28);
	font-weight: 500;
	margin: 20px 0 12px;
}
.m23 .section3 .boxwrap .box p{
	font-family: "Pretendard";
	font-size: var(--font-size-20);
	line-height: 1.5em;
	color: #666;
}


.m31{padding: 0 0 250px;}
.m31 .tabwrap{
	display: flex;
	gap: 40px;
}
.m31 .tabwrap li a{
	font-size: var(--font-size-18);
	font-weight: 500;
	color: #666;
}
.m31 .tabwrap li.on a{
	color: #065290;
}
.m31 .mainSwiper, .m31_view .mainSwiper{
	width: 92%;
	max-width: calc(1480px + 180px);
	padding: 0 90px;
	margin: 40px auto 100px;
}
.m31_view .mainSwiper{
	margin: 0 auto 100px;
}
.m31 .mainSwiper .swiper-slide img, .m31_view .mainSwiper .swiper-slide img{
	width: 100%;
	aspect-ratio: 1480 / 680;
}
.m31 .mainSwiper .vprev, .m31_view .mainSwiper .vprev{
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 58px;
	background: url(/images/page/m41_prev_btn.png) no-repeat center / contain;
	cursor: pointer;
}
.m31 .mainSwiper .vnext, .m31_view .mainSwiper .vnext{
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 58px;
	background: url(/images/page/m41_next_btn.png) no-repeat center / contain;
	cursor: pointer;
}
.m31 .mainSwiper .vpaging, .m31_view .mainSwiper .vpaging{
	position: absolute;
	left: 50%;
	bottom: 40px;
	transform: translateX(-50%);
	width: unset;
	z-index: 10;
}
.m31 .mainSwiper .vpaging .swiper-pagination-bullet, .m31_view .mainSwiper .vpaging .swiper-pagination-bullet{
	width: 40px;
	height: 4px;
	border-radius: 0;
	opacity: 1;
	background: unset;
	border: 1px solid #fff;
}
.m31 .mainSwiper .vpaging .swiper-pagination-bullet-active, .m31_view .mainSwiper .vpaging .swiper-pagination-bullet-active{
	background: #fff;
}

.m31 .txtSwiper{
	width: 100%;
}
.m31 .txtSwiper .swiper-slide, .m31_view .txtwrap{
	width: 100%;
	display: flex;
}
.m31 .txtSwiper .swiper-slide .titwrap, .m31_view .txtwrap .titwrap{
	width: 50%;
	padding: 20px 2% 0 0;
}
.m31 .txtSwiper .swiper-slide .titwrap .cate, .m31_view .txtwrap .titwrap .cate{
	font-size: var(--font-size-24);
	font-weight: 500;
	color: #065290;
}
.m31 .txtSwiper .swiper-slide .titwrap .tit, .m31_view .txtwrap .titwrap .tit{
	font-size: var(--font-size-40);
	font-weight: 500;
	margin: 10px 0 20px;
}
.m31 .txtSwiper .swiper-slide .titwrap .exp, .m31_view .txtwrap .titwrap .exp{
	font-family: "Pretendard";
	font-size: var(--font-size-20);
	padding-left: 20px;
	border-left: 1px solid #ddd;
}
.m31 .txtSwiper .swiper-slide .infowrap, .m31_view .txtwrap .infowrap{
	width: 50%;
}
.m31 .txtSwiper .swiper-slide .infowrap dl, .m31_view .txtwrap .infowrap dl{
	display: flex;
	padding: 16px;
	border-top: 1px solid #bbb;
}
.m31 .txtSwiper .swiper-slide .infowrap dl:last-child, .m31_view .txtwrap .infowrap dl:last-child{
	border-bottom: 1px solid #bbb;
}
.m31 .txtSwiper .swiper-slide .infowrap dl dt, .m31_view .txtwrap .infowrap dl dt{
	font-family: "Pretendard";
	position: relative;
	width: 130px;
	font-size: var(--font-size-18);
	font-weight: 500;
}
.m31 .txtSwiper .swiper-slide .infowrap dl dt:after, .m31_view .txtwrap .infowrap dl dt:after{
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 16px;
	background: #bbb;
}
.m31 .txtSwiper .swiper-slide .infowrap dl dt img, .m31_view .txtwrap .infowrap dl dt img{
	margin-right: 10px;
	vertical-align: center;
}
.m31 .txtSwiper .swiper-slide .infowrap dl dd, .m31_view .txtwrap .infowrap dl dd{
	font-family: "Pretendard";
	width: calc(100% - 130px);
	padding-left: 38px;
	font-size: var(--font-size-18);
	color: #666;
}

.m31 .list{
	display: flex;
	flex-wrap: wrap;
	column-gap: 38px;
	row-gap: 80px;
	margin-top: 100px;
}
.m31 .list li{
	width: calc((100% - 38px) / 2);
}
.m31 .list li a{
	display: block;
	width: 100%;
}
.m31 .list li a .thumb{
	position: relative;
	width: 100%;
	aspect-ratio: 468 / 300;
}
.m31 .list li a .thumb img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.m31 .list li a .locate{
	font-family: "Pretendard";
	font-size: var(--font-size-17);
	color: #666;
	margin: 15px 0;
}
.m31 .list li a .con{
	font-family: "Pretendard";
	font-size: var(--font-size-24);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


.m31_view{padding: 0 0 250px;}
.m31_view .editwrap{
	margin-top: 100px;
	padding: 100px 0;
	border-top: 1px solid #bbb;
	border-bottom: 1px solid #bbb;
}
.m31_view .btnwrap{
	margin-top: 100px;
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
}
.m31_view .btnwrap .btn.prev{
	justify-self: start;
}
.m31_view .btnwrap .list{
	justify-self: center; /* 가운데 정렬 */
	grid-column: 2; /* 항상 2번째 칸에 위치 */
	display: block;
	width: 200px;
	height: 64px;
	line-height: 64px;
	text-align: center;
	font-family: "Pretendrad";
	font-size: var(--font-size-18);
	color: #fff;
	background: #065290;
}
.m31_view .btnwrap .btn.next{
	justify-self: end; /* 오른쪽 정렬 */
	grid-column: 3; /* 항상 3번째 칸에 위치 */
	text-align: right;
}
.m31_view .btnwrap .btn{
	display: flex;
	align-items: center;
	gap: 30px;
}
.m31_view .btnwrap .btn .txt{}
.m31_view .btnwrap .btn .txt span{
	font-family: "Pretendrad";
	font-size: var(--font-size-18);
	
}
.m31_view .btnwrap .btn .txt .tit{
	font-family: "Pretendrad";
	font-size: var(--font-size-18);
	color: #666;
	margin-top: 10px;
}




.bbs{margin-top: -100px; padding: 0 0 250px;}

.bbs .bbs_tab{
	display: flex;
	column-gap: 50px;
}
.bbs .bbs_tab li{}
.bbs .bbs_tab li a{
	font-family:"Pretendard";
	font-size: 26px;
	color: rgba(102, 102, 102, 0.60);
}
.bbs .bbs_tab li.on a{
	color: #000;
	font-weight: 500;
	border-bottom: 2px solid #065290;
}

.bbs .searchTop{
	margin-top: 120px;
	margin-bottom: 40px;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.bbs .searchTop .total{
	font-family:"Pretendard";
	font-size: 18px;
	color: #666;
}
.bbs .searchTop .total span{
	font-weight: 500;
	color: #065290;
}
.bbs .searchTop .searchwrap{
	width:400px;
	height:65px;
	display: flex;
	align-items:center;
	padding: 0 30px;
	border: 1px solid #9A9891;
}
.bbs .searchTop .searchwrap .search_bar{
font-family:"Pretendard";
width:calc(100% - 25px);height:100%;
border:none;outline:none;
font-size:18px;color:#000;
}
.bbs .searchTop .searchwrap .search_bar::placeholder{font:inherit;color:#666;}
.bbs .searchTop .searchwrap button{
	width:25px;
	border: none;
	background: none;
}

.bbs .list{
	display: flex;
	flex-wrap: wrap;
	column-gap: 38px;
	row-gap: 80px;
}
.bbs .list li{
	width: calc((100% - 38px) / 2);
}
.bbs .list li a{
	display: block;
	width: 100%;
}
.bbs .list li a .thumb{
	position: relative;
	width: 100%;
	aspect-ratio: 468 / 300;
}
.bbs .list li a .thumb img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.bbs .list li a .info{
	margin: 20px 0 10px;
	display: flex;
}
.bbs .list li a .info .cate{
	position: relative;
	padding-right: 21px;
	font-family: "Pretendard";
	font-size: 17px;
	font-weight: 600;
	color: #065290;
}
.bbs .list li a .info .cate:after{
	content: "";
	position: absolute;
	right: 10px;
	top: 5px;
	width: 1px;
	height: 14px;
	background: #C4C4C4;
}
.bbs .list li a .info .date{
	font-family: "Pretendard";
	font-size: 16px;
	color: #666;
}
.bbs .list li a .tit{
	font-family: "Pretendard";
	font-size: var(--font-size-24);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.bbs .list li a .con{
	margin-top: 10px;
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	color: #666;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	line-height: 1.7em;
	height: 3.4em;
}

.bbs .slgwrap{
	margin-top: 130px;
}
.bbs .slgwrap .slg{
	font-size: var(--font-size-50);
	font-weight: 500;
	line-height: 1.4em;
}
.bbs .slgwrap p{
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: #666;
	margin-top: 30px;
}

.bbs .swiperarea{
	margin-top: 130px;
}
.bbs .swiperarea .main_swiper{
	width: 92%;
	max-width: 1480px;
	margin: 0 auto;
}
.bbs .swiperarea .main_swiper .swiper-slide{
	width: 100%;
	aspect-ratio: 1480 / 680;
}
.bbs .swiperarea .main_swiper .swiper-slide > img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.bbs .swiperarea .main_swiper .swiper-slide video{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.bbs .swiperarea .main_swiper .swiper-slide.video{}
.bbs .swiperarea .main_swiper .swiper-slide.video .play_icon{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}
.bbs .swiperarea .main_swiper .swiper-slide.video .play_icon .circle {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	width: 140px;
	height: 140px;
	border-radius: 50%;
	border: 1px solid #fff;
}
.bbs .swiperarea .main_swiper .swiper-slide.video .play_icon .circle1{animation: wave 2s ease-in infinite 0s;}
.bbs .swiperarea .main_swiper .swiper-slide.video .play_icon .circle2{animation: wave 2s ease-in infinite 0.3s;}
.bbs .swiperarea .main_swiper .swiper-slide.video .play_icon .circle3{animation: wave 2s ease-in infinite 0.7s;}
@keyframes wave{
0%{opacity:0.8;width:140px;height:140px;}
100%{opacity:0.2;width:180px;height:180px;}
}

.bbs .swiperarea .thumbarea{
	position: relative;
	width: 92%;
	max-width: calc(1480px + 180px);
	padding: 0 90px;
	margin: 30px auto 0;
}
.bbs .swiperarea .thumbarea .thumb_swiper{
	width: 100%;
}
.bbs .swiperarea .thumbarea .thumb_swiper .swiper-slide{
	position: relative;
	width: 300px;
	aspect-ratio: 300 / 200;
	cursor: pointer;
}
.bbs .swiperarea .thumbarea .thumb_swiper .swiper-slide img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.bbs .swiperarea .thumbarea .thumb_swiper .swiper-slide-thumb-active:before{
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border: 2px solid #065290;
	box-sizing: border-box;
}
.bbs .swiperarea .thumbarea .vprev{
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 58px;
	background: url(/images/page/m41_prev_btn.png) no-repeat center / contain;
	cursor: pointer;
}
.bbs .swiperarea .thumbarea .vnext{
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 30px;
	height: 58px;
	background: url(/images/page/m41_next_btn.png) no-repeat center / contain;
	cursor: pointer;
}


/* paging */
.paging{
	margin-top:110px;
	text-align:center;
}
.paging a{
	display:inline-block;vertical-align:top;box-sizing:border-box;
	width: 32px;
    height: 32px;
	font-family:"Pretendard";color:#666;font-size:14px; font-weight: 500;line-height:32px;
}
.paging strong{
	display:inline-block;vertical-align:top;box-sizing:border-box;
	width: 32px;
    height: 32px;
	border-bottom: 2px solid #065290;
	font-family:"Pretendard";color:#065290;font-size:14px;line-height:32px;font-weight:500;
}
.paging .page_begin{
	width: 32px;
    height: 32px;
	background:url(/images/common/page_begin.png) no-repeat center;
	border:0;
}
.paging .page_prev{
	width: 32px;
    height: 32px;
	background:url(/images/common/page_prev.png) no-repeat center;
	border:0;margin-right:20px;
}
.paging .page_next{
	width: 32px;
    height: 32px;
	background:url(/images/common/page_next.png) no-repeat center;
	border:0;margin-left:20px;
}
.paging .page_end{
	width: 32px;
    height: 32px;
	background:url(/images/common/page_end.png) no-repeat center;
	border:0;
}


.bbs_view{
	padding: 0 0 250px;
}
.bbs_view .titwrap{
	width: 100%;
	padding: 50px 4%;
	border-top: 1px solid #000;
	border-bottom: 1px solid #ccc;
	text-align: center;
}
.bbs_view .titwrap .tit{
	font-family: "Pretendard";
	font-size: var(--font-size-34);
	font-weight: 500;
}
.bbs_view .titwrap .date{
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	color: #666;
	margin-top: 20px;
}
.bbs_view .titwrap .file{
	margin-top: 20px;
	display: flex;
	justify-content: center;
}
.bbs_view .titwrap .file dt{
	font-family: "Pretendard";
	position: relative;
	padding-right: 25px;
	font-size: var(--font-size-18);
	font-weight: 500;
	color: #666;
}
.bbs_view .titwrap .file dt:after{
	content: "";
	position: absolute;
	right: 12px;
	top: 4px;
	width: 1px;
	height: 18px;
	background: rgba(0,0,0,0.2);
}
.bbs_view .titwrap .file dd{
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
}
.bbs_view .titwrap .file dd a{
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	color: #666;
}
.bbs_view .conwrap{
	padding: 100px 0;
	border-bottom: 1px solid #ccc;
}
.bbs_view .conwrap video{
	width: 100%;
}
.bbs_view .btn{
	font-family: "Pretendard";
	font-size: 18px;
	margin: 100px auto 0;
	display: block;
	width: 200px;
	height: 65px;
	line-height: 65px;
	text-align: center;
	color: #fff;
	background: #065290;
}



.m51{}
.m51 .section1{
	padding: 0 0 250px;
}
.m51 .section1 .formarea{
	border-top: 2px solid #000;
}
.m51 .section1 .formarea .con{
	padding: 100px 0;
	border-bottom: 1px solid #000;
	display: flex;
}
.m51 .section1 .formarea .con.last{
	border-bottom: none;
}
.m51 .section1 .formarea .con .titwrap{
	width: 30%;
}
.m51 .section1 .formarea .con .titwrap .tit{
	font-size: var(--font-size-34);
	font-weight: 500;
}
.m51 .section1 .formarea .con .titwrap .est{
	font-family: "Pretendard";
	font-size: 18px;
}
.m51 .section1 .formarea .con .titwrap .est span{
	color: #EE6A79;
}
.m51 .section1 .formarea .con .conwrap{
	width: 70%;
}
.m51 .section1 .formarea .con .conwrap .formwrap{
	width: 100%;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl{
	display: flex;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl + dl{
	margin-top: 40px;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl dt{
	width: 230px;
	font-family: "Pretendard";
	font-size: var(--font-size-24);
	font-weight: 600;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl dt span{
	color: #EE6A79;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl dd{
	width: calc(100% - 230px);
	display: flex;
	align-items: center;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl dd input{
	width: 100%;
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	border: 1px solid #ccc;
	height: 80px;
	padding: 0 20px;
	box-sizing: border-box;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl dd .etc{
	flex-shrink: 0;
	width: 40px;
	text-align: center;
	font-family: "Pretendard";
	font-size: var(--font-size-24);
	color: #666;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl dd textarea{
	width: 100%;
	height: 240px;
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	border: 1px solid #ccc;
	padding: 20px;
	box-sizing: border-box;
	resize: none;
}

.m51 .section1 .formarea .con .conwrap .formwrap dl dd .filebox {
	position: relative;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl dd .filebox .upload-name {
    display: inline-block;
    box-sizing: border-box;
    width: calc(100% - 160px);
	height: 80px;
	line-height: 80px;
	outline: 0;
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	border: none;
    appearance: none;
	background: #F9F9F9;
	border: 1px solid #ccc;
}

.m51 .section1 .formarea .con .conwrap .formwrap dl dd .filebox input[type="file"] {
    box-sizing: border-box;
    height: 60px;
    padding: 0 20px;
    border: 1px solid #ebebeb;
    background: #fff;
    outline: 0;
    border-radius: 10px;
    font-size: 22px;
    width: 100%;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl dd .filebox input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl dd .filebox label {
	width: 160px;
	height: 80px;
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	color: #666;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	background: #F9F9F9;
	border: 1px solid #ccc;
	border-left: none;
}
.m51 .section1 .formarea .con .conwrap .formwrap dl dd .filebox label span{font-weight: 400;}
.m51 .section1 .formarea .con .conwrap .formwrap dl dd .filebox .est{
	width: 100%;
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	color: #666;
	margin-top: 10px;
}

.m51 .section1 .formarea .con .conwrap .formwrap .agree input{
	display: none;
}
.m51 .section1 .formarea .con .conwrap .formwrap .agree input + label{
	position: relative;
	padding-left: 30px;
	font-family: "Pretendard";
	font-size: var(--font-size-18);
}
.m51 .section1 .formarea .con .conwrap .formwrap .agree input + label:before{
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 26px;
	height: 26px;
	border-radius: 50%;
	border: 1px solid #ddd;
	box-sizing: border-box;
}
.m51 .section1 .formarea .con .conwrap .formwrap .agree input:checked + label:before{
	border: 1px solid #065290;
}
.m51 .section1 .formarea .con .conwrap .formwrap .agree input:checked + label:after{
	content: "";
	position: absolute;
	left: 6px;
	top: 50%;
	transform: translateY(-50%);
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #065290;
}

.m51 .section1 .formarea .con .conwrap .formwrap .agreebox{
	width: 100%;
	height: 240px;
	padding: 20px;
	margin-top: 10px;
	border: 1px solid #ccc;
}
.m51 .section1 .formarea .con .conwrap .formwrap .agreebox .inner{
	width: 100%;
	height: 100%;
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	line-height: 1.7em;
	color: #666;
	white-space: pre-wrap;
	overflow: auto;
}
.m51 .section1 .formarea .btnwrap{
	padding-top: 30px;
	text-align: center;
}
.m51 .section1 .formarea .btnwrap button{
	display: inline-block;
	width: 360px;
	height: 64px;
	line-height: 64px;
	text-align: center;
	background: #065290;
	border: none;
	font-family: "Pretendard";
	font-size: var(--font-size-18);
	color: #fff;
}



@-webkit-keyframes showImg{
0%{ clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);}
100%{clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); }
animation-delay: 1s;
}
@-webkit-keyframes showImg2{
0%{ clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);}
0%{ clip-path: polygon(0 0, 28% 0, 58% 100%, 0 100%);}
100%{clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%); }
}
@-webkit-keyframes showImg3 {
0% {clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); opacity: 0;}
100% {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); opacity: 1;}
}
@-webkit-keyframes opacityAni{
0%{opacity:0;}
100%{opacity:1;}
}
@-webkit-keyframes scaleAni{
0%{opacity:0;transform:scale(1.3);}
100%{opacity:1;transform:scale(1);}
}
@-webkit-keyframes scaleAni2{
0%{opacity:0.5;transform:scale(1.3);}
100%{opacity:1;transform:scale(1);}
}
@-webkit-keyframes fadeUpAni{
0%{opacity:0; transform:translateY(30px);}
100%{opacity:1;transform:translateY(0);}
}
@-webkit-keyframes fadeLeftAni{
0%{opacity:0; transform:translateX(-50px);}
100%{opacity:1;transform:translateX(0);}
}
@-webkit-keyframes fadeRightAni{
0%{opacity:0; transform:translateX(50px);}
100%{opacity:1;transform:translateX(0);}
}
@-webkit-keyframes imgMotion{
	0% { clip-path: inset(50%);opacity:0; }
	100% {clip-path: inset(0);opacity:1;}
}

.fadeUp{opacity: 0;}
.fadeLeft{opacity: 0;}
.fadeRight{opacity: 0;}
.showImg{opacity: 0;}
.clipImg{opacity: 0;}

.showImg.in-view{animation-name: showImg;animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 1.4s; opacity: 1;}
.showImg2.in-view{animation-name: showImg2;animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 2s; opacity: 1;}
.showImg3.in-view{animation-name: showImg3;animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 1s; opacity: 1;}
.opacity.in-view{animation-name: opacityAni;animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 1.4s;}
.fadeUp.in-view{animation-name: fadeUpAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01);animation-duration: 1s; opacity: 1;}
.fadeLeft.in-view{animation-name: fadeLeftAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01);animation-duration: 1s; opacity: 1;}
.fadeRight.in-view{animation-name: fadeRightAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01);animation-duration: 1s; opacity: 1;}
.scaleAni.in-view{animation-name: scaleAni; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 2s; }
.scaleAni2.in-view{animation-name: scaleAni2; animation-timing-function: cubic-bezier(0.42, 0, 0.14, 1.01); animation-duration: 1.5s; }
.clipImg.in-view{animation-name: imgMotion;animation-duration: 1.4s;animation-fill-mode: forwards;animation-timing-function: ease-in-out;animation-delay: 0.1s;opacity: 0;}



.page_top .bg{transform: scale(1.2);}
.page_top.in-view .bg{transform: scale(1); transition: all 2s;}
.page_top .txtwrap h2{opacity: 0; transform: translateY(30px);}
.page_top.in-view .txtwrap h2{opacity: 1; transform: translateY(0); transition: all 1s 0.2s;}
.page_top .txtwrap p{opacity: 0; transform: translateY(30px);}
.page_top.in-view .txtwrap p{opacity: 1; transform: translateY(0); transition: all 1s 0.4s;}

.m11 .section1 .slg .txt{opacity: 0; transform: translateY(30px);}
.m11 .section1 .slg.in-view .txt{opacity: 1; transform: translateY(0); transition: all 1s 0.2s;}
.m11 .section1 .slg.in-view .txt2{opacity: 1; transform: translateY(0); transition: all 1s 0.3s;}

.m11 .section1 .ccwrap .cc{opacity: 0; transform: scale(0.8);}
.m11 .section1 .ccwrap .cc.in-view{opacity: 1; transform: scale(1); transition: all 1s 0.2s;}

.m11 .section1 .bot .bg{transform: scale(1.2);}
.m11 .section1 .bot.in-view .bg{transform: scale(1); transition: all 2s;}

.m12 .section1 .slgwrap > div{opacity: 0; transform: translateY(30px);}
.m12 .section1 .slgwrap.in-view .txt1{opacity: 1; transform: translateY(0); transition: all 1s 0.2s;}
.m12 .section1 .slgwrap.in-view .txt2{opacity: 1; transform: translateY(0); transition: all 1s 0.3s;}

.m12 .section1 .conwrap .swiper-container .swiper-slide.{
	opacity: 0;
}
.m12 .section1 .conwrap .swiper-container .swiper-slide.in-view{
	animation: showImg3 1.4s cubic-bezier(0.42, 0, 0.14, 1.01) forwards; opacity: 0;
}
.m12 .section1 .conwrap .swiper-container .swiper-slide.v1.in-view{
	animation-delay: 0.2s;
}
.m12 .section1 .conwrap .swiper-container .swiper-slide.v2.in-view{
	animation-delay: 0.4s;
}
.m12 .section1 .conwrap .swiper-container .swiper-slide.v3.in-view{
	animation-delay: 0.6s;
}

.m20 .section2 .ccwrap li{opacity: 0; transform: translateX(-30px);}
.m20 .section2 .ccwrap li:nth-child(1){transition: all 1s 0.2s;}
.m20 .section2 .ccwrap li:nth-child(2){transition: all 1s 0.4s;}
.m20 .section2 .ccwrap li:nth-child(3){transition: all 1s 0.6s;}
.m20 .section2 .ccwrap li:nth-child(4){transition: all 1s 0.8s;}
.m20 .section2 .ccwrap li:nth-child(5){transition: all 1s 1s;}
.m20 .section2 .ccwrap li.in-view{opacity: 1; transform: translateX(0);}


.m23 .section3 .boxwrap .box{opacity: 0; transform: translateY(30px);}
.m23 .section3 .boxwrap .box.in-view{opacity: 1; transform: translateY(0);}
.m23 .section3 .boxwrap .box:nth-child(1){transition: all 1s 0.2s;}
.m23 .section3 .boxwrap .box:nth-child(2){transition: all 1s 0.4s;}
.m23 .section3 .boxwrap .box:nth-child(3){transition: all 1s 0.6s;}