#MyPageHeader{background-image:url("../img/mypage/yeongkyeong-lee-AkNRiespFjA-unsplash.jpg");background-position:center;background-size:cover;background-repeat:no-repeat;height:250px;position:relative}@media (min-width: 768px){#MyPageHeader{height:320px}}#MyPageHeader::before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;background-color:rgba(0,0,0,0.5);height:100%;mix-blend-mode:multiply;z-index:0}#MyPageHeader .MyPageHeaderIn{display:flex;align-items:center;height:100%;margin-top:50px;padding-left:5%}@media (min-width: 1024px){#MyPageHeader .MyPageHeaderIn{margin-top:60px}}#MyPageHeader .MyPageHeaderIn .MyPageUser{width:100%}#MyPageHeader h2{font-size:24px;position:relative;margin:0 auto 10px}@media (min-width: 768px){#MyPageHeader h2{position:absolute;z-index:10;top:0;bottom:0;left:5%;margin:auto;height:30px}}@media (min-width: 768px){#MyPageHeader .User{display:flex;align-items:center;justify-content:center;height:100%}}#MyPageHeader .User .UserIn{position:relative;display:flex;align-items:center;z-index:10}#MyPageHeader .User .UserIn .Icon img{width:68px;height:auto;border-radius:50%}@media (min-width: 768px){#MyPageHeader .User .UserIn .Icon img{width:72px}}#MyPageHeader .User .UserIn .Name{margin-left:10px}@media (min-width: 768px){#MyPageHeader .User .UserIn .Name{margin-left:20px}}#MyPageHeader .User .UserIn .Name h3{font-size:22px;font-weight:lighter}@media (min-width: 768px){#MyPageHeader .User .UserIn .Name h3{font-size:24px}}#MyPageHeader .User .UserIn .Name h4{font-size:14px;font-weight:lighter}@media (min-width: 768px){#MyPageHeader .User .UserIn .Name h4{font-size:16px}}nav{overflow:scroll;width:94%;margin:auto}nav .TabMenu{width:600px;margin:30px auto 20px;border-bottom:1px solid #707070;padding-bottom:16px}@media (min-width: 768px){nav .TabMenu{max-width:1230px;width:auto;margin:30px auto}}nav .TabMenu li{display:inline-block}nav .TabMenu li a{font-size:15px;font-weight:bold;color:#fff;padding:14px}nav .TabMenu li a:hover{border-bottom:3px solid #ccc}nav .TabMenu li.active a{border-bottom:3px solid #0096de}.MyPageBox{display:none;opacity:0;max-width:1230px;width:95%;margin:auto;padding:0 5px}@media (min-width: 1024px){.MyPageBox{padding:0 0px}}.MyPageBox.is-active{display:block;animation-name:displayAnime;animation-duration:1s;animation-fill-mode:forwards}@keyframes displayAnime{from{opacity:0}to{opacity:1}}#live .liveIn{margin-top:40px}#live .ComingSoonBox{margin-bottom:60px}#live .ComingSoonBox a{transition:.5s}#live .ComingSoonBox a:hover{opacity:0.8}#live .ComingSoonBox a .iCatch{margin-bottom:10px}#live .ComingSoonBox a .iCatch img{width:100%;height:auto;border-radius:5px}#live .ComingSoonBox a h3{font-size:1.125em}#live .ComingSoonBox a h4{font-size:0.8em;font-weight:normal;color:#999;line-height:1.6em;text-align:justify;margin:10px 0;word-break:break-all;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}@media (min-width: 1024px){#live .ComingSoonBox a h4{font-size:0.9em}}#live .ComingSoonBox a .View{display:flex}#live .ComingSoonBox a .View img{width:20px;height:auto;margin:-6px 5px 0 0}#live .ComingSoonBox a .View h5{font-size:0.9em}#live .ComingSoonBox a p{font-size:0.9em;font-weight:bold}#live .ComingSoonBox a p span{margin-right:10px}#live .o-6column .col-xl-6{padding:0 5px}#live .o-6column{margin:0 -5px}@media only screen and (min-width: 1024px){#live .o-6column .col-xl-6{padding:0 10px}#live .o-6column{margin:0 -10px}}#follow .FollowIn{margin-top:40px}#follow .FollowBox{margin-bottom:60px}#follow .FollowBox .iCatch img{width:100%;height:auto;border-radius:5px}#follow .FollowBox h3{font-size:1.125em;line-height:1.4em;margin-top:10px}#follow .FollowBox h4{font-size:0.8em;font-weight:normal;color:#999;line-height:1.4em;text-align:justify;margin:6px 0;word-break:break-all;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}#follow .FollowBox p{font-size:0.65em;color:#999}#follow .FollowBox .FollowMessage{display:flex}#follow .FollowBox .FollowMessage form{width:50%}#follow .FollowBox .FollowMessage form button{display:inline-block;width:100%;height:40px;line-height:36px;text-align:center;font-size:0.8em;font-weight:bold;border-radius:5px;transition:.5s;border:1px solid #F98924;color:#F98924;background-color:rgba(255,255,255,0)}@media (min-width: 1024px){#follow .FollowBox .FollowMessage form button{font-size:0.9em}}#follow .FollowBox .FollowMessage form button img{width:23px;height:auto;margin-top:-2px}#follow .FollowBox .FollowMessage form button:hover{box-shadow:0px 0px 6px #fff}#follow .FollowBox .FollowMessage a{display:inline-block;width:50%;height:40px;line-height:36px;text-align:center;font-size:0.8em;font-weight:bold;border-radius:5px;font-feature-settings:"palt";letter-spacing:0.08em;transition:.5s}@media (min-width: 1024px){#follow .FollowBox .FollowMessage a{font-size:0.9em}}#follow .FollowBox .FollowMessage a img{width:23px;height:auto;margin-top:-2px}#follow .FollowBox .FollowMessage a.Message{border:1px solid #999999;color:#999999;margin-left:5px}@media (min-width: 1024px){#follow .FollowBox .FollowMessage a.Message{margin-left:10px}}#follow .FollowBox .FollowMessage a:hover{box-shadow:0px 0px 6px #fff}#follow .o-4column .col-xl-4{padding:0 5px}#follow .o-4column{margin:0 -5px}@media only screen and (min-width: 1024px){#follow .o-4column .col-xl-4{padding:0 10px}#follow .o-4column{margin:0 -10px}}.History{display:flex}.History .Count{display:flex;margin-right:30px}.History .Count:last-child{margin-right:0px}@media (min-width: 768px){.History .Count{margin-right:40px}}.History .Count h3{font-size:40px;font-weight:500;color:#f98924}@media (min-width: 768px){.History .Count h3{font-size:54px}}.History .Count h4{font-size:10px;font-weight:normal;margin:31px 0 0 3px}@media (min-width: 768px){.History .Count h4{font-size:15px;margin:40px 0 0 3px}}#history{margin-bottom:60px}#history .watch{border-top:1px dotted #666;margin-top:16px}#history .watch a{padding-top:16px}@media (min-width: 768px){#history .watch a{display:flex}}#history .watch .iCatch{width:100%;margin-top:16px}@media (min-width: 768px){#history .watch .iCatch{width:32%;padding-right:2%;margin-top:0px}}#history .watch .iCatch img{width:100%;height:auto;border-radius:5px}#history .watch .Text{width:100%}@media (min-width: 768px){#history .watch .Text{width:68%}}#history .watch .Text h3{font-size:1.0em;line-height:1.25em;margin-top:10px}@media (min-width: 768px){#history .watch .Text h3{margin-top:0px}}@media (min-width: 1024px){#history .watch .Text h3{font-size:1.25em}}#history .watch .Text h4{font-size:0.8em;font-weight:normal;color:#999;line-height:1.6em;text-align:justify;margin:10px 0;word-break:break-all;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}@media (min-width: 1024px){#history .watch .Text h4{font-size:0.9em}}#history .watch .Text p{font-size:0.9em;font-weight:bold;margin:0}#history .watch .Text p span{margin-right:10px}#comment ul li{position:relative;width:100%;border-bottom:1px dotted #666;margin-top:50px}@media (min-width: 1024px){#comment ul li{display:flex}}#comment ul li .Heart{display:flex}#comment ul li .Heart p{font-size:1.5em;line-height:1.0em;color:#ff7683;margin-top:-15px}#comment ul li .Heart h5{font-size:1.1em;line-height:1.0em;margin-left:-10px}@media (min-width: 1024px){#comment ul li .Heart h5{padding-bottom:20px}}#comment ul li .Text{padding-bottom:5px}@media (min-width: 1024px){#comment ul li .Text{text-align:right;position:absolute;right:0;bottom:0}}#comment ul li .Text h6{font-size:0.9em;line-height:1.6em}#comment ul li .Text p{font-size:0.8em}#profile .ProfileCard{position:relative;padding:24px 20px;width:100%;margin-top:30px;background-color:#242424}@media (min-width: 1024px){#profile .ProfileCard{margin-top:0px;display:flex;padding:0px;background-color:rgba(36,36,36,0)}}@media (min-width: 1024px){#profile .ProfileCard .UserIcon{position:absolute;top:0;left:0;z-index:10}}#profile .ProfileCard .UserIcon .UserIconIn{display:flex}@media (min-width: 1024px){#profile .ProfileCard .UserIcon .UserIconIn{text-align:center;display:inherit}}#profile .ProfileCard .UserIcon .UserIconIn img{border-radius:50%;width:140px;height:auto}@media (min-width: 1024px){#profile .ProfileCard .UserIcon .UserIconIn img{width:200px}}#profile .ProfileCard .UserIcon .UserIconIn .User{margin:20px 0 0 20px}@media (min-width: 1024px){#profile .ProfileCard .UserIcon .UserIconIn .User{margin:0}}@media (min-width: 1024px){#profile .ProfileCard .UserIcon .UserIconIn .User .ProfileBtn{margin-top:-20px}}#profile .ProfileCard .UserIcon .UserIconIn .User p{font-size:0.8em;line-height:1.6em;margin:10px 0 0 0}@media (min-width: 1024px){#profile .ProfileCard .ProfileName{background-color:#242424;position:relative;width:95%;margin-left:5%;margin-top:50px}}@media (min-width: 1024px){#profile .ProfileCard .ProfileName .Name{margin-left:calc( 250px - 5% );height:100px;display:flex;align-items:center}}#profile .ProfileCard .ProfileName .Name .NameIn{text-align:center;margin:20px auto 10px}@media (min-width: 1024px){#profile .ProfileCard .ProfileName .Name .NameIn{text-align:left;margin:0}}#profile .ProfileCard .ProfileName .Name .NameIn h1{font-size:1.5em;margin:0 0 10px 0}#profile .ProfileCard .ProfileName .Name .NameIn p{font-size:1em;margin:0}#profile .ProfileCard .ProfileName .ProfileBtn{text-align:center;margin:auto}@media (min-width: 1024px){#profile .ProfileCard .ProfileName .ProfileBtn{position:absolute;right:15px;top:0;bottom:0;height:30px}}@media (min-width: 1024px){#profile .Card{margin-left:250px}}#profile .Card table{margin:60px 0;width:100%}#profile .Card table tr th{font-size:0.9em;line-height:1.8em;text-align:left;width:120px;padding:10px 0;border-bottom:1px dashed #999;font-feature-settings:"palt";letter-spacing:0.08em}@media (min-width: 768px){#profile .Card table tr th{width:200px;font-size:1.0em;padding:20px 0}}#profile .Card table tr td{font-size:0.9em;line-height:1.8em;padding:20px 0 20px 20px;border-bottom:1px dashed #999}@media (min-width: 768px){#profile .Card table tr td{font-size:1.0em;padding:20px 0}}#profile .Card table tr .ProfileBtn{float:right}#profile .Card .Btn{position:relative;margin-bottom:150px}#profile .Card .Btn .BtnIn{display:flex;position:absolute;bottom:0;right:0}#profile .Card .Btn .BtnIn .ProfileBtn{margin-left:10px}#profile .ProfileBtn a{font-size:0.9em;font-weight:bold;color:#fff;display:inline-block;text-align:center;border-radius:5px;padding:8px 20px;background-color:#999;transition:.5s}#profile .ProfileBtn a:hover{background-color:#4d4d4d}
