#setting_delivery {
  // * ----------------
  // มีบางส่วนใช้ร่วมกับ หน้า _setting.scss
  // ----------------
  .collap{
    border-bottom: 1px solid #ddd;
    margin-bottom: 20px;
    &:last-child{
      border: 0;
    }
    form{
      display: none;
    }
  }
  .collap.open{
    .setting__control--collap:after{
      transform: rotate(180deg);
    }
    form{
      display: block;
    }
  }
  .setting{
    &__control{
      display: flex;
      justify-content: space-between;
      margin-bottom: 20px;
      flex-wrap: wrap;

      &--title {
        font-size: $font-size-normal;
        font-weight: bold;
        width: 30%;
        margin-right: 3%;
      }
      &--detail{
        color: #888;
        font-size: 13px;
        width: 100%;
      }
      &--switch {
        font-size: $font-size-small;
        display: flex;
        align-items: center;
        width: 80%;
      }
      &--collap{
        cursor: pointer;
        font-size: 13px;
        &:after{
          display: inline-block;
          content: ' ';
          width: 10px;
          height: 8px;
          background-image: url('../../imgs/down.svg');
          background-size: 100%;
          background-repeat: no-repeat;
          margin-left: 5px;
        }
      }
    }
  }

  .delivery{
  	display: flex;
  	align-items: center;
  	div{
		padding: 5px;
		text-align: center;
		&:first-child{
			padding-left: 0px;
		}
		&:nth-child(2){
			text-align: left;
		}
	}
	input{
		width: 100%;
	    border: 1px solid #ddd;
	    border-radius: 3px;
	    padding: 5px 10px;
	    &[type='number']{
	    	text-align: center;
	    }
	}
	&__number{
		width: 4%;
		color: #888;
	}
  	&__name{
  		width: 40%;
  	}
	&__low{
		width: 17%;
		input{
			background-color: #f2f2f2;
		}
	}
	&__high{
		width: 17%;
	}
	&__price{
		width: 17%;
	}

  	&__delete{
  		width: 4%;
  		cursor: pointer;
	    display: flex;
    	padding-right: 0 !important;
  		img{
  			width: 20px;
  			height: 20px;
  		}
  	}
  	&.header{
  		color: #888;
	    margin-bottom: 0;
	    font-size: 13px;
  	}
  }
  .addScope{
  	margin-top: 10px;
  	padding: 10px;
  	text-align: center;
  	cursor: pointer;
  	border: 1px dotted #004f9c;
    border-radius: 3px;
    color: #004f9c;
    display: flex;
    align-items: center;
    justify-content: center;
    svg{
    	width: 15px;
    	height: 15px;
    	fill: #004f9c;
    	margin-right: 10px;
    }
  }
  @media only screen and (max-width: 992px) {
    .collap{
      flex-wrap: wrap;
    }
    .setting{
      &__control{
        &--switch{
          flex-wrap: wrap;
        }
        &--title{
          width: 100%;
        }
      }
    }
  }
}
