@charset "utf-8";

/* ==================================================
Common CSS
================================================== */

@media(max-width:959px){

/* common */
.pc {
display:none;
}

img {
width:100%;
}

.title {
font-size:7vw;
font-weight:bold;
text-align:center;
padding-bottom:2vw;
}

.copy {
text-align:center;
font-size:4vw;
padding-bottom:7vw;
}

.copy .line {
border-top:#464646 1px solid;
padding-top:2vw;
}

.container {
width:92%;
margin:auto;
background:#fff;
box-shadow:0 0 10px #ccc;
border-radius:6px;
padding:7vw 5vw 7vw;
}

i {
padding-right:1vw;
}


/* header*/
header {
width:40%;
margin:auto;
padding:5vw 0;
}


/* login */
.forget {
font-size:3vw;
text-align:center;
padding-top:5vw;
}



/* form */
form {
text-align:center;
padding-bottom:5vw;
}

.formstyle {
width:100%;
font-size:4vw;
background:#f5f5f5;
margin-bottom:3vw;
border-radius:10px;
padding:4vw 4vw;
appearance:none;
outline:0;
}

.submitstyle {
width:60%;
margin:auto;
padding:4vw 3vw;
font-size:4vw;
font-weight:bold;
background:#0096d2;
color:#fff;
border-radius:10px;
text-align:center;
appearance:none;
border:none;
outline:0;
}

input[type="text"] {
border:1px solid #e1e1e1;
-webkit-appearance:none; 
}

input[type="text"]:focus {
border:1px solid #0096d2;
background:#f5f8f8;
appearance: none; 
}

input[type="password"] {
border:1px solid #e1e1e1;
-webkit-appearance:none; 
}

input[type="password"]:focus {
border:1px solid #0096d2;
background:#f5f8f8;
appearance: none; 
}

button:hover {
opacity:0.7;
}


/* mypage */
.mypage_copy {
padding-bottom:0;
}

.mail {
color:#969696;
font-size:4vw;
text-align:center;
}

.number {
color:#969696;
font-size:4vw;
text-align:center;
padding-bottom:7vw;
}

.title_area {
display:flex;
padding-bottom:1vw;
}

.members_title {
width:50%;
color:#0096d2;
font-weight:bold;
font-size:5vw;
}

.members_time {
width:50%;
text-align:right;
font-size:3.5vw;
color:#969696;
padding-top:1.5vw;
}

.members {
border:#0096d2 2px solid;
border-radius:10px;
padding:4vw 5vw;
font-size:4vw;
margin-bottom:10vw;
}

.members p {
line-height:7vw;
}

.members_end {
margin-bottom:0;
}

.information_title {
width:50%;
color:#c84632;
font-weight:bold;
font-size:5vw;
}

.information_time {
width:50%;
text-align:right;
font-size:3.5vw;
color:#969696;
padding-top:1.5vw;
}

.information {
border:#c84632 2px solid;
border-radius:10px;
padding:4vw 5vw;
font-size:4vw;
margin-bottom:10vw;
}

.information p {
line-height:7vw;
}

.data {
text-align:center;
}

.data .foot_logo {
width:50%;
margin:auto;
padding-bottom:4vw;
}

.data .contact {
font-size:4vw;
padding-bottom:1.5vw;
}

.data .tel {
font-size:4vw;
width:80%;
margin:0 auto 2vw;
color:#fff;
}

.data .tel a {
display:block;
padding:10px;
color:#fff;
background:#c84632;
border-radius:6px;
}

.data .time {
font-size:3vw;
padding-bottom:2vw;
}

.data .contact_mail {
font-size:4vw;
width:80%;
margin:auto;
color:#fff;
}

.data .contact_mail a {
display:block;
padding:3vw;
color:#fff;
background:#0096d2;
border-radius:6px;
}

.data .contact_mail a:hover {
opacity:0.7;
}

.change {
font-size:4vw;
width:80%;
margin:auto;
color:#fff;
padding-top:3vw;
text-align:center;
}

.change a {
display:block;
padding:3vw;
color:#fff;
background:#9ebc52;
border-radius:6px;
}

.change a:hover {
opacity:0.7;
}



/*confirmation*/
.confirmation .result {
width:100%;
margin:0 auto 15px;
padding:15px 20px;
background:#f5f5f5;
border:1px solid #e1e1e1;
border-radius:10px;
}

.confirmation .result_title {
width:100%;
text-align:left;
padding-right:20px;
color:#969696;
}

.confirmation .result_detail {
width:100%;
text-align:left;
}


/*logout*/
.logout {
text-align:center;
}

.logoutstyle {
right:10px;
top:10px;
margin:10px auto 0;
padding:2vw 3vw;
font-size:3vw;
font-weight:bold;
background:#fff;
color:#ccc;
border:#ccc 1px solid;
border-radius:10px;
text-align:center;
appearance:none;
outline:0;
cursor:pointer;
}


/*finish*/
.finish_message {
text-align:center;
font-size:4vw;
padding:4vw 0 15vw;
}

.finish_back{
text-align:center;
}

.backstyle {
margin:auto;
padding:3vw 4vw;
font-size:3vw;
background:#fff;
color:#ccc;
border:#ccc 1px solid;
border-radius:10px;
text-align:center;
appearance:none;
outline:0;
cursor:pointer;
}


/* footer */
footer {
padding:3vw 3vw;
text-align:center;
font-size:2.5vw;
color:#969696;
}



}