/* 메인 비쥬얼 */ #main_visual {width : 100%;} #main_visual .swiper-slide{height : 720px; position: relative;} #main_visual .swiper-slide div.backgroundimg{width : 100%; height : 100%;background-repeat: no-repeat; background-position: center; background-size: cover;} #main_visual .sliderkit-text1 {position: absolute;top : 0; left : 0; right : 0; width : 100%; height: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: center;} #main_visual .sliderkit-text1>div{text-align: center; color : #fff; background-color: rgba(0,0,0,0.8); padding : 20px 25px 0px; margin-top : -167px;} #main_visual .sliderkit-text1 h2{font-size : 40px; font-weight: normal;} #main_visual .sliderkit-text1 h2 i {width : 20px; height: 20px; margin : 0px 10px 16px;} #main_visual .sliderkit-text1 h1{font-weight: lighter; font-size : 70px;background-image: url(../img/index/line.png);background-size: cover; padding :10px 0px 12px; margin-top : 10px; color : #bbef56;} #main_visual .sliderkit-text1 h1 b{font-weight: bold; color : #fff;} #main_visual .sliderkit-text1 a{color : #fff; border : solid 1px #212b3a; text-align: center; padding : 10px 80px 10px 20px; font-size : 21px; background-color: #27406d; position: relative;} #main_visual .sliderkit-text1 a >i {position: absolute; top : 26%; right : 7%; font-size : 25px;} #main_visual .sliderkit-text2 {position: absolute; top : 0; left : 0; right : 0; height: 100%; max-width : 1200px; width : 100%; margin : 0 auto;} #main_visual .sliderkit-text2>div{position: absolute; top : 20%; right : 0;color : #fff; background-color: rgba(0,0,0,0.7); text-align: right; max-width : 550px; padding : 45px 94px 30px 80px; } #main_visual .sliderkit-text2 h1{font-size : 45px; font-weight: 800; color : #00b2ff; position: relative; margin-bottom : 30px;} #main_visual .sliderkit-text2 h1>i{position: absolute; width : 40px; height: 40px;} #main_visual .sliderkit-text2 h1>i.quote-left{left : 0; top : 8px;} #main_visual .sliderkit-text2 h1>i.quote-right{right : -52px; bottom : 7px;} #main_visual .sliderkit-text2 h2{font-size : 35px; font-weight: 600;} #main_visual .sliderkit-text3 {position: absolute; top : 0; left : 0; right : 0; height: 100%; max-width : 1200px; width : 100%; margin : 0 auto;} #main_visual .sliderkit-text3>div{position: absolute; top : 20%; right : 0;color : #fff; background-color: rgba(0,0,0,0.7); text-align: right; max-width : 550px; padding : 85px 87px 60px 37px; } #main_visual .sliderkit-text3 h1{font-size : 45px; font-weight: 800; color : #00f7ff; position: relative; margin-bottom : 30px;} #main_visual .sliderkit-text3 h1>i{position: absolute; width : 40px; height: 40px;} #main_visual .sliderkit-text3 h1>i.quote-left{left : 10px; top : 8px;} #main_visual .sliderkit-text3 h1>i.quote-right{right : -52px; bottom : 5px;} #main_visual .sliderkit-text3 h2{font-size : 38px; font-weight: 600;} #main_visual .sliderkit-text3 h2>b{color : #00f7ff;} #main_visual .swiper-button-prev{ left : 40px; background-image: url(../img/btn_left.png); background-color: rgba(0,0,0,0.3); width : 60px; height: 60px; background-size: 25px;} #main_visual .swiper-button-next{ right : 40px; background-image: url(../img/btn_right.png); background-color: rgba(0,0,0,0.3); width : 60px; height: 60px; background-size: 25px;} #quick_menu {margin : -100px 0 90px; z-index: 9999; position: relative; } #quick_menu .inner{} #quick_menu ul{display: flex;} #quick_menu ul>li{width : 16.666%; text-align: center; color : #fff; position: relative; padding : 45px 0px ;} #quick_menu ul>li:after{content:''; background-color: #fff; opacity: 0.05; width : 100%; height: 100%; position: absolute; top : 0; left : 0;} #quick_menu ul>li>a{color : #fff; display: block; width : 100%; height: 100%;} #quick_menu ul>li>a>i{display: block; width : 17px; height: 17px; position: absolute; top : 10px; right : 10px; transform: skew(-0.1deg); transition : 0.3s ease-out;} #quick_menu ul>li>a>i:before{content: ''; display: block; position: absolute; top : 0; left : calc(50% - 1px); width : 2px; height: 100%; background-color: #fff;} #quick_menu ul>li>a>i:after{content: ''; display: block; position: absolute; top : calc(50% - 1px); right : 0; width : 100%; height: 2px; background-color: #fff;} #quick_menu ul>li>a>h3{font-size : 25px; display: flex; height: 56px; align-items: center; justify-content: center; margin-bottom : 15px;} #quick_menu ul>li>a>p{font-size : 15px; height: 34px; justify-content: center; align-items: center;} #quick_menu ul>li{background-repeat: no-repeat; background-position: bottom right;} #quick_menu ul>li:nth-child(1){background-color: #2f42c5; background-image: url(../img/index/quick_menu_01.png);} #quick_menu ul>li:nth-child(2){background-color: #2f56d7; background-image: url(../img/index/quick_menu_02.png);} #quick_menu ul>li:nth-child(3){background-color: #3293bd; background-image: url(../img/index/quick_menu_03.png);} #quick_menu ul>li:nth-child(4){background-color: #36b7d4; background-image: url(../img/index/quick_menu_04.png);} #quick_menu ul>li:nth-child(5){background-color: #195289; background-image: url(../img/index/quick_menu_05.png);} #quick_menu ul>li:nth-child(6){background-color: #0a2238; background-image: url(../img/index/quick_menu_06.png);} #quick_menu ul>li:hover:after{opacity: 0; visibility: hidden;} #quick_menu ul>li>a:hover>i{transform : rotate(180deg);} #service{margin-bottom : 90px; } #service .title{font-size : 40px; text-align: center; margin-bottom : 60px;} #service .title h2 {font-weight: 400;} #service .title h2 b{color : #1c96d5;font-weight: 700;} #service ul{display: flex; height: 535px;} #service ul>li{position: relative; width : 33.3333%; padding-top : 74px; text-align: center; color : #3e3e40;} #service ul>li>img {position: absolute; top : 0; left : 0; z-index: -1;} #service ul>li>i{position: absolute; top : 44px; margin : 0 auto; left : 0; right : 0; background-color: #3e3e40; width : 43px; height: 4px;} #service ul>li>h4{font-size : 35px; font-weight: 900; margin-bottom : 10px;} #service ul>li>h3{font-size : 32px; font-weight: 900; margin-bottom : 10px;} #service ul>li>p{font-size : 20px; font-weight: 700;} #service ul>li>a{font-size : 15px; position: absolute; top : 170px; display: inline-block; margin : 0 auto; left : 0; right : 0; width : 100%; max-width : 165px; border : solid 1px #505350; padding : 5px 18px; background-image: url(../img/index/arr-right.png); background-position: 90% 45%; background-repeat: no-repeat; text-align: left;} #cs_center{ background-color: #e7eaee; padding : 65px 0px 75px;} #cs_center .title{font-size : 40px; text-align: center; margin-bottom : 60px;} #cs_center .title h2 {font-weight: 400; margin-bottom : 15px;} #cs_center .title h2 b{color : #1c96d5;font-weight: 700;} #cs_center .title p {font-size : 16px; color : #8f8f98;} #cs_center ul{display: flex; justify-content: space-between;} #cs_center ul>li{} #cs_center ul>li.notice_box{background-color: #fff; width : 26%;} #cs_center ul>li.notice_box .top{padding : 30px 0px 25px 20px; border-bottom : solid 1px #e1e1e1; position: relative;} #cs_center ul>li.notice_box .top img {float: left; margin-right : 10px;} #cs_center ul>li.notice_box .top h6{font-size:21px; color : #070000;} #cs_center ul>li.notice_box .top p{font-size : 15px; color : #8f918f;} #cs_center ul>li.notice_box .top a{font-size : 30px; position: absolute; top : 30px; right : 25px; color : #666;} #cs_center ul>li.notice_box .bottom{} #cs_center ul>li.notice_box .bottom ol{padding : 38px 0px 38px 25px;} #cs_center ul>li.notice_box .bottom ol>li{margin-bottom : 20px;} #cs_center ul>li.notice_box .bottom ol>li>a{font-size : 14px;} #cs_center ul>li.notice_box .bottom ol>li>a em {font-size : 0.85em; margin-left : 3px; float: right; line-height: 18px; margin-right : 20px; margin-top : 3px;} #cs_center ul>li.map_box{width : 70%;} #cs_center ul>li.cs_info_box{width : 26%; background-color: #1c96d5; color : #fff; padding : 30px 15px 40px 20px; background-image: url(../img/index/cs_center_back.png); background-repeat: no-repeat; background-position: 130% 130%;} #cs_center ul>li.cs_info_box .top{} .root_daum_roughmap .wrap_map{height: 390px !important;} #cs_center ul>li.cs_info_box .top:after{ content: ''; clear: both; display: table;} #cs_center ul>li.cs_info_box .top > img {float: left; margin-right : 10px;} #cs_center ul>li.cs_info_box .top > h6 {font-size : 25px;} #cs_center ul>li.cs_info_box .top > p {color : #94b4e0; font-size : 15px; font-weight: 900;} #cs_center ul>li.cs_info_box .bottom >span {font-size : 35px; margin : 20px 0px 5px; display: inline-block; padding-left : 11px;} #cs_center ul>li.cs_info_box .bottom >span strong{font-weight: 900;} #cs_center ul>li.cs_info_box .bottom dl {display: flex; flex-wrap: wrap;} #cs_center ul>li.cs_info_box .bottom dl>dt{width : 100px; border-bottom : solid 1px #5bb2df; padding : 15px 0px 15px 12px; } #cs_center ul>li.cs_info_box .bottom dl>dd{width :calc(100% - 100px); border-bottom : solid 1px #5bb2df; padding : 15px 0px;} #naver_blog{ background-color: #ffffff; padding : 65px 0px 75px;} #naver_blog .title{font-size : 40px; text-align: center; margin-bottom : 60px;} #naver_blog .title h2 {font-weight: 400; margin-bottom : 15px;} #naver_blog .title h2 b{color : #1c96d5;font-weight: 700;} #naver_blog .title p {font-size : 16px; color : #8f8f98;} #bottom_slide>div {display: flex; justify-content: space-between;} #bottom_slide>div>.left{width : 15%; max-width : 116px; display: flex; background-color: #848484; color : #fff; align-items: center; justify-content: center; padding : 30px 10px; font-size : 16px; transform:skew(-0.1deg); font-weight: normal;} #bottom_slide>div>.right{width : 80%; padding : 15px 0px; margin : 0 auto;} #bottom_slide>div>.right .family_slider {position: relative;} #bottom_slide>div>.right .family_slider img {border : solid 1px #e1e1e1; width : 100%;} #bottom_slide>div>.right .family_slider .swiper-button-prev, .swiper-container-rtl .swiper-button-next {background-image: url(../img/slide_prev_f.png); left : -3%; width : 17px; height: 17px; background-size: contain; top : 72%;} #bottom_slide>div>.right .family_slider .swiper-button-next, .swiper-container-rtl .swiper-button-prev {background-image: url(../img/slide_next_f.png); right : -3%; width : 17px; height: 17px; background-size: contain; top : 72%;} @media all and (max-width:1280px){ #main_visual .sliderkit-text2>div{} #quick_menu ul>li>a>h3{font-size : 21px;} #quick_menu ul>li>a>p{font-size : 14px; letter-spacing: -1px;} #service ul>li>h4{font-size : 26px} #service ul>li>img{width : 100%;} #cs_center ul{flex-wrap: wrap;} #cs_center ul>li.notice_box{width : calc(35% - 10px);} #cs_center ul>li.map_box{width : 65%; height: 400px;} #cs_center ul>li.cs_info_box{width : 100%; margin-top : 10px;} #cs_center ul>li.cs_info_box .bottom >span{font-size : 29px;} #cs_center ul>li.cs_info_box .bottom dl>dt{} #cs_center ul>li.cs_info_box .bottom dl>dd{} } @media all and (max-width:980px){ #main_visual .swiper-slide{height: 570px;} #main_visual .sliderkit-text1>div{margin-top : 0;} #main_visual .sliderkit-text1 h1{font-size : 50px;} #main_visual .sliderkit-text1 h2{font-size : 30px;} #main_visual .sliderkit-text1 h2 i{margin-bottom : 4px;} #main_visual .sliderkit-text2>div{padding : 20px 67px 24px 39px; top: auto; bottom : 0; width : 100%; max-width : 430px;} #main_visual .sliderkit-text2 h1{font-size : 35px; margin-bottom : 10px;} #main_visual .sliderkit-text2 h2{font-size : 25px;} #main_visual .sliderkit-text2 h1>i {width : 30px;} #main_visual .sliderkit-text3>div{padding:30px 46px 28px 24px; top : auto; bottom : 0;} #main_visual .sliderkit-text2 h1>i.quote-left{left : 51px; top : 5px;} #main_visual .sliderkit-text2 h1>i.quote-right{right : -38px; bottom : -3px;} #main_visual .sliderkit-text3 h1{font-size : 35px; margin-bottom : 10px;} #main_visual .sliderkit-text3 h2{font-size : 28px;} #main_visual .sliderkit-text3 h1>i{width : 26px;} #main_visual .sliderkit-text3 h1>i.quote-right{right : -37px; bottom : -4px;} #main_visual .sliderkit-text3 h1>i.quote-left{left : 0; top : 3px;} #quick_menu {margin-top : 0; margin-bottom : 57px;} #quick_menu .inner{padding : 0;} #quick_menu ul{flex-wrap: wrap;} #quick_menu ul>li{width : 33.333%;} #quick_menu ul>li:nth-child(6){background-color: #3887ca;} #service .title{font-size : 30px; margin-bottom : 47px;} #service ul{flex-wrap: wrap; height: auto;} #service ul>li{width : 100%; height: 200px; padding-top : 60px; background-repeat: no-repeat; background-position: right;} #service ul>li:nth-child(1){background-color: #dbd3c6; background-image: url(../img/index/m_service_01.jpg)} #service ul>li:nth-child(2){background-color: #c6dcb8; background-image: url(../img/index/m_service_02.jpg)} #service ul>li:nth-child(3){background-color: #bfe2fe; background-image: url(../img/index/m_service_03.jpg)} #service ul>li>i{top : 40px; left : 20px; margin : 0;} #service ul>li>p{text-align: left; padding-left : 20px; font-size : 18px;} #service ul>li>h4{text-align: left; padding-left : 20px; font-size : 20px;} #service ul>li>img{height: 100%; width : auto; left: auto; right : 0; z-index: 999; display: none;} #service ul>li>a{bottom : 37px; top: auto; margin : 0; left : 20px;} #cs_center ul>li.notice_box{width : 100%; margin-bottom : 10px;} #cs_center ul>li.map_box{width : 100%;} #cs_center {padding-top : 57px;} #cs_center .title{font-size : 30px; margin-bottom : 52px;} #cs_center ul>li.notice_box .bottom ol{min-height: 200px;} } @media all and (max-width:600px){ #main_visual .swiper-slide{height: 325px;} #main_visual .sliderkit-text1>div{margin: 0px 20px; padding : 12px 5px 0px;} #main_visual .sliderkit-text1 h1{font-size : 26px; padding : 0px 10px 12px;} #main_visual .sliderkit-text1 h2{font-size : 20px;} #main_visual .sliderkit-text1 h2 i{width : 13px; height: 13px; margin : 0px 7px 1px;} #main_visual .sliderkit-text2>div{margin : 0px 20px; width : auto; padding : 20px 30px 24px 14px; bottom : 10px;} #main_visual .sliderkit-text2 h1{font-size : 18px;} #main_visual .sliderkit-text2 h2{font-size : 16px; line-height: 23px;} #main_visual .sliderkit-text2 h1>i{width : 15px; height: 15px;} #main_visual .sliderkit-text2 h1>i.quote-left{left : auto; right : 200px; top : 1px;} #main_visual .sliderkit-text2 h1>i.quote-right{right : -24px; bottom : 5px;} #main_visual .sliderkit-text3>div{top : 10px; bottom : auto; padding : 18px 30px 18px 24px; right : 10px;} #main_visual .sliderkit-text3 h1{font-size : 18px;} #main_visual .sliderkit-text3 h2{font-size : 16px; line-height: 23px;} #main_visual .sliderkit-text3 h1>i{width : 15px; height: 15px;} #main_visual .sliderkit-text3 h1>i.quote-right{right : -21px; bottom : 4px;} #main_visual .sliderkit-text3 h1>i.quote-left{left: auto; right : 145px; top : 1px;} #main_visual .swiper-button-prev{width : 40px; height: 40px; background-size: 15px; left : 10px; } #main_visual .swiper-button-next{width : 40px; height: 40px; background-size: 15px; right : 10px;} #quick_menu{margin-bottom : 35px;} #quick_menu ul>li{padding : 30px 0px; background-size: 30%;} #quick_menu ul>li:after{display: none;} #quick_menu ul>li>a>h3{font-size : 16px; height: 40px; margin-bottom : 0px;} #quick_menu ul>li>a>p{font-size : 12px; display: none;} #quick_menu ul>li>a>i{width : 12px; height: 12px;} #service{margin-bottom : 44px;} #service .title{font-size : 21px; margin-bottom : 35px;} #service ul>li{background-size: cover;} #service ul>li:nth-child(1){} #service ul>li:nth-child(1)>a{background-color: rgba(219, 211, 198, 0.5);} #service ul>li:nth-child(1)>h4{text-shadow: 0px 0px 4px #dbd3c6;} #service ul>li:nth-child(2){} #service ul>li:nth-child(2)>a{background-color: rgba(200, 221, 188, 0.5);} #service ul>li:nth-child(2)>h4{text-shadow: 0px 0px 4px #c8ddbc;} #service ul>li:nth-child(3){} #service ul>li:nth-child(3)>a{background-color: rgba(191, 226, 254,0.5);} #service ul>li:nth-child(3)>h4{text-shadow: 0px 0px 4px #bfe2fe;} #cs_center{padding : 35px 0px;} #cs_center .title{font-size : 21px; margin-bottom : 35px;} #cs_center .title p{font-size : 13px; letter-spacing: -1px} #cs_center ul>li.notice_box .top{padding : 15px 0px 11px 12px;} #cs_center ul>li.notice_box .top a{top : 17px;} #cs_center ul>li.notice_box .top h6{font-size : 19px; margin-top : 4px;} #cs_center ul>li.notice_box .top p{font-size : 13px;} #cs_center ul>li.notice_box .bottom ol {padding : 15px 0px 15px 13px} #cs_center ul>li.map_box{height: 300px;} #cs_center ul>li.cs_info_box{padding : 20px 15px 24px 13px;} #cs_center ul>li.cs_info_box .top > h6{font-size : 19px; margin-top : 5px;} #cs_center ul>li.cs_info_box .top > p{font-size : 13px;} #cs_center ul>li.cs_info_box .top > img{margin-top : -8px;} #cs_center ul>li.cs_info_box .bottom >span{margin-top : 11px;} #cs_center ul>li.cs_info_box .bottom dl>dt{padding : 9px 0px 9px 12px} #cs_center ul>li.cs_info_box .bottom dl>dd{padding : 9px 0px;} #bottom_slide>div{flex-wrap: wrap; padding : 0;} #bottom_slide>div>.left{width : 100%;max-width : none; padding : 10px;} #bottom_slide>div>.right{width : 90%;} } /* main_visual */ @media all and (max-width:1779px){ } @media all and (max-width:1321px){ } @media all and (max-width:1200px){ } @media all and (max-width:980px){ } @media all and (max-width:600px){ }