@charset "utf-8";

/* main 공통 */
.more_btn {display: inline-block;}
.more_btn a {font-size: 0; letter-spacing: -4px; display: block; height: 50px; border: 1px solid #fff; box-sizing: border-box; padding: 0 20px; transition: all 0.3s;}
.more_btn a span {display: inline-block; vertical-align: middle; width: calc(100% - 16px); padding-right: 10px; color: #fff; font-weight: 500; font-size: 16px; letter-spacing: -0.05em; box-sizing: border-box; line-height: 48px; transition: all 0.3s; text-align: left;}
.more_btn a i {display: inline-block; vertical-align: middle; width: 16px; height: 11px; background: url('/img/btn_arrow.png') no-repeat; transition: all 0.3s;}
.more_btn:hover a {background: #fff;}
.more_btn:hover a span {color: #2d389a;}
.more_btn:hover a i {background: url('/img/btn_arrow_on.png') no-repeat;}

.more_btn02 {display: inline-block;}
.more_btn02 a {font-size: 0; letter-spacing: -4px; display: block;}
.more_btn02 a span {display: inline-block; vertical-align: middle; color: #222222; font-weight: 700; font-size: 16px; letter-spacing: 0;}
.more_btn02 a i {display: inline-block; vertical-align: middle; width: 38px; height: 38px; margin-left: 30px; background: url('/img/more_btn02.png') no-repeat; transition: all 0.3s;}
.more_btn02.type02 a span {color: #fff;}
.more_btn02.type02 a i {background: url('/img/more_btn03.png') no-repeat;}
.more_btn02:hover a i {background: url('/img/more_btn02_on.png') no-repeat;}
.more_btn02.type02:hover a i {background: url('/img/more_btn03_on.png') no-repeat;}

/* main_visual */
.main_visual {position: relative; height: 100vh;}
.main_visual .swiper-container {height: 100%;}
.main_visual .swiper-container ul li .bg {position: absolute; z-index: -1; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.main_visual .swiper-container ul li .txt_box {height: 100%;}
.main_visual .swiper-container ul li .txt_box .inner1435 {display: table; height: 100%;}
.main_visual .swiper-container ul li .txt_box .txt {display: table-cell; vertical-align: middle; padding-bottom: 60px; box-sizing: border-box; text-align: center;}
.main_visual .swiper-container ul li .txt_box .txt p {color: #ffffff; font-weight: 200; font-size: 48px; letter-spacing: 0.01em; word-break: keep-all;}
.main_visual .swiper-container ul li .txt_box .txt p b {letter-spacing: -0.05em;}
.main_visual .swiper-container ul li .txt_box .txt .more_btn {width: 173px; margin-top: 55px;}
.main_visual .swiper-container ul li.slide01 .txt_box .txt {padding-left: 25%;}
.main_visual .prev_btn {position: absolute; z-index: 2; left: 80px; top: calc(50% - 23px); width: 23px; height: 46px; background: url('/img/main_visual_prev_btn.png') no-repeat; cursor: pointer;}
.main_visual .next_btn {position: absolute; z-index: 2; right: 80px; top: calc(50% - 23px); width: 23px; height: 46px; background: url('/img/main_visual_next_btn.png') no-repeat; cursor: pointer;}
.main_visual .bottom_box {position: absolute; z-index: 2; left: 50%; bottom: 80px; width: 100%; max-width: 1435px; transform: translateX(-50%); -webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-o-transform: translateX(-50%);-ms-transform: translateX(-50%); font-size: 0; letter-spacing: -4px; height: 169px;}
.main_visual .bottom_box .inner1435 {height: 100%;}
.main_visual .bottom_box .control_box {display: inline-block; vertical-align: top; width: 21%; height: 100%; background: #2d389a; text-align: center;}
.main_visual .bottom_box .control_box .t_box {display: table; width: 100%; height: 100%;}
.main_visual .bottom_box .control_box .t_box .tc_box {display: table-cell; vertical-align: middle; padding: 10px; box-sizing: border-box;}
.main_visual .bottom_box .control_box .controller {display: inline-block; vertical-align: middle; margin-right: 30px;}
.main_visual .bottom_box .control_box .controller .current {display: inline-block; vertical-align: middle; color: #ffffff; font-weight: 500; font-size: 16px; letter-spacing: -0.05em;}
.main_visual .bottom_box .control_box .controller .progress {display: inline-block; vertical-align: middle; width: 98px; height: 2px; background: rgba(255,255,255,0.2); position: relative; margin-bottom: 0; margin: 0 10px;}
.main_visual .bottom_box .control_box .controller .progress_bar {display: block; width: 0; background: #ffffff; height: 100%;}
.main_visual .bottom_box .control_box .controller .next {display: inline-block; vertical-align: middle; color: #ffffff; font-weight: 500; font-size: 16px; letter-spacing: -0.05em; opacity: 0.2;}
.main_visual .bottom_box .control_box .play_btn {display: inline-block; vertical-align: middle; width: 7px; height: 14px; background: url('/img/play_btn.png') no-repeat; cursor: pointer;}
.main_visual .bottom_box .control_box .pause_btn {display: inline-block; vertical-align: middle; width: 9px; height: 12px; background: url('/img/pause_btn.png') no-repeat; margin-left: 15px; cursor: pointer;}
.main_visual .bottom_box .menu_box {background: #fff; display: inline-block; vertical-align: top; width: 79%; height: 100%;}
.main_visual .bottom_box .menu_box ul {font-size: 0; letter-spacing: -4px; height: 100%;}
.main_visual .bottom_box .menu_box ul li {display: inline-block; vertical-align: top; width: 33.333333%; height: 100%; box-sizing: border-box;}
.main_visual .bottom_box .menu_box ul li + li {border-left: 1px solid #eeeeee;}
.main_visual .bottom_box .menu_box ul li a {display: table; width: 100%; height: 100%;}
.main_visual .bottom_box .menu_box ul li a .tc_box {display: table-cell; vertical-align: middle; padding: 10px 30px 10px 50px; box-sizing: border-box;}
.main_visual .bottom_box .menu_box ul li .img {display: inline-block; vertical-align: middle;}
.main_visual .bottom_box .menu_box ul li .txt {display: inline-block; vertical-align: middle; margin-left: 20px; width: calc(100% - 112px); padding-right: 10px; box-sizing: border-box;}
.main_visual .bottom_box .menu_box ul li .txt p {color: #000000; font-weight: 700; font-size: 20px; letter-spacing: -0.05em; margin-bottom: 10px;}
.main_visual .bottom_box .menu_box ul li .txt span {color: #666666; font-weight: 400; font-size: 16px; letter-spacing: -0.05em;}
.main_visual .bottom_box .menu_box ul li i {display: inline-block; vertical-align: middle; width: 42px; height: 42px; background: url('/img/more_btn.png') no-repeat; transition: all 0.3s;}
.main_visual .bottom_box .menu_box ul li:hover i {background: url('/img/more_btn_on.png') no-repeat;}

@media all and (max-width: 1400px) {
	.main_visual .bottom_box .control_box .controller {margin-right: 20px;}
	.main_visual .prev_btn {left: 40px;}
	.main_visual .next_btn {right: 40px;}
}
@media all and (max-width: 1200px) {
	.main_visual .bottom_box .control_box .controller .progress {width: 60px;}
	.main_visual .bottom_box .menu_box ul li a .tc_box {padding: 10px 15px 10px 20px;}
}
@media all and (max-width: 1000px) {
	.main_visual {height: auto;}
	.main_visual .swiper-container {height: 640px;}
	.main_visual .swiper-container ul li .txt_box .txt {padding-bottom: 20px; padding-left: 40px; padding-right: 40px;}
	.main_visual .swiper-container ul li .txt_box .txt p {font-size: 36px;}
	.main_visual .swiper-container ul li .txt_box .txt .more_btn {margin-top: 40px;}
	.main_visual .prev_btn {left: 20px;}
	.main_visual .next_btn {right: 20px;}
	.main_visual .bottom_box {position: static; height: auto; transform: none; -webkit-transform: none;-moz-transform: none;-o-transform: none; -ms-transform: none;}
	.main_visual .bottom_box .control_box {display: none;}
	.main_visual .bottom_box .menu_box {width: 100%;}
	.main_visual .bottom_box .menu_box ul li {width: 100%;}
	.main_visual .bottom_box .menu_box ul li + li {border-top: 1px solid #eeeeee; border-left: none;}
	.main_visual .bottom_box .menu_box ul li a {height: 120px;}
}
@media all and (max-width: 767px) {
	.main_visual .swiper-container {height: 450px;}
	.main_visual .swiper-container ul li .txt_box .txt p {font-size: 23px;}
	.main_visual .swiper-container ul li .txt_box .txt .more_btn {margin-top: 30px;}
}

/* main */
.main_con01	{padding: 80px 80px 0; box-sizing: border-box;}
.main_con01	.box {position: relative; font-size: 0; letter-spacing: -4px;}
.main_con01	.box:before {position: absolute; z-index: -1; left: 0; top: 0; width: 100%; height: calc(100% - 65px); background: url('/img/main_con01_bg01.jpg') no-repeat right center / cover; content: '';}
.main_con01	.box .txt_box {display: inline-block; vertical-align: top; padding: 85px 0 0; width: calc(50% - 10px); text-align: right; box-sizing: border-box;}
.main_con01	.box .txt_box .ib_box {display: inline-block; text-align: left; padding-right: 20px; box-sizing: border-box;}
.main_con01	.box .txt_box .tit {margin-bottom: 30px;}
.main_con01	.box .txt_box .tit span {display: inline-block; width: 158px; height: 25px; color: #fff; font-weight: 600; font-size: 13px; letter-spacing: -0.025em; text-align: center; line-height: 25px; border-radius: 13px; margin-bottom: 20px; background: #2d389a;}
.main_con01	.box .txt_box .tit h3 {color: #222222; font-weight: 300; font-size: 40px; letter-spacing: -0.025em; line-height: 1.4;}
.main_con01	.box .txt_box p {color: #666666; font-weight: 300; font-size: 20px; letter-spacing: -0.025em; line-height: 1.9; word-break: keep-all;}
.main_con01	.box .img_box {display: inline-block; vertical-align: top; width: calc(50% + 10px); padding-top: 55px; text-align: center;}
.main_con01	.box .img_box .img {display: inline-block; width: 85%; max-width: 405px; box-shadow: 7px 14px 62px rgb(0 0 0 / 8%);}
.main_con01	.box .img_box .img img {width: 100%;}
.main_con02 {padding: 80px 0; font-size: 0; letter-spacing: -4px;}
.main_con02 .left_box {display: inline-block; vertical-align: top; width: 320px; margin-right: 70px; padding-top: 40px; padding-right: 15px; border-top: 3px solid #000000; box-sizing: border-box;}
.main_con02 .left_box h3 {color: #000000; font-weight: 700; font-size: 36px; letter-spacing: -0.05em; margin-bottom: 40px;}
.main_con02 .left_box p {color: #666666; font-weight: 500; font-size: 20px; letter-spacing: -0.05em; line-height: 1.5;}
.main_con02 .left_box .more_btn02 {margin-top: 40px;}
.main_con02 .right_box {display: inline-block; vertical-align: top; width: calc(100% - 390px); border-top: 3px solid #000000; box-sizing: border-box;}
.main_con02 .right_box ul li {cursor: pointer; box-sizing: border-box; border-bottom: 1px solid #e5e5e5; padding: 32px 52px 32px 30px;}
.main_con02 .right_box ul li .date {display: inline-block; vertical-align: middle; width: 80px; text-align: center;}
.main_con02 .right_box ul li .date p {color: #2d389a; font-weight: 700; font-size: 34px; letter-spacing: -0.05em; margin-bottom: 15px;}
.main_con02 .right_box ul li .date span {color: #666666; font-weight: 400; font-size: 16px; letter-spacing: -0.05em;}
.main_con02 .right_box ul li .cont {display: inline-block; vertical-align: middle; width: calc(100% - 132px); padding-top: 10px; padding-left: 70px; padding-right: 50px; box-sizing: border-box;}
.main_con02 .right_box ul li .cont p {color: #222222; font-weight: 600; font-size: 20px; letter-spacing: -0.05em; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.main_con02 .right_box ul li .cont span {display: block; color: #666666; font-weight: 300; font-size: 18px; letter-spacing: -0.05em; line-height: 1.6em;}
.main_con02 .right_box ul li .cont span > * {display: none;}
.main_con02 .right_box ul li .cont span :first-child {display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 18px !important;}


.main_con02 .right_box ul li .btn {display: inline-block; vertical-align: middle; width: 52px; height: 10px; background: url('/img/main_con02_arrow.png') no-repeat; transition: all 0.3s;}
.main_con02 .right_box ul li:hover .btn {background: url('/img/main_con02_arrow_on.png') no-repeat;}
.main_con03 {font-size: 0; letter-spacing: -4px; position: relative; overflow: hidden;}
.main_con03:before {position: absolute; z-index: -1; left: 80px; top: 35px; width: 5000px; height: 100%; background: #f8f8f9; content: '';}
.main_con03 .left_box {display: inline-block; vertical-align: top; width: 320px; padding: 90px 0 115px; box-sizing: border-box; position: relative; z-index: 1;}
.main_con03 .left_box:before {position: absolute; z-index: -1; right: 0; top: 0; width: 2000px; height: 100%; background: #2d389a url('/img/main_con03_bg01.jpg') no-repeat right bottom / cover; content: '';}
.main_con03 .left_box h3 {color: #ffffff; font-weight: 700; font-size: 36px; letter-spacing: -0.05em; margin-bottom: 35px;}
.main_con03 .left_box p {color: #ffffff; font-weight: 500; font-size: 20px; letter-spacing: -0.05em; line-height: 1.5;}
.main_con03 .left_box .more_btn02 {margin-top: 40px;}
.main_con03 .right_box {display: inline-block; vertical-align: top; width: calc(100% - 320px); margin-top: 35px; padding: 60px 0 70px 70px; box-sizing: border-box;}
.main_con03 .right_box ul li {display: inline-block; vertical-align: top; width: calc(33.333333% - 26.666667px); margin-right: 40px; cursor: pointer;}
.main_con03 .right_box ul li:last-of-type {margin-right: 0;}
.main_con03 .right_box ul li .img_box {position: relative; transition: all 0.3s;}
.main_con03 .right_box ul li .img_box .img {position:relative; padding:31% 0; overflow:hidden;}
.main_con03 .right_box ul li .img_box .img img {position:absolute; top:50%; left:50%; width:100%; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%);}
.main_con03 .right_box ul li .img_box .hover_box {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); opacity: 0; transition: all 0.3s;}
.main_con03 .right_box ul li .img_box .hover_box i {position: absolute; left: calc(50% - 30px); top: calc(50% - 30px); width: 60px; height: 60px; background: url('/img/main_con03_hover_icon01.png') no-repeat;}
.main_con03 .right_box ul li .txt_box {padding-top: 20px; box-sizing: border-box;}
.main_con03 .right_box ul li .txt_box p {color: #222222; font-weight: 700; font-size: 20px; letter-spacing: -0.025em; margin-bottom: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.main_con03 .right_box ul li .txt_box span {color: #888888; font-size: 16px; letter-spacing: -0.05em;}
.main_con03 .right_box ul li:hover .img_box {box-shadow: 10px 10px 16px rgb(0 0 0 / 23%);}
.main_con03 .right_box ul li:hover .img_box .hover_box {opacity: 1;}
.main_con04 {text-align: center; padding: 80px 0 45px; overflow: hidden;}
.main_con04 .tit {margin-bottom: 55px;}
.main_con04 .tit i {display: block; width: 50px; height: 3px; margin: 0 auto 35px; background: #000000;}
.main_con04 .tit h3 {color: #000000; font-weight: 700; font-size: 36px; letter-spacing: -0.05em;}
.main_con04 .tit p {color: #666666; font-weight: 500; font-size: 20px; letter-spacing: -0.05em; line-height: 1.6; margin-top: 10px;}
.main_con04 .img_box {display: inline-block; max-width: 100%;}
.main_con04 .img_box img {width: 100%;}
.main_con04 .slide_box {margin: 40px auto 0; width: 90.6%;}
.main_con04 .slide_box ul .slick-list {overflow: visible;}
.main_con04 .slide_box ul li {padding: 0 10px; box-sizing: border-box;}
.main_con04 .slide_box ul li a {display: block; position: relative; padding: 19.6% 0; overflow: hidden;}
.main_con04 .slide_box ul li a img {position: absolute; left: 0; top: 0; right: 0; bottom: 0; max-width: 100%; max-height: 100%; margin: auto;}
.main_con05 {font-size: 0; letter-spacing: -4px; background: url('/img/main_con05_bg01.jpg') fixed no-repeat center center / cover; padding: 136px 0;}
.main_con05 .tit {display: inline-block; vertical-align: middle; width: calc(100% - 195px);}
.main_con05 .tit h3 {color: #fff; font-weight: 700; font-size: 36px; letter-spacing: -0.025em;}
.main_con05 .tit p {color: #fff; font-weight: 500; font-size: 22px; letter-spacing: -0.025em; margin-top: 20px;}
.main_con05 .more_btn {display: inline-block; vertical-align: middle; width: 195px;}
.main_con05 .more_btn a span {font-weight: 700;}

@media all and (max-width: 1400px) {
	.main_con01 {padding: 80px 20px 0;}
	.main_con01 .box .txt_box .ib_box {padding-right: 0;}
	.main_con02 .left_box {margin-right: 50px; width: 270px;}
	.main_con02 .right_box {width: calc(100% - 320px);}
	.main_con02 .right_box ul li {padding: 32px 30px;}
	.main_con02 .right_box ul li .cont {padding-left: 40px;}
	.main_con03:before {left: 20px;}
	.main_con03 .left_box {width: 270px; padding: 80px 0;}
	.main_con03 .right_box {width: calc(100% - 270px); padding: 60px 0 70px 50px;}
	.main_con03 .right_box ul li {width: calc(33.333333% - 20px); margin-right: 30px;}
}
@media all and (max-width: 1200px) {
	.main_con01 .box .txt_box .tit h3 {font-size: 36px;}
}
@media all and (max-width: 1000px) {
	.main_con01 {padding: 80px 0 0;}
	.main_con01 .box:before {height: calc(100% - 120px);}
	.main_con01	.box .txt_box {width: 100%;}
	.main_con01	.box .img_box {width: 100%; text-align: left;}
	.main_con02 .left_box {width: 100%; margin-right: 0; padding-bottom: 40px;}
	.main_con02 .right_box {width: 100%;}
	.main_con03:before {left: 0;}
	.main_con03 .left_box {width: 100%; padding: 50px 0;}
	.main_con03 .left_box:before {right: -100px;}
	.main_con03 .right_box {width: 100%; margin-top: 0; padding-left: 0;}
	.main_con05 {padding: 100px 0;}
	.main_con05 .tit {width: 100%;}
	.main_con05 .more_btn {margin-top: 40px;}
}
@media all and (max-width: 767px) {
	.main_con03 .right_box ul li {width: 100%; margin-right: 0;}
	.main_con03 .right_box ul li + li {margin-top: 40px;}
}
