@charset "UTF-8";

img { width: 100%; }
h3 {font: 700 42px/160% 'paybooc'; word-break: keep-all;}
p, li, span, input, a, button {word-break: keep-all;}
.sec { width: 100%; margin: 0px auto; position: relative;}
.sub_tit {font:500 28px/140% 'paybooc';}
.hide {display: none;}
.strong,strong{font-weight: 700;}

.quickMenu {width:120px; border-radius:10px 0px 0px 10px; overflow: hidden; position: fixed; right:0px; top:50%; transform: translateY(-45%); text-align: center; box-shadow: 3px 3px 8px rgb(0,0,0,0.15); z-index: 3;}
.quickMenu .quick {width:100%;  background: #222; font:700 20px/100% 'paybooc'; padding:20px 32px; box-sizing: border-box; color:white;}
.quickMenu .q_kakao {width:100%; padding:19px 20px 20px; box-sizing: border-box; border-bottom: solid 1px #EEEEEE;  background: #fff;}
.quickMenu .q_kakao img {width:100%;}
.quickMenu .q_kakao p {margin-top:11px; font:500 15px/140% 'paybooc';}
.quickMenu .q_kakaoID p {font:500 14px/140% 'paybooc';}
.quickMenu .q_kakao .kakaoID {font-weight: 700; font-size: 16px; display: block; margin-top:3px; padding-top:3px;}
.quickMenu .q_call {width:100%; padding:25px 20px 25px; box-sizing: border-box;  border-bottom: solid 1px #EEEEEE; background: #fff;}
.quickMenu .q_call p {margin-top:10px; font:500 15px/140% 'paybooc';}
.quickMenu .q_call img {width:100%;}
.quickMenu .quick_top { width:100%;  font:700 16px/100% 'paybooc'; padding:15px 0px 20px; box-sizing: border-box; background-color: rgb(255,255,255,0.8); cursor: pointer;}
.quickMenu .quick_top span::before {content: ""; width:16px;height:7px; display: block; background:url('/resources/img/main/topbefore.png') no-repeat center/cover; margin:0px auto 3px;}


.section1 {padding:200px 0px 80px;}
.section1::before {content: ""; display: block; width:49.5vw; height:49.5vw; min-width: 300px; min-height: 300px; opacity: 0.1; background-color: #FAC8C8; border-radius: 500px; position: absolute; left:-11%; top:0; transform: translateY(-45%); z-index: -1;}
.section1::after {content: ""; display: block; width:26vw; height:26vw; opacity: 0.1; background-color: #FAC8C8; border-radius: 250px; position: absolute; left:-21%; top:0;  transform: translateY(40%); z-index: -1;}
.section1 h3 {width:70%;}
.section1 h3::before {content: ""; display: block; width:60px; height: 5px; margin-bottom: 7px; background-color: #B93535;}
.section1 .sub_tit {margin-top: 31px; width:50%;}
.section1 .com_list {display: -webkit-box;    display: -moz-box;    display: -ms-flexbox;    display: flex;}
.section1 .com_list li{width:125%; height:125%; position: relative; border-radius: 260px; box-sizing: border-box;}

/* li 원 크기 */
.section1 .com_list li:nth-child(1){width:12.5vw; height:12.5vw; margin-left:15vw; margin-top:12%;}
.section1 .com_list li:nth-child(2){width:14.5vw; height:14.5vw; margin-left:9vw; margin-top:5%;}
.section1 .com_list li:nth-child(3){width:18.5vw; height:18.5vw; margin-left:10vw; margin-top:8%;}
.section1 .com_list li:nth-child(4){width:12.5vw; height:12.5vw; margin-left:-0.5vw; margin-top:-9%;}

/* 잇는 선 , 대쉬 원 */
.section1 .com_list li::before {content: ""; display: block; width:20vw; height:3px; background-color: #E99393; position: absolute; left:50%; top:50%; z-index: -1; transform-origin:left;}
.section1 .com_list li:nth-child(1)::before {transform: rotate(-15deg);}
.section1 .com_list li:nth-child(2)::before {transform: rotate(12deg);}
.section1 .com_list li:nth-child(3)::before {transform: rotate(-54deg);}
.section1 .com_list li:last-child::before {display: none;}
.section1 .com_list li::after {content: ""; display: block; width:113%; height:113%; position: absolute; left:50%; top:50%; z-index: -1; border:dashed 1px #FAC8C8; transform: translate(-50%,-50%); border-radius: 260px;}


.section1 .com_list li .circle_deco {width:100%; height:100%; border-radius: 260px;  position: absolute; top:50%; left:50%; transform: translate(-50%,-50%);}

/* 백그라운드 원 */
.section1 .com_list li .circle_deco::before{content: ""; display: block; width:120%; height:120%; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); z-index: -1; background-color: #FAC8C8; opacity: 0.15;  border-radius: 260px; }
.section1 .com_list li .circle_deco::after{content: ""; display: block; width:140%; height:140%; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); z-index: -1; background-color: #FAC8C8; opacity: 0.15;  border-radius: 260px; animation: blink .8s linear infinite alternate;}

@-webkit-keyframes blink {
    0% { opacity: 0.15; }
    100% {opacity: 0;}
}
@keyframes blink {
    0% { opacity: 0.15; }
    100% {opacity: 0;}
}

/* 내부 원 */
.section1 .com_list li .circle {width:100%; height:100%; border: solid 13px #FAC8C8; box-sizing: border-box; background: #fff;  border-radius: 260px; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%);}


.section1 .com_list li .list_wrap {width:100%; font:500 28px/140% 'paybooc'; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%);text-align: center;}
.section1 .com_list li .list_wrap img {width:50px; height:50px;}
.section1 .com_list li .list_wrap span {display: block; margin-top:10px; line-height: 140%;}

.section2 {padding:147px 0px 0px; overflow: hidden;}
.section2 h3 {text-align: center; margin-bottom: 20px;}
.section2 .sub_tit {text-align: center; margin-bottom:80px;}
.section2 .mer_list {width:92%; max-width:1520px; margin:0px auto; position: relative;}
.section2 .mer_list .swiper-wrapper .swiper-slide {width:25%; height:550px; padding:50px; box-sizing: border-box; background: #E6F4F9;  position: relative;}
.section2 .mer_list .swiper-wrapper .swiper-slide > img {width:88%; position: absolute; bottom:20px; right:-20px; object-fit: cover;}
#mer01 > img {width:88%;}
#mer02 > img {width:88%;}
#mer03 > img {width:88%;}
#mer04 > img {width:70%;}
#mer05 > img {width:60%;}
.section2 .mer_list .swiper-wrapper .swiper-slide::after {content: ""; display: block; width:40px; height:40px; position: absolute; right:0px; top:0px; background: url('/resources/img/main/a-page.jpg') no-repeat center/contain;}
.section2 .button_wrap {position: absolute; top:50%; left:50%; transform: translateX(-50%); width:92%;  max-width: 1680px; z-index: 1;}
.section2 .swiper-button-next {width:60px; height:60px; right:-7%; border-radius: 50%; background:#AED7E5 url('/resources/img/common/arr_next.png') no-repeat center/contain; background-size: 16px;}
.section2 .swiper-button-prev {width:60px; height:60px; left:-7%; border-radius: 50%; background:#AED7E5 url('/resources/img/common/arr_prev.png') no-repeat center/contain; background-size: 16px;}

.section2 .mer_list .p_tit {font:700 34px 'paybooc'; margin-bottom: 20px;}
.section2 .mer_list .p_txt {font:300 20px/140% 'paybooc';}

.section3 {padding:220px 0px 0px;}
.section3 h3 {text-align: center; margin-bottom: 20px;}
.section3 .sub_tit {text-align: center; margin-bottom:80px;}
.section3 .sub_tit span {line-height: 140%;}
.section3 .pre_list {display: -webkit-box;    display: -moz-box;    display: -ms-flexbox;    display: flex;}
.section3 .pre_list .txt_num {font:700 64px 'paybooc'; color:#D7C748;}
.section3 .pre_list li {width:34%; padding:50px; box-sizing: border-box; background-color: #FCF9DE; position: relative;}
.section3 .pre_list li:nth-child(2) {background-color: #F8F3CA;}
.section3 .pre_list li .ico_toggle_wrap {width:50%; max-width: 200px; height:130px;  margin:40px auto 30px ; text-align: center; overflow: hidden; position: relative;}
.section3 .pre_list li .ico_toggle_wrap::after {content: ""; display: block; width:100%; height:200px; border-radius: 100px; top:30%; position: absolute; background-color: rgb(255, 255, 255,0.7);}
.section3 .pre_list li .ico_toggle_wrap .ico_toggle { margin:0px auto; Width:130px; height:120px; position: relative; z-index: 1;background: url('/resources/img/main/pre-ico01.png') no-repeat; background-size: cover;  background-position-y: top; transition: 0.3s ease-in;}
.section3 .pre_list li:nth-child(2) .ico_toggle_wrap .ico_toggle { background: url('/resources/img/main/pre-ico02.png') no-repeat top/cover;}
.section3 .pre_list li:nth-child(3) .ico_toggle_wrap .ico_toggle { background: url('/resources/img/main/pre-ico03.png') no-repeat top/cover;}
.section3 .pre_list li .pre_q {font:700 21px/140% 'paybooc'; transition: 0.2s; margin-bottom: 30px; transform-origin: left;}
.section3 .pre_list li span:not(.strong) {display: block; line-height: 140%;}
.section3 .pre_list li .pre_a {font:500 21px/140% 'paybooc'; transition: 0.2s;  transform-origin: left;}
.section3 .pre_list li .goBlod {transform: scale(1.2,1.2);}



.section4 {padding:220px 0px 200px;}
.section4 h3 {text-align: center; margin-bottom: 20px;}
.section4 .sub_tit {text-align: center; margin-bottom:80px;}
.section4 .sub_tit span{line-height: 140%;}
.section4 .map_contwrap {width:100%; position: relative; }
.section4 .map_contwrap .map_cont {width:66%; height:460px;}
.location3 > .map .root_daum_roughmap .wrap_map {height:100%;}
.location3 > .map .root_daum_roughmap .wrap_controllers {display: none;}
.section4 .map_contwrap .map_des {width:37%; padding:50px; box-sizing: border-box; position: absolute; right:0px; bottom:30px; background-color: #E6F4F9; z-index: 1;}
.section4 .map_contwrap .map_des::after {content: ""; display: block; width:40px; height:40px; position: absolute; right:0px; top:0px; background: url('/resources/img/main/a-page.jpg') no-repeat center/contain;}
.section4 .map_contwrap .map_des .map_logo {font:700 28px/100% 'paybooc'; margin-bottom: 57px;}
.section4 .map_contwrap .map_des .info {font:300 20px/140% 'paybooc'; margin-bottom: 15px;}
.section4 .map_contwrap .map_des .info span::before {content: ""; width:20px; height:20px; margin-right:15px; display: inline-block; background: url('/resources/img/main/ico-add.png') no-repeat center/cover; filter: invert(80%); position: relative; top:4px;}
.section4 .map_contwrap .map_des .info:nth-child(3) span::before {background: url('/resources/img/main/ico-call02.png') no-repeat center/cover;}
.section4 .map_contwrap .map_des .info span {font-weight: 500; margin-right:25px;}
.root_daum_roughmap .wrap_map {height:100% !important;}

.map_border {display: none !important;}
.roughmap_maker_label {display: none !important;}
.root_daum_roughmap .wrap_btn_zoom {display: none !important;}

@media screen and (max-width:1600px){
    .section1 .com_list li .list_wrap {font-size: 22px;}
}
@media screen and (max-width:1400px){
    .quickMenu {width:100px;}
    .quickMenu .quick {padding: 20px 0px;}
    .quickMenu .q_kakaoID p {font-size: 13px;}
    .quickMenu .q_kakao .kakaoID {font-size: 14px;}
    
    h3 {font-size: 32px;}
    .sub_tit {font-size: 20px;}
    .section1 {padding:120px 0px 80px;}
    .section1 .com_list li .list_wrap {font-size: 18px;}
    .section1 .com_list li .list_wrap img {width:40px; height:40px;}
    .section1 .com_list li .list_wrap span {margin-top:6px;}
    .section1 .com_list li:nth-child(1){width:14.5vw; height:14.5vw; margin-left:8vw; margin-top:12%;}
    .section1 .com_list li:nth-child(2){width:16.5vw; height:16.5vw; margin-left:9vw; margin-top:5%;}
    .section1 .com_list li:nth-child(4){width:14.5vw; height:14.5vw; margin-left:-0.5vw; margin-top:-9%;}
    .section2 .mer_list .swiper-wrapper .swiper-slide {height:460px;}

    .section3 .pre_list li .pre_q {font-size: 18px;}
    .section3 .pre_list li .pre_a {font-size: 18px;}
    .section3 .pre_list li .goBlod {transform: scale(1.1,1.1);}
}

@media screen and (max-width:1300px){
    
    .section3 .pre_list {-webkit-box-lines: multiple;        -moz-flex-wrap: wrap;        -ms-flex-wrap: wrap;        flex-wrap: wrap;}
    .section3 .pre_list li {width:100%; margin-bottom: 20px; padding:40px 50px;}
    .section3 .pre_list li:last-child {margin-bottom:0px;}
    .section3 .pre_list .txt_num {font-size: 34px;}
    .section3 .pre_list .list {display: -webkit-box;        display: -moz-box;        display: -ms-flexbox;        display: flex;}
    .section3 .pre_list li .ico_toggle_wrap {width:230px; margin: 20px 40px 0px 0px;}
    .section3 .pre_list li .pre_q {margin: 20px 0px 10px; padding-right:20px;}
    .section3 .pre_list li .pre_a {margin: 20px 0px 10px; padding-right:20px;}
    .section3 .pre_list li span:not(.strong) {display: inline; }
    .section3 .pre_list .txt_wrap {width:calc(100% - 230px);}
    
    .section4 .map_contwrap .map_des .info span {display: block; margin-bottom: 8px;}
}
@media screen and (max-width:1024px){
    .quickMenu { width:80px; border-radius:10px; top:78vh; right:4vw;}
    .quickMenu .quick {display: none; font-size: 12px; padding:10px 4px;}
    .quickMenu .quick_top {font-size: 13px; padding:10px 0px 14px;}
    .quickMenu .q_kakao {padding:10px 8px 10px 10px;}
    .quickMenu .q_call {padding:10px;}
    .quickMenu .q_kakao img {width:40px;height:40px;}
    .quickMenu .q_kakao p {display: none; margin-top: 0px;}
    .quickMenu .q_kakaoID img {display: none;}
    .quickMenu .q_kakaoID p {display: block;font-size: 12px;}
    .quickMenu .q_kakao .kakaoID {font-size: 13px; padding-top:0px;}
    .quickMenu .q_call img {width:40px;height:40px;}
    .quickMenu .q_call p {display: none;}
    
    .section1 h3 {width:100%; }
    .section1 .com_list li:nth-child(1){width:18.5vw; height:18.5vw; margin-left:6vw; margin-top:12%;}
    .section1 .com_list li:nth-child(2){width:18.5vw; height:18.5vw; margin-left:6.5vw; margin-top:5%;}
    .section1 .com_list li:nth-child(3){width:18.5vw; height:18.5vw; margin-left:7.2vw; margin-top:8%;}
    .section1 .com_list li:nth-child(4){width:18.5vw; height:18.5vw; margin-left:1vw; margin-top:-9%;}
    .section1 .com_list li:nth-child(3)::before {transform: rotate(-41deg);}

    .section2 .mer_list .swiper-wrapper .swiper-slide {height:400px;}
    .section2 .mer_list .p_tit {font-size: 24px;}
    .section2 .mer_list .p_txt {font-size: 18px;}

    .section4 .map_contwrap .map_des .map_logo {font-size: 18px; margin-bottom: 40px;}
    .section4 .map_contwrap .map_des .info {font-size: 16px;}
}

@media screen and (max-width:768px){
    h3 {font-size: 22px;}
    .sub_tit {font-size: 16px;}
    .section2 h3,.section3 h3,.section4 h3 {margin-bottom: 10px;}
    .section2 .sub_tit,.section3 .sub_tit,.section4 .sub_tit {font-size: 16px; margin-bottom: 40px;}
    
    .sec {padding:100px 0px 0px;}
    .sec:last-child {padding:80px 0px 400px;}

    .section1 .sub_tit {width:100%; margin-top: 12px;}
    .com_wrap {width:80%; margin:0px auto; margin-top:80px;}
    .section1 .com_list { -webkit-box-lines: multiple;        -moz-flex-wrap: wrap;        -ms-flex-wrap: wrap;        flex-wrap: wrap;-webkit-box-pack: justify;        -moz-justify-content: space-between;        -ms-flex-pack: justify;        justify-content: space-between;}
    .section1 .com_list li {width:34vw !important; height:34vw !important;}
    .section1 .com_list li:nth-child(1){margin:0px !important;}
    .section1 .com_list li:nth-child(2){margin:24vw 0px 0px 0px !important;}
    .section1 .com_list li:nth-child(3){margin:-10vw 0px 0px 0px !important;}
    .section1 .com_list li:nth-child(4){margin:14vw 0px 0px 0px !important;}
    .section1 .com_list li:nth-child(1)::before {width:260px; transform: rotate(25deg);}
    .section1 .com_list li:nth-child(2)::before {width:280px; transform: rotate(147deg);}
    .section1 .com_list li:nth-child(3)::before {width:260px; transform: rotate(30deg);}

    .section1 .com_list li .list_wrap img {width:36px; height:36px;}
    
    .section2 .mer_list {width:78%;}
    .section2 .mer_list .p_tit {font-size: 20px;}
    .section2 .mer_list .p_txt {font-size: 16px;}
    .section2 .mer_list .swiper-wrapper .swiper-slide {height:440px; padding:40px;}
    .section2 .button_wrap {top:40%;}
    .section2 .swiper-button-prev {width:40px; height:40px; background-size: 11px;}
    .section2 .swiper-button-next {width:40px; height:40px; background-size: 11px;}

    .section3 .pre_list li {width:100%; padding:40px;}
    .section3 .pre_list .list {-webkit-box-lines: multiple;        -moz-flex-wrap: wrap;        -ms-flex-wrap: wrap;        flex-wrap: wrap;}
    .section3 .pre_list .txt_num {font-size: 24px;}
    .section3 .pre_list li .ico_toggle_wrap {width:100%; margin:20px auto 0px;}
    .section3 .pre_list .txt_wrap {width:100%;}
    .section3 .pre_list li .pre_q {font-size: 16px; padding-right:0px;}
    .section3 .pre_list li .pre_a {font-size: 18px; padding-right:0px;}
    .section3 .pre_list li .goBlod {font-size: 16px; transform: scale(1,1);}

    .section4 .map_contwrap .map_cont {width:100%; height:300px;}
    .section4 .map_contwrap .map_des {width:100%; bottom:0px; transform: translateY(110%); margin-top:20px; padding:40px;}
}

@media screen and (max-width:500px){
    .quickMenu {width:60px;}
    .quickMenu .q_kakaoID p,.quickMenu .q_kakao .kakaoID {font-size: 10px;}

    .com_wrap {margin-top:50px;}
    .section1 .com_list li {width:38vw !important; height:38vw !important;}
    .section1 .com_list li .circle {border: solid 7px #FAC8C8;}
    .section1 .com_list li .list_wrap {font-size: 16px;}
    .section1 .com_list li:nth-child(3) {margin:-14vw 0px 0px 0px !important;}
    .section1 .com_list li:nth-child(4) {margin:10vw 0px 0px 0px !important;}
    .section1 .com_list li::before {display: none;}
    .section1 .com_list li::after {width:110%; height:110%;}
    .section1 .com_list li .circle_deco::after {display: none;}
    .section1 .com_list li .circle_deco::before {animation: blink .8s linear infinite alternate;}
    .section1 .com_list li .list_wrap img {width:30px; height:30px;}

    .section2 .mer_list {width:78%;}
    .section2 .mer_list .swiper-wrapper .swiper-slide {height:400px;}
    .section2 .mer_list .swiper-wrapper .swiper-slide > img {right:10px;}

    .section3 .sub_tit span {display: block;}
    .section4 .sub_tit span {display: block;}
}