@charset "utf-8";
@charset "utf-8";

#wrapper.my{height: auto;}
.my .header{position: fixed; top: 0; left: 0; z-index: 50; background: #fff; border-bottom: 1px solid #dedede;}
.my .header .village{display: none;}

.my .main{padding: 110px 0 0 0;}

.mypage {position: relative; max-width: 1200px; width: 100%; min-width: 900px; margin: 50px auto}
.mypage .sub_layout{display: flex; flex-direction: column; width: 100%; height: auto; align-items: center; justify-content: center;}
.mypage .sub_layout .sub_layout_tit{font-size: 36px; font-weight: 700; line-height: 1.3em;}

.login_inner{position: relative; width: 100%;}
.login_inner ul{position: relative; width: 540px; margin: 50px auto;}
.login_inner ul li{width: 100%; height: 70px; border-radius: 5px; overflow: hidden;}
.login_inner ul li:not(:first-child){margin-top: 20px;}
.login_inner ul li a{position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;}
.login_inner ul li a::before{content: ''; position: absolute; top: 50%; left: 40px; transform: translateY(-50%); width: 32px; height: 32px;}
.login_inner ul li a.kakao{background-color: #fee500;}
.login_inner ul li a.kakao::before{background: url(/treemap/resources/images/dollbom/common/ic_kakao.png) center no-repeat;}
.login_inner ul li a.naver{background-color: #1ec800;}
.login_inner ul li a.naver::before{background: url(/treemap/resources/images/dollbom/common/ic_naver.png) center no-repeat;}
.login_inner ul li a.phone{background-color: #fff; border: 1px solid #dedede;}
.login_inner ul li a.phone::before{background: url(/treemap/resources/images/dollbom/common/ic_phone.png) center no-repeat;}
.login_inner ul li a.apple{background-color: #000;}
.login_inner ul li a.apple::before{background: url(/treemap/resources/images/dollbom/common/ic_apple.png) center no-repeat;}
.login_inner ul li a span{font-size: 18px; font-weight: 600;}
.login_inner ul li a.naver span,
.login_inner ul li a.apple span{color: #fff;}

@media (max-width:1000px){
.login_wrap{position: relative; width: calc(100% - 0px); margin:0; padding:0; border:0; box-shadow:inherit;}
.login-using-rink {display:block; width:calc(100% - 20px); margin:0 auto; margin-top:15px;}

.title,
.login-type{display:none;}
.login-type-mobile{display:block;}
.login-type-mobile,
.login-type-mobile ul{position:relative; width:100%; display:inline-block;}
.login-type-mobile ul li{width:100%; display:inline-block; width:100%; margin-bottom:10px;}
.login-type-mobile ul li a{display:inline-block; width:100%;}
.login-type-mobile ul li a img{width:100%;}
}
