
#container {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    margin-top: 0px;
    font-family: "Gmarket Sans";
}
#container .section {
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    height: 928px;
    width: 100%;
    position: relative;
    /*scroll-snap-align: start;*/
    }

#container section#visual_section #visual_wrap {
    width: 100%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    display: block;
	background:url("/pages/basic/img/main/visual_1.jpg")  top center no-repeat;
	background-size: cover;}
#container section#visual_section #visual_wrap1 {
    width: 100%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    display: block;
	background:url("/pages/basic/img/main/visual_2.jpg")  top center no-repeat;
	background-size: cover;}
#container section#visual_section #visual_wrap2 {
    width: 100%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    display: block;
	background:url("/pages/basic/img/main/visual_3.jpg")  top center no-repeat;
	background-size: cover;}
#container section#visual_section  .visual .visual_txt{margin-top: 306px;font-weight: 600;font-family: "Gmarket Sans";color:#fff;text-align: center;display: block;top: 50%;}
#container section#visual_section  .visual .visual_txt h2{font-size: 58px;font-weight:400;}
#container section#visual_section   .visual_txt h4{font-size: 24px;    margin-top: -8px;display: block;letter-spacing: 0;     font-weight: 300;}
#container section#visual_section  .visual .visual_txt h3{font-size: 56px;color:#0cabfe;margin-top:30px;display: block;letter-spacing: 0;line-height: 65px;text-shadow: 0px 1px 1px #00000061;}
#container section#visual_section  .visual .visual_txt p{font-size: 18px;margin-top: 5px;display: block;letter-spacing: 0; font-weight: 300;}

.swiper-pagination-bullet {     width: 17px;
    height: 17px;
    background: none;
    border: 3px solid #bdb5b2;} 
.swiper-pagination-bullet-active { width: 17px;
    height: 17px;
    background: #2e98e2;
    border: 3px solid #2e98e2;} 
	
.swiper-pagination {bottom: 160px !important;}

#main-mouse-scroll { position:absolute; left:50%; bottom:0; width:33px; height:104px; margin-bottom:15px; font-size:16px; font-weight:400; text-align:center; color:#fff;}
#main-mouse-scroll div { position:absolute; left:0; bottom:0; animation:mouse_scroll 1s infinite;}
@keyframes mouse_scroll {
	0% { bottom:0; animation-timing-function:ease; }
	50% { bottom:20px; }
	100% { bottom:0; animation-timing-function:ease; }
}

		.main2 {max-width: 1300px; width: 98%; float: left;     margin-top: 35px; }
		.main2 .main_link { }
		.main2 .main_link ul { }
		.main2 .main_link ul li:nth-child(1) {     float: left; 
		width: calc(100% / 3 - 23.33333333333333px); 
		background:#6cc3fb url("/pages/basic/img/main/quick_icon1.png")  right 35px center no-repeat;
		padding: 30px 25px; }
		.main2 .main_link ul li:nth-child(2) {     float: left; margin-left: 35px;
		width: calc(100% / 3 - 23.33333333333333px);
		background:#6cc3fb url("/pages/basic/img/main/quick_icon2.png")  right 35px center no-repeat;
		padding: 26px 25px; }
		.main2 .main_link ul li:nth-child(3) {     float: left; margin-left: 35px;
		width: calc(100% / 3 - 23.33333333333333px);
		background:#6cc3fb url("/pages/basic/img/main/quick_icon3.png")  right 35px center no-repeat;
		padding: 30px 25px; }
		.main2 .main_link ul li { }
		.main2 .main_link ul li a { }
		.main2 .main_link ul li dl { }
		.main2 .main_link ul li dt {     font-size: 18px;  color: #000; }
		.main2 .main_link ul li dd {font-size: 13px;color:#000;font-family: 'Noto Sans KR';}
		.main2 .main_link ul li a:hover{transform: translateY(-20px);}
		.quick_service {     float: left;width: 100%;margin-top: 75px; }
		.quick_service h3 {     font-size: 38px;
    color: #000 }
		.quick_service h3 span {     font-weight: 400; } 

ul.sc5-quick{
    width: 100%;
    display: inline-block;
    margin-top: 48px;
}
ul.sc5-quick li{}
ul.sc5-quick li a{
    width: calc(100% / 7);
	transition: all .3s;
    display: inline-block;
    font-size: 17px;
    float: left;
    text-align: center;
    position: relative;
    box-sizing: border-box;
}
ul.sc5-quick li a:hover {transform: translateY(-10px); }
ul.sc5-quick li a:before{content:'';display: inline-block;width: 100%;position: relative; width:100px;
    height: 100px;
    border-radius: 50%;}
ul.sc5-quick li:nth-child(1) a:before{background:#eee url('/pages/basic/img/main/qs_icon1.png') center center no-repeat;}
ul.sc5-quick li:nth-child(2) a:before{background:#eee url('/pages/basic/img/main/qs_icon2.png') center center no-repeat;}
ul.sc5-quick li:nth-child(3) a:before{background:#eee url('/pages/basic/img/main/qs_icon3.png') center center no-repeat;}
ul.sc5-quick li:nth-child(4) a:before{background:#eee url('/pages/basic/img/main/qs_icon4.png') center center no-repeat;}
ul.sc5-quick li:nth-child(5) a:before{background:#eee url('/pages/basic/img/main/qs_icon5.png') center center no-repeat;}
ul.sc5-quick li:nth-child(6) a:before{background:#eee url('/pages/basic/img/main/qs_icon6.png') center center no-repeat;}
ul.sc5-quick li:nth-child(7) a:before{background:#eee url('/pages/basic/img/main/qs_icon7.png') center center no-repeat;}
ul.sc5-quick li a span{    display: block;margin-top:10px}

		.new_board { float: left;
    width: 100%;
    margin-top:60px; }
		.new_board .new_board_tab { float: left;
    width: 100%; }
		.new_board .new_board_tab ul { float: left;
    width: 100%; }
		.new_board .new_board_tab ul li {  float: left;
    width: calc(100% / 3);
    text-align: center;
    border: 1px solid #dcdcdc;  }
		.new_board .new_board_tab ul li a {     font-size: 18px;
    padding: 20px 0;
    float: left;
    text-align: center;
    width: 100%;
    color: #565656; } 
		.new_board .new_board_tab ul li .on { background: #3a3c43;
    color: #fff; } 
		
		.new_board .new_board_list { float: left;  width: 100%;      }
		.new_board .new_board_list ul { float: left;  width: 100%;     margin: 45px 0;     }
		.new_board .new_board_list ul li { float: left;   width: calc(100% / 3); }
		.new_board .new_board_list ul li:nth-child(1) {      border-right: 1px solid #dfdfdf;    }
		.new_board .new_board_list ul li:nth-child(2) {   width: calc(100% / 3 - 30px);   border-right: 1px solid #dfdfdf;      margin-left: 30px;   }
		.new_board .new_board_list ul li:nth-child(3) {   width: calc(100% / 3 - 30px);   margin-left: 30px;  }
		.new_board .new_board_list ul li a {  }
		.new_board .new_board_list ul li dl { }
		.new_board .new_board_list ul li dl dt {     font-size: 20px;
    display: inline-block;
    width: calc(100% - 30px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
		.new_board .new_board_list ul li dl .new_board_content {
    font-size: 16px;
    font-weight: 500;
    white-space: normal;
    line-height: 22px;
    height: 44px;
    text-align: left;
    word-wrap: break-word;
    display: -webkit-box;
    margin-top: 10px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-family: "Pretendarda";
    }
		.new_board .new_board_list ul li dl .new_board_date { font-size:14px;     margin-top: 20px; padding-bottom:20px; }
		
		.main3 {     margin-top: 35px;
    background: #ececec;
    width: 100%; }
		.main3 .new_photo {     max-width: 1300px;
    width: 98%;     padding: 60px 0;
    margin: 0 auto;     }
		.main3 .new_photo h3 { font-size: 38px;
    color: #000 }
		.main3 .new_photo h3 span {  font-weight: 400; }
		.main3 .new_photo h3 a {        float: right;
    font-size: 18px;     font-weight: 400;
    margin-top: 18px; }
		.main3 .new_photo h3 a img {     position: relative;
    top: 9px;
    margin-left: 5px; }
		.main3 .new_photo ul {display: flex;margin-top: 40px;/* gap: 20px 1px; */}
		.main3 .new_photo ul li {flex: 0 0 calc(25% - -11px);}
		.main3 .new_photo ul li a { }
		.main3 .new_photo ul li a dl {width: 295px;}
		.main3 .new_photo ul li a dt { }
		.main3 .new_photo ul li a dt img {width: 100%; height:208px }
		.main3 .new_photo ul li a dd {
    font-family: "Pretendarda";
    font-size: 17px;
    display: inline-block;
    width: calc(100% - 30px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 10px;
    font-weight: 400;
    }
	
	.main4 {    
	background:url("/pages/basic/img/main/bottom_visual.jpg")  center no-repeat;
    width: 100%; }
	
	.main4 .main_counsel {  max-width: 1300px;
    width: 98%;     padding: 60px 0 100px 0;
    margin: 0 auto;     }
	.main4 .main_counsel h3 { font-size:44px; color:#ffffff;     font-weight: 400; }
	.main4 .main_counsel h4 {font-size: 48px;color:#ffffff;font-weight: 400;margin: 20px 0;}
	.main4 .main_counsel p {font-size: 16px;margin-top: 5px;color:#ffffff;font-weight: 300;}
	.main4 .main_counsel a {
    font-size: 18px;
    font-weight: 500;
    color: #ffffff;
    background: #4095c3;
    font-weight: 400;
    padding: 12px 32px;
    margin-left: 4px;
    }
	.main4 .main_counsel a  img {
    position: relative;
    top: 8px;
    }
	
	@media screen and (max-width: 1260px) {
	.main3 .new_photo ul li {flex: 0 0 calc(25% - 0px);}
		.main3 .new_photo ul li a dl {width: 242px;}
		.main3 .new_photo ul li a dt img {width: 100%; height:180px }
		}

	@media screen and (max-width: 1100px) {
		.main2 .main_link ul li {         width: 100% !important;
        margin: 5px 0 !important; }
		
		ul.sc5-quick li a{width: calc(100% / 4); margin: 20px 0; }
	
	}

	@media screen and (max-width: 1000px) {
     .main3 .new_photo ul li { width: calc(100% / 3 - 5px);         display: inline-block; }
     .main3 .new_photo ul {
        display: inline-block;
        text-align: center;
        height: 214px;
        overflow: hidden;}
		.main3 .new_photo ul li a dl {width: 240px;}
	}

	@media screen and (max-width:780px) {
     .main3 .new_photo ul li { width: calc(100% / 2 - 5px);    display: inline-block;} 
	 .main3 .new_photo ul li a dl {width: 280px;}
	 .main3 .new_photo ul {
        display: inline-block;
        text-align: center;
        height: 214px;
        overflow: hidden;}
		}

	@media screen and (max-width: 600px) {
	.quick_service h3 {
    font-size: 30px;}
		ul.sc5-quick li a {     width: calc(100% / 3); }
		.new_board .new_board_list ul li { width:100% !important; margin: 5px 0 !important; border:0 none; }
		.new_board .new_board_list ul li:nth-child(1) { border:0 none;          border-bottom: 1px solid #dfdfdf;}
		.new_board .new_board_list ul li:nth-child(2) { border:0 none;         border-bottom: 1px solid #dfdfdf; }
		.main3 .new_photo h3 {    font-size: 30px;}
	 .main3 .new_photo ul li a dl {width: 240px;}
	}

	@media screen and (max-width: 500px) {
	    .main3 .new_photo ul {
        display:block;
        text-align: center;
        height: 244px;
        overflow: hidden;
    }
	 .main3 .new_photo ul li { width: calc(100% / 1 - 50px);  display:block; margin:0 auto}

	 .main3 .new_photo ul li a dl {width: 380px;}
	     .main3 .new_photo ul li a dt img {
        width: 100%;
        height: 215px;
    }
	 	@media screen and (max-width:420px) {
		.main3 .new_photo ul li a dl {
        width: 100%;		
			}
			}
	@media screen and (max-width:380px) {
		ul.sc5-quick li a {     width: calc(100% / 2); }
		}

@keyframes bounce-top{
	0% { transform:translateY(0); -webkit-transform:translateY(0); }
	50% { transform:translateY(15%); -webkit-transform:translateY(15%); }
	100% { transform:translateY(0); -webkit-transform:translateY(0); }
}
@-webkit-keyframes bounce-top {
	0% { transform:translateY(0); -webkit-transform:translateY(0); }
	50% { transform:translateY(15%); -webkit-transform:translateY(15%); }
	100% { transform:translateY(0); -webkit-transform:translateY(0); }
}


@keyframes bounce-right{
	0% { transform:translateX(0); -webkit-transform:translateX(0); }
	50% { transform:translateX(3%); -webkit-transform:translateX(3%); }
	100% { transform:translateX(0); -webkit-transform:translateX(0); }
}
@-webkit-keyframes bounce-right{
	0% { transform:translateX(0); -webkit-transform:translateX(0); }
	50% { transform:translateX(3%); -webkit-transform:translateX(3%); }
	100% { transform:translateX(0); -webkit-transform:translateX(0); }
}


/**************************************************************** 반응형 CSS ****************************************************************/




@media screen and (max-width: 1400px) {
#container .section{height: 680px;}
	.swiper-pagination {
    bottom: 60px !important;}
#container section#visual_section .visual .visual_txt {
    margin-top: 180px;}
#container section#three_section #three_wrap .quick{width:960px}
ul.sc3-quick li a{
    transition: all .3s;
    display: inline-block;
    font-size: 16px;
    float: left;
    text-align: center;
    position: relative;
    box-sizing: border-box;
    width: calc(22% - 46px);
    height: 168px;
    background: #891b1bab;
    margin: 0px 8px;
    border-radius: 100px;
    color: #fff;
    }

ul.sc3-quick li a:before{content:'';display: inline-block;width: 100%;position: relative;height: 100px;}
ul.sc3-quick li:nth-child(1) a:before{background: url('/pages/basic/img/main/icon_1.png') center 20px no-repeat;}
ul.sc3-quick li:nth-child(2) a:before{background: url('/pages/basic/img/main/icon_2.png') center 20px no-repeat;}
ul.sc3-quick li:nth-child(3) a:before{background: url('/pages/basic/img/main/icon_3.png') center 20px no-repeat;}
ul.sc3-quick li:nth-child(4) a:before{background: url('/pages/basic/img/main/icon_4.png') center 20px no-repeat;}
ul.sc3-quick li:nth-child(5) a:before{background: url('/pages/basic/img/main/icon_5.png') center 20px no-repeat;}

}


@media screen and (max-width: 1200px) {
 #container .section {
        height: 620px;}
#container section#visual_section .visual .visual_txt h3 {
    font-size: 45px;
    line-height: 54px;}
#fp-nav.fp-right{display:none}
ul.sc3-quick li a{
    width: calc(20% - 46px); height: 148px;}

	.new_board .new_board_list ul li dl .new_board_content{line-height:24px}
}


@media screen and (max-width: 960px) {
    #container .section {
        height: 520px;}
#container section#visual_section .visual .visual_txt { margin-top: 120px;}
#container section#visual_section .visual .visual_txt h2 {font-size: 47px;}
#container section#visual_section .visual_txt h4 {
    font-size: 21px;}
    #container section#visual_section .visual .visual_txt h3 {
        font-size: 36px;margin-top: 15px;line-height: 41px;}
		#container section#visual_section .visual .visual_txt p {
    font-size: 16px;margin-top: 3px;}
	.swiper-pagination { bottom: 60px !important;}



#container section#three_section #three_wrap .quick {margin-left:5%; display: block;}
ul.sc3-quick li a {
        width: calc(17% - 46px);
        height: 118px;}
ul.sc3-quick li a:before{content:'';display: inline-block;width: 100%;position: relative;height:66px; }
ul.sc3-quick li:nth-child(1) a:before{background: url('/pages/basic/img/main/icon_1.png') center 20px no-repeat; background-size:40%;}
ul.sc3-quick li:nth-child(2) a:before{background: url('/pages/basic/img/main/icon_2.png') center 20px no-repeat;background-size:40%;}
ul.sc3-quick li:nth-child(3) a:before{background: url('/pages/basic/img/main/icon_3.png') center 20px no-repeat;background-size:40%;}
ul.sc3-quick li:nth-child(4) a:before{background: url('/pages/basic/img/main/icon_4.png') center 20px no-repeat;background-size:40%;}
ul.sc3-quick li:nth-child(5) a:before{background: url('/pages/basic/img/main/icon_5.png') center 20px no-repeat;background-size:40%;}
#container section#fourth_section{padding:20px}
}


@media screen and (max-width: 780px) {
#container section#three_section #three_wrap .quick {margin-left:2%;}
 ul.sc3-quick li a {width: calc(17% - 55px);height: 109px; }
}


@media screen and (max-width: 690px) {
  #container section#visual_section .visual .visual_txt h2 {
        font-size: 35px;
        }
    #container section#visual_section .visual_txt h4 {
        font-size: 15px;
        }
	    #container section#visual_section .visual .visual_txt h3 {
        font-size: 23px;
        margin-top: 10px;
        line-height: 25px;
        }
		#container section#visual_section .visual .visual_txt p{
        font-size: 14px;
        margin-top: 3px;
        width: 80%;
        text-align: center;
        margin: 3px auto;
        justify-content: center;
        align-items: center;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        word-wrap: break-word;
        word-break: break-word;
    }

#container section#three_section #three_wrap .quick { width:360px; display: block; margin: 0 auto;}
ul.sc3-quick li a {
        transition: all .3s;
        display: block;
        font-size: 16px;
        width: calc(46% - 15px);
        height: 53px;
        background: #891b1bab;
        margin-top: 14px;
        }

ul.sc3-quick li a:before{width: 100%;position: relative;height:35px;}
ul.sc3-quick li:nth-child(1) a:before{background:none;height: 0;}
ul.sc3-quick li:nth-child(2) a:before{background:none;height: 0;}
ul.sc3-quick li:nth-child(3) a:before{background:none;height: 0;}
ul.sc3-quick li:nth-child(4) a:before{background:none;height: 0;}
ul.sc3-quick li:nth-child(5) a:before{background:none;height: 0;}

.tit_inquiry {font-size: 28px;}
.main4 .main_counsel {
    max-width: 1300px;
    width: 100%;
    padding:30px 0 80px 10px;
    margin: 0 auto;
    background: #00000094;}
	.main4 .main_counsel h3 {
    font-size: 35px;}
	.main4 .main_counsel p {
    font-size: 14px;}
	.main4 .main_counsel h4 { font-size: 35px;}
}
