.scroll {
  overflow: auto;
}
.wrapper {
	margin: 5px;
}
@media screen and (min-width: 481px) {
	.wrapper {
		margin: 10px;
	}
}
@media screen and (min-width: 769px) {
  .wrapper {
    width:750px;
    margin: 20px auto;
  }
}
@media screen and (min-width: 1280px) {
  .wrapper {
    width: 1240px;
    margin: 20px auto;
  }
  .container {
      display:flex;
  }
  .left_box {
      width: 600px;
  }
  .right_box {
    width: 610px;
  }
}
@media screen and (min-width: 1520px) {
    .wrapper {
      width: 1480px;
		margin: 20px auto;
    }
    .container {
        display:flex;
    }
    .left_box {
      width: 650px;
    }
    .right_box {
      width: 820px;
    }
}
input {
  margin: 10px;
}
option {
  margin: 10px;
}
hr {
  background-color: #fff;
	border-top: 2px dashed #8c8b8b;
  margin: 10px;
}
.right {
  text-align: right;
}
.left {
  text-align: left;
}
.center {
  text-align: center;
}
table {
    border:1px solid #cccccc;
    border-collapse: collapse;
    color:black;
}
th {
    border: solid 1px #cccccc;
    font-weight: bold;
}
td {
    border: solid 1px #cccccc;
}
td, th {
    padding: 5px;
}
.border1 {
  border: 1px solid #cccc00;
}
div {
    padding: 5px;
    word-wrap: break-word;
}
/*
.wrapper {
    margin: 20px auto;
}
*/
iframe {
    width:  100%;
    height: auto;
    border: 1px #cccccc solid;
}
select {
  height: 30px;
}
.webcam {
  width: 80vw;
  max-width: 700px;
	margin: 2px
}
.metcam {
	width:80vw;
	height:700px;
	object-fit:none;
	object-position:100% 20%;
	margin: 2px
	}

.webcamrect { clip:rect(75px,1200px,800px,135px); position:absolute; }

/* 全体設定 */
* {
  box-sizing: border-box;
  }

/* ポップアップウインドウの設定 */
.popup {
  background-color: #efefef;
  box-shadow: 0 0 0 9999px rgba(0, 0, 0, .8);
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 95vw;
  height: 70vw;
  overflow-y: scroll;
}
/* チェックボックスの初期設定 */
#popup-on{
  display: none;
}
/* チェックされたらポップアップウインドウを開く */
#popup-on:checked + .popup{
  display: block;
}

/* 閉じるアイコン（右上） */
.icon-close{
  background: #000;
  color: #fff;
  font-size: 30px;
  padding: 0 10px;
  position: absolute;
  right: 0;
}

/* 閉じるボタン */
.btn-close{
  background: #000;
  border-radius: 10px;
  color: #fff;
  padding: 10px;
  cursor: pointer;
  margin: 10px auto;
  width: 95%;
  text-align: center;
}

/* 開くボタン */
.btn-open{
  background: #fff;
  border-radius: 10px;
  color: #fff;
  padding: 10px;
  cursor: pointer;
  margin: 10px auto;
  width: 95%;
  text-align: center;
}

/* ポップアップの内容 */
.popup-content{
  margin: 10px auto 10px auto;
  width: 90%;
}