/*///////////////// h2 ////////////////*/

@media all and (min-width: 768px) {
#profile h2 span{
    font-size: 250%;
  }
#profile h2 small{
    margin-top:20px;
  }
#profile.box {
    padding:60px 0;
  }
#profile .inbox{
    width: 940px;
    margin:50px auto 50px;
  }
}

@media all and (max-width: 767px) {
#profile h2 span{
    font-size: 180%;
  }
#profile h2 small{
      margin-top:.5em;
    }
#profile.box {
  padding:2em 0;
  }
#profile .inbox{
  width: 90%;
  margin:0 auto;
}
}


/*///////////////// member ////////////////*/
/*/photo/*/
#profile .photo span {
position: relative;
height: 0;
background-repeat: no-repeat;
padding-top:150%;
background-size: cover;
}

/*/btn/*/
#profile a,#profile a:hover{
  text-decoration: none;
}
#profile .btn{
  display: block;
  color:#5fd1fc;
  border:solid 2px #5fd1fc;
  border-radius:50px;
  padding:10px;
  margin:0 auto;
  text-decoration: none;
  text-align: center;
}

#profile a:hover .btn{
    border:solid 2px #fff000;
    color:#fff000 !important;
}

@media all and (min-width: 768px) {
#profile .prof_box{
  width:800px;
  margin:0 auto;
}
#profile ul{
width:800px;
height:800px;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
flex-wrap: wrap;
justify-content:space-between;
flex-direction: column;
border-radius: .5em;
margin:0 auto 50px;
}
#profile .item1 {
  width:533px;
  height:800px;
  background-size: cover;
}
#profile .item2,
#profile .item3
 {
  width:267px;
  height:400px;
  background-size: cover;
}
#profile .item1 span{
  border-radius: .5em 0 0 .5em;
}
#profile .item2 span{
  border-radius:0 .5em 0 0;
}
#profile .item3 span{
  border-radius: 0 0 .5em 0;
}
#profile .txt{
  margin-top:50px;
}
#profile .btn{
  width: 300px;
  padding:20px 0;
  font-size: 130%;
}
}

@media all and (max-width: 767px) {
  #profile .photo span{
  margin:1em auto;
  border-radius: .5em;
  }
  #profile .txt{
    margin-top:1em;
  }
  #profile .btn{
  width: 60%;
  font-size: 100%;
  }
}