*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
a{
    text-decoration: none;
}
html, body{    
    width: 100%;
    height: 100%;
}
.toonBg{
    position: relative;
    background: #F4EBE2;
}
.toonwidth{
    position: relative;
    margin: 0 auto;
    width: 700px;
}
.toonLeft{
    position: relative;
    float: left;
    padding-left: 20px;
}
.toonwidth::after{
    content: '';
    display: block;
    clear: both;
}

/* 제목배너부분 */
.toonBanner{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
/* .toonBanner::after{
    content: '';
    position: absolute;
    background-image: url(../img/banner_bg.png);
    background-repeat: no-repeat;
    width: 230px;
    height: 272px;
    right: 0;
    bottom: 0;
} */
.tbanner_left {
    position: relative;
}
.tbanner_left h6{
    font-size: 16px;
    color: #3D1414;
    padding: 70px 0 10px;
}
.tbanner_left a{
    display: block;
    padding-top: 14px;
}
.tbanner_left span{
    font-size: 24px;
    font-weight: bold;
    color: #4C4742;
    display: block;
    padding-bottom: 4px;
}
.tbanner_left div img{
    display: block;
}
.tbanner_right img{
    display: block;
}

/* 새로운주소 업데이트 */
.address{
    position: relative;
    width: 100%;
    height: 100%;
}
.address_one{
    position: relative;
    background: #FFFFFF;
    border: 2px solid #4D4742;
    border-radius: 10px;
    filter: drop-shadow(0px 3px 0px #4C4742);
    height: 64px;
}
.address_one span,
.address_two span{
    font-size: 32px;
    color: #4C4742;
    position: absolute;
    top: 6px;
    left: 20px;
}
.address_one a,
.address_two a{
    position: absolute;
    display: block;
    right: 2px;
    top: 2px;
}
.address_two{
    margin-top: 10px;
    position: relative;
    background: #FFFFFF;
    border: 2px solid #4D4742;
    border-radius: 10px;
    filter: drop-shadow(0px 3px 0px #4C4742);
    height: 64px;
}

/* 아이폰 안드로이드 다운 */
.appdown{
    position: relative;
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.iosD,
.androidD{
    position: relative;
    background: #FFFFFF;
    border: 2px solid #D1C6BB;
    border-radius: 10px;
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 217px;
    height: 229px;
}

.manaboza{
    background: #B7F0D8;
    border: 2px solid #85CCAE;
    border-radius: 10px;
}

.kmana{
    background: white;
    border: 2px solid #67c6ee;
    border-radius: 10px;
}

.manaboza div{
    padding-top: 20px;
}

.kmana div{
    padding-top: 20px;
}

.iosD p,
.androidD p{
    font-size: 14px;
    padding: 12px 0;
}
.iosD a{
    color: white;
    font-size: 20px;
    font-weight: bold;
    position: absolute;
    bottom: -2px;
    display: flex;
    width: 217px;
    height: 58px;
    background: #686868;
    border-radius: 0px 0px 10px 10px;
    align-items: center;
    justify-content: center;
}
.androidD a{
    color: white;
    font-size: 20px;
    font-weight: bold;
    position: absolute;
    bottom: -2px;
    display: flex;
    width: 217px;
    height: 58px;
    background: #F94932;
    border-radius: 0px 0px 10px 10px;
    align-items: center;
    justify-content: center;
}
.kmana a,
.manaboza a{
    padding-left: 0;
    font-size: 20px;
    color: #297282;
    font-weight: bold;
    position: absolute;
    bottom: 0;
    display: flex;
    width: 213px;
    height: 58px;
    background: #FFFFFF;
    /* border: 2px solid #85CCAE;
    border-radius: 0px 0px 10px 10px; */
    /* background-image: url(../img/마나보자바로가기.png);
    background-repeat: no-repeat; */
    align-items: center;
    justify-content: center;
}

.kmana a::after{
    content: '';
    width: 100%;
    position: absolute;
    height: 2px;
    top: 0;
    left: 0;
    background-color: #67c6ee;
}

.manaboza a::after{
    content: '';
    width: 100%;
    position: absolute;
    height: 2px;
    top: 0;
    left: 0;
    background-color: #85CCAE;
}

.kmana a span,
.manaboza a span{
    display: block;
    position: relative;
}

.kmana a span::after,
.manaboza a span::after{
    content: '';
    position: absolute;
    background-image: url(../img/manabozaIcon.svg);
    background-repeat: no-repeat;
    right: -32px;
    top: 2px;
    width: 24px;
    height: 24px;
}

.kmana a span::before,
.manaboza a span::before{
    content: '';
    position: absolute;
    background-image: url(../img/manabozaIcon.svg);
    background-repeat: no-repeat;
    left: -32px;
    top: 2px;
    width: 24px;
    height: 24px;
}
.cockman a{
    padding-left: 0;
    font-size: 20px;
    color: #885555;
    font-weight: bold;
    position: absolute;
    bottom: 0;
    display: flex;
    width: 213px;
    height: 58px;
    background: #FFFFFF;
    /* background-image: url(../img/쿡만화바로가기.png);
    background-repeat: no-repeat; */
    align-items: center;
    justify-content: center;
}
.cockman a::after{
    content: '';
    width: 100%;
    position: absolute;
    height: 2px;
    top: 0;
    left: 0;
    background-color: #D1C6BB;
}
.cockman a span{
    position: relative;
}
.cockman a span::after{
    content: '';
    position: absolute;
    background-image: url(../img/cookmanaIcon.svg);
    background-repeat: no-repeat;
    right: -32px;
    top: 2px;
    width: 24px;
    height: 24px;
}
.cockman a span::before{
    content: '';
    position: absolute;
    background-image: url(../img/cookmanaIcon.svg);
    background-repeat: no-repeat;
    left: -32px;
    top: 2px;
    width: 24px;
    height: 24px;
}
.cockman div img{
    padding: 38px 0;
}

.text_Q{
    display: block;
    padding: 20px;
    text-align: center;
    color: #2C241E;
}


/* 왼쪽 커무니티 와티비 아이콘들 */
.community{
    position: relative;
    margin-top: 100px;
    float: left;
    padding: 0 20px 0 40px;
}
.toonwidth::after{
    content: '';
    clear: both;
    display: block;
}
.community a{
    margin-bottom: 20px;
    font-weight: bold;
    font-size: 20px;
    flex-direction: column;
    display: flex;
    align-items: center;
    width: 114px;
    background: #7D7D7D;
    border-radius: 10px;
    justify-content: flex-end;
}
.comwa_text,
.comoz_text {
    width: 100%;
    padding: 10px 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color: white;
}
.comoz_text span:first-child{
    color: #FF9F46;
}
.comwa_text span:first-child{
    color: #00D315;
}



/* 모바일 */
@media (max-width:980px){
    .toonwidth{
        width: 100%;
        padding: 10px;
    }
    .community{
        width: 100%;
        padding: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 0;
    }
    .toonLeft{
        padding: 0;
        width: 100%;
    }
    .address_one,
    .address_two{
        width: 100%;
    }
    .address_one span, .address_two span{
        font-size: 24px;
        top: 13px;
    }
    .toonBanner{
        margin-top: 10px;
    }
    .iosD{
        width: 100%;
        margin-right: 6px;
    }
    .androidD{
        width: 100%;
        margin-left: 6px;
    }
    .iosD a, .androidD a{
        width: 100%;
    }
    .manaboza div img{
        width: 100%;
    }
    .tbanner_left h6{
        font-size: 14px;
        padding-top: 14px;
    }
    .tbanner_left span{
        font-size: 20px;
    }
    .tbanner_left div img,
    .tbanner_left a img,
    .tbanner_right img{
        width: 100%;
    }
    .community a img{
        width: 30%;
    }
    .comwa_text, .comoz_text{
        padding: 6px 0;
    }
    .text_Q{
        font-size: 14px;
    }
    .community a{
        margin: 0 4px;
        border-radius: 4px;
        width: 100%;
        font-size: 16px;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        flex-direction: row;
    }
    
}