@charset "utf-8"; 
/* MOBILE */ 
 
/* talk */
.talk , .talk__txt { position:relative ; display:inline-block }
.talk { padding:0 0 0 5.5rem }

.talk__face , .talk__face::before, .talk__face::after , .talk__txt::before { border-radius:0.4rem }
.talk__face , .talk__face::before , .talk__face::after { position:absolute ;  ; display:block }
.talk__face { 
    overflow:hidden ; left:0 ; top:0 ; z-index:5 ; 
    width:5rem ; height:5rem ; background-color:#ffffff ;
    font-size:0 ; color:transparent ;  
    box-shadow:0 0.2rem 0.3rem rgba(0,0,0,0.2) ;
}
.talk__face::before , .talk__face::after , .talk__txt::before { box-sizing:border-box }
.talk__face::before , .talk__face::after {
    width:100% ; height:100% ; 
    content:"" ; 
    left:50% ; top:50% ; transform:translate(-50%,-50%) ;
}
.talk__face::before { 
    width:10rem ; height:10rem ; transform:translate(-50%,-50%) scale(0.5) ;
    background:url(../img_sub/SS32_faces.png) no-repeat left top ; background-size:auto 26rem }
.talk__face::after { border:solid 1px rgba(0,0,0,0.1) }
.talk__txt {
    padding:1rem 2rem ; margin-bottom:2.5rem ;
    font-size:1.8rem ; line-height:3rem ; text-align:left ; word-break:keep-all ; font-weight:500 ;
}
.talk__txt br { display:none }
.talk__box:last-child .talk__txt { margin-bottom:0 }
.talk__txt::before {
    display:block ; content:"" ; width:100% ; height:100% ;
    position:absolute ; left:0 ; top:0 ; z-index:4 ;
    border:solid 0.2rem #ceafa8 
}
 
.face1 .talk__face::before  { background-position:0 0 } /* 고민 */
.face2 .talk__face::before  { background-position:-10rem 0 } /* 코밑손 */
.face3 .talk__face::before  { background-position:-20rem 0 } /* 아하 */
.face4 .talk__face::before  { background-position:-30rem 0 } /* 화남 */
.face5 .talk__face::before  { background-position:-40rem 0 } /* 윙크 */
.face6 .talk__face::before  { background-position:-50rem 0 } /* 으으~ */
.face7 .talk__face::before  { background-position:0 -13rem } /* 오~대단 */
.face8 .talk__face::before  { background-position:-10rem -13rem } /* 음 */
.face9 .talk__face::before  { background-position:-20rem -13rem } /* 살짝웃음 */
.face10 .talk__face::before { background-position:-30rem -13rem } /* 땀삐질*/
.face11 .talk__face::before { background-position:-40rem -13rem } /* 웃음 */
.face12 .talk__face::before { background-position:-50rem -13rem } /* 상대방 */

.face12 .talk__txt::before { border-color:#8560a8 } 



/* img */
#SS32_img1 { max-width:35rem }
#SS32_img2_1 , #SS32_img2_2 , #SS32_img2_3 { max-width:46.6rem }
#SS32_img3_1 , #SS32_img3_2 { max-width:70rem }
#SS32_img4 , #SS32_img5 { max-width:50rem }
#SS32_img6 { max-width:67rem }





/* PC */
@media screen and (min-width:1024px){ 
    
    
    /* talk */
    .talk__txt br { display:block }


    /* img */
    #SS32_img2_1 , #SS32_img2_2 , #SS32_img2_3 {width:33.3333% }
    #SS32_img5 { width:35.71% }
    #SS32_img6 { width:62.85% }

    /*
#SS32_img1 { max-width:35rem }

#SS32_img3_1 , #SS32_img3_2 { max-width:70rem }
#SS32_img4 { max-width:60rem }

*/
}   
 




/* PRINT */
@media print {   }