#sub{width:100%;}

#sub .comfort{width:100%;}
#sub .comfort .view{width:100%;}
#sub .comfort .view .titImg{width:100%; position:Relative;}
#sub .comfort .view .titImg .bg{width:100%;}
#sub .comfort .view .titImg .bg img{width:100%;}
#sub .comfort .view .titImg .title{width:100%; position:absolute; padding:0px 3%; box-sizing:border-box; text-align:Center; top:50%; transform:translateY(-50%); color:#fff; font-size:24px; font-weight:500;}

#sub .comfort .tabmenu{width:100%; overflow-x:auto; display:flex;}
#sub .comfort .tabmenu::-webkit-scrollbar{width:0px; height:0;}
#sub .comfort .tabmenu::-webkit-scrollbar-track{background-color: #e5e5e5;}
#sub .comfort .tabmenu::-webkit-scrollbar-thumb{background: #222;}
#sub .comfort .tabmenu::-webkit-scrollbar-button{display: none;}
#sub .comfort .tabmenu li{width:100%; cursor:pointer;}
#sub .comfort .tabmenu li a{width:100%; padding:12px 0px; display:block; text-align:Center; font-size:14px; color:#d9d9d9; background:#222;}
#sub .comfort .tabmenu li.current a{color:#222; background:#fff;}

#sub .comfort .audioA{width:100%; padding:40px 3%; box-sizing:border-box;}
#sub .comfort .audioA .subjA{width:100%;}
#sub .comfort .audioA .subjA .subj{width:100%; font-size:20px; color:#222; font-weight:500}
#sub .comfort .audioA .subjA .subs{width:100%; font-size:14px; color:#777; margin-top:4px;}
#sub .comfort .audioA .audioScreen{width:100%; margin-top:20px; background:#FEF7F5; padding:20px; box-sizing:border-box;}
#sub .comfort .audioA .audioScreen img{width:168px; margin:0 auto; display:block;}
#sub .comfort .audioA .playbar{width:100%; margin-top:12px; text-align:center;}

#sub .letter{width:100%; padding:20px 3%; box-sizing:border-box;}
#sub .letter .tit{width:100%; font-size:18px; color:#444; font-weight:600; margin-bottom:4px;}
#sub .letter .discription{width:100%; font-size:14px; color:#444; word-break:keep-all; line-height:19px;}
#sub .letter .who{width:100%; font-size:14px; color:#777; margin-top:12px;}

#sub .letter .list{width:100%;}
#sub .letter .list .letterList{width:100%; border:1px solid #FCD7D2; box-sizing:border-box; margin-top:20px; background:#fff;}
#sub .letter .list .letterList li{width:100%; text-align:Center; font-size:14px; color:#222; padding:12px 8px; box-sizing:border-box; border-bottom:1px dashed #FCD7D2;}
#sub .letter .list .letterList li:last-child{border-bottom:0px dashed #FCD7D2;}
#sub .letter .list .letterList li span{display:inline-block; margin-right:8px; color:#FCD7D2}

#sub .letter .view{width:100%;}
#sub .letter .view .discription{width:100%; font-size:14px; color:#444; line-height:19px; word-break:keep-all;}
#sub .letter .view .letterList{width:100%; margin-top:20px; display:flex; gap:20px; flex-flow:Wrap;}
#sub .letter .view .letterList li{width:100%;}
#sub .letter .view .letterList li .thum{width:100%;}
#sub .letter .view .letterList li .thum img{width:100%;}
#sub .letter .view .letterList li .step{width:100%; font-size:13px; color:#777; margin-top:8px;}
#sub .letter .view .letterList li .subj{width:100%; font-size:15px; color:#222; margin-top:4px; font-weight:500;}

#sub .letter .month{width:100%; display:flex; flex-flow:column; height:100%;}
#sub .letter .month .letterbox{width:100%; height:100%; background:#fff; border:1px solid #FCD7D2; padding:12px; box-sizing:border-box; font-size:14px; line-height:19px; color:#444; word-break:keep-all; height:100%; margin-top:20px; overflow-y:scroll;}
#sub .letter .month .letterbox::-webkit-scrollbar{width:0px;}
#sub .letter .month .letterbox::-webkit-scrollbar-track{background-color: #e5e5e5;}
#sub .letter .month .letterbox::-webkit-scrollbar-thumb{background: #222;}
#sub .letter .month .letterbox::-webkit-scrollbar-button{display: none;}
#sub .letter .month .sizeControl{width:100%; display:flex; justify-content:space-between; margin-top:12px;}

#sub .mypage{width:100%; display:Flex; flex-flow:column; height:calc(100vh - 56px)}
#sub .mypage .profileA{width:100%; padding:20px 3%; box-sizing:border-box; text-align:center; height:auto;}
#sub .mypage .profileA .flower{width:120px; margin:0 auto;}
#sub .mypage .profileA .flower img{width:100%}
#sub .mypage .profileA .name{width:100%; text-align:Center; font-size:24px; color:#18365E; margin-top:20px;}
#sub .mypage .profileA .writeDaily{display:inline-block; padding:8px 16px; background:#18365E; color:#fff; font-size:13px; margin-top:8px; }
#sub .mypage .profileA .writeDaily a{color:#fff;}
#sub .mypage .playList{width:100%; padding:20px 3%; box-sizing:border-box; border-bottom:16px solid #fff;}
#sub .mypage .playList .title{width:100%; font-size:20px; color:#222; font-weight:600;}
#sub .mypage .playList .list{width:100%; margin-top:12px; display:flex; flex-flow:wrap; gap:12px;}
#sub .mypage .playList .list li{width:100%; display:flex; justify-content:space-between;}
#sub .mypage .playList .list li .info{width:100%; place-self:center; display:flex;}
#sub .mypage .playList .list li .info .circle{width:44px; height:44px; border-radius:50%; background:#FFE5E2; color:#222; font-size:13px; text-align:Center; display:flex; align-items:center; justify-content:center;word-break:Keep-all;}
#sub .mypage .playList .list li .info .subjA{place-self:Center; width:auto; padding-left:8px; box-sizing:border-box;}
#sub .mypage .playList .list li .info .subjA .discription{font-size:13px;}
#sub .mypage .playList .list li .info .subjA .subject{font-size:15px; margin-top:5px;}
#sub .mypage .playList .list li .playbtn{width:auto; padding:8px 12px; background:#DFEFFA; box-sizing:border-box; display:flex; gap:4px; place-self:center;}
#sub .mypage .playList .list li .playbtn .ico{width:16px; place-self:Center;}
#sub .mypage .playList .list li .playbtn .tx{font-size:13px; color:#18365E; place-self:Center; word-break:Keep-all;}

#sub .mypage .calA{width:100%; padding:20px 3%; box-sizing:border-box;}
#sub .mypage .calA .myCount{width:100%; display:flex; justify-content:space-between; gap:4px;}
#sub .mypage .calA .myCount li{width:100%; padding:12px; border:1px solid #FCD7D2;}
#sub .mypage .calA .myCount li .subj{width:100%; text-align:center; font-size:14px; color:#777;}
#sub .mypage .calA .myCount li .count{width:100%; text-align:center; font-size:18px; color:#FFA99D; font-weight:bold; margin-top:4px;}
#sub .mypage .calA .cal{width:100%; padding:12px; background:#fff; border:1px solid #FCD7D2; text-align:Center; box-sizing:border-box; margin-top:12px;}

#sub .diary{width:100%; padding:20px 3%; box-sizing:border-box; height:100%; display:flex; flex-flow:column;}
#sub .diary .btn{width:100%; padding:12px; background:#fcd7d2; color:#fff; margin-top:10px; cursor:pointer;text-align:Center; box-sizing:border-box; font-size:14px}
#sub .diary .title{width:100%; font-size:20px; color:#222; font-weight:600; margin-bottom:12px;}
#sub .diary .btnA{width:100%; display:flex; gap:4px;}
#sub .diary .cont{width:100%; box-sizing:border-box; height:100%; border:1px solid #FCD7D2; background:#fff; padding:12px; }
#sub .diary .cont .table tr th{text-align:left; font-weight:normal; color:#777; padding:4px 0px; font-size:14px; vertical-align:top;}


#sub .faq{width:100%; padding:20px 3%; box-sizing:border-box; min-height:calc(100vh - 56px); display:flex; flex-flow:column;}
#sub .faq .faqList{width:100%; border:1px solid #FCD7D2; box-sizing:border-box; background:#fff; height:100%; overflow-y:auto; display:flex; flex-flow:column;}
#sub .faq .faqList li{width:100%; padding:12px; border-bottom:1px solid #FCD7D2; box-sizing:border-box;}
#sub .faq .faqList li:last-child{border-bottom:0;}
#sub .faq .faqList li .accordion-item .accordion-header{width:100%; display:flex; gap:8px;}
#sub .faq .faqList li .accordion-item .accordion-header .mark{width:28px; place-self:Center; line-height:28px; font-size:14px; font-weight:bold; color:#fff; background:#FCD7D2; text-align:center; border-radius:50%; font-family:'poppins'}
#sub .faq .faqList li .accordion-item .accordion-header .question{place-self:Center; font-size:14px;}
#sub .faq .faqList li .accordion-item .accordion-content{width:100%; margin-top:12px; padding-top:12px; border-top:1px dashed #FCD7D2; font-size:14px; color:#777; display:none; }




.fc .fc-button{font-size:0.75rem !important; word-break:keep-all;}
.fc .fc-toolbar-title{font-size:1rem !important;}
.fc .fc-button .fc-icon{font-size:0.75rem !important;}
.fc table{font-size:0.75rem !important;}