@charset "UTF-8";

@media screen and (max-width:750px){
/*-----------
    header
--------------*/

.header {
    display: block;
    /* background: #8eb65d; */
    /* padding: 20px 0 0;*/
    padding: 0px;
    position: fixed;
    width: 100%;
    z-index: 90;
}

.header:after {
    content: "";

    display: block;

    background: #87b54e;

    height: 100%;

    width: 100%;

    position: absolute;

    top: 0;

    z-index: -1;

    opacity: 0.9;

}

/*select変更*/

select::-ms-expand {

	display: none;

}

select {

    -webkit-appearance: none;

    -moz-appearance: none;

    appearance: none;

    border: none;

    background-image: url(../img/select-arrow.png);

    background-repeat: no-repeat;

    background-size: contain;

    background-position: right;

}    

.select_box {

    width: 70%;

    margin: 0 0px 20px 80px;

}

.select_box .select {

    background-color: #ffffff;

    width: 100%;

    padding: 5px;

}    

.time_day {

    background: #ddd;

    text-align: center;

    padding: 5px 0;

    font-weight: bold;

    color: #333;

}

#copy {

    font-size: 114%;

    color: #a9a9a9;

    text-align: center;

    padding: 0 0 30px;

}

a.disabled{

    pointer-events: none;

}

/*-----------

    footer

--------------*/

.footer_btn {

    position: fixed;

    bottom: 0;

    width: 100%;

    z-index: 70;

}    

.footer_btn ul {

    /* background: #8eb65d; */

    padding: 10px 0;

    width: 100%;

    text-align: center;

}

.footer_btn ul:after {

    background: #87b54e;

    height: 100%;

    width: 100%;

    content: "";

    display: block;

    position: absolute;

    top: 0;

    z-index: -1;

    opacity: 0.9;

}

.footer_btn li {

    width: 48%;

    display: inline-block;

    text-align: center;

    font-size: 114%;

}

.footer_btn li a {

    display: block;

    padding: 15px 0;

    border: 2px solid;

    border-radius: 7px;

    box-sizing: border-box;

    position: relative;

}

.footer_btn li a:before{

    content: "";

    display:block;

}

.footer_btn li a:before {

    content: "";

    display: block;

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    left: 10px;

}

.footer_btn li:first-child a {

    color: #fff;

    background: #3a733c;

}

.footer_btn li:first-child a:before {

    width: 0;

    height: 0;

    border-style: solid;

    border-width: 8px 0 8px 10px;

    border-color: transparent transparent transparent #ffffff;

}    

.footer_btn li:last-child a {

    color: #3a733c;

    background: #fff;

}

.footer_btn li:last-child a:before {

    width: 0;

    height: 0;

    border-style: solid;

    border-width: 8px 0 8px 10px;

    border-color: transparent transparent transparent #3a733c;

}



/*//共通//*/

main {

    padding-top: 102px;

}

img{

    object-fit: contain;

    width: 100%;

    vertical-align: top;

    text-align: center;

}

.flex_box{

    display: flex;

    flex-wrap: nowrap;

    align-items: center; 

}

.flex_box li {

    margin-right: 5px;

}

.flex__box {

    display: flex;

    flex-wrap: nowrap;

    align-items: center;

    justify-content: space-around;

}

table{
    border-collapse: collapse;
    border-spacing: 0;
    border: 0;
    width: 100%;
}

    th, td {
        vertical-align: middle;
        text-align: center;
    }

textarea {
    border-color: #ddd;
    width: 100%;
}

.s{

    width: 30%;

}

.l{

    width: 60%;

}

.col02 li {

    width: 45%;

}

.col03 li{

    width: 30%;

}

.col04 li{

    width: 24%;

}

.col05 li{

    width: 19%;

}



.w15{

    width: 15%;

}

.w_80{

    width: 80%;

    margin: auto;

}

figure {

    margin: 2px 0;

}

.fs_st{

    font-size: 114%;

}

.content_block {

    border-bottom: 1px solid #ddd;

    width: 98%;

    margin: auto;

}

.s_normal {

    background: none;

    border-radius: 0;

    line-height: 1.8;

    padding: 5px;

}





/*//btn//*/

.btn_box {

    background: #8eb65d;

    display: flex;

    flex-wrap: nowrap;

    /*padding: 10px 0;*/
    padding: 0px;

    justify-content: space-around;

}

.common_btn {

    width: 50%;

    text-align: center;

    margin: 15px auto;

}

    .btn {
        background: #3a733c;
        color: #fff;
        position: relative;
        /*padding: 10px 0;*/
        padding: 0px;
        width: 100%;
        text-align: center;
        display: block;
        font-size: 114%;
        border-radius: 7px;
        border: 2px solid;
        box-sizing: border-box;
    }

.btn:before{

    content: "";

    display: block;

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    left: 5px;

    width: 0;

    height: 0;

    border-style: solid;

    border-width:5px 0 5px 7px;

    border-color: transparent transparent transparent #ffffff;

}

.erase_btn{

    background:#c3c3c3;

}

 .btn_o {

    position: relative;

    background: #f60;

    color: #fff;

    padding: 5px 20px;

    border-radius: 7px;

}   

.btn_o:before{

    content: "";

    display: block;

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    left: 5px;

    width: 0;

    height: 0;

    border-style: solid;

    border-width:5px 0 5px 7px;

    border-color: transparent transparent transparent #ffffff;

}



.btn_o a {  color: #ffffff; }



.btn.bg_o a { color: #fff;}



.bg_w {

    background: #fff;

}

.bg_o {

    background: #f60;

}

.bg_r {

    background: #f00;

}

.bg_gr{

    background: #ddd;

}

.bg_grl{

    background:#f4f6f9;

}

.off_btn,.on_btn {

    width: 33px;

    text-align: center;

    display: inline-block;

}

.off_btn{

    border: 1px solid #777;

    box-sizing: border-box;

}

.on_btn {

    background: #3a733c;

    color: #fff;

}

/*input btn*/

.btn_inner {

    width: 50%;

    position: relative;

}

input.input_btn {

    margin: 0;

    padding: 0;

    height: auto;

    border: 2px solid;

    width: 100%;

}

.btn_inner:after {

    content: "";

    display: block;

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    left: 10px;

    width: 0;

    height: 0;

    border-style: solid;

    border-width: 5px 0 5px 7px;

    border-color: transparent transparent transparent #ffffff;

}

.update {

    position: absolute;

    bottom: 10px;

    right: 10px;

}

.update .btn_inner {

    width: 100%;

}

.update .btn_o {

    background: #f60;

    height: auto;

    margin: 0;

    line-height: normal;

}



.update_btn {

    width: 30%;

    color: #fff;

    text-align: center;

    margin: auto;

}



.update_btn .btn_o {

    display: block;

}



.center{

    text-align: center;

}

.right{

    text-align: right;

}

.left{

    text-align: left;

}

.mtb_0{
    margin-bottom: 0;
    margin-top: 0;
}

.mbt_10{

    margin: 10px 0;

}

    .mbt_1 {
        margin: 1px;
    }

.mb_10{

    margin-bottom: 10px;

}

.mt_10{

    margin-top: 10px;

}

.mb_20{

    margin-bottom: 20px;

}

.mt_20{

    margin-top: 20px;

}

.mt_30{

    margin-top: 60px;

}

.pbt_10{

    padding: 10px 0;

}

.gr_t {

    font-size: 114%;

    color: #3a733c;

}

.border_t {

    border-top: 1px solid #ddd;

    padding: 20px 0;

}

/**/    

.scroll{

    overflow-x: scroll;

}

.scroll .text {

    width: 780px;

    color: #f60;

    font-size: 114%;

    padding: 15px 10px;

    margin: 0;

}

/*チェックボックス*/

.my-checkbox {

    /* display: block; */

    cursor: pointer;

    user-select: none; /* テキストの選択を防ぐ */

  }

  

  /* inputは非表示にする */

  .my-checkbox input {

    display: none;

  }

  

  /* □ */

    .checkmark {

    height: 15px;

    width: 15px;

    border: solid 2px #d4dae2;

    border-radius: 2px;

    box-sizing: border-box;

    display: block;

    position: relative;

    margin-left: auto;

    margin-right: 6px;

    }

  /* ✓ */

  .checkmark:after {

    content: "";

    position: absolute;

    left: 1px;

    bottom: 1px;

    width: 6px;

    height: 10px;

    border: solid #FFF;

    border-width: 0 2px 2px 0;

    transform: rotate(45deg);

    opacity: 0;

}

 /* 〇 */

.checkmark_c {

    border: 1px solid #777;

    border-radius: 50%;

    width: 12px;

    height: 12px;

    display: block;

    margin: auto;

}

  /* チェックが入ったときの□ */

  .my-checkbox input:checked + .checkmark{

    background: #2e80ff; /* チェック時の色 */

    border-color: #2e80ff; /* チェック時の色 */

  }

  .my-checkbox input:checked + .checkmark_c {

    background: #2e80ff;

    border: 3px double #fff;

    width: 8px;

    height: 8px;

}

  /* チェックが入ったときの✓ */

  .my-checkbox input:checked + .checkmark:after,.my-checkbox input:checked + .checkmark_c:after {

    opacity: 1; /* 透明を解除 */

  }

/*////////設置場所・栽培種別・育成・通信///////////*/

.top_box table {

    border-spacing: 2px;

    border-collapse: separate;

}

    .top_box table th, .top_box table td {
        font-size: 114%;
        line-height: normal;
        padding: 0px;
    }

.top_box table th {

    width: 35%;

}

.environ_box th {

    background: #82ae4b;

    padding: 10px 0;

}

    .environ_box td {
        background: #dddddd;
        /* padding: 5px 10px 5px;*/
        text-align: left;
        padding: 0px;
    }

.end_time {

    font-size: 75%;

}

    .middle_box tr th:before {
        content: "";
        display: inline-block;
        background-size: contain;
        vertical-align: middle;
        height: 17px;
        width: 28px;
        padding: 0px;
    }

    .middle_box tr:first-child th:before {
        background: url(../img/t_icon01.png) no-repeat;
        background-size: contain;
        padding: 0px;
    }

    .middle_box tr:last-child th:before {
        background: url(../img/t_icon02.png) no-repeat;
        background-size: contain;
        padding: 0px;
    }

.middle_box tr {

    border-bottom: 1px solid #ddd;

    width: 100%;

    display: inline-table;

    padding: 5px 0;

}

.middle_box tr:last-child {

    border: none;

}

.middle_box th {

    border: 2px solid #3a733c;

    color: #3a733c;

    padding: 5px 0;

}

    .middle_box td {
        padding-left: 5px;
        text-align: left;
        padding: 0px;
    }



/*////////センサー・制御・入力///////////*/

    .table_ttl {
        background: #3a733c;
        color: #ffffff;
        font-size: 114%;
        font-weight: normal;
        padding: 5px 0 3px; /*koredeii*/
        text-align: center;
    }

    .sensor_table td {
        border: 1px solid #b9b9b9;
        box-sizing: border-box;
        padding: 0px; /*koredeii*/
       
    }

    .sensor_table td:nth-child(odd) {
        width: 10%;
        background: #ddd;
        color: #3a733c;
        padding: 5px; /*koredeii*/
        border-left: 0;
        border-right: 0;

    }

        .sensor_table td:nth-child(even) {
           
            text-align: center;
            line-height: 5px;
            padding: 5px 10px; /*koredeii*/
            width: 40%;
        }


.time_select .select {
    width: 27%;
    padding: 5px;
    border: 1px solid #ddd;
    font-size: 12px;
}


/*//006.html//*/

.first_body {

    color: #3a733c;

}

.table td:first-child {

    width: 5%;

}

.table tbody:nth-child(odd) {

    background: #ddd;

}

    .table td {
        vertical-align: middle;
        border-bottom: 1px solid #777;
        border-right: 1px solid #777;
        font-size: 3vw;
        /* padding: 6px 2px; */

        width: 20%;
    }

.table td:last-child {

    border-right: none;

}



.page_013 .table_step td:nth-child(2),.page_013 .table_step tr:last-child td:nth-child(1){

    text-align: left;

}

.page_013 .table_step td span {

    display: block;

}

.page_013 .table_step tr:first-child td {

    color: #333;

}

/*育成　閲覧　014.html*/

.tabel_02 td{

    border-bottom: 1px solid #bebebe;

    padding: 10px 5px;

}

.tabel_02 th {

    background: #ddd;

    width: 20%;

    border-bottom: 1px solid #bebebe;

}

/*育成　閲覧　014-2.html*/

.use .textarea {

    width: 72%;

    margin-right: 10px;

}

.img_tmp span {

    font-size: 114%;

    font-weight: bold;

    margin: 0 5px;

}

.icon .yet {

    background: #FF0000;

    color: #fff;

    padding: 4px 8px;

    display: inline-block;

    border-radius: 4px;

    margin-right: 5px;

}

.icon .done {

    border: 2px solid #2693FF;

    color: #2693FF;

    padding: 3px 7px;

    display: inline-block;

    border-radius: 4px;

    box-sizing: border-box;

}

/*//login 000.html//*/

.log_in .header {

    padding-top: 30px;

    background: #fff;

    position: unset;

}

.log_in .header .logo{

    width: 200px;

    margin: 0 auto 20px;

}

.log_in main {

    padding: 0;

}

.log_in .wrapper .box {

    margin: 0;

}

.log_in .inner {

    background: #82ae4b;

    padding: 20px 15px;

}

.log_in dd {

    margin-bottom: 20px;

}

    

    



}



@media screen and (max-width:320px){

    .btn_o {

        display: inline-block;

        font-size: 75%;

 

    }

    .end_time {

        display: block;

    }

    .sensor_table .inner:nth-child(even) td:nth-child(2), .sensor_table .inner:nth-child(even) td:nth-child(3) {

        text-align: center;

        display: block;

    }

}

/*///20210719調整///*/
input{
}
.img_tmp img {
    object-fit: contain;
}