/*
공통
*/
.mg_160{ margin-bottom:130px; }
.mg_60{ margin-bottom:60px; }
.ur_title{
    font-size:22px; font-weight:600;
    margin-bottom:25px;
}
.in_title{
    font-size:25px; font-weight:600;
    margin-bottom:40px; text-align:center;
}





/*----------------------------------------------------------------------
일반유저 홈화면 = ur

첫번째 섹션 ur1
*/
.ur1{ margin-top:100px; position:relative; }
.ur1 h2{
    font-size:32px; font-weight:600;
    line-height:48px; margin-bottom:25px;
}
.ur1 h2 br:last-of-type{ display:none; }

.ur1_swiper{ overflow:hidden; margin-bottom:20px;  }
.ur1 ul li{
    height:350px; background:url('../images/home_img1.jpg') no-repeat center / cover;
    position:relative; border-radius:10px;
}
.ur1 ul li a{ 
    display:flex; justify-content:center; align-items:center;
    height:100%; background-color:rgba(0, 0, 0, 0.2);
    border-radius:10px; overflow:hidden;
}
.ur1 ul li p{
    position:absolute; left:20px; bottom:15px;
    font-size:25px; font-weight:600;
    color:#FFF; line-height:27px;
    width:85%;
}
.ur1 ul li p span{ font-size:16px; font-weight:500; }

.ur1_next, .ur1_prev{
    --swiper-theme-color:#5a6068;
    --swiper-navigation-size:18px;
    width:50px; height:50px;
    background-color:#fff; border-radius:9999px;
    border:1px solid #E8EAED;
    box-shadow:0 0 4px #d7d7d7;
}
.ur1_next{ position:absolute; right:-25px; top:53%; }
.ur1_prev{ position:absolute; left:-25px; top:53%; }

/*
ur2
*/
.ur2{ position:relative; }
.ur2 h2 span{
    display:block;
    font-size:18px; font-weight:500;
}
.tabs_swiper{
    width:65%; max-width:750px;
    overflow:hidden;
}
.ur2_tabs button{
    position:relative; width:auto;
    padding:0 20px; height:38px;
    background-color:#fff;
    border:1px solid #E8EAED; border-radius:9999px;

    font-size:14px; font-weight:500;
    transition:all .3s;
}
.ur2_tabs button.active,
.ur2_tabs button:hover{ background-color:#202124; color:#fff; }

/*스와이퍼*/
.ur2_swiper{ overflow:hidden; }
.ur2 .SnsCon_btns{ position:absolute; right:0; top:5%; }

/*
ur3
ur4
ur5
*/
.ur3, .ur4{ position:relative; overflow:hidden; }
.ur3 .SnsCon_btns,
.ur4 .SnsCon_btns{ position:absolute; right:0; top:0; }

.ur4 ul li{
    border-radius:9999px;
    background:url('../images/home_img3.jpg') no-repeat center / cover;
}
.ur4 ul li a{
    display:block; height:250px;
    display:flex; justify-content:center; align-items:center;
    background:rgba(0, 0, 0, 0.2);
    border-radius:9999px; text-align:center; 
    font-size:18px; font-weight:600; color:#FFF;
}

.ur5 .con_content{ margin:50px 0; }


/*----------------------------------------------------------------------
인플루언서 홈화면 = in

첫번째 섹션 inReg
*/
.inReg{ height:800px; background:url('../images/home_img5.jpg') no-repeat center / cover; }
.inReg>div{
    height:100%; z-index:99;
    display:flex; flex-flow:column; justify-content:center;
}
.inReg>div h2{
    font-size:55px; font-weight:500;
    color:#fff; line-height:75px;
    margin-bottom:20px;
}
.inReg>div p{
    font-size:25px; font-weight:400;
    color:#fff; line-height:37px;
    margin-bottom:75px;
}
.inReg>div p span{ display:block; font-weight:500; }
.inReg>div a{
    display:inline-block;
    padding:0 25px; line-height:55px;
    border-radius:9999px; text-align:center;

    font-size:18px; font-weight:700;
}

/*
in1
*/
.in1 ul{
    display:flex; flex-wrap:wrap; justify-content:center;
    margin-bottom:30px;
}
.in1 ul li{
    width:32%;
    padding:200px 25px 40px 25px;
    border-radius:8px;
    background-repeat:no-repeat;
    background-position:center 40px;
    background-size:60%;
    background-color:#F8F9FA;
}
.in1 ul li:nth-of-type(1){ background-image:url('../images/HomeIn1_1.png'); }
.in1 ul li:nth-of-type(2){ background-image:url('../images/HomeIn1_2.png'); }
.in1 ul li:nth-of-type(3){ background-image:url('../images/HomeIn1_3.png'); }
.in1 ul li:not(:first-of-type){ margin-left:2%; }
.in1 ul li h3{
    font-size:20px; font-weight:500;
    margin-bottom:15px;
}
.in1 ul li p{ font-size:14px; font-weight:400; }

.in1>p{
    font-size:16px; font-weight:400;
    color:#B4B4B4;
}

/*
in2
*/
.in2 h2{
    font-size:25px; font-weight:600;
    line-height:37px; margin-bottom:30px;
}
.in2_swiper{ overflow:hidden; }
.in2_swiper>ul{ transition-timing-function:linear; }
.in2>div{
    background-color:#F8F9FA; border-radius:10px;
    padding:25px 30px; margin-bottom:1.5%;
}
.in2>div ul li{
    height:120px; border-radius:9999px;
    background-color:#E8EAED; overflow:hidden;
    display:flex; justify-content:center; align-items:center;
}

.in2>ul{ display:flex; flex-wrap:wrap; }
.in2>ul li{
    display:flex; flex-flow:column; justify-content:space-between;
    width:49.25%; padding:25px 30px;
    background-color:#F8F9FA;
    border-radius:8px;
}
.in2>ul li:nth-child(even){ margin-left:1.5%; }
.in2>ul li:nth-of-type(n-1){ margin-bottom:1.5%; }
.in2 .img_box{
    height:360px; background-color:#E8EAED;
    border-radius:8px;
}

/*
in3
*/
.in3>h2{ position:relative; }
.in3>h2 div{
    position:absolute; left:50%; top:-100%;
    transform:translateX(-50%);
}
.in3>h2 div span{
    display:inline-block; width:12px; height:12px;
    border-radius:100%;
}
.in3>h2 div span:nth-of-type(1){ background-color:#ff699f; }
.in3>h2 div span:nth-of-type(2){ background-color:#ff176b; }
.in3>h2 div span:nth-of-type(3){ background-color:#1B6CE2; }
.in3>h2 div span:not(:first-of-type){ margin-left:5px; }

/*콘텐츠 내용*/
.in3 ol li{
    display:flex; flex-wrap:wrap;
    height:265px;
}
.in3 ol li:nth-of-type(odd) .text_box,
.in3 ol li:nth-of-type(2) .img_box{ margin-left:2%; }
.in3 ol li:not(:last-of-type){ margin-bottom:2%; }
.in3 .img_box{
    width:30%; height:100%;
    background-color:#E8EAED; border-radius:12px;
}
.in3 ol li:nth-of-type(1) img{ max-width:500%; margin-top:80px; }
.in3 ol li:nth-of-type(2) img{ max-width:350%; margin:140px 360px 0 0; }
.in3 ol li:nth-of-type(3) img{ max-width:350%; margin:60px 0 0 350px; }

.in3 .text_box{
    display:flex; flex-flow:column; justify-content:center;
    width:68%; padding:0 30px;
    border-radius:8px;
}
.in3 .text_box span{
    width:40px; line-height:40px;
    border-radius:100%; text-align:center;
    margin-bottom:15px;

    font-size:20px; font-weight:600;
    color:#fff;
}
.in3 ol li:nth-of-type(1) .text_box span{ background-color:#ff699f; }
.in3 ol li:nth-of-type(2) .text_box span{ background-color:#ff176b; }
.in3 ol li:nth-of-type(3) .text_box span{ background-color:#1B6CE2; }
.in3 .text_box strong{
    font-size:20px; font-weight:500;
    margin-bottom:10px;
}
.in3 .text_box p{ font-size:14px; font-weight:400; }

/*
in4
*/
.in4{ position:relative; }
.in4 .ur2_swiper{ margin-bottom:50px; }
.in4 .SnsCon_btns{ position:absolute; right:0; top:0; }
.in4 .more_btn button{ background-position:91% center; }

/*
in5
*/
.in5{
    background:linear-gradient(#ff699f 71%,#fff 29%);
    padding-top:100px;
}
.in5>div{ display:flex; flex-wrap:wrap; align-items:center; }
.in5 .img_box{
    width:49%; height:410px;
    background-color:#E8EAED; border-radius:8px;
}
.in5 .text_box{ width:45%; margin-left:5%; }
.in5 .text_box strong{
    display:flex; flex-wrap:wrap; justify-content:space-between;
    font-size:35px; font-weight:500;
    color:#fff;
}
.in5 .text_box strong span{ font-weight:600; }
.in5 .text_box .pile2{ margin-bottom:50px; }
.in5 .text_box p{
    font-size:16px; font-weight:400;
    margin-bottom:75px; color:#fff;
}

.in5 .inUrNumb{ display:flex; flex-wrap:wrap; justify-content:space-between; }
.in5 .inUrNumb li:not(:nth-of-type(2)){
    font-size:16px; font-weight:500;
    text-align:center;
}
.in5 .inUrNumb li:not(:nth-of-type(2)) span{
    display:block; line-height:100%;
    font-size:35px; font-weight:700;
    margin-top:5px;
}
.in5 .inUrNumb li:nth-of-type(2){
    display:inline-block; width:1px; height:88px;
    background-color:#C8C8C8;
    text-indent:-9999px;
}

/*
in5
*/
.in6 .in_title{ margin-bottom:15px; }
.in6>p{
    font-size:18px; font-weight:400;
    margin-bottom:20px; text-align:center;
}
.in6_tabs{ text-align:center; margin-bottom:70px; }
.in6_tabs button{ font-size:18px; font-weight:500; }
.in6_tabs button:hover,
.in6_tabs button.active{
    text-decoration:underline #ff176b 2px;
    text-underline-offset:15px;
}
.in6_tabs button:last-of-type{ margin-left:30px; }

/*콘텐츠 내용*/
.in6_wrap{ display:flex; flex-wrap:wrap; align-items:flex-end; }
.in6_wrap>div{ width:50%; }
.in6_wrap .text_box strong{
    display:block; margin-bottom:40px;
    font-size:35px; font-weight:700;
    line-height:50px;
}
.in6_wrap .text_box p{ font-size:16px; font-weight:400; }
.in6_wrap .text_box p:first-of-type{ margin-bottom:15px; }
.in6_wrap .text_box p:last-of-type{ margin-bottom:85px; }
.in6_wrap .text_box p span{ display:block; font-weight:700; }
.in6_wrap .text_box a{
    display:block; width:200px; line-height:60px;
    border-radius:8px;
    text-align:center;
    font-size:18px; font-weight:500; color:#fff;
}
.in6_wrap .img_box img{ margin-left:auto; }

.charge_modal{
    width:90%; max-width:700px;
    max-height:722px; height:90%;
    padding:35px 30px; overflow-y:scroll;
}
.charge_modal::-webkit-scrollbar{ width:5px; }
.charge_modal::-webkit-scrollbar-thumb{ height:10%; background-color:#c1c1c1; border-radius:9999px; }
.charge_modal::-webkit-scrollbar-track{ background-color: transparent; }

.charge_modal>ul>li{ margin-bottom:35px; }
.charge_modal>ul>li:not(:last-of-type){ border-bottom:1px solid #E8EAED; padding-bottom:35px; }
.charge_modal>ul>li strong{ display:block; margin-bottom:10px; }
.charge_modal>ul>li p{ line-height:25px; font-size:14px; font-weight:400; }

.charge_modal .deco_text{ padding-left:20px; }
.charge_modal .deco_text li{ list-style:disc; font-size:14px; font-weight:400; }
.charge_modal .deco_text li:not(:last-of-type){ margin-bottom:8px; }
.charge_modal .deco_text li span{ font-weight:700; }

.charge_modal div{ text-align:center; }



/*----------------------------------------------------------------------
기본 pc 스타일
*/
@media screen and (max-width:1250px) {
    .ur1 ul li{ height:320px; }

    .inReg{ height:770px; }
    .in2>div ul li{ height:100px; }
    .in2 .img_box{ height:300px; }
    .in5 .img_box{ height:400px; }

    .in5 .text_box strong,
    .in5 .inUrNumb li:not(:nth-of-type(2)) span,
    .in6_wrap .text_box strong{ font-size:34px; }
} 
@media screen and (max-width:1110px) {
    .ur1 ul li{ height:300px; }
    .con_content>ul>li{ width:32%; }
    .con_content>ul>li:not(:nth-of-type(4n+1)){ margin-left:0; }
    .con_content>ul>li:not(:nth-of-type(3n+1)){ margin-left:2%; }
    .con_content>ul>li:not(:nth-of-type(-n+4)){ margin-top:0; }
    .con_content>ul>li:not(:nth-of-type(-n+3)){ margin-top:50px; }

    .in5 .text_box strong,
    .in5 .inUrNumb li:not(:nth-of-type(2)) span,
    .in6_wrap .text_box strong{ font-size:31px; }
}
/*태블릿 스타일*/
@media screen and (max-width:1023px) {
    .ur1 h2{ font-size:30px; line-height:43px; }
    .ur1 ul li p{ font-size:23px; }

    .inReg>div h2{ font-size:50px; line-height:70px; }
    .in2 h2{ font-size:22px; line-height:34px; }
    .in2 .img_box{ height:230px; }
    .in3 .text_box p br{ display:none; }
    .in5{ background:linear-gradient(#ff699f 70%, #fff 30%); }
    .in5 .img_box{ height:370px; }
    .in5 .text_box .pile2{ margin-bottom:45px; }
    .in5 .text_box p{ margin-bottom:70px; }
    .in6_wrap .text_box{ width:56%; }
    .in6_wrap .text_box strong{ line-height:45px; margin-bottom:35px; }
    .in6_wrap .text_box p:last-of-type{ margin-bottom:80px; }
    .in6_wrap .img_box{ width:44%; }
} 
@media screen and (max-width:900px) {
    .con_content>ul>li{ width:48.5%; }
    .con_content>ul>li:not(:nth-of-type(3n+1)){ margin-left:0%; }
    .con_content>ul>li:not(:nth-of-type(2n+1)){ margin-left:3%; }
    .con_content>ul>li:not(:nth-of-type(-n+3)){ margin-top:0; }
    .con_content>ul>li:not(:nth-of-type(-n+2)){ margin-top:50px; }

    .inReg{ height:730px; }
    .inReg>div h2{ font-size:45px; line-height:60px; }
    .inReg>div p{
        font-size:22px; line-height:32px;
        margin-bottom:65px;
    }
    .inReg>div a{ font-size:16px; width:190px; }
    .in2 .img_box{ height:210px; }
    .in3 ol li{ height:220px; }
    .in5{ background:linear-gradient(#ff699f 71%, #fff 29%); }
    .in5 .img_box{ height:350px; }
    .in5 .text_box strong,
    .in5 .inUrNumb li:not(:nth-of-type(2)) span,
    .in6_wrap .text_box strong{ font-size:29px; line-height:40px; }
    .in5 .text_box .pile1{ margin-bottom:5px; }
    .in5 .text_box .pile2{ margin-bottom:40px; }
    .in5 .inUrNumb li:nth-of-type(2){ height:75px; }
    .in5 .inUrNumb li:not(:nth-of-type(2)) span{ margin-top:3px; }
    .in6_wrap .text_box strong{ margin-bottom:35px; }
    .in6_wrap .text_box p:last-of-type{ margin-bottom:75px; }
    .in6>p{ font-size:16px; margin-bottom:15px; }
    .in6_tabs button{ font-size:16px; }
    .in6_wrap .text_box a{
        width:180px; line-height:55px;
        font-size:16px;
    }
}
@media screen and (max-width:850px) {
    .ur1{ margin-top:160px; }
    .ur1 ul li{ height:280px; }

    .in_title{ font-size:22px; }
    .inReg{ padding-top:120px; }
    .in1 ul li{
        display:flex; flex-flow:column; justify-content:center;
        width:100%; height:170px; padding:0 20px 0 230px;
        background-size:30%;
        background-position:35px center;
        background-size:22%;
    }
    .in1 ul li:not(:first-of-type){ margin-left:0; }
    .in1 ul li:not(:last-of-type){ margin-bottom:3%; }
    .in1 ul li h3{ font-size:18px; }
    .in1>p{ width:100%; }
    .in2 .img_box{ height:200px; }
    .in2>div{ margin-bottom:2%; }
    .in2>ul li{ width:49%; }
    .in2>ul li:nth-child(even){ margin-left:2%; }
    .in2 h2{ font-size:20px; line-height:31px; }
    .in3 .img_box{
        width:100%; height:300px;
        margin-bottom:3%; align-items:flex-start;
    }
    .in3 ol li:nth-of-type(1) img,
    .in3 ol li:nth-of-type(2) img,
    .in3 ol li:nth-of-type(3) img{ max-width:100%; margin:0; }
    .in3 .text_box{ width:100%; padding:25px 30px; }
    .in3 .text_box strong{ font-size:18px; }
    .in3 ol li{ height:auto; }
    .in3 ol li:nth-of-type(2){ flex-flow:column-reverse; }
    .in3 ol li:not(:last-of-type){ margin-bottom:3%; }
    .in3 ol li:nth-of-type(odd) .text_box,
    .in3 ol li:nth-of-type(2) .img_box{ margin-left:0; }
    .in5 .text_box strong,
    .in5 .inUrNumb li:not(:nth-of-type(2)) span,
    .in6_wrap .text_box strong{ font-size:26px; }
    .in5 .inUrNumb li:not(:nth-of-type(2)) span{ margin-top:0; }
    .in5 .text_box .pile1{ margin-bottom:0; }
}
/*모바일 스타일*/
@media screen and (max-width:767px) {
    .mg_60{ margin-bottom:50px; }
    .ur1 h2{ font-size:28px; line-height:40px; }
    .ur1 ul li p{ font-size:20px; }
    .ur1_next, .ur1_prev{ width:45px; height:45px; }
    .ur1_prev{ left:-23px; }
    .ur1_next{ right:-23px; }
    .ur1 .swiper-button div:not(.swiper-button-stop){ background-size:14px; }
    .ur2_tabs button{ height:35px; padding:0 17px; }

    .mg_160{ margin-bottom:100px; }
    .inReg>div h2{ font-size:40px; line-height:55px; }
    .in1 ul li{ padding:0 20px 0 190px; }
    .in4 .in_title{ width:70%; text-align:left; }
    .in2 .img_box{ height:150px; }
    .in2>div{ padding:20px 25px; }
    .in2>ul li{ padding:25px; }
    .in2>ul li h2 br{ display:none; }
    .in3 .text_box{ padding:20px 25px; }
    .in5{ background:linear-gradient(#ff699f 85%, #fff 15%); }
    .in5 .img_box{
        width:100%; height:310px;
        margin-bottom:25px;
    }
    .in5 .text_box{ width:100%; margin-left:0; }
    .in5 .text_box .pile2{ margin-bottom:20px; }
    .in5 .text_box p{ margin-bottom:60px; }
    .in5 .inUrNumb{ justify-content:space-around; }
    .in5 .text_box strong,
    .in5 .inUrNumb li:not(:nth-of-type(2)) span,
    .in6_wrap .text_box strong{ font-size:29px; line-height:40px; }
    .in6_wrap{ flex-flow:column-reverse; }
    .in6_wrap .text_box{ width:100%; text-align:center; }
    .in6_wrap .text_box a{ margin:0 auto; width:170px; }
    .in6_wrap .text_box strong{ margin-bottom:30px; }
    .in6_wrap .text_box p:last-of-type{ margin-bottom:55px; }
    .in6_wrap .img_box{ width:100%; margin-bottom:50px; }
} 
@media screen and (max-width:599px) {
    .ur1 ul li{ height:320px; }

    .inReg>div h2 span{ display:block; }
    .inReg>div p{ font-size:20px; line-height:28px; }
    .in1 ul li{ background-size:25%; padding:0 20px 0 180px; }
    .in2>ul li{ width:100%; }
    .in2>ul li:nth-child(even){ margin-left:0; }
    .in2>ul li:nth-of-type(n-1){ margin-bottom:0; }
    .in2>ul li:not(:last-of-type){ margin-bottom:3%; }
    .in5 .text_box strong,
    .in5 .inUrNumb li:not(:nth-of-type(2)) span,
    .in6_wrap .text_box strong{ font-size:28px; }
    .in5 .img_box{ height:280px; }
    .in5 .text_box p{ font-size:15px; }

}
@media screen and (max-width:550px) {
    .con_content>ul>li{ width:100%; }
    .con_content>ul>li:not(:nth-of-type(2n+1)){ margin-left:0%; }
    .con_content>ul>li:not(:nth-of-type(-n+1)){ margin-top:30px; }
}
@media screen and (max-width:500px) {
    .ur_title{ font-size:20px; }
    .ur1 h2{ font-size:25px; line-height:38px; }
    .ur1_next, .ur1_prev{ width:40px; height:40px; }
    .ur1_prev{ left:-20px; top:55%; }
    .ur1_next{ right:-20px; top:55%; }
    .tabs_swiper{ width:100%; }
    .ur1 h2 br:last-of-type{ display:block; }

    .in_title{ font-size:20px; }
    .inReg>div a{
        width:170px; line-height:50px;
        font-size:15px;
    }
    .in1 ul{ margin-bottom:20px; }
    .in1 ul li{
        height:auto; padding:150px 25px 25px 25px;
        background-position:center 25px;
        background-size:40%;
    }
    .in1>p{ font-size:15px; }
    .in2>div ul li{ height:85px; }
    .in3 .text_box span{
        width:35px; line-height:35px;
        font-size:16px;
    }
    .in1 ul li:not(:last-of-type),
    .in2>div, .in2>ul li:not(:last-of-type),
    .in3 .img_box, .in3 ol li:not(:last-of-type){ margin-bottom:4%; }
    .in4 .in_title{ width:60%; }
    .in5 .img_box{ height:250px; }
    .in5 .text_box strong,
    .in5 .inUrNumb li:not(:nth-of-type(2)) span,
    .in6_wrap .text_box strong{ font-size:25px; line-height:35px; }
    .in6_tabs button:last-of-type{ margin-left:20px; }
    .in6>p, .in6_tabs button,
    .in6_wrap .text_box p, .in6_wrap .text_box p:last-of-type{ font-size:15px; }
    .in6_wrap .text_box a{
        width:150px; line-height:50px;
        font-size:15px;
    }
}
@media screen and (max-width:400px) {
    .ur2 h2 span{ font-size:16px; }
    .ur1 ul li{ height:280px; }
    .ur1 h2{ font-size:24px; line-height:36px; }
    .ur_title{ font-size:18px; }
    .ur2_tabs button{ font-size:13px; }
    
    .inReg>div h2{ font-size:38px; line-height:53px; }
    .inReg>div p{ font-size:18px; line-height:25px; }
    .in_title{ font-size:18px; }
    .in1 ul li{
        padding:140px 25px 20px 25px;
        background-size:45%;
    }
    .in1 ul li h3{ font-size:16px; }
    .in1>p{ font-size:14px; }
    .in2 h2{ font-size:18px; line-height:28px; }
    .in3>h2 div{ top:-35px; }
    .in3 .text_box strong{ font-size:16px; }
    .in5 .text_box strong,
    .in5 .inUrNumb li:not(:nth-of-type(2)) span,
    .in6_wrap .text_box strong{ font-size:22px; line-height:31px; }
    .in5 .inUrNumb li:not(:nth-of-type(2)), .in5 .text_box p,
    .in6>p, .in6_tabs button, .in6_wrap .text_box p{ font-size:14px; }
    .in5{ background:linear-gradient(#ff699f 84%, #fff 16%); }
    .in5 .img_box{ height:200px; }
    .in5 .text_box p{ margin-bottom:55px; }
    .in5 .inUrNumb li:nth-of-type(2){ height:65px; }
    .in6_tabs button:last-of-type{ margin-left:15px; }
    .in6>p{ margin-bottom:10px; }
    .in6_wrap .text_box p:last-of-type{ margin-bottom:50px; }
}