@charset "utf-8";

.center {
    width: 1300px;
    margin: 0 auto;
    min-width: 1300px;
}

/* --메인 */

/*헤더*/
header {
    position: fixed;
    width: 100%;
    z-index: 10;
}

header .inner {
    width: 1260px;
    margin: 0 auto;
    position: relative;
    padding: 30px 0 20px;
    box-sizing: border-box;
}

header .inner .logo {
    font-size: 0;
}

header .inner .logo a img {
    height: 35px;
    vertical-align: top;
}

header .inner .gnb {
    position: absolute;
    top: 0;
    right: 0;
}

/*3.1수정내용 헤더*/
.headerbg {
    position: fixed;
    top: 0;
    width: 100%;
    height: 85px;
    z-index: 5;
    background-color: rgba(255, 255, 255, 0.8);
}

.headerbg.on {
    display: none;
}

/*메인 헤더*/
.mainheader {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    transition: all .3s ease;
    display: contents;
}

.mainheader .inner .gnb {
    top: 29px;
    right: 0;
}

.mainheader .inner .gnb ul li {
    float: left;
}

.mainheader .inner .gnb .menu li {
    margin: 8px 0 0 25px;
}

.mainheader .inner .gnb .menu li a {
    font-size: 16px;
    color: #4d4d4d;
    transition: all .3s ease;
}

.mainheader .inner .gnb .menu li a:hover {
    color: #6230cf;
    font-weight: 500;
}

.mainheader .inner .gnb .reqstep {
    display: none;
}

.mainheader .inner .gnb .reqstep li a {
    padding: 5px 12px;
    font-size: 16px;
    font-weight: 500;
    display: inline-block;
    margin-left: 10px;
    background-color: #fff;
    border: 1px solid #8264E8;
    color: #6230cf;
    vertical-align: top;
    border-radius: 17px;
}

.mainheader .inner .gnb .reqstep li a:hover {
    background-color: #6230cf;
    color: #fff;
}

.mainheader.scrolldown {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    background-color: #fff;
}

.mainheader.scrolldown .inner .gnb .reqstep {
    display: block;
}

.mainheader.scrolldown .inner .gnb .menu {
    display: none;
}

/*서브페이지 헤더*/
.subheader {
    position: fixed;
    width: 100%;
    background-color: #fff;
    left: 0;
    top: 0;
    border-bottom: 1px solid rgba(230, 230, 230, 0.7);
}

.subheader .inner {
    width: 1260px;
    margin: 0 auto;
    position: relative;
    padding: 30px 0 20px;
}

.subheader .inner .logo {
    font-size: 0;
}

.subheader .inner .logo a img {
    height: 35px;
}

.subheader .inner .gnb {
    top: 29px;
    font-size: 0;
}

.subheader .inner .gnb a {
    padding: 5px 12px;
    font-size: 16px;
    font-weight: 500;
    display: inline-block;
    margin-left: 10px;
    background-color: #fff;
    border: 1px solid #8264E8;
    color: #6230cf;
    vertical-align: top;
    border-radius: 17px;
}

.subheader .inner .gnb a:hover {
    background-color: #6230cf;
    color: #fff;
}

/*메인배너*/
.topBanner {
    height: 700px;
    min-width: 1300px;
}

.topBanner .visual {
    background-position: center;
    height: 700px;
    width: 100%;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: #6031CD;
}

.topBanner .visual .bannerblock {
    width: 1400px;
    margin: 0 auto;
    height: 100%;
}

.topBanner .visual .bannerblock .bannertext {
    padding: 220px 0 0 70px;
}

.topBanner .visual .bannerblock .bannertext .maintext {
    font-size: 45px;
    font-weight: 500;
    color: #fff;
}

.topBanner .visual .bannerblock .bannertext .subtext {
    font-size: 18px;
    color: #fff;
    margin-top: 20px;
}

.topBanner .visual01 {
    background-image: url(../images/main_banner_01.jpg);
}


.topBanner .visual03 {
    background-image: url(../images/main_banner_02.jpg);
}

@media screen and (max-width: 1920px) {
    .topBanner .visual {
        background-size: 1920px auto;
    }
}

/*메인배너 내부 청소업체찾기*/
.topBanner .reqlink {
    position: absolute;
    top: 400px;
    left: 48%;
    margin-left: -590px;
}

.topBanner .reqlink ul {
    display: flex;
    align-items: center;
}

.topBanner .reqlink ul li.hoverbutton {
    font-size: 22px;
    font-weight: 600;
    padding: 20px;
    padding-right: 200px;
    margin: 10px;
    background-color: #fff;
    color: #6230cf;
    border: 2px solid #6230cf;
    border-radius: 10px;
    box-shadow: 0px 0px 10px rgba(98, 48, 207, 0.2);
    position: absolute;
    top: 0px;
    left: 0;
    width:max-content;
    cursor: pointer;
}

.topBanner .reqlink ul li.hoverbutton a .color {
    color: #b3b3b3;
    font-size: 20px;
    font-weight: 450;
    padding-top: 10px;
}

.topBanner .reqlink ul li.hoverbutton a img {
    width: 50px;
    position: absolute;
    right: 26px;
    bottom: 25px;
}


/*.topBanner .reqlink ul li.categorybutton {*/
/*    overflow: hidden;*/
/*}*/

/*.topBanner .reqlink ul li.categorybutton a {*/
/*    display: inline-block;*/
/*    font-size: 22px;*/
/*    font-weight: 600;*/
/*    background-color: #6230cf;*/
/*    color: #fff;*/
/*    padding: 9.5px 33px;*/
/*    margin: 10px;*/
/*    border-radius: 26px;*/
/*    box-shadow: 0px 0px 10px rgba(98, 48, 207, 0.2);*/
/*    transform: translateX(-100%);*/
/*    opacity: 0;*/
/*    transition: all .5s;*/
/*}*/

/*.topBanner .reqlink ul li.categorybutton a.on {*/
/*    transform: translateX(0px);*/
/*    opacity: 1;*/
/*}*/

/*.topBanner .reqlink ul li.categorybutton a:hover {*/
/*    color: #6230cf;*/
/*    background-color: #fff;*/
/*}*/

/*메인배너 pager*/
.topBanner .slick-dots {
    bottom: 30px;
}

.topBanner .slick-dots li {
    margin: 0 20px;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    background-color: #fff;
    opacity: .8;
    transition: all .5s;
}

.topBanner .slick-dots li.slick-active {
    width: 25px;
}

.topBanner .slick-dots li button:before {
    content: '';
}

.category_preview {
    margin-top: 100px;
    margin-bottom: 100px;
}

.category_preview .title {
    height: 36px;
    font-size: 25px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.6;
    letter-spacing: normal;
    text-align: left;
    color: #4d4d4d;
}

.category_preview .container {
    width: 1300px;
    height: 200px;
    display: inline-flex;
    margin-top: 25px;
}

.category_preview .card .description{
    width: 160px;
    height: 160px;
    margin: 0 20px 0 0;
    padding: 20px;
    border-radius: 10px;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.2));
    background-position: center;
    background-size: cover;
}

.category_preview .card:nth-child(1) .description {
    background-image: url("../images/category_normal_main.png");
}

.category_preview .card:nth-child(2) .description{
    background-image: url("../images/category_oneroom_main.png");
}

.category_preview .card:nth-child(3) .description{
        background-image: url("../images/category_wash_main.png");
}

.category_preview .card:nth-child(4) .description{
    background-image: url("../images/category_aircon_main.png");
}

.category_preview .card:nth-child(5) .description{
    background-image: url("../images/category_bathroom_main.png");
}

.category_preview .card:nth-child(6) .description{
    background-image: url("../images/category_zimshot_main.png");
}

/*.category_preview .description {*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    justify-content: flex-end;*/
/*    height: 200px;*/
/*    cursor: pointer;*/
/*}*/

.category_preview .card .name {
    height: 29px;
    /*margin: 0 0 12px;*/
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #4d4d4d;
    display: block;
}

.category_preview .card .add1 {
    height: 20px;
    margin: 12px 18px 3px 0;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #4d4d4d;
    display: block;
}

.category_preview .card .add2 {
    height: 20px;
    margin: 3px 32px 0 0;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #4d4d4d;
    display: block;
}

/*클린벨3단계*/
.processguide .title {
    text-align: center;
    padding-top: 40px;
    font-size: 17px;
    color: #4d4d4d;
}

.processguide .title h2 {
    font-size: 35px;
    color: #6230cf;
    padding-bottom: 10px;
}

.processguide ul::before {
    content: '';
    display: inline-block;
    width: 640px;
    height: 1px;
    background-color: #E6E6E6;
    position: absolute;
    top: 60px;
    left: 50%;
    margin-left: -320px;
    z-index: -1;
}

.processguide ul {
    text-align: center;
    display: flex;
    justify-content: center;
    position: relative;
    margin-top: 65px;
}

.processguide ul li {
    width: 190px;
}

.processguide ul li:nth-child(2) {
    margin: 0 130px;
}

.processguide ul li .processicon {
    margin: 0 auto;
    width: 120px;
    height: 120px;
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 90px auto;
}

.processguide ul li:nth-child(1) .processicon {
    background-image: url(../images/processicon01.png);
}

.processguide ul li:nth-child(2) .processicon {
    background-image: url(../images/processicon02.png);
}

.processguide ul li:nth-child(3) .processicon {
    background-image: url(../images/processicon03.png);
}

.processguide ul li dl dt {
    font-size: 25px;
    font-weight: 500;
    padding: 20px 0 15px;
}

.processguide ul li dl dd {
    font-size: 15px;
}

/* 클린벨 데이터 */
.maindata {
    background: url(../images/countdata_bg.jpg) no-repeat center center/cover;
    padding: 90px 0 115px;
    margin-top: 140px;
}

.maindata .center > div {
    float: left;
    width: 50%;
}

.maindata .datavalue {
    color: #FFEB33;
    font-weight: 700;
    text-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2);
}

.maindata .customer {
    text-align: center;
    padding-top: 15px;
}

.maindata .customer .datavalue {
    font-size: 30px;
    padding-bottom: 34px;
}

.maindata .customer .datavalue span {
    font-size: 50px;
}

.maindata .customer p:last-child {
    color: #fff;
    font-size: 25px;
}

.maindata table {
    margin: 0 auto;
    border-collapse: separate;
    border-spacing: 0 25px;
}

.maindata table tbody tr th {
    text-align: left;
    padding-right: 52px;
    font-size: 25px;
    color: #fff;
    font-weight: 400;
}

.maindata table tbody tr td {
    font-size: 35px;
}

/*메인본문 타이틀*/
.maintitle {
    padding-bottom: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.maintitle h2 {
    font-size: 25px;
    color: #4d4d4d;
    font-weight: 500;
}

.maintitle .more a {
    display: inline-block;
    padding-right: 19px;
    font-size: 18px;
    color: #6230CF;
    background: url(../images/mainmorebtn.png) no-repeat right center;
}

/*청소업체랭킹 시세검색 링크*/
.ranking_price_link {
    padding-top: 140px;
}

.ranking_price_link ul {
    font-size: 0;
}

.ranking_price_link ul li {
    display: inline-block;
    width: calc(50% - 10px);
    height: 200px;
}

.ranking_price_link ul li:nth-child(1) {
    margin-right: 20px;
}

.ranking_price_link ul li a {
    display: inline-block;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    font-size: 33px;
    color: #fff;
    font-weight: 600;
    padding: 55.5px 0 55.5px 65px;
    background-position: right 65px center;
    background-repeat: no-repeat;
    border-radius: 20px;
}

.ranking_price_link ul li:nth-child(1) a {
    background-color: #8662FF;
    background-image: url(../images/mainranking.png);
}

.ranking_price_link ul li:nth-child(2) a {
    background-color: #A372FF;
    background-image: url(../images/mainprice.png);
}


/*리뷰 슬라이드*/
.bestreview {
    padding-top: 140px;
}

.bestreview .reviewlane .review {
    padding-right: 20px;
    box-sizing: border-box;
}

.bestreview .reviewlane .review .inner .review_data .estimateprice .category {
    width: 109px;
    height: 33px;
    padding: 6px 13px;
    border-radius: 17px;
    background-color: #f7f2ff;
}

.bestreview .reviewlane .review .inner .review_data .estimateprice .category span {
    width: 83px;
    height: 21px;
    font-size: 15px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #6230cf;
}

.bestreview .reviewlane .review .inner {width: 100%; background-color: #fff; border: 1px solid #e6e6e6; padding: 25px 25px 20px; box-sizing: border-box; color: #4d4d4d; border-radius: 20px;}
.bestreview .reviewlane .review .inner .review_data .estimateprice {font-size: 17px; padding-bottom: 16px;}
.bestreview .reviewlane .review .inner .review_data .estimateprice .price {font-size: 25px; font-weight: 600;  margin-left: 7px;}
.bestreview .reviewlane .review .inner .review_data .estimateprice .won {font-weight: 500;}

.bestreview .reviewlane .review .inner .review_data ul {
    font-size: 0;
    padding-bottom: 35px;
}

.bestreview .reviewlane .review .inner .review_data ul li {
    display: inline-block;
    font-size: 16px;
    padding: 2px 7px;
    margin-right: 10px;
}

.bestreview .reviewlane .review .inner .review_content .info {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    padding-bottom: 10px;
    color: #666;
}

.bestreview .reviewlane .review .inner .review_content .text p {width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-all; font-size: 16px; line-height: 24px; max-height: 72px;}

.bestreview .reviewlane .slick-arrow {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    z-index: 5;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
}

.bestreview .reviewlane .slick-prev {
    background: url(../images/main_arrow_left.png) no-repeat center #fff;
    left: -20px;
}

.bestreview .reviewlane .slick-next {
    background: url(../images/main_arrow_right.png) no-repeat center #fff;
    right: -20px;
}

.bestreview .reviewlane .slick-arrow.slick-disabled {
    opacity: 0;
}

/* 안심하고 이용해보세요! */
.mainpoints3 {
    background-color: #fff;
    padding: 65px 94px;
    margin-top: 140px;
}

.mainpoints3 h2 {
    text-align: center;
    font-size: 30px;
    color: #4d4d4d;
    padding-bottom: 80px;
}

.mainpoints3 ul li {
    width: 33.3%;
    float: left;
    text-align: center;
}

.mainpoints3 ul li .icon {
    display: inline-block;
    margin-bottom: 20px;
    width: 75px;
    height: 75px;
    border-radius: 50%;
    background-color: #F5F2FF;
    background-size: 55px;
    background-repeat: no-repeat;
    background-position: center;
}

.mainpoints3 ul li:nth-child(1) .icon {
    background-image: url(../images/point1.png);
}

.mainpoints3 ul li:nth-child(2) .icon {
    background-image: url(../images/point2.png);
}

.mainpoints3 ul li:nth-child(3) .icon {
    background-image: url(../images/point3.png);
}

.mainpoints3 ul li .bold {
    font-size: 25px;
    font-weight: 600;
    color: #6230CF;
    padding-bottom: 7px;
}

.mainpoints3 ul li .bold::after {
    content: '';
    display: block;
    width: 140px;
    height: 1px;
    background-color: #E0E0E0;
    margin: 45px auto;
}

.mainpoints3 ul li .sub {
    font-size: 20px;
    color: #4d4d4d;
}

.mainpoints3 ul li .sub .small {
    font-size: 16px;
}

/*우수업체 인터뷰*/
.bestinterview {
    padding-top: 140px;
    min-width: 1300px;
}

.bestinterview .interviewlane .interview {
    width: 560px;
    height: 400px;
    margin: 0 15px;
    opacity: .5;
    transition: all 1s linear;
}

.bestinterview .interviewlane .interview.slick-center {
    opacity: 1;
}

.bestinterview .interviewlane .interview a {
    display: inline-block;
    width: 100%;
    height: 100%;
    background-color: #eee;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    border-radius: 10px;
}

.bestinterview .interviewlane .interview a .interview_content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 35px 20px;
    box-sizing: border-box;
    border-radius: 10px;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: rgba(0, 0, 0, 0.2);
    background: -moz-linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 50%);
    background: -webkit-linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 50%);
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 50%);
}

.bestinterview .interviewlane .interview a .interview_content .text {
    font-size: 25px;
    font-weight: 600;
    padding-bottom: 20px;
}

.bestinterview .interviewlane .interview a .interview_content .text p {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-all;
    height: 74px;
}

.bestinterview .interviewlane .interview a .interview_content .info {
    font-size: 15px;
}

.bestinterview .interviewlane .interview a .interview_content .info p {
    padding-bottom: 5px;
}

.bestinterview .interviewlane .interview a .interview_content .info p span:first-child {
    margin-right: 7px;
}

.bestinterview .interviewlane .interview a .interview_content .info ul li {
    display: inline-block;
}

.bestinterview .interviewlane .interview a .interview_content .info ul li:first-child {
    padding-left: 24px;
    background: url(../images/maininterview_star.png) no-repeat left center;
    margin-right: 20px;
}

.bestinterview .interviewlane .interview a .interview_content .info ul li:nth-child(2) .case {
    margin-left: 7px;
}


.bestinterview .interviewlane .slick-arrow {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    z-index: 5;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
}

.bestinterview .interviewlane .slick-prev {
    left: 50%;
    top: 50%;
    margin-left: -340px;
    background: url(../images/main_arrow_left.png) no-repeat center #fff;
}

.bestinterview .interviewlane .slick-next {
    left: 50%;
    top: 50%;
    margin-left: 300px;
    background: url(../images/main_arrow_right.png) no-repeat center #fff;
}


/*청소팁*/
.cleanbelltip {
    padding: 90px 0;
}

.cleanbelltip ul {
    font-size: 0;
    overflow: hidden;
}

.cleanbelltip ul li {
    float: left;
    width: 236px;
}

.cleanbelltip ul li:not(:first-child) {
    margin-left: 30px;
}

.cleanbelltip ul li a {
    font-size: 17px;
    display: inline-block;
    width: 100%;
}

.cleanbelltip ul li a .tipthumb {
    width: 100%;
    padding-bottom: 100%;
    background-color: #eee;
    border-radius: 10px;
    position: relative;
}

.cleanbelltip ul li a .tipthumb img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.cleanbelltip ul li a .tiptitle {
    padding-top: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-all;
}

/*클린벨 입점 신청하기*/
.withCleaner {
    background: linear-gradient(0deg, #6D5AFF 0%, #8264E8 100%);
}

.withCleaner a > div {
    padding: 60px 0;
    text-align: center;
    color: #fff;
}

.withCleaner a > div .bold {
    font-size: 25px;
    font-weight: 600;
    padding-right: 120px;
}

.withCleaner a > div .arrow {
    font-size: 18px;
}

.withCleaner a > div .arrow::after {
    content: '';
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 1px solid #e6e6e6;
    border-radius: 50%;
    background: url(../images/mainpartner_arrow.png) no-repeat center #fff;
    vertical-align: middle;
    margin-left: 15px;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
}

/*푸터*/
footer {
    background-color: #E6E6E6;
    color: #666;
    padding-bottom: 80px;
}

footer .caution {
    text-align: center;
    padding: 30px 0;
    margin-top: 50px;
    margin-bottom: 50px;
    border-top: 1px solid #D9D9D9;
    border-bottom: 1px solid #D9D9D9;
    min-width: 1300px;
}

footer .inner .f_bottom {
    padding: 0 50px 0 50px;
}

footer .inner .f_left {
    float: left;
    font-size: 17px;
    margin-right: 130px;
    color: #808080;
}

footer .inner .f_left .csCenter span {
    font-size: 20px;
}

footer .inner .f_left .csCenter a {
    display: block;
    font-size: 30px;
    letter-spacing: -.2px;
    padding: 10px 0 10px;
}

footer .inner .f_left .f_sns {
    padding-top: 30px;
    font-size: 0;
}

footer .inner .f_left .f_sns li {
    display: inline-block;
    padding-right: 15px;
}

footer .inner .f_left .f_sns li:last-child {
    padding-right: 0;
}

footer .inner .f_left .f_sns li a img {
    height: 30px;
    opacity: .4;
}

footer .inner .f_right .busyInfo {
    float: left;
    font-size: 14px;
    color: #808080;
}

footer .inner .f_right .busyInfo p:nth-of-type(1) {
    font-size: 20px;
    padding-bottom: 10px;
}

footer .inner .f_right .busyInfo .copyright {
    padding-top: 10px;
}

footer .inner .f_right .busyInfo address a {
    color: #808080;
}

footer .inner .f_right ol {
    float: right;
}

footer .inner .f_right ol a {
    color: #666;
}

footer .inner .f_right ol li {
    padding-bottom: 15px;
}

footer .inner .f_right ol li:nth-child(3) a {
    font-weight: 500;
}

/* 메인-- */

/*언론 속의 클린벨*/
.media_list ul li {
    display: none;
}

.mediaTop {
    height: 350px;
    text-align: center;
    background: url(../images/media_topbg.jpg) repeat-x center;
    margin-bottom: -70px;
    min-width: 1300px;
}

.mediaTop h2 {
    font-size: 40px;
    color: #fff;
    padding-top: 120px;
    font-weight: 500;
}

.media_list {
    padding: 0 45px 110px;
    box-sizing: border-box;
}

.media_list .a_more_btn {
    text-align: center;
    padding-top: 50px;
}

.media_list .a_more_btn button {
    background-color: #fff;
    width: 220px;
    line-height: 50px;
    font-size: 20px;
    border: 2px solid #555;
    border-radius: 50px;
    color: #555;
}

.media_list .mediaList {
    background-color: #fff;
    border-radius: 10px;
    margin: 0 5px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.07);
    margin-top: 20px;
}

.media_list .mediaList:first-child {
    margin-top: 0;
}

.media_list .mediaList .title {
    padding: 30px 60px;
    background: url(../images/a_arrow01.png) no-repeat;
    background-position: right 60px top 50%;
}

.media_list .mediaList .title.on {
    background-image: url(../images/a_arrow02.png);
}

.media_list .mediaList .title .a_date {
    font-size: 15px;
    color: #999;
    font-weight: 300;
    padding-right: 35px;
}

.media_list .mediaList .title .a_title {
    font-size: 20px;
    font-weight: 500;
}

.media_list .mediaList .content.on {
    display: block;
}

.media_list .mediaList .content {
    padding: 0 60px 45px;
    color: #808080;
    display: none;
}

.media_list .mediaList .content .c_inner {
    border-top: 1px solid #eee;
    padding: 35px 0 0;
}

.media_list .mediaList .c_img {
    padding-bottom: 30px;
}

.media_list .mediaList .c_img > img {
    height: 300px;
}

.media_list .mediaList .c_img > p {
    font-size: 14px;
    padding-top: 5px;
    color: #b3b3b3;
}

.media_list .mediaList .content .c_copyright {
    font-size: 14px;
    padding: 30px 0;
}

.media_list .mediaList .content .a_btn a {
    float: right;
    display: block;
    width: 150px;
    line-height: 40px;
    text-align: center;
    font-size: 18px;
    letter-spacing: -.2px;
    background-color: #f2f2f2;
    border-radius: 40px;
}

.c_text {
    padding: 10px;
    overflow: auto;
    white-space: pre-wrap;
}

/*pre 태그 자동 줄바꿈 위해 추가 Peter*/

/*청소업체 순위 TOP20*/

/*oswald 폰트 적용*/
.ranking {
    font-family: 'Oswald', sans-serif;
}

.top20_title {
    background: url(../images/top20_topbg.jpg) repeat-x center center;
    height: 350px;
    min-width: 1300px;
}

.top20_title > div {
    padding: 130px 0 0 800px;
    box-sizing: border-box;
}

.top20_title h2 {
    color: #fff;
    font-size: 23px;
    line-height: 40px;
    font-weight: 300;
    letter-spacing: .5px
}

.top20_title h2 .t_bold {
    font-size: 30px;
    font-weight: 500;
}

.top20_tab {
    background-color: #363636;
}

.top20_tab ul {
    padding: 15px 200px;
    box-sizing: border-box;
}

.top20_tab ul li {
    float: left;
    width: 100px;
    text-align: center;
    font-size: 20px;
    line-height: 40px;
    color: #777;
    margin-left: 300px;
    border-radius: 40px;
    cursor: pointer;
}

.top20_tab ul li:first-child {
    margin-left: 0px;
}

.top20_tab ul li.on {
    background-color: #fff;
    font-weight: 500;
    color: #555;
}

.top20_bottom .tab_con {
    display: none;
}

.top20_bottom .tab_con.on {
    display: block;
}

.top20_bottom .bg_ranklist {
    background-color: #f2f2f2;
}

.top20_bottom .rank_list {
    padding: 27px 50px 110px;
    box-sizing: border-box;
}

.top20_bottom .rank_list ol > li {
    margin-top: 50px;
}

.top20_bottom .rank_list ol > li:first-child {
    margin-top: 30px;
}

.top20_bottom .rank_list .rank_item {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.05);
    display: flex;
    position: relative;
    line-height: 60px;
    padding-left: 290px;
    font-size: 18px;
    color: #666;
    font-weight: 500;
}

.top20_bottom .rank_list .rank_item .ranking {
    width: 35px;
    font-size: 18px;
    line-height: 35px;
    text-align: center;
    border-radius: 35px;
    background-color: #f2f2f2;
    position: absolute;
    top: 12px;
    left: 55px;
}

.top20_bottom .rank_list .rank_item .logo_img {
    position: absolute;
    top: -30px;
    left: 140px;
    width: 90px;
    height: 90px;
    background-color: #fff;
    line-height: normal;
}

.top20_bottom .rank_list .rank_item .logo_img > img {
    width: 90px;
}

.top20_bottom .rank_list .rank_item .c_name {
    min-width: 275px;
    color: #555;
}

.top20_bottom .rank_list .rank_item .star_small {
    background: url(../images/top20_star.png) no-repeat left center;
    background-size: auto 18px;
    padding: 0 55px 0 34px;
}

.top20_bottom .rank_list .rank_item ul {
    overflow: hidden;
}

.top20_bottom .rank_list .rank_item li {
    float: left;
}

.top20_bottom .rank_list .rank_item li .r_row {
    color: #999;
    padding-right: 10px;
    font-weight: 400;
}

.top20_bottom .rank_list .rank_item ul > li:nth-child(1) {
    min-width: 140px;
}

.top20_bottom .rank_list .rank_item ul > li:nth-child(2) {
    min-width: 155px;
}

.top20_bottom .rank_list .rank_item ul > li:nth-child(3) {
    min-width: 175px;
}


/*파트너업체 가입신청 페이지*/

/*헤더 파트너업체 가입신청 버튼*/
.landingheader {
    position: fixed;
    top: 0;
    width: 100%;
    height: 85px;
    z-index: 5;
}

.landingheader .inner .gnb {
    right: 20px;
    top: 20px;
}

.landingheader .inner .gnb .join_partner {
    display: inline-block;
    padding: 8px 25px;
    color: #363636;
    background-color: #FFDF41;
    font-weight: 500;
    width: auto;
    border: none;
    border-radius: 20px;
}

.landingheader .inner .gnb .header_tel {
    font-size: 18px;
    font-weight: 500;
    padding-right: 15px;
}

.landingheader .inner .gnb .header_tel span {
    font-size: 23px;
    font-weight: bold;
}

.landingheader .inner .gnb .header_tel.on {
    display: none;
}

.landingheaderbg {
    position: fixed;
    top: 0;
    width: 100%;
    height: 85px;
    z-index: 5;
    background-color: rgba(255, 255, 255, 0.8);
}

.landingheaderbg.on {
    display: none;
}

/*파트너업체 가입신청 타이틀*/
.landing_top {
    background: url(../images/landing_topbg.png) no-repeat center;
    height: 790px;
    min-width: 1300px;
}

.landing_top .landing_title {
    padding: 85px 50px 0;
    box-sizing: border-box;
    text-align: center;
}

.landing_top .landing_title .title_bg {
    background: url(../images/landing-titlebg.jpg);
    height: 550px;
    border-radius: 200px 0;
    box-shadow: 0 0 35px rgba(107, 78, 170, 0.25);
    padding: 170px 0 0 90px;
    box-sizing: border-box;
    text-align: left;
    margin-bottom: -30px;
}

.landing_top .landing_title .title_bg h2 {
    font-size: 43px;
    padding-bottom: 30px;
}

.landing_top .landing_title .title_bg h2::first-line {
    font-size: 30px;
    font-weight: 500;
}

.landing_top .landing_title .title_bg h2 .bold {
    font-size: 55px;
    color: #6230cf;
}

.landing_top .landing_title .title_bg p {
    font-size: 18px;
    line-height: 30px;
    color: #808080;
}

.landing_top .landing_title a {
    display: inline-block;
    text-align: center;
    line-height: 60px;
    border-radius: 60px;
    letter-spacing: -.2px;
    padding: 0 40px;
    font-size: 25px;
    font-weight: 600;
    color: #fff;
    background-color: #6230cf;
    box-shadow: 0 5px 5px rgba(107, 78, 170, 0.2);
}

.landing_top .landing_title a:hover {
    background-color: #25124F;
}

.landing_top .landing_title .partner_tel {
    line-height: 50px;
    font-size: 35px;
    text-align: right;
    font-weight: bold;
    color: #fff;
    padding-top: 25px;
}

.landing_top .landing_title .partner_tel span {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: url(../images/partner_tel_icon.png) no-repeat left center;
    padding-right: 15px;
}

/*청소요청 고객 수*/
.customer_add {
    background-color: #411A98;
    text-align: center;
    padding: 65px 0;
    color: #fff;
    font-size: 33px;
    font-weight: bold;
}

.customer_add p:nth-child(1) {
    font-size: 20px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.7);
    padding-bottom: 15px;
}

.customer_add p span {
    font-size: 45px;
    color: #ffdf41;
}

/*파트너 업체 내용 소개*/
.landing_sub {
    padding-top: 120px;
}

.landing_sub > div {
    height: 440px;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 100px 0 100px 0;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1);
}

.landing_sub .sub01 {
    background-image: url(../images/sub01_bg.png);
    background-repeat: no-repeat;
    background-position: left center;
    padding: 90px 0 0 690px;
    margin-bottom: 120px;
}

.landing_sub .sub02 {
    background-image: url(../images/sub02_bg.png);
    background-repeat: no-repeat;
    background-position: right center;
    padding: 90px 0 0 90px;
    margin-bottom: 140px;
}

.landing_sub .title {
    font-size: 30px;
    letter-spacing: -.2px;
    font-weight: bold;
    padding-bottom: 40px;
    position: relative;
}

.landing_sub .title::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 250px;
    height: 3px;
    background-color: #eee;
}

.landing_sub .title span {
    font-size: 40px;
    color: #6230cf;
}

.landing_sub .s_text {
    color: #808080;
    font-size: 18px;
    line-height: 30px;
    padding-top: 40px;
}

/*gif 스크롤 애니메이션 */
.gif_container .img_frame {
    opacity: 0;
}

.motionup {
    animation: scrollup 1s ease forwards;
}

@keyframes scrollup {
    0% {
        opacity: 0;
        transform: translateY(40px);
    }
    100% {
        opacity: 1;
        transform: translateY(0px);
    }

}

/*파트너 가입 상품 설명*/
.product_top {
    background-color: #fff;
}

.product_top .center {
    overflow: hidden;
    height: 560px;
}

.product_top .center .gif_container {
    width: 50%;
    height: 100%;
    padding-left: 150px;
    box-sizing: border-box;
    float: left;
}

.product_top .center .gif_container .img_frame {
    height: 100%;
    background: url(../images/product_top.png) no-repeat left top 30px / 400px auto;
}

.product_top .center .txt_content {
    width: 50%;
    padding-top: 150px;
    float: left;
    font-size: 23px;
    color: #4D4D4D;
}

.product_top .center .txt_content .bold {
    font-size: 30px;
    color: #6230CF;
    font-weight: 600;
    display: inline-block;
    margin: 60px 0 30px;
    background-repeat: no-repeat;
    background-position: 0 bottom;
    background-size: 100% 50%;
    background-image: linear-gradient(#F2F5FF, #F2F5FF);
    background-image: -webkit-linear-gradient(#F2F5FF, #F2F5FF);
    background-image: -o-linear-gradient(#F2F5FF, #F2F5FF);
    background-image: -moz-linear-gradient(#F2F5FF, #F2F5FF);
    background-image: -ms-linear-gradient(#F2F5FF, #F2F5FF);
}

.product_top .center .txt_content .small {
    font-size: 17px;
    color: #8c8c8c;
    line-height: 33px;
}

.product_con .center {
    padding: 0 50px;
    box-sizing: border-box;
}

.product_con .basic_bg {
    background-color: #F2F5FF;
    height: 600px;
    overflow: hidden;
}

.product_con .product_info .left_info {
    float: left;
}

.product_con .product_info .gif_container {
    float: right;
    height: 600px;
    width: 350px;
    margin-right: 80px;
}

.product_con .product_info .gif_container .img_frame {
    height: 100%;
    background: url(../images/product_con.png) no-repeat center top 50px/350px auto;
}

.product_con .product_info .left_info .toptext {
    font-size: 23px;
    font-weight: 500;
    color: #4d4d4d;
    padding-top: 114px;
}

.product_con .product_info .left_info .toptext .strongtext {
    font-size: 30px;
    font-weight: 700;
    color: #6230CF;
    padding: 20px 0 60px;
}

.product_con .product_info .left_info .subtext {
    font-size: 16px;
    color: #666;
}

.product_con .product_info .left_info .subtext p:nth-child(2) {
    padding-top: 20px;
}


/*파트너 매니저 내용*/
.landing_consulting .p_manager h3 {
    text-align: center;
    font-size: 25px;
    padding: 80px 0 20px;
    color: #6230CF;
}

.landing_consulting .p_manager > p {
    text-align: center;
    padding-bottom: 60px;
    color: #808080;
}

.landing_consulting .p_manager ol {
    width: 1200px;
    margin: 0 auto;
}

.landing_consulting .p_manager ol li {
    overflow: hidden;
    margin-bottom: 40px;
}

.landing_consulting .p_manager ol li dt {
    float: left;
    color: #fff;
    font-size: 22px;
    line-height: 100px;
    padding-left: 70px;
    box-sizing: border-box;
    font-weight: 300;
}

.landing_consulting .p_manager ol li dt span {
    font-weight: 500;
}

.landing_consulting .p_manager ol li dd {
    float: right;
    background-color: #fff;
    font-size: 18px;
    width: 540px;
    height: 100px;
    padding: 23px 0 0px 30px;
    box-sizing: border-box;
    position: relative;
}

.landing_consulting .p_manager ol li:nth-child(1) dd {
    padding-top: 36px;
}

.landing_consulting .p_manager ol li dd::before {
    content: '';
    display: inline-block;
    width: 40px;
    height: 100px;
    position: absolute;
    left: -40px;
    top: 0;
    background: url(../images/consulting_a.png) no-repeat center;
}

.landing_consulting .p_manager ol li dd span {
    font-weight: 500;
}

.landing_consulting .p_manager ol li:nth-child(1) {
    background-image: url(../images/consulting_1.png);
    background-repeat: no-repeat;
    background-color: #865AFF;
}

.landing_consulting .p_manager ol li:nth-child(2) {
    background-image: url(../images/consulting_2.png);
    background-repeat: no-repeat;
    background-color: #9B77FF;
}

.landing_consulting .p_manager ol li:nth-child(3) {
    background-image: url(../images/consulting_3.png);
    background-repeat: no-repeat;
    background-color: #AE91FF;
    margin-bottom: 80px;
}

/*가입업체 경험담 내용*/
.landing_consulting .p_review {
    background-color: #fff;
}

.landing_consulting .p_review h3 {
    text-align: center;
    font-size: 30px;
    padding: 80px 0 60px;
}

.landing_consulting .p_review h3 span {
    color: #6230cf;
}

.landing_consulting .p_review ul {
    padding: 0 50px;
}

.landing_consulting .p_review ul li {
    float: left;
    width: 320px;
    padding-left: 120px;
}

.landing_consulting .p_review ul li:first-child {
    padding-left: 0px;
}

.landing_consulting .p_review ul li .p_info h4 {
    font-size: 25px;
    font-weight: 500;
    display: inline-block;
}

.landing_consulting .p_review ul li .p_info .region {
    font-size: 18px;
    color: #808080;
    padding-left: 8px;
}

.landing_consulting .p_review ul li .p_img {
    padding: 20px 0;
    position: relative;
}

.landing_consulting .p_review ul li .p_img img {
    width: 320px;
    border-radius: 10px;
}

.landing_consulting .p_review ul li .p_img .com_term {
    color: #fff;
    font-size: 20px;
    line-height: 23px;
    font-weight: 500;
    background-color: rgba(0, 0, 0, 0.6);
    width: 110px;
    height: 110px;
    text-align: center;
    padding-top: 30px;
    box-sizing: border-box;
    border-radius: 100%;
    position: absolute;
    bottom: 40px;
    right: 20px;
}

.landing_consulting .p_review ul li .p_img .com_term::first-line {
    font-size: 14px;
    letter-spacing: -.5px;
    font-weight: 300;
}

.landing_consulting .p_review ul li .p_text {
    font-size: 18px;
    color: #808080;
    line-height: 30px;
    padding: 0 10px;
}

.landing_consulting .p_review ul li .p_text p:nth-child(1) {
    font-size: 20px;
    font-weight: 500;
    padding-bottom: 15px;
    color: #555;
}

.landing_consulting .p_review .join_btn {
    text-align: center;
    padding: 70px 0 60px;
}

.landing_consulting .p_review .join_btn a {
    display: inline-block;
    text-align: center;
    line-height: 60px;
    border-radius: 60px;
    letter-spacing: -.2px;
    padding: 0 40px;
    font-size: 25px;
    font-weight: 600;
    color: #fff;
    background-color: #6230cf;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.15);
}

.landing_consulting .p_review .join_btn a:hover {
    background-color: #25124F;
}

/*자주 묻는 질문*/
.partner_faq {
    padding: 0 50px 85px;
    box-sizing: border-box;
}

.partner_faq h3 {
    font-size: 25px;
    color: #666;
    font-weight: 500;
    text-align: center;
    padding: 80px 0 50px;
}

.partner_faq ul li {
    background-color: #fff;
    margin-bottom: 25px;
}

.partner_faq ul li .q_click {
    padding: 22px 70px;
    font-size: 18px;
    color: #4d4d4d;
    font-weight: 500;
    position: relative;
}

.partner_faq ul li .q_click::after {
    content: '';
    display: block;
    position: absolute;
    width: 26px;
    height: 14px;
    background-image: url(../images/q_click_arrow.png);
    background-position: center 0px;
    right: 40px;
    top: 28px;
}

.partner_faq ul li .a_dropdown {
    padding: 30px 70px;
    font-size: 16px;
    color: #666;
    line-height: 30px;
    border-top: 1px solid #eee;
    display: none;
}

.partner_faq ul li:nth-child(1) .q_click {
    background: url(../images/q1_bg.png) no-repeat left center;
}

.partner_faq ul li:nth-child(2) .q_click {
    background: url(../images/q2_bg.png) no-repeat left center;
}

.partner_faq ul li.on .q_click::after {
    background-position: center 15px;
}

.partner_faq ul li.on .a_dropdown {
    display: block;
}

/* 후기 더보기 페이지 베스트리뷰 */
.best_review_topbg {background: url(../images/reviewtop.jpg) center bottom; height: 385px; min-width: 1300px;}
.best_review_title {padding-top: 135px; padding-left: 120px; box-sizing: border-box;}
.best_review_title p {font-size: 17px; color: #777; padding-bottom: 10px;}
.best_review_title h2 {font-size: 33px; }
.best_review_title h2 .bold {color: #6230cf;}
.best_review_btm {padding: 40px 50px 110px;; box-sizing: border-box; }
.best_review_btm ul .best_review:not(:first-child) {padding-top: 50px;}
.best_review_btm ul .best_review .left_region {float: left; width: 215px; height: 240px; padding: 20px 20px 0; box-sizing: border-box; border-radius: 10px; background: rgb(91,47,188);
background: linear-gradient(135deg, rgba(91,47,188,1) 50%, rgba(69,69,207,1) 100%); color: #fff; font-size: 18px; font-weight: 500; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);}
.best_review_btm ul .best_review .left_region p:nth-child(1) {font-size: 25px; padding-bottom: 25px;}
.best_review_btm ul .best_review .left_region .emoji {line-height: 50px; background: url(../images/best_icon.png) no-repeat left center/50px auto; padding-left: 63px; }

.best_review_btm ul .best_review .right_text {float: right; background-color: #fff; border-radius: 10px; box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1); width: 960px; padding: 30px 35px 30px; box-sizing: border-box; min-height: 240px;}
.best_review_btm ul .best_review .right_text dt {font-size: 24px; font-weight: 600; padding-bottom: 10px; color: #6230CF;}
.best_review_btm ul .best_review .right_text dt .won {font-size: 20px; font-weight: 500;}
.best_review_btm ul .best_review .right_text dd ul li {float: left; color: #666; font-weight: 500; line-height: 20px; padding: 0 10px; border-left: 1px solid #eee;}
.best_review_btm ul .best_review .right_text dd ul li:nth-child(1) {padding-left: 0; border-left: none;}
.best_review_btm ul .best_review .right_text dd.user {font-size: 13px; color: #808080; padding: 15px 0 10px;}
.best_review_btm ul .best_review .right_text .text_content {font-size: 15px; color: #4d4d4d;}

/* 2020-12-22 수정 */
.pagination {
    padding-top: 50px;
    text-align: center;
}

.pagination a {
    display: inline-block;
    width: 30px;
    height: 30px;
    margin: 0 7px;
    font-size: 14px;
    line-height: 30px;
    vertical-align: bottom;
}

.pagination .icon_abbreviation {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: url(../images/abbreviation.png) no-repeat center center;
    vertical-align: bottom;
    margin: 0 7px;
}

.pagination .page_num.on {
    background-color: #666;
    color: #fff;
    border-radius: 50%;
    font-weight: 500;
}

.pagination .prev_page {
    background: url(../images/arrow_prevpage.png) no-repeat center center;
}

.pagination .next_page {
    background: url(../images/arrow_nextpage.png) no-repeat center center;
}

/* 2020-12-22 수정 */


/*클린벨 이용방법*/
.guidebg {
    width: 100%;
    background: rgb(115, 90, 255);
    background: -moz-linear-gradient(0deg, rgba(115, 90, 255, 1) 0%, rgba(136, 114, 255, 1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(115, 90, 255, 1) 0%, rgba(136, 114, 255, 1) 100%);
    background: linear-gradient(0deg, rgba(115, 90, 255, 1) 0%, rgba(136, 114, 255, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#735aff", endColorstr="#8872ff", GradientType=1);
}

.guidebg .guide_step {
    min-height: 1080px;
    width: 100%;
    height: 100vh;
    color: #fff;
    position: relative;
}

.guidebg .guide_step .guide_inner {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    padding: 0px 90px;
    box-sizing: border-box;
    width: 100%;
}

.guidebg .guide_step .guide_inner dl {
    float: left;
}

.guidebg .guide_step .guide_inner dl dt {
    font-size: 30px;
    opacity: .75;
}

.guidebg .guide_step .guide_inner dl .bold {
    font-size: 45px;
    font-weight: 600;
    padding: 10px 0 40px;
}

.guidebg .guide_step .guide_inner dl .sub {
    font-size: 18px;
    line-height: 30px;
}

.guide_step .guide_inner .imgcontainer {
    float: right;
    width: 480px;
    height: 558px;
    background-image: radial-gradient(circle 240px at 240px 240px, rgba(98, 48, 207, 0.15) 99%, transparent 0);
    background-position: 0 30px;
    background-size: 480px 480px;
    background-repeat: no-repeat;
}

.guide_step .guide_inner .imgcontainer .guideimg {
    width: 300px;
    height: 100%;
    margin: 0 auto;
    background-position: left top;
    background-size: 300px auto;
    background-repeat: no-repeat;
    opacity: 0;
}

.step1 .imgcontainer .guideimg {
    background-image: url(../images/guidestep01.png);
}

.step2 .imgcontainer .guideimg {
    background-image: url(../images/guidestep02.png);
}

.step3 .imgcontainer .guideimg {
    background-image: url(../images/guidestep03.png);
}


/*guide 스크롤 애니메이션 */
.guide_step .imgcontainer .guideimg.slidein {
    animation: guidescroll .7s ease forwards;
}

@keyframes guidescroll {
    0% {
        opacity: 0;
        transform: translateX(230px);
    }
    100% {
        opacity: 1;
        transform: translateX(0px);
    }
}


.mediabg {
    background-color: #231E41;
    background-image: url(../images/media_bg.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: auto 100%;
    padding-bottom: 110px;
    min-width: 1300px;
}

.mediabg h3 {
    text-align: center;
    font-size: 30px;
    color: #fff;
    padding: 70px 0 50px;
}

.mediabg .media_container {
    width: 615px;
    margin: 0 auto;
}

.mediabg .media_container iframe {
    width: 100%;
}

/*클린벨 이용방법*/

/*컨텐츠 인터뷰,청소tip*/
/*공통*/
.contentlist {
    padding: 85px 40px 0 40px;
    box-sizing: border-box;
}

.contentlist .contenttitle {
    text-align: center;
    padding: 70px 0;
}

.contentlist .contenttitle h3 {
    font-size: 27px;
    color: #555;
    text-align: center;
    display: inline-block;
}

.contentlist .contenttitle h3::after {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    background-color: #e6e6e6;
    margin-top: 20px;
}

.sub_content {
    background-color: #fafafa;
}

/*컨텐츠 목록 페이지 버튼*/
.contentlist .listpagination {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 70px 0 130px;
}

.contentlist .listpagination .pagearrow {
    display: inline-block;
    width: 8px;
    height: 25px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 8px auto;
}

.contentlist .listpagination .pageleft {
    background-image: url(../images/page_left.png);
    margin-right: 32px;
}

.contentlist .listpagination .pageright {
    background-image: url(../images/page_right.png);
    margin-left: 32px;
}

.contentlist .listpagination .index {
    font-size: 0;
}

.contentlist .listpagination .index a {
    display: inline-block;
    width: 34px;
    height: 34px;
    text-align: center;
    line-height: 34px;
    margin: 0 5px;
    font-size: 16px;
    color: #999;
    box-sizing: border-box;
}

.contentlist .listpagination .index a.active {
    font-weight: 500;
    color: #6230cf;
    background-color: #fff;
    border: 2px solid #6230cf;
    border-radius: 50%;
    line-height: 30px;
}

/*컨텐츠 상세페이지 공통*/
.sub_contentdetail {
    background-color: #fff;
}

.contentdetail {
    padding: 85px 125px 0;
    box-sizing: border-box;
}

.contentdetail > .listlink {
    padding: 30px 0 40px;
}

.contentdetail > .listlink a {
    font-size: 18px;
    color: #4d4d4d;
    padding: 4px 13px 4px 32px;
    display: inline-block;
    border: 1px solid #e6e6e6;
    border-radius: 3px;
    background: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/contentdetail_arrowleft.png) no-repeat left 13px center #fff;
}

.contentdetail .content_top {
    border-bottom: 1px solid #d9d9d9;
    position: relative;
}

.contentdetail .content_top .contenttitle .category {
    font-size: 18px;
    font-weight: 500;
    color: #6230cf;
    padding-bottom: 10px;
}

.contentdetail .content_top .contenttitle h3 {
    font-size: 30px;
    padding-bottom: 35px;
}

.contentdetail .content_top .con_date {
    padding-bottom: 30px;
    font-size: 15px;
    color: #808080;
}

.contentdetail .content_top .urlcopy_circle {
    position: absolute;
    right: 0;
    bottom: 20px;
}

.contentdetail .content_top .urlcopy_circle button {
    width: 40px;
    height: 40px;
    border: 1px solid #ccc;
    border-radius: 50%;
    box-sizing: border-box;
    background: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/urlcopy.png) no-repeat center #fafafa;
}

.contentdetail .content_mid {
    padding: 40px 0;
    border-bottom: 1px solid #d9d9d9;
}

.contentdetail .content_mid .urlcopy_bottom {
    text-align: center;
    padding-top: 40px;
}

.contentdetail .content_mid .urlcopy_bottom button {
    font-size: 18px;
    padding: 6.5px 38px 6.5px 10px;
    border-radius: 3px;
    color: #4d4d4d;
    background: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/urlcopy.png) no-repeat right 10px center #f2f2f2;
}

.contentdetail .content_btm {
    padding: 30px 0 130px;
}

.contentdetail .content_btm a {
    font-size: 18px;
    border: 1px solid #e6e6e6;
    border-radius: 3px;
    display: inline-block;
    background-color: #fff;
}

.contentdetail .content_btm .prevnext_con {
    float: left;
    font-size: 0;
}

.contentdetail .content_btm .prevnext_con a {
    background-repeat: no-repeat;
    margin-right: 20px;
}

.contentdetail .content_btm .prevnext_con a.prev_con {
    padding: 4px 13px 4px 32px;
    background-image: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/contentdetail_arrowleft.png);
    background-position: left 13px center;
}

.contentdetail .content_btm .prevnext_con a.next_con {
    padding: 4px 32px 4px 13px;
    background-image: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/contentdetail_arrowright.png);
    background-position: right 13px center;
}

.contentdetail .content_btm .listlink {
    float: right;
}

.contentdetail .content_btm .listlink a {
    padding: 4px 22.5px;
}

/*인터뷰 목록*/
.interview_list .interviewbox {
    margin-bottom: 30px;
}

.interview_list .interviewbox a {
    display: flex;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
    max-height: 300px;
}

.interview_list .interviewbox a .thumb {
    width: 400px;
    height: 300px;
    background-color: #e6e6e6;
    border-radius: 10px 0 0 10px;
    overflow: hidden;
}

.interview_list .interviewbox a .thumb img {
    width: 400px;
    height: 100%;
    object-fit: cover;
}

.interview_list .interviewbox a .previewinfo {
    width: 820px;
    padding: 30px;
    box-sizing: border-box;
}

.interview_list .interviewbox a .previewinfo .con_category {
    font-size: 18px;
    color: #6230cf;
    font-weight: 500;
    padding-bottom: 10px;
}

.interview_list .interviewbox a .previewinfo h4 {
    font-size: 25px;
    color: #4d4d4d;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: break-all;
    margin-bottom: 20px;
}

.interview_list .interviewbox a .previewinfo .con_preview p {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-break: break-all;
    color: #666;
    font-size: 15px;
    margin-bottom: 42px;
    min-height: 47px;
}

.interview_list .interviewbox a .previewinfo .con_info p {
    font-size: 17px;
    font-weight: 500;
    color: #555;
    padding-bottom: 10px;
}

.interview_list .interviewbox a .previewinfo .con_info p span {
    margin-right: 10px;
}

.interview_list .interviewbox a .previewinfo .con_info ul {
    display: flex;
    align-items: center;
}

.interview_list .interviewbox a .previewinfo .con_info ul li {
    font-size: 15px;
    color: #555;
    padding-right: 20px;
}

.interview_list .interviewbox a .previewinfo .con_info ul li .stargrade {
    padding-left: 28px;
    background: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/preview_stargrade.png) no-repeat left top;
}

.interview_list .interviewbox a .previewinfo .con_info ul li .case {
    padding-left: 7px;
}

/*청소TIP 목록*/
.cleantip_list {
    display: grid;
    grid-template-columns: repeat(2, 600px);
    -ms-grid-columns: 600px 600px;
}

.cleantip_list .cleantipbox {
    width: 600px;
    margin-bottom: 60px;
}

.cleantip_list .cleantipbox:nth-child(2n) {
    margin-left: 20px;
}

.cleantip_list .cleantipbox a {
    display: inline-block;
    width: 100%;
}

.cleantip_list .cleantipbox a .thumb {
    width: 100%;
    height: 300px;
    background-color: #e6e6e6;
    border-radius: 10px;
    overflow: hidden;
}

.cleantip_list .cleantipbox a .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all .5s ease;
}

.cleantip_list .cleantipbox a:hover .thumb img {
    transform: scale(1.1);
}

.cleantip_list .cleantipbox a .previewinfo h4 {
    margin: 15px 0;
    font-size: 23px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: break-all;
}

.cleantip_list .cleantipbox a:hover .previewinfo h4 {
    color: #6230cf;
}

.cleantip_list .cleantipbox .previewinfo .con_preview p {
    font-size: 15px;
    color: #808080;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    word-break: break-all;
    min-height: 66px;
}

.cleantip_list .cleantipbox .previewinfo .con_date {
    font-size: 15px;
    color: #808080;
    padding-top: 15px;
}

.cleantip_list + .listpagination {
    padding-top: 0;
}

/*인터뷰 상세페이지*/
.content_top .interview_info {
    background-color: #fafafa;
    display: inline-block;
    min-width: 400px;
    padding: 25px 20px;
    box-sizing: border-box;
    border-radius: 10px;
    margin-bottom: 20px;
    color: #4d4d4d;
}

.content_top .interview_info p {
    font-size: 18px;
    font-weight: 500;
    padding-bottom: 8px;
}

.content_top .interview_info p span:first-child {
    margin-right: 10px;
}

.content_top .interview_info ul {
    display: flex;
    font-size: 15px;
}

.content_top .interview_info ul li:first-child {
    margin-right: 20px;
}

.content_top .interview_info ul li:first-child dl {
    display: flex;
}

.content_top .interview_info ul li:first-child .stargrade_img {
    width: 105px;
    height: 20px;
    background: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/stargrade_bg.png) no-repeat left bottom;
    margin-right: 7px;
}

.content_top .interview_info ul li:first-child dl .stargrade_img .fillstar {
    display: inline-block;
    height: 20px;
    background: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/stargrade_bg.png)
}

.content_top .interview_info ul li:nth-child(2) .case {
    margin-left: 7px;
}

/* price.html */
/* 청소요금 미리 알아보기 */
.pricesearch_top {
  height: 100vh;
  min-height: 1080px;
	background: linear-gradient(#8264E8,#6F79ED);
	background: -webkit-linear-gradient(#8264E8,#6F79ED);
	background: -moz-linear-gradient(#8264E8,#6F79ED);
}
.pricesearch_top .price_box{
  padding: 245px 20px 0;
  box-sizing: border-box;
}
.pricesearch_top .price_box .title{
  padding-left: 30px;
  color: #fff;
  font-size: 20px;
  margin-bottom: 100px;
}
.pricesearch_top .price_box .title h2{
  font-size: 35px;
  color: #fff;
  text-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3);
  margin-bottom: 20px;
}
.pricesearch_top .price_box .title h2 span{
  font-size: 50px;
  color: #FFF280;
}
.pricesearch_top .price_box .con h3 {
  font-size: 23px;
  color: #fff;
  padding-left: 38px;
  background: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/searchbox_title.png) no-repeat left center;
  margin-bottom: 30px;
  margin-left: 30px;
}
.pricesearch_top .price_box .con .searchbox {
  background-color: #fff;
  border-radius: 20px;
  padding: 35px 50px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.2);
}
.pricesearch_top .price_box .con .searchbox .selectedBox{
  position: relative;
  float: left;
  width: 240px;
  margin-right: 50px;
}
.pricesearch_top .price_box .con .searchbox .selectedBox .dropclick input{
  cursor: default;
  width: 100%;
  padding: 11px 0;
  font-size: 25px;
  font-weight: 500;
  color: #4d4d4d;
  border-bottom: 1px solid #DEDAE6;
  background: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/dropclick.png) no-repeat right 10px center / 19px auto;
}
.pricesearch_top .price_box .con .searchbox .selectedBox .dropdown{
  position: absolute;
  width: 100%;
  top: 80px;
  left: 0;
  background-color: #fff;
  border-radius: 20px;
  box-sizing: border-box;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  display: none;
}
.pricesearch_top .price_box .con .searchbox .selectedBox .dropdown ul li{
  position: relative;
}
.pricesearch_top .price_box .con .searchbox .selectedBox .dropdown ul li:not(:last-child){
  border-bottom: 1px solid #EDEDED;
}
.pricesearch_top .price_box .con .searchbox .selectedBox .dropdown ul li input{
  position: absolute;
  opacity: 0;
  top: 0;
  left: 0;
}
.pricesearch_top .price_box .con .searchbox .selectedBox .dropdown ul li input+label{
  width: 100%;
  display: block;
  text-align: center;
  padding: 13px 0;
  font-size: 20px;
  font-weight: 400;
  color: #4d4d4d;
}
.pricesearch_top .price_box .con .searchbox .selectedBox .dropdown ul li input:not(:disabled)+label:hover{
  background-color: #fafafa;
  color: #6230cf;
}
.pricesearch_top .price_box .con .searchbox .selectedBox .dropdown ul li input:disabled+label{
  background-color: #EDEDED;
  color: #CCCCCC;
}
.pricesearch_top .price_box .con .searchbox .selectCategory{
  float: left;
}
.pricesearch_top .price_box .con .searchbox .selectCategory li{
  float: left;
  position: relative;
  padding-top: 13px;
}
.pricesearch_top .price_box .con .searchbox .selectCategory li:first-child{
  margin-right: 50px;
}
.pricesearch_top .price_box .con .searchbox .selectCategory li input{
  position: absolute;
  opacity: 0;
  left: 0;
  top: 0;
}
.pricesearch_top .price_box .con .searchbox .selectCategory li input+label{
  font-size: 25px;
  color: #4d4d4d;
  font-weight: 500;
  padding-left: 32px;
  background: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/rounduncheck_fill.png) no-repeat left center;
  /* line-height: 63px; */
}
.pricesearch_top .price_box .con .searchbox .selectCategory li input:checked+label{
  background-image: url(https://ctrlf-cleanbell-prod.s3.ap-northeast-2.amazonaws.com/static/web/images/roundcheck_fill.png);
}
.pricesearch_top .price_box .con .searchbox .searchsubmit{
  float: right;
}
.pricesearch_top .price_box .con .searchbox .searchsubmit button{
  padding: 13px 50px;
  font-size: 25px;
  font-weight: 600;
  color: #fff;
  border-radius: 60px;
  background-color: #6230CF;
  border:none;
}
.pricesearch_bottom {
  padding: 80px 20px 90px;
  box-sizing: border-box;
  display: none;
}
.pricesearch_bottom h4{
  font-size: 23px;
  color: #4d4d4d;
  margin-bottom: 20px ;

}
.pricesearch_bottom .selectedShow{
  padding-bottom: 15px;
  border-bottom: 5px solid #6230cf;
  width: fit-content;
  margin-bottom: 60px;
}
.pricesearch_bottom .selectedShow span{
  font-size: 27px;
  color: #6230cf;
  font-weight: 600;
  display: inline-block;
  padding-right: 20px;
}
.pricesearch_bottom .priceTable .tablehead{
  padding: 0 50px;
}
.pricesearch_bottom .priceTable .tablehead .th{
  float: left;
  width: 550px;
  font-size: 18px;
  color: #808080;
  margin-bottom: 20px;
}
.pricesearch_bottom .priceTable .tablehead .th:nth-child(2){
  float: right;
}
.pricesearch_bottom .priceTable .tablehead .th span:first-child{
  display: inline-block;
  width: 240px;
}
.pricesearch_bottom .priceTable .tablebody{
  padding: 10px 50px;
  background-color: #fff;
  border-radius: 40px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.1);
}
.pricesearch_bottom .priceTable .tablebody .priceList li{
  float: left;
  width: 550px;
  padding: 30px 0;
  line-height: 37px;
  font-size: 21px;
  color: #666;
}
.pricesearch_bottom .priceTable .tablebody .priceList li:not(:last-child){
  border-bottom: 1px solid #E9E6ED;
}
.pricesearch_bottom .priceTable .tablebody .priceList li:nth-child(2n){
  float: right;
}
.pricesearch_bottom .priceTable .tablebody .priceList li .region{
  display: inline-block;
  width: 240px;
}
.pricesearch_bottom .priceTable .tablebody .priceList li .price{
  font-size: 25px;
  font-weight: 500;
  color: #4d4d4d;
}