@charset "utf-8";
/* CSS Document */



/* banner */
.header-container .banner-wrap { position: relative; min-width: 1200px; width: 100%; white-space: nowrap; overflow:hidden; }
.header-container .banner-wrap .banner {position: relative;display: inline-block; width: 100%; transition: transform .5s cubic-bezier(0.61, 0, 0.49, 0.8); margin-right: -2px; white-space: initial;}
.header-container .banner-wrap .banner .banner-bg {width:100%; height:530px;}
.header-container .banner-wrap .banner .banner-bg .banner-img {width:100%; height:100%; background-position: 50%; background-size: cover !important;}

.header-container .banner-wrap.banner-01-on .banner { -ms-transform: translateX(0); -webkit-transform: translateX(0); -moz-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); }
.header-container .banner-wrap.banner-02-on .banner { -ms-transform: translateX(-100%); -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); }
.header-container .banner-wrap.banner-03-on .banner { -ms-transform: translateX(-200%); -webkit-transform: translateX(-200%); -moz-transform: translateX(-200%); -o-transform: translateX(-200%); transform: translateX(-200%); }
.header-container .banner-wrap.banner-04-on .banner { -ms-transform: translateX(-300%); -webkit-transform: translateX(-300%); -moz-transform: translateX(-300%); -o-transform: translateX(-300%); transform: translateX(-300%); }
.header-container .banner-wrap.banner-05-on .banner { -ms-transform: translateX(-400%); -webkit-transform: translateX(-400%); -moz-transform: translateX(-400%); -o-transform: translateX(-400%); transform: translateX(-400%); }
.header-container .banner-wrap.banner-06-on .banner { -ms-transform: translateX(-500%); -webkit-transform: translateX(-500%); -moz-transform: translateX(-500%); -o-transform: translateX(-500%); transform: translateX(-500%); }
.header-container .banner-wrap.banner-07-on .banner { -ms-transform: translateX(-600%); -webkit-transform: translateX(-600%); -moz-transform: translateX(-600%); -o-transform: translateX(-600%); transform: translateX(-600%); }
.header-container .banner-wrap.banner-08-on .banner { -ms-transform: translateX(-700%); -webkit-transform: translateX(-700%); -moz-transform: translateX(-700%); -o-transform: translateX(-700%); transform: translateX(-700%); }
.header-container .banner-wrap.banner-09-on .banner { -ms-transform: translateX(-800%); -webkit-transform: translateX(-800%); -moz-transform: translateX(-800%); -o-transform: translateX(-800%); transform: translateX(-800%); }
.header-container .banner-wrap.banner-10-on .banner { -ms-transform: translateX(-900%); -webkit-transform: translateX(-900%); -moz-transform: translateX(-900%); -o-transform: translateX(-900%); transform: translateX(-900%); }

.header-container .banner-wrap .banner01 .banner-bg .banner-img { background: url("../../img/main/banner_bg01.png") no-repeat center;}
.header-container .banner-wrap .banner02 .banner-bg .banner-img { background: url("../../img/main/banner_bg02.png") no-repeat center;}
.header-container .banner-wrap .banner03 .banner-bg .banner-img { background: url("../../img/main/banner_bg03.png") no-repeat center;}
.header-container .banner-wrap .banner04 .banner-bg .banner-img { background: url("../../img/main/banner_bg04.png") no-repeat center;}
.header-container .banner-wrap .banner-text-wrap {width: 1200px; margin:0 auto; position: absolute; top:90px; left: 50%;  -webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-o-transform:translateX(-50%);transform:translateX(-50%);color: #fff; letter-spacing: -0.02em; }
.header-container .banner-wrap .banner .banner-text-wrap .banner-text .sub-title {font-size: 2.5rem; font-weight: 500; line-height: 25px;}
.header-container .banner-wrap .banner .banner-text-wrap .banner-text .title {font-size: 6rem; font-weight: 600; line-height: 85px; margin:25px 0 50px; font-family: 'LotteMartDream', sans-serif; letter-spacing: 0;}
.header-container .banner-wrap .banner .banner-text-wrap .banner-text .text {font-size: 2.2rem; font-weight: 400; line-height: 35px;}

/* banner02 */
.header-container .banner-wrap .banner02 .banner-text-wrap {top: 30px;}
.header-container .banner-wrap .banner02 .banner-text-wrap .banner-text .title {margin-bottom: 25px; font-family: 'Noto Sans KR', sans-serif; font-size: 4.5rem; font-weight: 300; line-height: 66px; letter-spacing: -0.085em;}
.header-container .banner-wrap .banner02 .banner-text-wrap .banner-text .title .bold {font-size: 5.7rem; font-weight: 600; letter-spacing: -0.3px;}

/* banner03 */
.header-container .banner-wrap .banner03 .banner-text-wrap .banner-text .sub-title {font-size:2.2rem; font-weight: 500; letter-spacing: -0.3px;}
.header-container .banner-wrap .banner03 .banner-text-wrap .banner-text .title {margin-bottom: 25px; font-family: 'Noto Sans KR', sans-serif; font-size: 5rem; font-weight: 600; line-height: 75px;}

/* banner04 */
.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .sub-title {font-size:2rem; font-weight: 300; letter-spacing: -0.3px; line-height: 33px;}
.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .title {margin-bottom: 25px; font-family: 'Noto Sans KR', sans-serif; font-size: 4.8rem; font-weight: lighter; line-height: 75px; letter-spacing: -0.05em;}
.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .title .bold {font-weight: 600; color: #ffc14a}


.header-container .banner-wrap .fix  { position: absolute; width:1200px; bottom: 90px; right: 50%; -webkit-transform:translateX(50%);-moz-transform:translateX(50%);-ms-transform:translateX(50%);-o-transform:translateX(50%);transform:translateX(50%); }
.header-container .banner-wrap .fix .page .arrow img {width: 13px; margin-right: 30px; cursor: pointer}
.header-container .banner-wrap .fix .page .arrow img:hover {opacity: .7; -webkit-transition: opacity .3s;-moz-transition: opacity .3s;-ms-transition: opacity .3s;-o-transition: opacity .3s;transition: opacity .3s;}
.header-container .banner-wrap .fix .page .dot {margin-top:20px;}
.header-container .banner-wrap .fix .page .dot span {width: 10px; height:10px; border-radius: 50%; background: #fff; margin-right: 10px; display: inline-block; cursor: pointer; -webkit-transition: background .3s, width .3s;-moz-transition: background .3s, width .3s;-ms-transition: background .3s, width .3s;-o-transition: background .3s, width .3s;transition: background .3s, width .3s;}
.header-container .banner-wrap .fix .page .dot span.select {width: 30px; border-radius: 10px; }
.header-container .banner-wrap .fix .page .dot span:hover {background: rgba(255,255,255,.7);}
.header-container .banner-wrap .fix .video  { position: absolute; bottom: 0; right: 0; width: 50%; }
.header-container .banner-wrap .fix .video .video-area {text-align: right;}
.header-container .banner-wrap .fix .video .video-area video {border:10px solid rgba(255,255,255,0.2);}
.header-container .banner-wrap .fix .video .button-area ul {width: 500px; float: right; position: relative; top: -3px;}
.header-container .banner-wrap .fix .video .button-area ul li {float: left; width: 33.3%; line-height: 90px; color:#fff; text-align: center; font-weight: 500; font-size: 1.7rem; -webkit-transition: background .2s;-moz-transition: background .2s;-ms-transition: background .2s;-o-transition: background .2s;transition: background .2s;}
.header-container .banner-wrap .fix .video .button-area ul li a {display: block; width:100%; line-height: 90px; color:#fff;}
.header-container .banner-wrap .fix .video .button-area ul li:nth-child(1) {border-bottom:10px solid #2c70a6; background:#367db5;}
.header-container .banner-wrap .fix .video .button-area ul li:nth-child(2) {border-bottom:10px solid #153965; background:#1d487c;}
.header-container .banner-wrap .fix .video .button-area ul li:nth-child(3) {border-bottom:10px solid #0d206e; background:#11267c;}
.header-container .banner-wrap .fix .video .button-area ul li:nth-child(1):hover { background:#2c70a6}
.header-container .banner-wrap .fix .video .button-area ul li:nth-child(2):hover { background:#153965}
.header-container .banner-wrap .fix .video .button-area ul li:nth-child(3):hover { background:#0d206e}

.header-container .banner-wrap .quick-area { position: absolute; top:50%; -webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);-o-transform: translateY(-50%);transform: translateY(-50%); right:110px;}
.header-container .banner-wrap .quick-area ul { width:455px;}
.header-container .banner-wrap .quick-area ul li { float:left; position: relative; width:calc(50% - 10px); height: 165px; background:#fff; overflow: hidden; }
.header-container .banner-wrap .quick-area ul li:nth-child(1),
.header-container .banner-wrap .quick-area ul li:nth-child(2) {margin-bottom:5px;}
.header-container .banner-wrap .quick-area ul li:nth-of-type(2n) {margin-left:5px;}
.header-container .banner-wrap .quick-area ul li a { display: block; position: relative; width: 100%; height: 100%; z-index: 10;padding:20px; }
.header-container .banner-wrap .quick-area ul li a > img { position: absolute; bottom:20px; right:20px;}
.header-container .banner-wrap .quick-area ul li:nth-child(1) a > img { width: 33px; }
.header-container .banner-wrap .quick-area ul li:nth-child(2) a > img { width: 50px; }
.header-container .banner-wrap .quick-area ul li:nth-child(3) a > img { width: 50px; }
.header-container .banner-wrap .quick-area ul li:nth-child(4) a > img { width: 40px; }
.header-container .banner-wrap .quick-area ul li a p { font-size: 1.3rem; color:#9ea6c6; word-break: keep-all; white-space: normal;}
.header-container .banner-wrap .quick-area ul li a h3 { font-weight: 600; font-size: 1.8rem; color:#1d1c69; padding-bottom:10px;}
.header-container .banner-wrap .quick-area ul li a h3 img { width: 22px;}
.header-container .banner-wrap .quick-area ul li .circle01 { position: absolute; top: -180px; right:-150px; border-radius: 50%; width:160px; height: 160px; background: #eaf1ff; }
.header-container .banner-wrap .quick-area ul li .circle02 { position: absolute; bottom: -180px; left:-150px; border-radius: 50%; width:160px; height: 160px; background: #eaf1ff; }
.header-container .banner-wrap .quick-area ul li:hover > .circle01 {top: -70px; right: -45px; -webkit-transition: top .3s, right .3s;-moz-transition: top .3s, right .3s;-ms-transition: top .3s, right .3s;-o-transition: top .3s, right .3s;transition: top .3s, right .3s;}
.header-container .banner-wrap .quick-area ul li:hover > .circle02 {bottom: -80px; left: -50px; -webkit-transition: bottom .3s, left .3s;-moz-transition: bottom .3s, left .3s;-ms-transition: bottom .3s, left .3s;-o-transition: bottom .3s, left .3s;transition: bottom .3s, left .3s;}
.header-container .banner-wrap .quick-area ul li:hover > a h3 img { margin-left: 10px; -webkit-transition: margin .3s;-moz-transition: margin .3s;-ms-transition: margin .3s;-o-transition: margin .3s;transition: margin .3s;}



/* section 공통*/
.body-container .section {width: 100%; margin: 0 auto; position: relative;}

/* section01  */
.body-container .section01 {width: 1200px; margin: 90px auto;}
.body-container .section01 .cont-wrap {width: 100%; height: 170px; background: url("../../img/main/visit_bg.png") no-repeat center; box-shadow: 17px 9px 25px -5px rgba(48,1,17,0.1); }
.body-container .section01 .cont-wrap a {display: block; width: 100%; height: 100%; padding-top:55px; padding-left: 72px;}
.body-container .section01 .cont-wrap a h3 { font-weight: 400; color: #222; font-size: 2.8rem; }
.body-container .section01 .cont-wrap a h3 span {font-weight: 600;}
.body-container .section01 .cont-wrap a p {font-size: 1.4rem; font-weight: 300; color: #5d5d5d;}


/* section02 */
.body-container .section02 {width: 100%; height: 360px; background:url("../../img/main/eq_list_bg.png")no-repeat center; position: relative;background-size: cover;}
.body-container .section02 .cont-wrap {width: 1200px; margin:0 auto; }
.body-container .section02 .cont-wrap .title { width: 380px; float:left; padding:90px 0 0;}
.body-container .section02 .cont-wrap .title h3 { position: relative; font-size: 3rem; font-weight: 300; line-height: 34px; letter-spacing: -0.3px; color:#fff; padding:35px 0;}
.body-container .section02 .cont-wrap .title h3:after {position: absolute; content: ''; width: 40px; height: 2px; background:#fff;top:0;left:0;}
.body-container .section02 .cont-wrap .title h3 span {font-weight: 500;display: block;}
.body-container .section02 .cont-wrap .title a { border:1px solid #fff; color:#fff; padding:10px 13px; padding-right: 20px; display: inline-block; font-size: 1.4rem; line-height: 15px; }
.body-container .section02 .cont-wrap .title a img { width: 22px; margin-left:5px;  position: relative; left:0;}
.body-container .section02 .cont-wrap .title a:hover img {left: 5px; -webkit-transition: left .3s;-moz-transition: left .3s;-ms-transition: left .3s;-o-transition: left .3s;transition: left .3s;}
.body-container .section02 .cont-wrap .cont { width: calc(100% - 380px); height: 100%; float:left;}
.body-container .section02 .cont-wrap .cont ul {width: 100%; height: 360px;}
.body-container .section02 .cont-wrap .cont ul li {float: left; width: calc(25% - 1px); height: calc(50% - 1px); text-align: center; background:rgba(26,52,186,.25); margin-right:1px;}
.body-container .section02 .cont-wrap .cont ul li:hover {background: rgba(26,52,186,.4); -webkit-transition: background .3s;-moz-transition: background .3s;-ms-transition: background .3s;-o-transition: background .3s;transition: background .3s;}
.body-container .section02 .cont-wrap .cont ul li a {display: block; width: 100%; height: 100%;}
.body-container .section02 .cont-wrap .cont ul li a p {color:#fff; font-size: 1.3rem; }
.body-container .section02 .cont-wrap .cont ul li:nth-child(1),
.body-container .section02 .cont-wrap .cont ul li:nth-child(2),
.body-container .section02 .cont-wrap .cont ul li:nth-child(3),
.body-container .section02 .cont-wrap .cont ul li:nth-child(4) {margin-bottom:1px;}
.body-container .section02 .cont-wrap .cont ul li:nth-of-type(4n) {margin-right: 0;}
.body-container .section02 .cont-wrap .cont ul li:nth-child(1) a img {width: 69px; margin:30px 0 17px;}
.body-container .section02 .cont-wrap .cont ul li:nth-child(2) a img {width: 91px; margin:30px 0 17px;}
.body-container .section02 .cont-wrap .cont ul li:nth-child(3) a img {width: 95px; margin:40px 0 12px;}
.body-container .section02 .cont-wrap .cont ul li:nth-child(4) a img {width: 70px; margin:32px 0 13px;}
.body-container .section02 .cont-wrap .cont ul li:nth-child(5) a img {width: 100px; margin:25px 0 15px;}
.body-container .section02 .cont-wrap .cont ul li:nth-child(6) a img {width: 100px; margin:35px 0 20px;}
.body-container .section02 .cont-wrap .cont ul li:nth-child(7) a img {width: 82px; margin:25px 0 22px;}
.body-container .section02 .cont-wrap .cont ul li:nth-child(8) a img {width: 63px; margin:25px 0 10px;}


/* section03 */
.body-container .section03 { position: relative; width: 100%; height: 360px;}
.body-container .section03:after {content: ''; position: absolute; top:0; left:0; width: 50%; height: 100%; background:#edf0f8; z-index: -1;}
.body-container .section03:before {content: ''; position: absolute; top:0; right:0; width: 50%; height: 100%; background:#f8f8f8; z-index: -1;}
.body-container .section03 .cont-wrap {width: 1200px; margin:0 auto; }
.body-container .section03 .cont-wrap .title { position: relative; width: 380px; float:left; padding:75px 0 0; background:#edf0f8;}
.body-container .section03 .cont-wrap .title h3 { position: relative; font-size: 3rem; font-weight: 300; line-height: 34px; letter-spacing: -0.3px; color:#333; padding:35px 0;}
.body-container .section03 .cont-wrap .title h3:after {position: absolute; content: ''; width: 40px; height: 2px; background:#333;top:0;left:0;}
.body-container .section03 .cont-wrap .title h3 span {font-weight: 500;display: block;}
.body-container .section03 .cont-wrap .title p {color: #767676; padding-bottom: 38px;}
.body-container .section03 .cont-wrap .title > a { border:1px solid #9090a4; color:#696982; padding:10px 13px; padding-right: 20px; display: inline-block; font-size: 1.4rem; line-height: 15px; }
.body-container .section03 .cont-wrap .title > a img { width: 22px; margin-left:5px;  position: relative; left:0;}
.body-container .section03 .cont-wrap .title > a:hover img {left: 5px; -webkit-transition: left .3s;-moz-transition: left .3s;-ms-transition: left .3s;-o-transition: left .3s;transition: left .3s;}
.body-container .section03 .cont-wrap .title ul {position: absolute; top:50%; right:0; -webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);-o-transform: translateY(-50%);transform: translateY(-50%);}
.body-container .section03 .cont-wrap .title ul li a {display: block; width:120px; border-bottom: .5px solid #b1b1b1; padding:15px 10px; font-size: 1.7rem; letter-spacing: -0.3px; color: #535353; left:0; -webkit-transition: background .3s, left .3s, color .2s;-moz-transition: background .3s, left .3s, color .2s;-ms-transition: background .3s, left .3s, color .2s;-o-transition: background .3s, left .3s, color .2s;transition: background .3s, left .3s, color .2s;}
.body-container .section03 .cont-wrap .title ul li:hover a,
.body-container .section03 .cont-wrap .title ul li.select a {position: relative; left:10px; color:#fff; background:#5496ff; border:0; }
.body-container .section03 .cont-wrap .cont { width: calc(100% - 380px); height: 360px; float:left; background: #f8f8f8;}
.body-container .section03 .cont-wrap .cont .wrap {position: relative; }
.body-container .section03 .cont-wrap .cont ul {margin-left: 60px; padding-left:40px; margin-top: 45px; position: relative; overflow: hidden;}
.body-container .section03 .cont-wrap .cont ul li.box { position: relative; float: left; width: calc(33.3% - 30px); margin-right:30px; background:#fff; border-top:1px solid #000c54; padding:30px 20px; display: inline-block; min-height: 275px; cursor: pointer;}
.body-container .section03 .cont-wrap .cont ul li.box:hover h3,
.body-container .section03 .cont-wrap .cont ul li.box:hover p {text-decoration: underline;}
.body-container .section03 .cont-wrap .cont ul li.box h3 { overflow: hidden;display: -webkit-box; white-space: normal;word-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; color:#333; font-size: 1.6rem; letter-spacing: -0.3px; display: block;	position: relative;	text-overflow: ellipsis;	padding: 0 !important;	height: calc(1em * 1.5 * 2);margin-bottom: 10px;}
.body-container .section03 .cont-wrap .cont ul li.box .text { overflow: hidden;display: -webkit-box; white-space: normal; -webkit-line-clamp: 5; -webkit-box-orient: vertical; color:#767676; font-size: 1.3rem; letter-spacing: -0.3px; padding-top:15px;	display: block;	position: relative;	text-overflow: ellipsis;padding: 0 !important;	height: calc(1em * 2 * 3);}
.body-container .section03 .cont-wrap .cont ul li.box .date {color:#8c8c8c; font-size: 1.4rem; position: absolute; bottom:20px; left:20px;}
.body-container .section03 .cont-wrap .cont ul li.arrow {position: absolute; cursor: pointer;}
.body-container .section03 .cont-wrap .cont ul li.arrow img {width: 12px; position: relative;}
.body-container .section03 .cont-wrap .cont ul li.arrow.left {top:50%; margin-top:-10px; left: 10px; transition:left .3s; }
.body-container .section03 .cont-wrap .cont ul li.arrow.left:hover {transition:left .3s; left:5px;}
.body-container .section03 .cont-wrap .cont ul li.arrow.right {top:50%; margin-top:-10px; right: 5px; transition:right .3s; }
.body-container .section03 .cont-wrap .cont ul li.arrow.right:hover {transition:right .3s; right:0px;}
.body-container .section03 .cont-wrap .wrap.none { text-align: center; color:#c2c9d4; position: relative; top:40%;}
.body-container .section03 .cont-wrap .wrap.none p {font-size: 1.3rem; font-weight: 500; color:#878f9c; }
.body-container .section03 .cont-wrap .wrap.none p i {font-size: 3rem; display: block; margin-bottom: 15px; color:#c2c9d4;}
.body-container .section03 .cont-wrap .cont ul li.box.link {border-top:0; overflow: hidden; background:#dfebff;}
.body-container .section03 .cont-wrap .cont ul li.box.link:hover {box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1); transition:box-shadow .3s;}
.body-container .section03 .cont-wrap .cont ul li.box.link:hover h3 {text-decoration: none;}
.body-container .section03 .cont-wrap .cont ul li.box.link h3 { z-index: 20; color: #00226b; font-size: 1.9rem; overflow: unset; word-break: keep-all;}
.body-container .section03 .cont-wrap .cont ul li.box.link h3 span {display: block; font-size: 1.4rem; margin-top: 5px; color: #6f8bc7;}
.body-container .section03 .cont-wrap .cont ul li.box.link img {position: absolute; width: 100px; z-index: 10;}
.body-container .section03 .cont-wrap .cont ul li.box.link img.bg01 {top:0; right:0; width: 130px}
.body-container .section03 .cont-wrap .cont ul li.box.link img.bg02 {bottom:0; left:0;}
.body-container .section03 .cont-wrap .cont ul li.box.link img.img01 {bottom:10px; right:0; width: 155px; }
.body-container .section03 .cont-wrap .cont ul li.box.disabled {text-align: center; cursor: unset;}
.body-container .section03 .cont-wrap .cont ul li.box.disabled p {position: absolute; top:50%; left:50%; font-size:1.2rem; color:#999; -webkit-transform: translate(-50%,-50%);-moz-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);-o-transform: translate(-50%,-50%); transform: translate(-50%,-50%);word-break: keep-all;}
.body-container .section03 .cont-wrap .cont ul li.box.disabled p i {display: block; margin-bottom: 10px; font-size: 1.5rem;}
.body-container .section03 .cont-wrap .cont ul li.box.disabled:hover p {text-decoration: none;}


/* section04 */
.body-container .section04 {position: relative; width: 1200px; margin: 0 auto; padding:90px 0 0;}
.body-container .section04 .cont-wrap > div {float:left; width:calc(50% - 15px);}
.body-container .section04 .cont-wrap > div .title {width:100%; position: relative; border-bottom:1px solid #000c54; padding-bottom:20px; margin-bottom:20px;}
.body-container .section04 .cont-wrap > div .title h3 {font-size: 1.8rem; line-height: 18px; font-weight: 600; letter-spacing: -0.5px; color:#000c54}
.body-container .section04 .cont-wrap > div .title img.more {width: 18px; height: 18px; position: absolute; top:5px;; right: 0; cursor: pointer; -webkit-transition: all .3s;-moz-transition: all .3s;-ms-transition: all .3s;-o-transition: all .3s;transition: all .3s;}
.body-container .section04 .cont-wrap > div .title img.more:hover {-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg);}
.body-container .section04 .cont-wrap .center-area {margin-left:15px;}
.body-container .section04 .cont-wrap .video-area {margin-right:15px;}
.body-container .section04 .cont-wrap .video-area .video {width: 100%; /*height: 315px;*/ overflow: hidden;}
.body-container .section04 .cont-wrap .video-area .video video {width: 100%;}
.body-container .section04 .cont-wrap .center-area .board ul li {position: relative; padding:20px 0; border-bottom:1px solid #e5e5e5; cursor: pointer;}
.body-container .section04 .cont-wrap .center-area .board ul li p {font-size: 1.5rem; line-height: 15px; font-weight: 400; color:#555; letter-spacing: -0.5px;text-overflow: ellipsis; white-space: nowrap; overflow: hidden; padding-right: 60px;}
.body-container .section04 .cont-wrap .center-area .board ul li .date {position: absolute; top:17px; right: 0; color:#8c8c8c; font-size: 1.4rem; }
.body-container .section04 .cont-wrap .center-area .board ul li.first-li {padding-top:0; min-height: 145px; }
.body-container .section04 .cont-wrap .center-area .board ul li.first-li .thumb {float:left; width: 175px; height: 125px; position: relative; overflow: hidden; margin-right: 20px;background:#f3f3f3;}
.body-container .section04 .cont-wrap .center-area .board ul li.first-li .thumb img {position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-o-transform: translate(-50%, -50%);transform: translate(-50%, -50%);}
.body-container .section04 .cont-wrap .center-area .board ul li.first-li .text {float: left; width: calc(100% - 195px); position: relative;}
.body-container .section04 .cont-wrap .center-area .board ul li.first-li .text h3 {font-size: 2rem; line-height: 20px; font-weight: 500; letter-spacing: -0.5px; padding-bottom:10px;text-overflow: ellipsis; white-space: nowrap; overflow: hidden; color:#333;}
.body-container .section04 .cont-wrap .center-area .board ul li.first-li .text p {font-size: 1.4rem; font-weight: 300; letter-spacing: -0.5px;color:#767676; line-height: 19.5px; margin-bottom: 20px; overflow: hidden;display: -webkit-box; white-space: normal;word-wrap: break-word; -webkit-line-clamp: 3; -webkit-box-orient: vertical; padding-right: 0;height: calc(1em * 2 * 4);}
.body-container .section04 .cont-wrap .center-area .board ul li.first-li .text .date {font-size: 1.3rem; color: #8c8c8c; position: static;}
.body-container .section04 .cont-wrap .center-area .board ul li:hover p {text-decoration: underline;}


/* section05 */
.body-container .section05 {position: relative; width: 1200px; margin: 0 auto; padding: 90px 0;}
.body-container .section05 .cont-wrap {display: flex; flex-wrap: wrap; gap: 30px;}
.body-container .section05 .cont-wrap .box {float: none; width: calc(50% - 15px); height: 180px; padding: 30px; cursor: pointer; -webkit-transition:box-shadow .3s;-moz-transition:box-shadow .3s;-ms-transition:box-shadow .3s;-o-transition:box-shadow .3s;transition:box-shadow .3s;}
.body-container .section05 .cont-wrap .box:hover {box-shadow: 16px 20px 15px -10px rgba(16, 20, 62, 0.25);}
.body-container .section05 .cont-wrap .box h3 {padding:13px 0 15px;}
.body-container .section05 .cont-wrap .box01 { background: url("../../img/main/foot_box_bg02.svg"); background-size: cover; background-position: center; background-repeat: no-repeat; }
.body-container .section05 .cont-wrap .box02 { background: url("../../img/main/foot_box_bg01.svg"); background-size: cover; background-position: center; background-repeat: no-repeat; }
.body-container .section05 .cont-wrap .box03 { background: url("../../img/main/foot_box_bg03.svg"); background-size: cover; background-position: center; background-repeat: no-repeat; }
.body-container .section05 .cont-wrap .box04 { background: url("../../img/main/foot_box_bg04.svg"); background-size: cover; background-position: center; background-repeat: no-repeat; }
.body-container .section05 .cont-wrap .box .tit { color: #fff; font-size: 1.5rem; line-height: 16px; letter-spacing: -0.3px; }
.body-container .section05 .cont-wrap .box .txt { color: #fff; font-size: 1.3rem; line-height: 14px; letter-spacing: -0.3px; font-weight: 300;}
.body-container .section05 .cont-wrap .box01 .txt {padding-bottom: 20px;}
.body-container .section05 .cont-wrap .box01 h3 { font-size: 2.5rem; line-height: 31px; font-weight: 600; letter-spacing: -0.75px; color: #fff; padding:10px 0 7px;}
.body-container .section05 .cont-wrap .box02 h3,
.body-container .section05 .cont-wrap .box04 h3 { font-size: 1.8rem; line-height: 26px; font-weight: 600; letter-spacing: -0.5px; color: #fff; padding-bottom:25px;}
.body-container .section05 .cont-wrap .box03 h3 { font-size: 1.8rem; line-height: 26px; font-weight: 600; letter-spacing: -0.5px; color: #fff; padding-bottom:25px;}
.body-container .section05 .cont-wrap .box a {color:#2a3176; font-size: 1.3rem; line-height: 14px; background: #fff; padding: 2px 14px; border-radius: 3px; font-weight: 500;}
.body-container .section05 .cont-wrap .box a img {width: 22px; margin-left:5px; -webkit-transition: margin-left .3s;-moz-transition: margin-left .3s;-ms-transition: margin-left .3s;-o-transition: margin-left .3s;transition: margin-left .3s; display: none;}
.body-container .section05 .cont-wrap .box:hover a img {margin-left:10px;}








@media all and (max-width: 1240px) {
	/* banner */
	.header-container .banner-wrap {min-width: auto; width: 100%;}
	.header-container .banner-wrap .quick-area {right: 0;}
	.header-container .banner-wrap .banner .banner-text-wrap,
	.header-container .banner-wrap .fix {width: 100%; padding:0 30px;}
	.header-container .banner-wrap .banner .banner-text-wrap .banner-text .title {font-size: 5.5rem; margin-top:15px; margin-bottom:40px;}
	.header-container .banner-wrap .banner .banner-text-wrap .banner-text .text {font-size: 2rem;}
	
	/* banner03 */
	.header-container .banner-wrap .banner03 .banner-text-wrap .banner-text .sub-title {font-size: 2rem; }
	.header-container .banner-wrap .banner03 .banner-text-wrap .banner-text .title {font-size: 4rem; line-height: 60px;}
	
	/* banner04 */
	.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .sub-title {font-size: 1.7rem; }
	.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .title {font-size: 4rem; line-height: 60px;}
	
	/* section01 */
	.body-container .section01 {width: 100%; margin: 50px 0;}
	.body-container .section01 .cont-wrap {background-size: cover;}
	
	/* section02 */
	.body-container .section02 .cont-wrap {width: 100%;}
	.body-container .section02 .cont-wrap .title {padding-left:30px;}
	
	/* section03 */
	.body-container .section03 .cont-wrap {width: 100%;}
	.body-container .section03 .cont-wrap .title {padding-left:30px;}
	.body-container .section03 .cont-wrap .cont ul {margin-left: 20px;}
	
	/* section04 */
	.body-container .section04 {width: 100%; padding:50px 0 0;}
	.body-container .section04 .cont-wrap > div {width:calc(50% - 30px); margin:0 15px;}
	
	/* section05 */
	.body-container .section05 {width: 100%; padding: 50px 0;}	
}

@media all and (max-width: 1140px) {
	/* banner04 */
	.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .title .bold { display: block; }
	
	/* section02 */
	.body-container .section02 .cont-wrap .title {width: 300px;}
	.body-container .section02 .cont-wrap .cont { width: calc(100% - 300px);}
	
	/* section03 */
	.body-container .section03 .cont-wrap .title {width: 300px;}
	.body-container .section03 .cont-wrap .cont { width: calc(100% - 300px);}
	.body-container .section03 .cont-wrap .title ul li a {width: auto; padding: 15px;}
	
	/* section05 */
	.body-container .section05 .cont-wrap {gap: 10px;}
	.body-container .section05 .cont-wrap .box { width: calc(50% - 5px);}
	.body-container .section05 .cont-wrap .box .tit {font-size: 1.3rem;}
	.body-container .section05 .cont-wrap .box .txt { font-size: 1.3rem;}
	.body-container .section05 .cont-wrap .box01 h3 { font-size: 2rem;}
	.body-container .section05 .cont-wrap .box02 h3,
	.body-container .section05 .cont-wrap .box04 h3 { font-size: 1.5rem; padding-bottom: 20px; padding-top: 5px;}
	.body-container .section05 .cont-wrap .box03 h3 { font-size: 1.5rem; padding-bottom: 20px; padding-top: 5px;}
	.body-container .section05 .cont-wrap .box a { font-size: 1.2rem; }
}

@media all and (max-width: 880px) {
	/* banner */
	.header-container .banner-wrap .banner .banner-bg {height: 450px;}
	.header-container .banner-wrap .banner .banner-bg .banner-img {background-size: cover; background-position: -250px;}
	.header-container .banner-wrap .quick-area {position: static; transform: none; top:auto}
	.header-container .banner-wrap .quick-area ul {width: 100%;}
	.header-container .banner-wrap .quick-area ul li {width: calc(25% - 1px); margin: 0 !important; border-right:1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;}
	.header-container .banner-wrap .quick-area ul li:last-child {border-right:0;}
	.header-container .banner-wrap .banner-text-wrap {top: 50px;}
	.header-container .banner-wrap .banner .banner-text-wrap .banner-text .sub-title {font-size: 2.2rem; font-weight: 400;}
	.header-container .banner-wrap .banner .banner-text-wrap .banner-text .title {font-size: 5rem; margin-bottom:30px;}
	.header-container .banner-wrap .banner .banner-text-wrap .banner-text .text {font-size: 1.8rem; line-height: 30px;}
	.header-container .banner-wrap .fix {bottom:215px;}

	/* banner02 */
	.header-container .banner-wrap .banner02 .banner-text-wrap .banner-text .title {font-size: 4rem; line-height: 55px; margin-bottom: 20px;}
	.header-container .banner-wrap .banner02 .banner-text-wrap .banner-text .title .bold {font-size: 5.2rem;}

	/* banner03 */
	.header-container .banner-wrap .banner03 .banner-text-wrap .banner-text .sub-title {font-size: 1.7rem; }
	.header-container .banner-wrap .banner03 .banner-text-wrap .banner-text .title {font-size: 3rem; line-height: 45px;}
	
	/* banner04 */
	.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .sub-title {font-size: 1.7rem; }
	.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .title {font-size: 4rem; line-height: 60px;}
	
	/* section01 */
	.body-container .section01 {margin:30px 0;}
	.body-container .section01 .cont-wrap a {padding-left:30px; padding-top: 35px;}
	.body-container .section01 .cont-wrap a h3 {font-size: 2.3rem;}
	.body-container .section01 .cont-wrap {height:130px;}
	
	/* section02 */
	.body-container .section02 {background-size: cover; height: auto;}
	.body-container .section02 .cont-wrap .title {width: 100%; padding:30px;}
	.body-container .section02 .cont-wrap .cont {width: 100%;}
	.body-container .section02 .cont-wrap .title a {float: right; margin-top: 45px; font-size:1.3rem; padding: 7px 10px;}
	.body-container .section02 .cont-wrap .title h3 {display: inline-block; font-size: 2.1rem; padding:20px 0 0; line-height: 29px; }
	.body-container .section02 .cont-wrap .cont ul li a p {font-size: 1.3rem;}
	
	/* section03 */
	.body-container .section03 { height: auto; background: #f8f8f8;}
	.body-container .section03:before {display: none;}
	.body-container .section03 .cont-wrap .cont {width: 100%; height: auto;background: none;}
	.body-container .section03 .cont-wrap .cont ul {margin:0; padding:0 30px 30px;}
	.body-container .section03 .cont-wrap .cont ul li.arrow {display: none;}
	.body-container .section03 .cont-wrap .cont ul li.box {width: calc(33.3% - 10px); min-height: 200px; margin-right: 10px; padding: 15px;}
	.body-container .section03 .cont-wrap .cont ul li.box:last-child {margin-right: 0; margin-bottom: 0;}
	.body-container .section03 .cont-wrap .cont ul li.box h3 {font-size: 1.4rem;}
	.body-container .section03 .cont-wrap .cont ul li.box .text {height: calc(1em * 2 * 2.1);}
	.body-container .section03 .cont-wrap .title {width: 100%; padding: 30px; background:none;}
	.body-container .section03 .cont-wrap .title h3 {padding:20px 0; font-size: 2rem;}
	.body-container .section03 .cont-wrap .title p {display: none;}
	.body-container .section03 .cont-wrap .title p br {display: none;}
	.body-container .section03 .cont-wrap .title ul {border-bottom:1px solid #b1b1b1;}
	.body-container .section03 .cont-wrap .title ul li { float: left; }
	.body-container .section03 .cont-wrap .title ul li a {font-size: 1.3rem; padding:5px 25px; border:0;}
	.body-container .section03 .cont-wrap .title ul li:hover a, 
	.body-container .section03 .cont-wrap .title ul li.select a {left: 0;}
	.body-container .section03 .cont-wrap .title > a {position: absolute; right: 30px; top: auto; bottom:30px; border:0; font-size: 1.2rem; padding:0;font-weight: 600;}
	.body-container .section03 .cont-wrap .title > a img {display: none;}
	.body-container .section03 .cont-wrap .title ul {position: static; top: auto; right: auto; transform: none;}
	.body-container .section03 .cont-wrap .wrap.none { padding:30px 0 60px; top:auto; }
	
	/* section04 */
	.body-container .section04 .cont-wrap .center-area .board ul li {padding:15px 0;}
	.body-container .section04 .cont-wrap .center-area .board ul li .date {font-size: 1.2rem; top: 12px;}
	.body-container .section04 .cont-wrap .center-area .board ul li.first-li .thumb {width: 120px; height: 70px; margin-right: 10px;}
	.body-container .section04 .cont-wrap .center-area .board ul li.first-li .text {width: calc(100% - 130px)}
	.body-container .section04 .cont-wrap .center-area .board ul li.first-li .text h3 {font-size: 1.6rem;}
	.body-container .section04 .cont-wrap .center-area .board ul li.first-li .text p {font-size: 1.3rem; height: calc(1em * 2 * 3);}
	.body-container .section04 .cont-wrap .center-area .board ul li.first-li .text .date {font-size: 1.2rem;}
	.body-container .section04 .cont-wrap .center-area .board ul li p {font-size: 1.3rem; padding-right: 50px;}
	
	/* section05 */
	.body-container .section05 .cont-wrap .box {width: 100%;}
}
@media all and (max-width: 680px) {
	/* banner */
	.header-container .banner-wrap .quick-area ul li a h3 {font-size: 1.6rem;}
	.header-container .banner-wrap .quick-area ul li a h3 img {width: 18px;}
	
	/* sectino02 */
	.body-container .section02 .cont-wrap .cont ul li {width: calc(33.3% - 1px); margin-right:1px !important; margin-bottom: 1px !important;}
	.body-container .section02 .cont-wrap .cont ul li:nth-of-type(3n) {margin-right: 0 !important;}
	
	/* section03 */
	.body-container .section03 .cont-wrap .cont ul li.box {width: 100%; margin-bottom: 20px;}
	.body-container .section03 .cont-wrap .title ul li a {padding: 5px 15px;}
	.body-container .section03 .cont-wrap .cont ul li.box.link h3 {margin-top: 55px; text-align: center;}
	
	/* section04 */
	.body-container .section04 .cont-wrap {padding: 0 30px;}
	.body-container .section04 .cont-wrap .video-area,
	.body-container .section04 .cont-wrap .center-area {width: 100%; margin: 30px 0 30px;}
	.body-container .section04 .cont-wrap .center-area .board ul li {padding:10px 0;}
	.body-container .section04 .cont-wrap > div .title {margin-bottom: 15px; padding-bottom: 15px;}
	.body-container .section04 .cont-wrap .center-area .board ul li .date {top: 8px;}
}
@media all and (max-width: 570px) {
	/* banner*/
	.header-container .banner-wrap .quick-area ul li a {padding: 13px}
	.header-container .banner-wrap .quick-area ul li:nth-child(1) a > img { width: 25px; margin-top:0;}
	.header-container .banner-wrap .quick-area ul li:nth-child(2) a > img { width: 38px }
	.header-container .banner-wrap .quick-area ul li:nth-child(3) a > img { width: 38px }
	.header-container .banner-wrap .quick-area ul li:nth-child(4) a > img { width: 32px}
	
}
@media all and (max-width: 475px) {
	/* banner*/
	.header-container .banner-wrap .banner .banner-bg .banner-img {background-position: -270px}
	.header-container .banner-wrap .quick-area ul li {height: 100px; text-align: center;}
	.header-container .banner-wrap .quick-area ul li a p,
	.header-container .banner-wrap .quick-area ul li a h3 img {display: none;}
	.header-container .banner-wrap .quick-area ul li a > img {position: static; margin-top: 5px;}
	.header-container .banner-wrap .quick-area ul li a h3 {font-size: 1.4rem;}

	/* banner02 */
	.header-container .banner-wrap .banner02 .banner-text-wrap { top: 0; }
	.header-container .banner-wrap .banner02 .banner-text-wrap .banner-text .title { font-size: 2.5rem; line-height: 45px; }
	.header-container .banner-wrap .banner02 .banner-text-wrap .banner-text .title .bold {font-size: 4rem;}
	
	/* banner04 */
	.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .sub-title {font-size: 1.5rem; }
	.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .title {font-size: 4rem; line-height: 55px; margin-bottom: 10px;}
	
	/* pop */
	.pop-wrap .pop-area .cont p.account span {display: block; margin:5px 0;}

	/*section03*/
	.body-container .section03 .cont-wrap .cont ul li.box.link h3 { text-align: left; margin-top: 30px; }
}
@media all and (max-width: 425px) {
	/*banner*/
	.header-container .banner-wrap .fix {bottom: 145px;}
	.header-container .banner-wrap .fix .page .dot {margin-top: 15px;}
	.header-container .banner-wrap .banner .banner-bg {height: 350px;}
	.header-container .banner-wrap .banner .banner-text-wrap, .header-container .banner-wrap .fix {padding: 0 20px;}
	.header-container .banner-wrap .banner .banner-text-wrap .banner-text .title {font-size: 3rem; margin: 10px 0 25px; line-height: 30px;}
	.header-container .banner-wrap .banner .banner-text-wrap .banner-text .sub-title {font-size: 1.8rem;}
	.header-container .banner-wrap .banner .banner-text-wrap .banner-text .text {font-size: 1.6rem; line-height: 22px;}

	/* banner02 */
	.header-container .banner-wrap .banner02 .banner-text-wrap { top: 15px; }
	.header-container .banner-wrap .banner02 .banner-text-wrap .banner-text .title {font-size:1.5rem !important; line-height: 35px; margin-bottom: 20px;}
	.header-container .banner-wrap .banner02 .banner-text-wrap .banner-text .title .bold { font-size: 2.7rem; }
	
	/* banner03 */
	.header-container .banner-wrap .banner03 .banner-text-wrap .banner-text .sub-title {font-size: 1.5rem; }
	.header-container .banner-wrap .banner03 .banner-text-wrap .banner-text .title {font-size: 2.5rem; line-height: 40px;}
	
	/* banner04 */
	.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .sub-title {font-size: 1.4rem; line-height: 25px; }
	.header-container .banner-wrap .banner04 .banner-text-wrap .banner-text .title {font-size: 3rem; line-height: 40px; margin-bottom: 10px;}
	
	/* section01 */
	.body-container .section01 .cont-wrap a {padding-left: 20px; padding-right: 100px; word-break: keep-all;}
	.body-container .section01 .cont-wrap a h3 {font-size: 2rem;}
	.body-container .section01 .cont-wrap a p {display: none;}
	.body-container .section01 .cont-wrap a h3 span {display: block;}
	
	/* section02 */
	.body-container .section02 .cont-wrap .title {padding: 20px;}
	.body-container .section02 .cont-wrap .cont ul li {height: calc(37% - 1px);}
	.body-container .section02 .cont-wrap .cont ul li a {padding: 0 10px; word-break: keep-all;}
	.body-container .section02 .cont-wrap .cont ul li a p {line-height: 17px;}
	.body-container .section02 .cont-wrap .cont ul li:nth-child(1) a img { width: 50px; margin: 18px 0 6px; }
	.body-container .section02 .cont-wrap .cont ul li:nth-child(2) a img { width: 66px; margin: 14px 0 6px; }
	.body-container .section02 .cont-wrap .cont ul li:nth-child(3) a img { width: 62px; margin: 28px 0 6px; }
	.body-container .section02 .cont-wrap .cont ul li:nth-child(4) a img { width: 52px; margin: 19px 0 6px; }
	.body-container .section02 .cont-wrap .cont ul li:nth-child(5) a img { width: 72px; margin: 11px 0 8px; }
	.body-container .section02 .cont-wrap .cont ul li:nth-child(6) a img { width: 70px; margin: 26px 0 6px; }
	.body-container .section02 .cont-wrap .cont ul li:nth-child(7) a img { width: 55px; margin: 17px 0 5px; }
	.body-container .section02 .cont-wrap .cont ul li:nth-child(8) a img { width: 40px; margin: 25px 0 4px; }
	
	/*sectino03*/
	.body-container .section03 .cont-wrap .title {padding:30px 20px 20px;}
	.body-container .section03 .cont-wrap .cont ul {padding: 0 20px 20px;}
	.body-container .section03 .cont-wrap .cont ul li.box {min-height: 150px;}
	.body-container .section03 .cont-wrap .cont ul li.box h3 { height: calc(1em * 1.5 * 1); }
	.body-container .section03 .cont-wrap .cont ul li.box .date { bottom: 15px;}
	.body-container .section03 .cont-wrap .cont ul li.box.link img.img01 {width: 130px;}
	.body-container .section03 .cont-wrap .cont ul li.box.link h3 { margin-top: 0; }
	
	/*section04*/
	.body-container .section04 .cont-wrap {padding: 0 20px;}
	
	/*section05*/
	.body-container .section05 .cont-wrap .box {padding: 20px; height:160px; }
	.body-container .section05 .cont-wrap .box01 h3 {padding-bottom: 5px;}
	
}


