/* Theme Name: theme-blog-header
Author: RyoIwamoto
Desctiption: DemoSite blog theme header
Version: 1 */

@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Sacramento&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Caveat&display=swap");

.aside-1 {
  max-width: 400px;
  width: calc(100%* 1 / 3);
  flex-direction: column;
  background-color: transparent;
}

@media screen and (max-width: 768px) {
  .aside-1 {
    margin: 0;
    padding: 10px 0;
    width: 100%;
   max-width: initial;
  }
}

.profile-box {
  box-sizing: border-box;
  background-color: white;
  text-align: center;
  margin: 30px 0;
  max-width: 360px;
  width: calc(100% - 10px);
  /* height: 100px; */
  padding-top: 30px;
  padding-bottom: 30px;
}

@media screen and (max-width: 768px) {
   .profile-box {
       max-width: initial;
       margin: 30px auto;
   }
}

.dojou-img {
  border-radius: 50%;
  box-shadow: 0px 0px 2px gray;
}

.profile_name {
  margin: 10px 0 0 0;
}

.profile-text {
  text-align: center;
  padding: 10px;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: rgba(192, 192, 192, 0.15);
  width: 80%;
  margin: 0px;
  padding: 10px;
  border-radius: 2px;
  font-size: 0.85rem;
  /* font-size: 15px; */
}

.usability-box {
  box-sizing: border-box;
  background-color: white;
  text-align: center;
  margin: 30px 0;
  max-width: 360px;
  width: calc(100% - 10px);
  /* height: 100px; */
  padding-top: 30px;
  padding-bottom: 30px;
}

@media screen and (max-width: 768px) {
   .usability-box {
      max-width: initial;
      margin: 30px auto;
   }
}

.profile-text {
  margin: 0;
}

.profilelink-box {
}
.profile-link {
  color: blue;
  text-decoration-line: underline;
}

.link_download {
  color: blue;
  text-decoration-line: underline;
}

.catlist_block {
  margin: 20px auto;
}

@media screen and (max-width: 768px) {
   .catlist_block select {
      width: 300px;
   }
}

.catlist {
  margin: auto auto;
}

.catlist_p {
  font-size: 17px;
  font-weight: bold;
  text-align: left;
  padding-left: 40px;
}

@media screen and (max-width: 768px) {
   .catlist_p {
       max-width: 300px;
       margin: 0 auto;
       padding-left: 0;
   }
}

h3 {
  text-align: left;
  padding-left: 40px;
}

.link_wrap {
  text-align: left;
  padding-left: 40px;
  margin-top: 30px;
}
#twitter-widget-0 {
    width: 100% !important;
    max-width: calc(100% - 10px);
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
   .twitter-tweet {
      margin: 10px auto !important;
   }
}