@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP");
body {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 16px;
  color:#666666;
  /* background:url(/img/container_bg.jpg); */
}

img {
  width: 100%;
}

a:link, a:visited {
  color:#666666;
  text-decoration: none;
}

a:hover, a:active {
  color:#666666;
  text-decoration: underline;
}

h1 {
  margin: 20px 0;
  font-size: 14px;
  text-align: center;
}

h2 {
  line-height: 36px;
  margin-bottom: 8px;
}

@media screen and (min-width: 768px) {
  h2 {
    line-height: 48px;
  }
}

.button a:link, .button a:visited {
  font-size: 80%;
  font-weight: 700;
  width: 80%;
  max-width: 250px;
  margin: 0 auto 5%;
  padding: 12px 0;
  display: block;
  border: solid 1px #666;
  letter-spacing: 0.2em;
  text-align: center;
}

@media screen and (min-width: 768px) {
  .button a:link, .button a:visited {
    margin: 16px auto;
  }
}

.button a:hover, .button a:active {
  display: block;
  background: #000;
  color: #fff;
  opacity: 1.0;
  text-decoration: none;
}

div.button img {
  width: 30px;
  height: 30px;
}

.button_list .button a:link, .button_list .button a:visited {
  margin-bottom: 0;
}

.button_list .button a:hover, .button_list .button a:active {
  margin-bottom: 0;
}

.button_list ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: initial;
  width: 100%;
  margin: 32px 0 0;
  padding-left: 0;
}

.button li {
  width: 33%;
}

.button.edit {
  -webkit-box-flex: 0;
      -ms-flex: 0 1 100%;
          flex: 0 1 100%;
}

.button.disp, .button.delete {
  -webkit-box-flex: 0;
      -ms-flex: 0 1 30%;
          flex: 0 1 30%;
}

.system_kanri_container {
  margin: 3% auto;
  padding: 5% 2%;
}

@media screen and (min-width: 768px) {
  .system_kanri_container {
    width: 980px;
    margin: 0px auto;
    padding: 30px;
  }
}

.system_kanri_guide {
  font-size: 14px;
}

.information_content {
  border: solid 1px #999;
  width: 90%;
  margin: 3% auto;
  padding: 5%;
}

@media screen and (min-width: 768px) {
  .information_content {
    width: 480px;
    margin: 30px auto;
    padding: 10px 30px 30px 30px;
  }
}

input[type="text"] {
  width: 90%;
}

@media screen and (min-width: 768px) {
  input[type="text"] {
    width: 240px;
  }
}

.keisai-keisaichu {
  background: #000;
  color: #fff;
  padding: 5px 7px;
  font-size: 12px;
}

.keisai-hikeisai {
  border: solid 1px #999;
  padding: 5px 7px;
  font-size: 12px;
}

.dokuji-contents {
  background: #068fcf;
  color: #fff;
  padding: 5px 7px;
  font-size: 12px;
}

li {
  list-style: none;
  margin: 0;
  padding: 0;
}

li.hikeisai {
  color: #ddd;
}

.hikeisai {
  color: #999;
}

input[type="text"].titlearea {
  width: 96%;
  padding: 3px;
}

@media screen and (min-width: 768px) {
  input[type="text"].titlearea {
    width: 96%;
    padding: 3px;
  }
}

.textarea {
  width: 96%;
  height: 360px;
  padding: 3px;
}

@media screen and (min-width: 768px) {
  .textarea {
    width: 96%;
    height: 300px;
    padding: 3px;
  }
}

.s {
  font-size: 70%;
}

.warning {
  color: #cf091a;
}

/*-----------------------ここから管理画面のCSS-------------------------*/
div.system_kanri_container {
  text-align: left;
  width: 96%;
  margin: 3% auto 10%;
  overflow-wrap: break-word;
  /* テキストの折り返しcss 参考url https://creive.me/archives/17653/ */
  word-wrap: break-word;
  /* テキストの折り返しcss*/
  background:url(/img/container_bg.jpg);
}

.category_icon {
  text-align: center;
  margin: 0 auto 50px;
}

.category_icon img {
  width: 30px;
  height: 30px;
}

.profile_photo {
  width: 250px;
  margin: 0 auto 30px;
  text-align: center;
}

.profile_photo img {
  width: 100%;
}

.guide_image {
  width: 100%;
  margin: 50px auto;
}

/* 768：iPad縦 / iPhone 7/6 Plus横 */
/* 980：PC（デスクトップ/タブレット横）*/
@media screen and (min-width: 768px) and (max-width: 980px) {
  div.system_kanri_container {
    text-align: left;
    width: 96%;
    margin: 50px auto 100px;
  }
  .guide_image {
    width: 96%;
  }
}

/* 980以上：PC（デスクトップ） */
@media screen and (min-width: 980px) {
  .guide_image {
    width: 960px;
  }
}

.warning {
  color: #c00;
}

/*------------------------------------------------*/
.bottom a:link, .bottom a:visited {
  font-size: 80%;
  font-weight: 700;
  width: 80%;
  max-width: 250px;
  margin: 0 auto 48px;
  padding: 12px 0;
  display: block;
  border: solid 1px #666;
  letter-spacing: 0.2em;
  text-align: center;
  /* border-radius: 40px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px; */
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

.bottom a:hover, .bottom a:active {
  display: block;
  -webkit-transform: scale(0.9);
          transform: scale(0.9);
  background: #000;
  color: #fff;
  opacity: 1.0;
  text-decoration: none;
}

div.bottom img {
  width: 30px;
  height: 30px;
}

.contents {
  margin: 0 auto 50px;
  text-align: left;
}

.contents_c {
  margin: 0 auto 50px;
  text-align: left;
}

/* 768：iPad縦 / iPhone 7/6 Plus横 */
@media screen and (min-width: 480px) {
  .contents_c {
    text-align: center;
  }
}

/* 980：PC（デスクトップ/タブレット横）*/
@media screen and (min-width: 768px) {
  .contents {
    max-width: 760px;
  }
}

/* 980以上：PC（デスクトップ） */
.contents h2, .contents_c h2 {
  font-size: 110%;
  font-weight: bold;
  margin: 20px 0 30px;
}

.contents h3, .contents_c h3 {
  font-size: 100%;
  font-weight: bold;
  margin: 20px 0 30px;
}

/* body p{
  text-align: left;
} */
body > div {
  width: 94%;
  margin: 0 auto;
}

/* 768：iPad縦 / iPhone 7/6 Plus横 */
/* 980：PC（デスクトップ/タブレット横）*/
@media screen and (min-width: 768px) {
  /* body p{
    text-align: center;
  } */
}

/* 980以上：PC（デスクトップ） */
.shop_parsonal {
  text-align: center;
  width: 80%;
  margin: 0 auto 50px;
  max-width: 250px;
}

/* 980：PC（デスクトップ/タブレット横）*/
.logo {
  width: 30vh;
  max-width: 210px;
  /* height: 100px; */
  margin: 30px auto;
  border-radius: 50%;
  background: #fff, linear-gradient(140deg, #69d2ff, #71dca7, #ffd458, #ffa7de, #69d2ff);
  -webkit-animation: huerotator 20s infinite alternate;
          animation: huerotator 20s infinite alternate;
}

.logo img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

@-webkit-keyframes huerotator {
  0% {
    -webkit-filter: hue-rotate(0deg);
    filter: hue-rotate(0deg);
  }
  100% {
    -webkit-filter: hue-rotate(360deg);
    filter: hue-rotate(360deg);
  }
}

@keyframes huerotator {
  0% {
    -webkit-filter: hue-rotate(0deg);
    filter: hue-rotate(0deg);
  }
  100% {
    -webkit-filter: hue-rotate(360deg);
    filter: hue-rotate(360deg);
  }
}

.staff_parsonal img {
  width: 100px;
  height: 100px;
}

/* 768：iPad縦 / iPhone 7/6 Plus横 */
/* 980：PC（デスクトップ/タブレット横）*/
/* 980以上：PC（デスクトップ） */
.container {
  width: 100%;
  margin: 0 auto;
  max-width: 1240px;
}

.staff_parsonal {
  /* text-align: left; */
  margin: 0 0 50px 0;
}

.container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
}

div.staff_parsonal {
  text-align: center;
  width: 50%;
}

h2.shop_head {
  line-height: 36px;
  font-size: 14px;
  text-align: center;
}

@media screen and (min-width: 768px) {
  h2.shop_head {
    line-height: 48px;
  }
}

/* 768：iPad縦 / iPhone 7/6 Plus横 */
/* 980：PC（デスクトップ/タブレット横）*/
@media screen and (min-width: 768px) and (max-width: 980px) {
  div.staff_parsonal {
    width: 33%;
  }
}

/* 980以上：PC（デスクトップ） */
@media screen and (min-width: 980px) {
  div.staff_parsonal {
    width: 20%;
  }
}

.object-fit-img {
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: 50% 0;
     object-position: 50% 0;
  /* 左から50% 上から0% */
  border-radius: 50%;
  font-family: 'object-fit: cover; object-position: 50% 0;';
}

.copy {
  text-align: center;
  font-size: 78%;
}

/*-----------------------ここから管理画面のCSS-------------------------*/
div.system_kanri_container {
  text-align: left;
  width: 96%;
  margin: 3% auto 10%;
  overflow-wrap: break-word;
  /* テキストの折り返しcss 参考url https://creive.me/archives/17653/ */
  word-wrap: break-word;
  /* テキストの折り返しcss*/
}

.category_icon {
  text-align: center;
  margin: 0 auto 50px;
}

.category_icon img {
  width: 30px;
  height: 30px;
}

.profile_photo {
  width: 250px;
  margin: 0 auto 30px;
  text-align: center;
}

.profile_photo img {
  width: 100%;
}

.guide_image {
  width: 100%;
  margin: 50px auto;
}

/* 768：iPad縦 / iPhone 7/6 Plus横 */
/* 980：PC（デスクトップ/タブレット横）*/
@media screen and (min-width: 768px) and (max-width: 980px) {
  div.system_kanri_container {
    text-align: left;
    width: 96%;
    margin: 50px auto 100px;
  }
  .guide_image {
    width: 96%;
  }
}

/* 980以上：PC（デスクトップ） */
@media screen and (min-width: 980px) {
  .guide_image {
    width: 960px;
  }
}

.warning {
  color: #c00;
}

/*------------------------------------------------*/
#form {
  text-align: left;
  width: 96%;
  margin: 50px auto 100px;
}

/* 768：iPad縦 / iPhone 7/6 Plus横 */
/* 980：PC（デスクトップ/タブレット横）	 */
@media screen and (min-width: 768px) {
  #form {
    text-align: left;
    width: 640px;
    margin: 50px auto 100px;
  }
}

/* 980以上：PC（デスクトップ） */
.inputText {
  width: 97%;
  padding: 3px;
  font-size: 110%;
  /*border-radius: 6px;*/
}

.inputSelect {
  padding: 3px;
  font-size: 110%;
}

.inputText.inputTextShort {
  width: 96%;
}

.inputText.inputTextShortest {
  width: 50%;
}

.textarea {
  width: 96%;
  height: 250px;
  padding: 3px;
  font-size: 110%;
  /*	-webkit-border-radius: 6px;
	-webkit-box-shadow: 0 2px 2px #CCC inset;
	border-radius: 6px;
	box-shadow: 0 2px 2px #CCC inset;*/
}

.formBtn {
  font-size: 110%;
  padding: 4px 10px;
  /* padding-left: 8px;
	padding-right: 8px; */
  /* width: 150px; */
  /* -webkit-box-shadow: 0 2px 2px #CCC; */
  border-radius: 6px;
  /* box-shadow: 0 2px 2px #CCC; */
}

.center-text {
  text-align: center;
  margin: 0;
}

/* 768：iPad縦 / iPhone 7/6 Plus横 */
/* 980：PC（デスクトップ/タブレット横）	 */
/* 980以上：PC（デスクトップ） */
@media screen and (min-width: 980px) {
  .inputText {
    width: 700px;
    padding: 3px;
    font-size: 14px;
  }
  .inputSelect {
    padding: 3px;
    font-size: 14px;
  }
  .inputText.inputTextShort {
    width: 600px;
  }
  .inputText.inputTextShortest {
    width: 300px;
  }
  .textarea {
    width: 96%;
    height: 180px;
    padding: 3px;
    font-size: 14px;
  }
  .formBtn {
    font-size: 14px;
    padding: 4px 10px;
    border-radius: 6px;
  }
}

img.waiting, .waiting {
  -ms-filter: "alpha( opacity=40 )";
  filter: alpha(opacity=40);
  opacity: 0.4;
}
/*# sourceMappingURL=system_kanri.css.map */