/* 1.0 Initial Setup*/

* {
  box-sizing: border-box;
}

body, html {
  height: 100%;
  width: 100%;
  margin: 0;
  font-family: "Zen Maru Gothic", Arial, Helvetica, serif;
  text-shadow: 5px 5px 10px rgb(190, 164, 164);
  

  
}


.njp {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.njps {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}


.hm {
  font-family: "Hina Mincho", serif;
  font-weight: 400;
  font-style: normal;
}


.zkg {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.zmg {
  font-family: "Zen Maru Gothic", serif;
  font-weight: 400;
  font-style: normal;
}

.ys {
  font-family: "Yuji Syuku", serif;
  font-weight: 400;
  font-style: normal;
}

/* Responsive columns */
@media screen and (max-width: 600px) {
  .column-66,
  .column-33 {
    width: 100%;
    text-align: center;
  }
  img {
    margin: auto;
  }
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/**************************************************/

/* 1.0 zig zag*/

.container {
  padding: 64px;
}

.row:after {
  content: "";
  display: table;
  clear: both
}

.column-66 {
  float: left;
  width: 66.66666%;
  padding: 20px;
}

.column-33 {
  float: left;
  width: 33.33333%;
  padding: 20px;

}

.large-font {
  font-size: 48px;
}

.xlarge-font {
  font-size: 64px
}

.button {
  border: none;
  color: white;
  padding: 14px 28px;
  font-size: 16px;
  cursor: pointer;
  background-color:  rgb(224, 172, 216);
  box-shadow: 5px 5px 10px rgb(190, 164, 164);  
}

img {
  display: block;
  height: auto;
  max-width: 100%;
  border-radius: 50px;
  box-shadow: 5px 5px 10px rgb(190, 164, 164);

}

.btxt {

  color:white;
  text-decoration: none;

}

.icon {
  width: 25px;
  height: 25px;
  
}