/* 메인슬라이더 */
#idx_wrapper{ width:100%; height:500px; margin-top:85px;}

#slogan{ width:700px; position:absolute; top:170px; left:50%; margin-left:-600px; z-index:998;}
#slogan .img01{ visibility:hidden;}
#slogan .mt{  font-size:1.27em; letter-spacing:0; font-weight:400; color:rgba(0,0,0,0.7); margin-top:20px; visibility:hidden;}
#slogan  p{ font-size: 1.7em; color: #555; line-height: 1em; font-weight: 500; font-family: 'paybooc-Bold',sans-serif; margin:0 0 7px}
#slogan  h2{ font-size: 4.5em; color: #333; line-height: 1.2em; font-weight: 500; font-family: 'paybooc-Bold',sans-serif;}
#slogan  h2 span{ display:block; color:#fb9397 }

.swiper-container { width: 100%; height:100%;}
.swiper-slide {
  text-align: center;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  position:relative;
  height:900px;
}
.mv01{ background:url(../img/main/mvisual01.jpg) no-repeat center top;}
.mv02{ background:url(../img/main/mvisual02.jpg) no-repeat center top;}
.mv03{ background:url(../img/main/mvisual03.jpg) no-repeat center top;}

#idx_wrapper .swiper-pagination{ visibility:hidden;}
#idx_wrapper .swiper-container-horizontal>.swiper-pagination-bullets{ bottom:80px; width:auto; left:50%; margin-left:-600px;}
#idx_wrapper .swiper-pagination-bullet{ width:15px; height:15px; border-radius:10px; background:#fff; border:2px solid #fb9397; opacity:1; margin:0 5px;}
#idx_wrapper .swiper-pagination-bullet-active{ width:50px; background:#fb9397; border:0;}
#idx_wrapper .swiper-button-next, #idx_wrapper .swiper-button-prev{ display:none;}


/*메인-중간컨텐츠*/
#middle{ width:100%; background:#fff; padding:80px 0;}
#middle .mid_title{ text-align:center; margin-bottom:60px; font-size:2.5em; font-weight:400; color:#222; line-height:1.2em; font-family:'paybooc-Bold',sans-serif;}
#middle .mid_title span{ color:#fb9397;}
#middle .mid_title p{ font-size:17px; color:#999; font-weight:500; margin-bottom:5px !important; line-height:22px; font-family:'Noto Sans KR', sans-serif;}
#middle .mid_title:before{ display:block; content:""; width:30px; height:6px; background:#fb9397; margin:0 auto 20px auto; border-radius:10px;
-webkit-transform: rotate(30deg); -ms-transform: rotate(30deg); transform: rotate(30deg);}
#middle_in{ width:1280px; margin:0 auto; box-sizing: border-box;}
#middle_in:after{ display:block; content:""; clear:both;}
#middle .abox{ float:left; width:20%; box-sizing: border-box; text-align:center;}
#middle .abox01{}
#middle .abox02{}
#middle .abox03{}
#middle .abox_img { border-radius:50%; width:150px; height:150px; padding-top:35px; box-sizing:border-box; overflow:hidden; margin:0 auto; background:#fff; border:2px dotted #ccc; transition:all 0.3s;}
#middle .abox:hover .abox_img{ border-style:solid; border-color:#fb9397; transition:all 0.3s;}
#middle .abox_img img{ width:70px; height:auto;}
#middle dl{ color:#444; position:relative; margin-top:20px;}
#middle dt{ font-size:1.7em;; font-weight:500; color:#333; line-height:1.3em;}
#middle .abox:last-child dt{ font-size:1.5em;}
#middle dd{ font-size:14px; color:#888; margin:10px 0 25px 0; line-height:1.6em;}
#middle a.mbtn{ display:block; width:100px; margin:0 auto; border:1px solid #ccc; background:#fff; line-height:35px; border-radius:20px; color:#999; padding:0 15px; font-size:1.1em;}
#middle .abox:hover a.mbtn{ border:1px solid #fb9397; background:#fb9397; color:#fff; border-radius:0px; transition:all 0.5s;}

#middle .abox03 dt{ text-align:center;}
#middle .abox03 p{ text-align:center;}
#middle .abox03 .tel_icon{ float:left; width:33px; height:33px; border-radius:50%; line-height:33px; text-align:center; color:#fff; background:#d10a11; font-size:1.2em;
margin:1px 12px 0 35px;}
#middle .abox03 .tel_wrap{ float:left;}
#middle .abox03 a{ display:block; font-family:Tahoma, Geneva, sans-serif;}
#middle .abox03 a.tel{ font-size:30px; color:#333; font-weight:500; line-height:1em;}
#middle .abox03 a.fax{ font-size:21px; color:#888; font-weight:500; line-height:1em; margin:7px 0 5px 3px;}
#middle .abox03 a.mail{ font-size:14px; color:#5893d4; font-weight:600; line-height:1em; letter-spacing:0; margin-left:3px;}


#middle2{ width:100%; background:#fff; padding: 40px 0 60px 0;}
#middle2_in{ width:1250px; margin:0 auto; box-sizing: border-box;}
#middle2_in:after{ display:block; content:""; clear:both;}
#middle2 .abox{ float:left; min-height:210px; box-sizing: border-box;;}
#middle2 .abox01{ width:25%;}

#middle2 .tabs{  margin-bottom:20px;}
#middle2 .tabs:after{ display:block; content:""; clear:both;}
#middle2 .tabs .tad{ float:left; width:33%; text-align:center;}
#middle2 .tabs .tad a{ display:block; color:#888; font-size:1.25em; line-height:45px; padding:0 15px; border-bottom:1px solid #ddd; box-sizing:border-box;}
#middle2 .tabs .tad a.selected{ font-weight:500; color:#222; border-bottom:0; border-top:2px solid #fb9397; border-right:1px solid #ddd;border-left:1px solid #ddd; line-height:44px;}
#middle2 .panels{}
#middle2 .panels .pd{}

#middle2 .abox02{ width:50%; padding:0px 40px; box-sizing:border-box}
#middle2 .abox03{ width:25%;}
#middle2 .abox03 dl{}
#middle2 .abox03 dt{ font-size:1.8em; font-weight:500; margin-bottom:20px;}
#middle2 .abox03 .tel{ font-size:3em; font-weight:300; letter-spacing:0;}
#middle2 .abox03 dd{ margin-top:15px; padding-left:70px; background:url(../img/main/tel_bg.gif) no-repeat left 0/45px auto;}
#middle2 .abox03 ul{}
#middle2 .abox03 li{ font-size:1.15em; letter-spacing:0; margin:3px 0;}
#middle2 .abox03 li strong{ display:inline-block; background:#555; width:60px; font-size:12px; font-weight:400; text-align:center; margin-right:10px; padding:2px 0; color:#fff;}
#middle2 .abox03 li:last-child strong{}

#middle3{ width:100%; height:450px; text-align:center; background:#ddd; margin:40px 0 0px 0; background:url(../img/main/huwon_bg.jpg) no-repeat center center; background-attachment:fixed;}
#middle3 h1{ font-size:3.7em; font-weight:bold; letter-spacing:-2px; padding:100px 0 20px 0; color:#fff;}
#middle3 p{ font-size:1.5em; line-height:1.8em; font-weight:300; margin-bottom:40px; color:rgba(250,250,250,0.8);}
#middle3 a.mid_btn2{ display:block; width:250px; margin:0 auto; border:2px solid #fff; line-height:45px; color:#fff;transition:all 0.5s; font-size:1.5em;}
#middle3 a.mid_btn2:hover{ background:#fff; color:#222; transition:all 0.5s;}

@media (max-width: 1279px) {
#middle_in{ width:100%; margin:0 auto; box-sizing: border-box;}
#slogan .mt{  font-size:1.27em; letter-spacing:0; font-weight:400; color:rgba(0,0,0,0.7); margin-top:20px; visibility:hidden;}
#slogan  p{ font-size: 1.7em; color: #555; line-height: 1em; font-weight: 500; font-family: 'paybooc-Bold',sans-serif; margin:0 0 7px}
#slogan  h2{ font-size: 4.5em; color: #333; line-height: 1.2em; font-weight: 500; font-family: 'paybooc-Bold',sans-serif;}
#slogan  h2 span{ display:block; color:#fb9397 }
}


#mbanner{ width:100%; background:#f4f4f4; padding:35px 0;}
#mbanner_in{ width:1250px; margin:0px auto;}
#mbanner a{ display:inline-block; width:calc(16% - 8px); margin:0 3px; border:1px solid #ccc; background:#fff; line-height:60px; padding:0 15px; box-sizing:border-box;}
#mbanner img{ width:100%;}

/*BBS*/
#bbs {
    width: 100%;
}

#bbs .in {
    width: 1280px;
    margin: 70px auto 60px auto;
}

#bbs .noti {
    float: left;
    width: 60%;
}

#bbs .noti dt {
    float: left;
    text-align: center;
    width: calc(30% - 20px);
    border-top: 3px solid #575050;
    margin-right: 20px;
    font-size: 1.85em;
    color: #575050;
    padding-top: 15px;
}

#bbs .noti dd {
    float: left;
    width: 70%;
    border-top: 3px solid #575050;
}

#bbs .ban {
    float: left;
    width: calc(40% - 50px);
    margin-left: 50px;
}

#bbs .ban a {
    float: left;
    width: calc(50% - 12px);
    margin-left: 12px;
    display: block;
    padding: 30px 30px 90px 30px;
    color: #fff;
	border-radius:.35rem;
}

#bbs .ban a.a {
    background: #deb863 url(../img/main/bs_con1.png) no-repeat 90% 25%;
	/*background: #deb863;*/
	padding: 30px 30px 31px 30px;
}
#bbs .ban a.a h3 span {
    display: block;
    padding-top: 13px;
    letter-spacing: 0.2px;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.82em;
	line-height: 1.3em;
}

#bbs .ban a.b {
    background: #02acce url(../img/main/bs_con2.png) no-repeat 90% 85%;
}

#bbs .ban a h3 {
    font-size: 1.35em;
}

#bbs .ban a h3 span {
    display: block;
    padding-top: 13px;
    letter-spacing: 0.2px;
    color: rgba(255, 255, 255, 0.4);
    font-size: 0.82em;
}

@media (max-width: 1279px) {
#bbs .in {
    width: 100%;
    margin: 70px auto 60px auto;
}
}

@media (max-width: 992px) {
    #bbs .in {
        width: 100%;
        margin: 20px auto 20px auto;
        padding: 15px;
    }

    #bbs .noti {
        width: 100%;
    }

    #bbs .noti dt {
        width: 100%;
        border-top: 2px solid #575050;
        margin-right: 0;
        font-size: 1.2em;
        padding: 5px 0;
    }

    #bbs .noti dd {
        width: 100%;
        border-top: 2px solid #000;
    }

    #bbs .ban {
        width: 100%;
        margin: 0;
    }

    #bbs .ban a {
        width: calc(50% - 10px);
        margin: 5px;
        padding: 15px 15px 25px 15px;
    }

    #bbs .ban a.a {
        background: #deb863 url(../img/main/bs_con1.png) no-repeat 98% 85% / 34px auto;
		padding: 15px 30px 31px 30px;
    }

    #bbs .ban a.b {
        background: #02acce url(../img/main/bs_con2.png) no-repeat 98% 85% / 34px auto;
    }

    #bbs .ban a h3 {
        font-size: 1.1em;
    }

	#bbs .ban a h3 span {
		font-size: 0.72em;
	}
#slogan .mt{  font-size:1.0em; letter-spacing:0; font-weight:400; color:rgba(0,0,0,0.7); margin-top:20px; visibility:hidden;}
#slogan  p{ font-size: 1.2em; color: #555; line-height: 1em; font-weight: 500; font-family: 'paybooc-Bold',sans-serif; margin:0 0 7px}
#slogan  h2{ font-size: 2.5em; color: #333; line-height: 1.2em; font-weight: 500; font-family: 'paybooc-Bold',sans-serif;}
#slogan  h2 span{ display:block; color:#fb9397 }
}
@media (max-width: 500px) {
#bbs .ban a.a { background:#deb863}
#bbs .ban a.b { background:#02acce}
}


@media (max-width:1279px) {
/* 메인슬라이더 */
#idx_wrapper{ height:400px; margin-top:60px;}
.swiper-slide { height:400px; background-size:cover;}

#idx_wrapper .swiper-container-horizontal>.swiper-pagination-bullets{ bottom:30px; left:4%; margin-left:0;}
#idx_wrapper .swiper-pagination-bullet{ width:10px; height:10px; margin:0 3px;}
#idx_wrapper .swiper-pagination-bullet-active{ width:30px;}

#slogan{ width:100%; top:120px; left:auto; padding: 0 0 0 4%; margin-left:0px; word-break: keep-all; word-wrap:break-word; text-shadow:0;}
#slogan .img01{ font-size:15px; width:170px; margin-bottom:15px;}
#slogan .img01 img{ width:100%;}
#slogan .mt{  font-size:11px; margin-top:10px;}

/*메인-중간컨텐츠*/
#middle{ padding:30px 0;}
#middle .mid_title{ margin-bottom:20px; font-size:1.8em;}
#middle .mid_title p{ font-size:14px;}
#middle .mid_title:before{ width:20px; height:4px; margin-bottom:0 auto;}
#middle_in{ width:100%; text-align:center;}
#middle .abox{ float:none; display:inline-block; vertical-align:top; width:32%; height:150px; margin-bottom:20px;}
#middle .abox_img { width:80px; height:80px; padding-top:25px;}
#middle .abox_img img{ width:30px;}
#middle dl{ margin-top:10px;}
#middle dt{ font-size:1.2em; height:35px;}
#middle .abox:last-child dt{ font-size:1.1em;}
#middle dd{ display:none;}
#middle a.mbtn{ width:80px; line-height:25px; padding:0 10px; font-size:1em; margin-top:10px;}

#middle2{ padding:30px 20px;}
#middle2_in{ width:100%;}
#middle2 .abox{ float:none; min-height:auto;}
#middle2 .abox01{ display:none;}
#middle2 .abox02{ display:none;}
#middle2 .abox03{ width:100%;}
#middle2 .abox03 dt{ font-size:1.5em; margin-bottom:10px;}
#middle2 .abox03 .tel{ font-size:3em;}
#middle2 .abox03 dd{ margin-top:10px; padding-left:50px; background-size:40px auto;}
#middle2 .abox03 li{ font-size:1.1em;}
#middle2 .abox03 li strong{ width:70px; font-size:13px;}

#middle3{ height:200px; margin:0px 0 0px 0; background-size:cover;}
#middle3 h1{ font-size:2em; padding:30px 0 10px 0;}
#middle3 p{ font-size:1em; line-height:1.5em; margin-bottom:20px; padding:0 30px;}
#middle3 a.mid_btn2{ width:200px; line-height:35px; font-size:1.3em;}

#mbanner{ padding:20px 0;}
#mbanner_in{ width:100%;}
#mbanner a{ width:calc(33% - 6px); margin:2px 2px; line-height:35px; padding:0 5px;}

#middle_in{ width:100%; margin:0 auto; box-sizing: border-box;}
}


